index.html

<!-- use version 0.19.1 -->
<script lang="javascript" src="https://cdn.sheetjs.com/xlsx-0.19.1/package/dist/xlsx.full.min.js"></script>
<div
  id="drop_dom_element"
  style = "height:100%">
  <p>Drag one or more files to this <i>drop zone</i>.</p>
</div>
<script>
let jsonString;
/* suppress default behavior for drag and drop events */
function suppress(e) { e.stopPropagation(); e.preventDefault(); }

/* handle data from drop event */
async function handleDropAsync(e) {
  suppress(e);
  /* get first file */
  const f = e.dataTransfer.files[0];
  /* get raw data */
  const data = await f.arrayBuffer();
  /* data is an ArrayBuffer */
  const wb = XLSX.read(data);
  /* do something with the workbook here */
   jsonArray = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
  jsonArray.splice(0,10);
  docWrite=`<script>
  function saveFile(filename) {
    document.getElementById('saveButton').remove();
    filename ="Testpage_${/^(.+?)_en_|^(.+?)_fr_/.exec(jsonArray[0].__EMPTY_7)[0].slice(0,-1)}.html";
    text = document.querySelector("html").innerHTML;

 var element = document.createElement('a');
 element.setAttribute('href', 'data:text/plain;charset=utf-8,' + 
 encodeURIComponent(text));
 element.setAttribute('download', filename);

  element.style.display = 'none';
  document.body.appendChild(element);

  element.click();

  document.body.removeChild(element);
}<`+`/script>` ;
docWrite+= `<h1> ${/^(.+?)_en_|^(.+?)_fr_/.exec(jsonArray[0].__EMPTY_7)[0].slice(0,-1)}</h1>`; //getting campaign name from first obj in array
docWrite += "<input type='button' id ='saveButton' onclick=saveFile() value='Save Testpage' /> </br>";
  jsonArray.forEach(function (el){
    const dimensionRegex = /(\d{1,4})x(\d{1,4})/;
    let dimension= dimensionRegex.exec(el.__EMPTY_7); //this returns an array of ["300x600","300","600"]
    let w = +dimension[1]+16; //adding some padding to remove scrollbars
    let h = +dimension [2]+34;
    docWrite+= `${el.__EMPTY_7} ${el.__EMPTY_6} </br></br></br> <iframe class = 'iframeCreatives' srcdoc="${el.__EMPTY_15}" width='${w}px'; height='${h}px'></iframe> </br></br>`;
  })
document.write(docWrite);
}

drop_dom_element.addEventListener("drop", handleDropAsync, false);
drop_dom_element.addEventListener("dragover", suppress, false);
drop_dom_element.addEventListener("dragenter", suppress, false);
</script>