diff --git a/apps/jscad-web/main.js b/apps/jscad-web/main.js index 87ae23c..e8ec77c 100644 --- a/apps/jscad-web/main.js +++ b/apps/jscad-web/main.js @@ -77,6 +77,7 @@ async function initFs() { sw.defProjectName = 'jscad' sw.onfileschange = files => { sendNotify('clearFileCache', { files }) + editor.filesChanged(files) if (sw.fileToRun) runScript({ url: sw.fileToRun, base: sw.base }) } sw.getFile = path => getFile(path, sw) @@ -282,6 +283,7 @@ editor.init( await writable.close() } }, + path=>sw?.getFile(path) ) menu.init(loadExample) welcome.init() diff --git a/apps/jscad-web/src/editor.js b/apps/jscad-web/src/editor.js index 4a27668..b3d4fa9 100644 --- a/apps/jscad-web/src/editor.js +++ b/apps/jscad-web/src/editor.js @@ -9,6 +9,7 @@ let view let compileFn let saveFn +let getFileFn // file selector let currentFile = '/index.js' @@ -28,7 +29,7 @@ const save = (code, path) => { saveFn(code, path) } -export const init = (defaultCode, fn, _saveFn) => { +export const init = (defaultCode, fn, _saveFn, _getFileFn) => { // by calling document.getElementById here instead outside of init we allow the flow // where javascript is included in the page before the tempalte is loaded into the DOM // it was causing issue to users trying to replicate the app in Vue, and would likely some others too @@ -37,6 +38,7 @@ export const init = (defaultCode, fn, _saveFn) => { compileFn = fn saveFn = _saveFn + getFileFn = _getFileFn // Initialize codemirror const editorDiv = document.getElementById('editor-container') view = new EditorView({ @@ -86,6 +88,26 @@ export const setSource = (source, path = '/index.js') => { currentFile = path } +export function filesChanged(files){ + files.forEach(async path=>{ + if(path == currentFile){ + let file = await getFileFn(path) + readSource(file, path) + } + }) +} + +async function readSource(file, currentFile){ + // Read FileEntry + file.file((file) => { + const reader = new FileReader() + reader.onloadend = () => { + setSource(reader.result, currentFile) + } + reader.readAsText(file) + }) +} + export const setFiles = (files) => { const editorFiles = document.getElementById('editor-files') if (files.length < 2) { @@ -101,14 +123,7 @@ export const setFiles = (files) => { button.addEventListener('click', () => { currentFile = file.fsPath editorFile.innerHTML = currentFile - // Read FileEntry - file.file((file) => { - const reader = new FileReader() - reader.onloadend = () => { - setSource(reader.result, currentFile) - } - reader.readAsText(file) - }) + readSource(file, currentFile) }) item.appendChild(button) editorFiles.appendChild(item)