diff --git a/index.html b/index.html index 8603cae..0fcb000 100644 --- a/index.html +++ b/index.html @@ -163,6 +163,27 @@ background: rgba(0, 0, 0, .2); } + /** + * Import Modal with Upload Button + */ + + .upload-btn { + border: 1px solid rgba(0, 0, 0, .33); + background: #fff; + } + + .upload-btn:hover { + background: rgba(0, 0, 0, .1); + } + + .upload-btn:active { + background: rgba(0, 0, 0, .2); + } + + .upload-btn .upload-input { + display: none; + } + /** * Canvas */ diff --git a/js/export/export.js b/js/export/export.js index b1c82e6..baafd62 100644 --- a/js/export/export.js +++ b/js/export/export.js @@ -96,14 +96,21 @@ function importFromJson(json) { } function exportToFile() { - const name = 'placeholder.fsm'; - const json = exportToJson(); + if(activeDocument === null) { + return; + } + + const document = documents[activeDocument]; + const name = `${new Date(document.createdAt).toLocaleDateString()} - ${document.name || 'Unbenannt'}.fsm`; + const json = exportToJson(document); downloadFile(name, json, 'application/json'); } function downloadFile(name, content, type) { const element = document.createElement('a'); + console.log(content); + element.setAttribute('href', `data:${type},charset=utf-8,${content}`); element.setAttribute('download', name); diff --git a/js/menu.js b/js/menu.js index 2d31d69..c8bdcd7 100644 --- a/js/menu.js +++ b/js/menu.js @@ -66,7 +66,23 @@ modalExport.addFooterBtn('Download .fsm', 'btn', () => { const modalImport = new tingle.modal({ footer: true, }); -modalImport.setContent('

Dokument importieren

'); +modalImport.setContent('

Dokument importieren

'); +modalImport.addFooterBtn('Laden', 'btn', () => { + const el = document.getElementById('importUpload'); + const file = el.files[0]; + console.log(file); + + if(file) { + const reader = new FileReader(); + reader.readAsText(file, 'UTF-8'); + reader.onload = (evt) => { + console.log(evt.target.result); + }; + reader.onerror = (evt) => { + console.log(evt); + } + } +}); document.getElementById('saveBtn').addEventListener('click', () => { if(activeDocument === null) {