3 changed files with 40 additions and 158 deletions
--- a/README.md
+++ b/README.md
@ -1,3 +1,3 @@
 # loader

-loader: builds content to load in a frame and set up sandbox and CSP
+loader: loads content in a frame and sets up sandbox and CSP
--- a/builder.js
+++ b/builder.js
@ -1,49 +1,8 @@
-const defaultHtml = `
-
-<!doctype html>
-<html>
-  <head>
-    <title>macchiato.dev</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
-    <style type="text/css">
-html, body {
-  margin: 0;
-  padding: 0;
-}
-html {
-  box-sizing: border-box;
-}
-*, *:before, *:after {
-  box-sizing: inherit;
-}
-    </style>
-  </head>
-  <body>
-    ${ '<' + 'script type="module" src="/app.js"><' + '/script>' }
-  </body>
-</html>
-
-`.trim()
-
-const defaultIntro = `
-
-window.Macchiato = {
-  modules: {},
-}
-
-`.trim()
-
-export class Builder {
+class Builder {
  constructor(files) {
    this.files = files
  }

-  buildStyle(file) {
-    const style = document.createElement('style')
-    style.textContent = file.data
-    return style.outerHTML
-  }
-
  buildModule(file) {
    const script = document.createElement('script')
    script.setAttribute('type', 'module')
@ -61,7 +20,7 @@ export class Builder {
        return `// append: ${s}\n${match}`
      }
    ).replaceAll(
-      /^\s*import\s+(\{[^}]+\})\s+from\s+("[^"]+")/gms,
+      /^\s*import\s+(\{[^}]+\})\s+from\s+("[^"]+"|')/gms,
      (match, p1, p2) => {
        const vars = p1.replaceAll(' as ', ': ')
        const importPath = p2.slice(1, -1)
@ -80,81 +39,44 @@ export class Builder {
    return script.outerHTML
  }

-  buildReplace(filesMap) {
-    if ('_replace.js' in filesMap) {
-      const rSrc = filesMap['_replace.js']
-      return new Function(
-        rSrc.match(/\((\w+)\)/)[1],
-        rSrc.slice(
-          rSrc.indexOf('{') + 1,
-          rSrc.lastIndexOf('}')
-        )
-      )
-    } else {
-      return ({data}) => data
-    }
-  }
-
  build() {
-    const filesMap = Object.fromEntries(
-      this.files.map(
-        ({name, data}) => ([name, data])
-      )
-    )
-    const replace = this.buildReplace(filesMap)
-    const intro = this.buildModule({
-      name: '_intro.js',
-      data: replace({
-        name: '_intro.js',
-        data: (
-          '_intro.js' in filesMap ? 
-          filesMap['_intro.js'] :
-          defaultIntro
-        ),
-        files: this.files,
-      })
+    const modules = this.files.map(file => {
+      return this.buildModule(file)
    })
-    const modules = this.files.filter(({name}) => (
-      name.endsWith('.js') && 
-      !name.startsWith('_')
-    )).map(file => (
-      this.buildModule({
-        ...file,
-        data: replace({
-          ...file,
-          files: this.files,
-        }),
-      })
-    ))
-    const styles = this.files.filter(({name}) => (
-      name.endsWith('.css')
-    )).map(file => (
-      this.buildStyle(file)
-    ))
-    let html = (
-      'index.html' in filesMap ?
-      filesMap['index.html'] :
-      defaultHtml
-    )
-    let replaced = false
-    html = html.replace(/\s*<\/head>/, match => {
-      replaced = true
-      return styles.join("\n") + "\n" + match
-    })
-    if (!replaced) {
-      html = styles.join("\n") + "\n" + html
-    }
-    replaced = false
-    html = html.replace(
-      '<' + 'script type="module" src="/app.js"><' + '/script>',
-      () => {
-        replaced = true
-        return intro + "\n" + modules.join("\n")
-      }
-    )
-    if (!replaced) {
-      html += "\n" + intro + "\n" + modules.join("\n")
-    }
-    return html
+    return `
+<!doctype html>
+<html>
+  <head>
+    <title>Editor</title>
+    <style>
+html, body, iframe {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+}
+iframe {
+  border: none;
+  display: block;
+}
+html {
+  box-sizing: border-box;
+}
+*, *:before, *:after {
+  box-sizing: inherit;
+}
+    </style>
+  </head>
+  <body>
+${'<'}script type="module">
+window.Macchiato = {modules: {}}
+${'</'}script>
+${modules.join("\n")}
+${'<'}script type="module">
+
+${'</'}script>
+  </body>
+</html>
+    `.trim()
  }
 }
--- a/editor-build.js
+++ b/editor-build.js
@ -1,40 +0,0 @@
-import { Builder } from "/loader/builder.js"
-
-export class EditorBuild {
-  deps = [
-    'forms/button-group.js',
-    'dialog/dialog.js',
-    'menu/dropdown.js',
-    'editor/header.js',
-    'editor/file-group.js',
-    'editor/file-view.js',
-    'editor/text-edit.js',
-    'editor/code-edit.js',
-    'loader/builder.js',
-    'editor/app.js',
-  ]
-
-  constructor() {
-    this.files = undefined
-  }
-
-  async loadFiles() {
-    const files = []
-    for (const name of this.deps) {
-      const resp = await fetch(name)
-      files.push({
-        name,
-        data: await resp.text(),
-      })
-    }
-    this.files = files
-  }
-
-  async build() {
-    if (this.files === undefined) {
-      await this.loadFiles()
-    }
-    const builder = new Builder(this.files)
-    return builder.build()
-  }
-}