Merge pull request 'create from template' (#77) from templates into main

Reviewed-on: https://codeberg.org/macchiato/pages/pulls/77

components/header.js

@@ -254,6 +254,22 @@ export class Header extends HTMLElement {
     return this.editing ? this.icons.check : this.icons.edit
   }
 
+  getTemplates() {
+    const text = this.storage.getItem(
+      'settings:templates'
+    )
+    if (text ?? undefined !== undefined) {
+      const data = JSON.parse(text)
+      return Object.entries(
+        data.templates
+      ).map(([id, data]) => (
+        {...data, id}
+      ))
+    } else {
+      return []
+    }
+  }
+
   addPage() {
     const dialog = document.createElement('m-dialog')
     this.dialogWrap.replaceChildren(dialog)
@@ -269,6 +285,13 @@ export class Header extends HTMLElement {
       el.innerText = this.text[value]
       return el
     }))
+    const templates = this.getTemplates()
+    select.append(...templates.map(t => {
+      const el = document.createElement('option')
+      el.value = t.id
+      el.innerText = t.name
+      return el
+    }))
     select.value = 'htmlCss'
     input.addEventListener('input', e => {
       const ext = e.target.value.match(/\.\w+$/)
@@ -295,10 +318,9 @@ export class Header extends HTMLElement {
         }
         return
       }
-      const value = (
-        select.value === 'singleFile' ?
-        '' :
-        JSON.stringify({
+      let value
+      if (select.value === 'htmlCss')  {
+        value = JSON.stringify({
           type: 'm-file-group',
           files: [
             {
@@ -311,7 +333,11 @@ export class Header extends HTMLElement {
             },
           ],
         })
-      )
+      } else {
+        value = this.storage.getItem(
+          select.value
+        ) ?? ''
+      }
       this.storage.setItem(newPath, value)
       this.storage.setItem(
         'settings/page:' + newPath, '{}'

components/page-actions.js

@@ -268,6 +268,7 @@ export class PageActions extends HTMLElement {
           settingsData, dir, otherDir
         )
       }
+      this.applyTemplateSettings()
       dialog.close()
       this.dispatchEvent(new CustomEvent(
         'settings-change', {bubbles: true, composed: true}
@@ -336,6 +337,31 @@ export class PageActions extends HTMLElement {
     }
   }
 
+  applyTemplateSettings() {
+    const templates = {}
+    for (const key of this.storage.keys()) {
+      try {
+        if (key.startsWith('settings/page:')) {
+          const data = JSON.parse(
+            this.storage.getItem(key)
+          )
+          if (data.template) {
+            const name = key.slice(
+              'settings/page:'.length
+            )
+            templates[name] = {name}
+          }
+        }
+      } catch (err) {
+        // do nothing
+      }
+    }
+    this.storage.setItem(
+      'settings:templates',
+      JSON.stringify({templates}),
+    )
+  }
+
   get language() {
     return this._language
   }

sw.js

@@ -25,7 +25,8 @@ async function initCache() {
     '/settings/connections.js',
     '/settings/connection-edit.js',
     '/editor-lib-codemirror/codemirror-bundle.js',
-  ]) //1
+    '/storage/storage.js', //2
+  ])
 }
 
 self.addEventListener("install", event => {