Merge branch 'rel-4.1'

src/moto/license.js

@@ -5,7 +5,7 @@
     let terms = {
         COPYRIGHT: "Copyright (C) Stewart Allen <sa@grid.space> - All Rights Reserved",
         LICENSE: "See the license.md file included with the source distribution",
-        VERSION: (is_self ? self : this).debug_version || "4.0.31"
+        VERSION: (is_self ? self : this).debug_version || "4.1.0"
     };
 
     if (typeof(module) === 'object') {

src/moto/space.js

@@ -1308,10 +1308,39 @@ gapp.register("moto.space", [], (root, exports) => {
             return {
                 url: ncv.toDataURL(param.format || "image/png", param.options),
                 width: ncv.width,
-                height: ncv.height
+                height: ncv.height,
             };
         },
 
+        screenshot3(param = {}) {
+            let oco = renderer.domElement;
+            let oWidth = oco.offsetWidth;
+            let oHeight = oco.offsetHeight;
+            let oRatio = oWidth / oHeight;
+            let width = param.width || 512;
+            let height = param.height || width;
+            let nRatio = width / height;
+            let ncv = document.createElement('canvas');
+            ncv.width = width;
+            ncv.height = height;
+            let nco = ncv.getContext('2d');
+            let ox = 0, oy = 0;
+            if (oRatio > nRatio) {
+                let tmp = oWidth;
+                oWidth = oHeight * nRatio;
+                ox = (tmp - oWidth) / 2;
+            } else {
+                let tmp = oHeight;
+                oHeight = oWidth * nRatio;
+                oy = (tmp - oHeight) / 2;
+            }
+            nco.drawImage(oco, ox, oy, oWidth, oHeight, 0, 0, width, height);
+            if (param.out) {
+                ncv.toBlob(blob => blob.arrayBuffer().then(png => param.out({ png, width, height })));
+            }
+            return ncv;
+        },
+
         internals: () => {
             return { renderer, camera, platform };
         },

src/moto/webui.js

@@ -33,9 +33,14 @@ function build(data, context) {
     html.push(`<${type}`);
     let func = {};
     for (let [key, val] of Object.entries(attr || {})) {
+        if (val === undefined) {
+            continue;
+        }
         let tov = typeof val;
         if (key === '_') {
             text = val;
+        } else if (key.startsWith('_')) {
+            if (val) html.push(` ${key.substring(1)}`);
         } else if (key === 'id') {
             elid = val ? (tov === 'object' ? val.join('_') : val) : undefined;
         } else if (tov === 'function') {
@@ -76,7 +81,12 @@ let h = exports({
     bind: (el, data, opt = {}) => {
         let ctx = [];
         let html = build(data, ctx).join('');
-        if (opt.append) {
+        if (opt.after || opt.before) {
+            let tmpl = document.createElement('template');
+            tmpl.innerHTML = html;
+            opt.before && el.before(tmpl.content);
+            opt.after && el.after(tmpl.content);
+        } else if (opt.append) {
             el.innerHTML += html;
         } else {
             el.innerHTML = html;
@@ -149,7 +159,7 @@ gapp.overlay(root, {
 // add common element types
 [
     "a", "i", "hr", "div", "pre", "code", "span", "label", "input",
-    "button", "svg", "textarea", "select", "option"
+    "button", "svg", "textarea", "select", "option", "img", "canvas"
 ].forEach(type => {
     h[type] = (attr, innr) => {
         return h.el(type, attr, innr);