diff --git a/index.html b/index.html index 80f265f..8603cae 100644 --- a/index.html +++ b/index.html @@ -3,19 +3,220 @@ FSM Designer + + + + + + +
+ + + +
+ + + + + + + + + +
+ +
+ + + - + + + + diff --git a/js/menu.js b/js/menu.js new file mode 100644 index 0000000..2d31d69 --- /dev/null +++ b/js/menu.js @@ -0,0 +1,93 @@ +const modalSave = new tingle.modal({ + footer: true, + +}); +modalSave.setContent('

Dokument speichern

'); +modalSave.addFooterBtn('Schließen', 'btn', () => { + document.getElementById('saveName').value = ""; + modalSave.close(); +}); +modalSave.addFooterBtn('Speichern', 'btn', () => { + const input = document.getElementById('saveName'); + const name = input.value; + + if(name.trim().length > 0) { + documents[activeDocument].name = name; + saveToLocalStorage(); + modalSave.close(); + } else { + + } +}); + +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 = '

Gespeicherte Dokumente

'; + modalOpen.setContent(html); + + for(let element of document.getElementsByClassName('file-list-item')) { + element.addEventListener('click', () => { + const entry = entries.find(entry => entry.document.id === element.getAttribute('data-id')); + addDocument(entry.document); + switchDocument(entry.document); + modalOpen.close(); + }); + } + }, +}); + +const modalExport = new tingle.modal({ + footer: true, + beforeOpen: () => { + const el = document.getElementById('previewImage'); + el.src = canvas.toDataURL('image/png'); + } +}); +modalExport.setContent('

Dokument exportieren

'); +modalExport.addFooterBtn('Download .png', 'btn', () => { + exportToImageFile(); + modalExport.close(); +}); +modalExport.addFooterBtn('Download .svg', 'btn', () => { + +}); +modalExport.addFooterBtn('Download .fsm', 'btn', () => { + exportToFile(); + modalExport.close(); +}); + +const modalImport = new tingle.modal({ + footer: true, +}); +modalImport.setContent('

Dokument importieren

'); + +document.getElementById('saveBtn').addEventListener('click', () => { + if(activeDocument === null) { + return; + } + + if(documents[activeDocument].name !== null) { + saveToLocalStorage(); + } else { + modalSave.open(); + } +}); + +document.getElementById('openBtn').addEventListener('click', () => { + modalOpen.open(); +}); + +document.getElementById('importBtn').addEventListener('click', () => { + modalImport.open(); +}); + +document.getElementById('exportBtn').addEventListener('click', () => { + modalExport.open(); +}); \ No newline at end of file