complete download html button

src/editor/main.js

@@ -10,6 +10,7 @@ import { saveCVJSON } from '../lib/store';
 import {
   createElement,
   downloadContent,
+  downloadIframeHTML,
   propertiesToObject,
   traverseDownObject,
 } from '../lib/utils';
@@ -193,24 +194,36 @@ $inputUploadData.on('change', () => {
   reader.readAsText(files[0])
 })
 
-$btnDownloadJSON.on('click', () => {
+function downloadCV(contentType) {
   const data = editor.getValue()
-  let name = data.meta.name
+  const meta = data.meta || (data.meta = {})
+  let name = meta.name
   if (!name) {
     name = prompt(`Please enter a name for your CV's data`)
   }
-  if (!name) {
+  if (!name) return
-    name = 'jsoncv'
-  }
 
   // update data
-  data.meta.name = name
+  meta.name = name
-  data.meta.lastModified = dayjs().format('YYYY-MM-DDTHH:mm:ssZ[Z]')
+  meta.lastModified = dayjs().format('YYYY-MM-DDTHH:mm:ssZ[Z]')
 
   // download
-  let filename = `${name}.json`
+  if (contentType === 'json') {
-  downloadContent(filename, JSON.stringify(data, null, 2))
+    let filename = `${name}.json`
+    downloadContent(filename, JSON.stringify(data, null, 2))
+  } else if (contentType === 'html') {
+    let filename = `${name}.html`
+    downloadIframeHTML(filename, $outputHTML.get(0))
+  }
 
   // update editor value
-  editor.getEditor('root.meta').setValue(data.meta)
+  editor.getEditor('root.meta').setValue(meta)
+}
+
+$btnDownloadJSON.on('click', () => {
+  downloadCV('json')
+})
+
+$btnDownloadHTML.on('click', () => {
+  downloadCV('html')
 })

src/lib/utils.js

@@ -61,3 +61,13 @@ export function downloadContent(filename, text) {
 
   document.body.removeChild(element);
 }
+
+export function downloadIframeHTML(filename, iframe) {
+  const blob = new Blob([iframe.contentDocument.documentElement.outerHTML], { type: 'text/html' });
+  const a = document.createElement('a');
+  a.href = URL.createObjectURL(blob);
+  a.download = filename;
+  a.style.display = 'none';
+  a.click();
+  document.body.removeChild(a)
+}