waibu-mpa 2.1.0 → 2.1.2

package/extend/bajoTemplate/template/wmpa.js

@@ -98,9 +98,13 @@ class Wmpa {
     return result
   }
 
-  fetchRender = async (body) => {
+  fetchRender = async (body, qs = {}) => {
     if (_.isArray(body)) body = body.join('\n')
-    const resp = await fetch(this.renderUrl, {
+    let url = this.renderUrl + '?'
+    _.forOwn(qs, (v, k) => {
+      url += '&' + k + '=' + v
+    })
+    const resp = await fetch(url, {
       method: 'POST',
       headers: { 'Content-Type': 'text/plain', 'Waibu-Referer': window.location.href },
       body
@@ -187,9 +191,9 @@ class Wmpa {
     return selector instanceof HTMLElement ? selector : document.querySelector(selector)
   }
 
-  createComponent = async (body, wrapper) => {
+  createComponent = async (body, wrapper, qs = {}) => {
     if (_.isArray(body)) body = body.join('\n')
-    const html = await this.fetchRender(body)
+    const html = await this.fetchRender(body, qs)
     return this.createComponentFromHtml(html, wrapper)
   }
 
@@ -201,9 +205,9 @@ class Wmpa {
     return cmp.getAttribute('id')
   }
 
-  replaceWithComponent = async (body, selector, wrapper) => {
+  replaceWithComponent = async (body, selector, wrapper, qs = {}) => {
     let cmp
-    if (_.isString(body) || _.isArray(body)) cmp = await this.createComponent(body, wrapper)
+    if (_.isString(body) || _.isArray(body)) cmp = await this.createComponent(body, wrapper, qs)
     else cmp = body
     const el = this.getElement(selector)
     if (!el) return
@@ -221,9 +225,9 @@ class Wmpa {
     return cmp.getAttribute('id')
   }
 
-  addComponent = async (body, selector = 'body', wrapper, checkChild) => {
+  addComponent = async (body, selector = 'body', wrapper, checkChild, qs = {}) => {
     let cmp
-    if (_.isString(body) || _.isArray(body)) cmp = await this.createComponent(body, wrapper)
+    if (_.isString(body) || _.isArray(body)) cmp = await this.createComponent(body, wrapper, qs)
     else cmp = body
     const el = this.getElement(selector)
     if (!el) return

package/extend/waibuMpa/route/component/render.js

@@ -5,7 +5,7 @@ const component = {
     const { ext = '.html' } = req.body
     reply.header('Content-Type', `text/html; charset=${this.config.page.charset}`)
     reply.header('Content-Language', req.lang)
-    const opts = { req, reply, partial: true, ext }
+    const opts = { req, reply, partial: true, ext, theme: req.params.theme ?? req.query.theme, iconset: req.params.iconset ?? req.query.iconset }
     return this.renderString(req.body, req.query, opts)
   }
 }

package/index.js

@@ -1,5 +1,7 @@
 import { stripHtml } from 'string-strip-html'
 import iconsetMappings from './lib/iconset-mappings.js'
+import toolsFactory from './lib/class/tools.js'
+import widgetFactory from './lib/class/widget.js'
 import path from 'path'
 
 // taken from: https://stackoverflow.com/questions/52928550/js-get-list-of-all-available-standard-html-tags
@@ -68,6 +70,7 @@ async function factory (pkgName) {
             css: true,
             meta: true,
             scripts: true,
+            links: true,
             inlineScript: true,
             inlineCss: true
           },
@@ -81,6 +84,7 @@ async function factory (pkgName) {
           autoInsert: {
             css: true,
             scripts: true,
+            links: true,
             inlineScript: true,
             inlineCss: true
           }
@@ -89,7 +93,8 @@ async function factory (pkgName) {
           cacheMaxAge: 0,
           excluded: [],
           css: false,
-          scripts: false
+          scripts: false,
+          links: false
         },
         cheerio: {
           loadOptions: {
@@ -130,6 +135,8 @@ async function factory (pkgName) {
     init = async () => {
       const { trim } = this.app.lib._
       this.config.waibu.prefix = trim(this.config.waibu.prefix, '/')
+      await toolsFactory.call(this)
+      await widgetFactory.call(this)
     }
 
     arrayToAttr = (array = [], delimiter = ' ') => {

package/lib/build-page/concat-resources.js

@@ -63,6 +63,7 @@ async function concatResources (options) {
   if (!(this.app.bajoExtra && this.app.bajoCache)) return
   if (this.config.concatResource.cacheMaxAge < 1) return
   if (this.config.concatResource.css) await apply.call(this, { $, req, tag: 'link', attr: 'href', type: 'css' })
+  if (this.config.concatResource.links) await apply.call(this, { $, req, tag: 'link', attr: 'href', type: 'css' })
   if (this.config.concatResource.scripts) await apply.call(this, { $, req, tag: 'script', attr: 'src', type: 'js' })
 }
 

package/lib/build-page/inject-elements/link.js

@@ -0,0 +1,16 @@
+import { collectRegular } from './script.js'
+
+export function printLink (link) {
+  const { routePath } = this.app.waibu
+  const { isString } = this.app.lib._
+  const item = isString(link) ? { href: link, rel: 'stylesheet', type: 'text/css' } : link
+  return `<link href="${routePath(item.href)}" rel="${item.rel}" type="${item.type}" />`
+}
+
+async function link (options) {
+  const { $ } = options ?? {}
+  const regular = await collectRegular.call(this, 'links', printLink, options)
+  if (regular.length > 0) $('head').prepend(regular.join('\n'))
+}
+
+export default link

package/lib/build-page/inject-elements/meta.js

@@ -1,4 +1,4 @@
-const omitted = ['css', 'style', 'scripts', 'ns', 'appTitle', 'title', 'fullTitle']
+const omitted = ['css', 'style', 'links', 'scripts', 'ns', 'appTitle', 'title', 'fullTitle']
 const names = ['description', 'keywords', 'robots', 'viewport', 'author', 'publisher',
   'application-name', 'generator', 'referrer', 'theme-color', 'googlebot'
 ]

package/lib/build-page/inject-elements.js

@@ -1,6 +1,7 @@
 import injectCss from './inject-elements/css.js'
 import injectMeta from './inject-elements/meta.js'
 import injectScript from './inject-elements/script.js'
+import injectLink from './inject-elements/link.js'
 
 async function injectElements (options) {
   const { $, req, cmp, reply } = options ?? {}
@@ -11,10 +12,10 @@ async function injectElements (options) {
   if (req.darkMode) $('body').attr('data-bs-theme', 'dark')
   const rsc = {}
   for (const tag of reply.ctags ?? []) {
-    let Builder = get(cmp, `factory.${tag}`)
+    let Builder = get(cmp, `widget.${tag}`)
     if (!isFunction(Builder)) continue
     if (!isClass(Builder)) Builder = await Builder.call(cmp)
-    for (const key of ['scripts', 'css']) {
+    for (const key of ['scripts', 'css', 'links']) {
       let item = Builder[key] ?? []
       if (isString(item)) item = [item]
       if (isFunction(item)) item = await item.call(cmp, req)
@@ -32,11 +33,13 @@ async function injectElements (options) {
       }
     }
   }
-  options.scripts = rsc.scripts ?? []
-  options.css = rsc.css ?? []
+  for (const key of ['scripts', 'css', 'links']) {
+    options[key] = rsc[key] ?? []
+  }
   options.inlineScript = rsc.inlineScript
   options.inlineCss = rsc.inlineCss
   await runHook(`${this.ns}:beforeBuildPageInjectElement`, options)
+  await injectLink.call(this, options)
   await injectCss.call(this, options)
   await injectMeta.call(this, options)
   await injectScript.call(this, options)