Tidying up a little bit and implementing file (.fsm) import

js/export/export.js

@@ -1,4 +1,4 @@
-function prepareForExport(doc, _settings = settings) {
+function prepareForExport(doc, settings = settings) {
     let states = JSON.parse(JSON.stringify(doc.states));
 
     states.forEach(state => {
@@ -37,9 +37,13 @@ function prepareForExport(doc, _settings = settings) {
     delete _doc.lastSavedHash;
     delete _doc.element;
 
+    const _settings = JSON.parse(JSON.stringify(settings));
+
+    delete _settings.colors.getColor;
+
     return {
         document: _doc,
-        _settings,
+        settings: _settings,
     };
 }
 
@@ -91,8 +95,8 @@ function parseFromJson(json) {
 function importFromJson(json) {
     const doc = parseFromJson(json);
 
-    addDocument(doc);
-    switchDocument(doc);
+    addDocument(doc.document);
+    switchDocument(doc.document);
 }
 
 function exportToFile() {
@@ -109,9 +113,7 @@ function exportToFile() {
 function downloadFile(name, content, type) {
     const element = document.createElement('a');
 
-    console.log(content);
-
-    element.setAttribute('href', `data:${type},charset=utf-8,${content}`);
+    element.setAttribute('href', `data:${type};base64,${btoa(content)}`);
     element.setAttribute('download', name);
 
     element.style.display = 'none';
@@ -157,4 +159,4 @@ function openFromLocalStorage(id) {
     const entry = getLocalStorageEntries().find(entry => entry.document.id === id);
     addDocument(entry.document);
     switchDocument(entry.document);
-}
+}

js/menu.js

@@ -23,10 +23,8 @@ modalSave.addFooterBtn('Speichern', 'btn', () => {
 const modalOpen = new tingle.modal({
     beforeOpen: () => {
         const entries = getLocalStorageEntries().sort((a, b) => {
-            console.log(a, b);
             return b.document.createdAt - a.document.createdAt
         });
-        console.log(entries);
         let html = '<h3>Gespeicherte Dokumente</h3><ul class="file-list">';
         entries.forEach(entry => html += `<li class="file-list-item" data-id="${entry.document.id}">${entry.document.name} (${new Date(entry.document.createdAt).toLocaleString()})</li>`);
         html += '</ul>';
@@ -70,16 +68,20 @@ modalImport.setContent('<h3>Dokument importieren</h3><label for="importUpload" c
 modalImport.addFooterBtn('Laden', 'btn', () => {
     const el = document.getElementById('importUpload');
     const file = el.files[0];
-    console.log(file);
 
     if(file) {
         const reader = new FileReader();
+        // TODO: Check for file type etc.
         reader.readAsText(file, 'UTF-8');
         reader.onload = (evt) => {
-            console.log(evt.target.result);
+            const json = evt.target.result;
+            // TODO: Add error handling
+            importFromJson(json);
+            modalImport.close();
         };
         reader.onerror = (evt) => {
-            console.log(evt);
+            alert('Ein Fehler beim Einlesen der Datei ist aufgetreten. Womöglich muss hier ein Bug behoben werden... :(');
+            modalImport.close();
         }
     }
 });
@@ -106,4 +108,4 @@ document.getElementById('importBtn').addEventListener('click', () => {
 
 document.getElementById('exportBtn').addEventListener('click', () => {
     modalExport.open();
-});
+});

js/simulate.js

@@ -56,8 +56,6 @@ function simulationStep(input) {
         possibilities.forEach(conn => {
             const conditions = conn.text.split(/, ?/g);
 
-            console.log(conn, conditions);
-
             if (input.match(new RegExp(conditions.join('|'), 'g'))) {
                 if (conn instanceof Connection) {
                     animations.push(new ConnectionAnimation(conn));
@@ -218,4 +216,4 @@ class SelfConnectionAnimation {
 
 function easeInOutCubic(t) {
     return t < .5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1
-}
+}