efront 3.26.7 → 3.26.14

package/coms/zimoli/prompt.less

@@ -0,0 +1,23 @@
+tip {
+    display: block;
+    font-size: 12px;
+    color: #c24;
+}
+
+[error] {
+
+    >input {
+        background: #c241;
+        border-color: #c24;
+    }
+}
+
+textarea {
+    width: 100%;
+    height: 100%;
+    resize: none;
+}
+
+input {
+    width: 100%;
+}

package/coms/zimoli/render.js

@@ -2,10 +2,28 @@ var hasOwnProperty = {}.hasOwnProperty;
 var renderElements = Object.create(null);
 var presets = Object.create(null);
 var createTemplateNodes = function (text) {
-    var node = document.createElement(this.parentNode.tagName || "div");
-    node.innerHTML = text;
     remove(this.with);
-    this.with = [].slice.call(node.childNodes, 0);
+    if (isEmpty(text)) return;
+    if (isNode(text)) {
+        var node = text;
+        if (isElement(node) && this.$struct.copys) {
+            for (var c of this.$struct.copys) {
+                if (c.name === 'class') {
+                    addClass(node, c.value);
+                }
+                else if (c.name === 'style') {
+                    css(node, c.value);
+                }
+                else node.setAttribute(c.name, c.value);
+            }
+        }
+        this.with = [node];
+        return;
+    } else {
+        var node = document.createElement(this.parentNode.tagName || "div");
+        node.innerHTML = text;
+        this.with = [].slice.call(node.childNodes, 0);
+    }
     appendChild.after(this, this.with);
     this.with = renderElement(this.with, this.$scope, this.$parentScopes, this.renderid === 9);
 };
@@ -13,7 +31,7 @@ presets.template = function (t) {
     var comment = document.createComment('template');
     comment.$scope = t.$scope;
     comment.$parentScopes = t.$parentScopes;
-    if (!t.innerHTML) {
+    if (t.$struct.binds.src) {
         care(comment, createTemplateNodes)
     }
     else {
@@ -77,20 +95,13 @@ function rebuild(element) {
     }
 }
 var variableReg = /([^\:\,\+\=\-\!%\^\|\/\&\*\!\;\?\>\<~\{\}\s\[\]\(\)]|\?\s*\.(?=[^\d])|\s*\.\s*)+/g;
-var createGetter = function (search, isprop = true) {
+var variableOnlyReg = new RegExp(`^${variableReg.source}$`);
+var createGetter = function (target, search, isprop = true) {
     if (!search) return function () { };
     search = renderExpress(search);
-    if (isprop) {
-        return function (event) {
-            return $eval.call(this, search, this.$scope, event);
-        };
-    }
-    if (/([\=\(\+\-])/.test(search)) return function (event) {
-        return $eval.call(this, search, this.$scope, event);
-    }
-    else return function (event) {
-        $eval.call(this, search)(event);
-    }
+    if (isprop) return $$eval.bind(target, search, null);
+    if (variableOnlyReg.test(search)) return $$eval.bind(target, search + "(event)", null);
+    else return $$eval.bind(target, search, null);
 };
 var createComment = function (renders, type, expression) {
     var comment = document.createComment(`${type} ${expression}`);
@@ -187,11 +198,11 @@ var createRepeat = function (search, id = 0) {
     if (!repeater) throw new Error(`不能识别循环表达式: ${expression} `);
     var { srcName, trackBy } = repeater;
     // 懒渲染
-    var getter = createGetter(srcName).bind(this);
+    var getter = createGetter(this, srcName);
     var element = this, clonedElements = [], savedValue, savedOrigin;
     if (this.$struct.if) id = -7;
     var renders = [function () {
-        var result = getter();
+        var result = getter(this);
         var origin = result;
         result = extend(result instanceof Array ? [] : {}, result);
         if (savedOrigin === origin && deepEqual.shallow(savedValue, result)) return;
@@ -260,7 +271,7 @@ var initIf = function (ifs) {
 };
 var createIf = function (search, id = 0) {
     // 懒渲染
-    var getter = createGetter(search).bind(this);
+    var getter = createGetter(this, search);
     var element = this;
     var elements = [element, getter];
     if_top.push(elements);
@@ -268,15 +279,17 @@ var createIf = function (search, id = 0) {
     elements.parent = this.parentNode;
     elements.comment = search;
     if (this.$struct.repeat) id = -3;
+
     elements.renders = [function () {
         var shouldMount = -1;
         for (var cx = 0, dx = elements.length; cx < dx; cx += 2) {
             var getter = elements[cx + 1];
-            if (!getter || getter()) {
+            if (!getter || getter(this)) {
                 shouldMount = cx;
                 break;
             }
         }
+        // console.log(shouldMount,savedValue,this,this.$scope)
         if (savedValue === shouldMount) return;
         savedValue = shouldMount;
         for (var cx = 0, dx = elements.length; cx < dx; cx += 2) {
@@ -366,17 +379,20 @@ var renderStructure = function (element) {
     var $struct = element.$struct;
     if ($struct.if) var { name: ifkey, key, value: ifexp } = $struct.if;
     if ($struct.repeat) var { value: repeat } = $struct.repeat;
-    delete $struct.if;
     if (!ifkey) return createRepeat.call(element, repeat);
     if (!ifexp || !repeat) return structures[key].call(element, ifexp);
     var { before, after } = parseIfWithRepeat(ifexp, repeat);
     if (after.length) {
         $struct.if = { key, name: ifkey, value: after.join("&&") };
     }
+    else {
+        delete $struct.if;
+    }
     if (before.length > 0) {
         return createIf.call(element, before.join("&&"), null);
     } else {
         delete $struct.repeat;
+        if (!repeat) debugger;
         return createRepeat.call(element, repeat, null);
     }
 };
@@ -396,7 +412,7 @@ var structures = {
         initIf(if_top.splice(cx + 1, if_top.length - cx - 1));
         var top = if_top[cx];
         if (search && search) {
-            var getter = createGetter(search).bind(this);
+            var getter = createGetter(this, search);
         }
         var comment = createComment.call(this, undefined, search ? 'elseif' : 'else', search);
         top.push(comment, getter);
@@ -409,10 +425,10 @@ structures["else-if"] = structures.elseif = structures.else;
 structures["for-each"] = structures.foreach = structures.for = structures.each = structures.repeat;
 var createBinder = function (binder) {
     return function (search) {
-        var getter = createGetter(`(${search})`).bind(this);
+        var getter = createGetter(this, `(${search})`);
         var oldValue;
         this.renders.push(function () {
-            var value = getter();
+            var value = getter(this);
             if (deepEqual.shallow(value, oldValue)) return;
             oldValue = value;
             if (isNode(value) || isArray(value)) {
@@ -430,10 +446,10 @@ var createBinder = function (binder) {
 }
 
 var src2 = function (search) {
-    var getter = createGetter(search).bind(this);
+    var getter = createGetter(this, search);
     var savedValue;
     this.renders.push(function () {
-        var origin = getter();
+        var origin = getter(this);
         var temp = origin;
         if (origin instanceof Array) {
             temp = extend([], origin);
@@ -465,36 +481,36 @@ var directives = {
         var parsedSrc = this.$src;
         return src2.call(this, parsedSrc ? parsedSrc.srcName : src);
     },
-    model(search) {
-        var getter = createGetter(search).bind(this);
+    model(search, target) {
+        var getter = createGetter(this, search);
         var oldValue;
-        var getstr = this.getValue instanceof Function ? "this.getValue()" : "";
-        var setter = this.setValue instanceof Function ? function () {
-            var value = getter();
+        var getstr = target.getValue instanceof Function ? "this.getValue()" : "";
+        var setter = target.setValue instanceof Function ? function () {
+            var value = getter(this);
             if (value === undefined) value = "";
             if (deepEqual(oldValue, value)) return;
             oldValue = value;
             this.setValue(value);
         } : null;
         var setter2 = function (key) {
-            var value = getter();
+            var value = getter(this);
             if (value === undefined) value = "";
             if (deepEqual(oldValue, value)) return;
             oldValue = value;
             this[key] = value;
         };
-        if (/^input$/i.test(this.tagName) && /^checkbox$/i.test(this.type) || /^checkbox$/i.test(this.tagName)) {
-            this.renders.push(setter || setter2.bind(this, 'checked'));
+        if (/^input$/i.test(target.tagName) && /^checkbox$/i.test(target.type) || /^checkbox$/i.test(target.tagName)) {
+            this.renders.push(setter || setter2.bind(target, 'checked'));
             var change = getstr || "this.checked";
-        } else if (("value" in this || this.getValue instanceof Function) && this.setValue instanceof Function) {
+        } else if (("value" in target || target.getValue instanceof Function) && target.setValue instanceof Function) {
             this.renders.push(setter);
             var change = getstr || "this.value";
-        } else if (/^(select|input|textarea)$/i.test(this.tagName) || "value" in this) {
-            this.renders.push(setter || setter2.bind(this, 'value'));
+        } else if (/^(select|input|textarea)$/i.test(target.tagName) || "value" in target) {
+            this.renders.push(setter || setter2.bind(target, 'value'));
             var change = getstr || "this.value";
         } else {
             this.renders.push(setter || function () {
-                var value = getter();
+                var value = getter(this);
                 if (value === undefined) value = "";
                 if (deepEqual(oldValue, value)) return;
                 oldValue = value;
@@ -503,24 +519,25 @@ var directives = {
             var change = getstr || "'value' in this?this.value:this.innerHTML";
         }
         setter2 = null;
+        var changeme = $$eval.bind(this, search + "=" + change, null);
         var onchange = function () {
-            $eval.call(this, search + "=" + change, this.$scope);
-            var value = getter();
+            changeme(this);
+            var value = getter(this);
             if (value === oldValue) {
                 return;
             }
             oldValue = value;
             userChanged = true;
         };
-        eventsBinders.forEach(on => on(this, onchange, true));
+        eventsBinders.forEach(on => on(target, onchange, true));
     },
 
     "class"(search) {
-        var getter = createGetter(`(${search})`).bind(this);
+        var getter = createGetter(this, `(${search})`);
         var generatedClassNames = {};
         var oldValue;
         this.renders.push(function () {
-            var className = getter();
+            var className = getter(this);
             if (deepEqual(oldValue, className)) return;
             oldValue = className;
             var originalClassNames = [];
@@ -556,10 +573,10 @@ directives.text = directives.bind;
 var binders = {
     _(attr, search) {
         attr = attr.replace(/\-(\w)/g, (_, w) => w.toUpperCase());
-        var getter = createGetter(search).bind(this);
+        var getter = createGetter(this, search);
         var oldValue;
         this.renders.push(function () {
-            var value = getter();
+            var value = getter(this);
             if (deepEqual(value, oldValue)) return;
             oldValue = value;
             if (this[attr] !== value) {
@@ -568,10 +585,10 @@ var binders = {
         });
     },
     ""(attr, search) {
-        var getter = createGetter(search).bind(this);
+        var getter = createGetter(this, search);
         var oldValue;
         this.renders.push(function () {
-            var value = getter();
+            var value = getter(this);
             if (deepEqual(value, oldValue)) return;
             oldValue = value;
             if (value === true || value === '') {
@@ -587,10 +604,12 @@ var binders = {
     }
 };
 var reject = function (e) { digest(); throw e };
-var createEmiter = function (on) {
-    return function (key, search) {
-        var parsedSrc = this.$src;
-        var getter = createGetter(search, false);
+var createEmiter = function (on, target) {
+    return function (target, key, search) {
+        /**
+         * @type {Repeater}
+         */
+        var getter = createGetter(this, search, false);
         var onkey;
         if (key === 'mounted' || key === 'mount') {
             onkey = on === once ? oncemount : onmounted;
@@ -601,18 +620,24 @@ var createEmiter = function (on) {
         else {
             onkey = on(key);
         }
-        onkey(this, function (e) {
+        onkey(target, function (e) {
             digest();
-            if (parsedSrc) {
-                var target = e.currentTarget || e.target;
-                var scopes = target && target.$parentScopes;
-                if (scopes) {
-                    var scope = null;
-                    for (var cx = scopes.length - 1; cx >= 0; cx--) {
-                        var s = scopes[cx];
-                        if (s === this.$scope) {
-                            scope = scopes[cx + 1];
-                            break;
+            var parsedSrc = this.$src;
+            if (parsedSrc instanceof Repeater) {
+                var target = e.currentTarget === this ? e.target : e.currentTarget || e.target;
+                if (target === this) {
+                    scope = parsedSrc.createScope();
+                }
+                else {
+                    var scopes = target && target.$parentScopes;
+                    if (scopes) {
+                        var scope = null;
+                        for (var cx = scopes.length - 1; cx >= 0; cx--) {
+                            var s = scopes[cx];
+                            if (s === this.$scope) {
+                                scope = scopes[cx + 1];
+                                break;
+                            }
                         }
                     }
                 }
@@ -623,12 +648,12 @@ var createEmiter = function (on) {
                 var temp = this.$scope;
                 this.$parentScopes.push(temp);
                 this.$scope = scope;
-                res = getter.call(this, e);
+                res = getter(this, e);
                 this.$parentScopes.pop();
                 this.$scope = temp;
             }
             else {
-                res = getter.call(this, e);
+                res = getter(this, e);
             }
             if (res && isFunction(res.then)) res.then(digest, reject);
             return res;
@@ -656,6 +681,31 @@ function getFromScopes(key, scope, parentScopes) {
     }
 }
 
+function renderRest(element, struct, replacer = element) {
+    var renders = element.renders;
+    element.renders = [];
+    var { binds, attrs, props } = struct;
+    for (var k in binds) {
+        if (k === 'src') continue;
+        if (directives.hasOwnProperty(k)) {
+            directives[k].call(element, binds[k], replacer);
+        }
+        else {
+            binders._.call(element, k, binds[k]);
+        }
+    }
+    for (var k in struct.attrs) {
+        binders[""].call(element, k, attrs[k]);
+    }
+    for (var k in struct.props) {
+        try {
+            if (replacer[k] !== props[k]) replacer[k] = props[k];
+        } catch (e) { }
+    }
+    if (binds.src) directives.src.call(element, binds.src);
+    if (renders.length) element.renders.push.apply(element.renders, renders);
+}
+
 function renderElement(element, scope = element.$scope, parentScopes = element.$parentScopes, once) {
     if (isArrayLike(element)) {
         return Array.prototype.slice.call(element).map(function (element) {
@@ -687,13 +737,11 @@ function renderElement(element, scope = element.$scope, parentScopes = element.$
     if (!element || element.renderid < 0 || element.nodeType !== 1) {
         return element;
     }
-    var elementid = element.getAttribute("renderid") || element.getAttribute("elementid") || element.getAttribute("id");
-    if (elementid) {
-        if (scope[elementid] && scope[elementid] !== element) throw new Error("同一个id不能使用两次:" + elementid);
-        scope[elementid] = element;
+    for (var id of element.$struct.ids) {
+        if (scope[id] && scope[id] !== element) throw new Error("同一个id不能使用两次:" + id);
+        scope[id] = element;
     }
     var isFirstRender = !element.renderid;
-
     if (isFirstRender) {
         element.renderid = 1;
         var parentNode = element.parentNode;
@@ -701,7 +749,7 @@ function renderElement(element, scope = element.$scope, parentScopes = element.$
             if (parentNode.renderid > 1 || isMounted(parentNode)) element.renderid = 2;
         }
         element.renders = element.renders ? [].concat(element.renders) : [];
-        var { ons, copys, attrs, props, binds, ids, once } = element.$struct;
+        var { copys, binds, once } = element.$struct;
         if (once) element.renderid = 9;
         if (binds.src) {
             element.$src = parseRepeat(binds.src);
@@ -720,6 +768,11 @@ function renderElement(element, scope = element.$scope, parentScopes = element.$
         if (isFunction(constructor)) {
             var replacer = constructor.call(scope, element, scope, parentScopes);
             if (isNode(replacer) && element !== replacer) {
+                if (!replacer.$scope) {
+                    replacer.$scope = scope;
+                }
+                if (replacer.children && replacer.children.length) renderElement(replacer.children, replacer.$scope, replacer.$parentScopes || parentScopes, once);
+                if (!replacer.$parentScopes) replacer.$parentScopes = parentScopes;
                 if (nextSibling) appendChild.before(nextSibling, replacer);
                 else if (parentNode) appendChild(parentNode, replacer);
                 if (element.parentNode === parentNode) remove(element);
@@ -740,42 +793,29 @@ function renderElement(element, scope = element.$scope, parentScopes = element.$
                             replacer.setAttribute(name, value);
                     }
                 });
-                replacer.renderid = element.renderid;
-                var renders = element.renders;
-                if (replacer.renders) renders = renders.concat(replacer.renders);
-                replacer.renders = renders;
-                if (binds.src) replacer.$src = element.$src;
-                replacer.$eval = element.$eval;
-                element = replacer;
-                element.$scope = scope;
-                element.$parentScopes = parentScopes;
+                if (!replacer.renderid) replacer.renderid = element.renderid;
             }
         }
     }
-    if (element.children && element.children.length) renderElement(element.children, scope, parentScopes, once);
+    if (!replacer || element === replacer) {
+        if (element.children && element.children.length) renderElement(element.children, scope, parentScopes, once);
+    }
     if (!isFirstRender) return element;
-    var renders = element.renders;
-    element.renders = [];
-    for (var k in binds) {
-        if (k === 'src') continue;
-        if (directives.hasOwnProperty(k)) {
-            directives[k].call(element, binds[k])
+    renderRest(element, element.$struct, replacer);
+    if (replacer) {
+        if (!replacer.renders) replacer.renders = [];
+        if (isElement(replacer)) createStructure(replacer);
+        replacer.renders = [].concat(element.renders, replacer.renders);
+        for (var id of element.$struct.ids) {
+            scope[id] = replacer;
         }
-        else {
-            binders._.call(element, k, binds[k]);
+        if (replacer.$struct && replacer.$struct !== element.$struct) {
+            renderRest(replacer, replacer.$struct);
+            element.$struct.ons.forEach(([on, key, value]) => on.call(element, replacer, key, value));
         }
+        element = replacer;
     }
-    for (var k in attrs) {
-        binders[""].call(element, k, attrs[k]);
-    }
-    for (var k in props) {
-        try {
-            if (element[k] !== props[k]) element[k] = props[k];
-        } catch (e) { }
-    }
-    if (binds.src) directives.src.call(element, binds.src);
-    ons.forEach(([on, key, value]) => on.call(element, key, value));
-    if (renders.length) element.renders.push.apply(element.renders, renders);
+    if (element.$struct) element.$struct.ons.forEach(([on, key, value]) => on.call(element, element, key, value));
     if (element.renders.length) {
         if (element.renderid !== 9) {
             onmounted(element, addRenderElement);
@@ -787,21 +827,18 @@ function renderElement(element, scope = element.$scope, parentScopes = element.$
             rebuild(element);
         }
     }
-    if (elementid) scope[elementid] = element;
-    for (var id of ids) {
-        scope[id] = element;
-    }
     return element;
 }
 var createEval = function (deep) {
     var context = [];
     while (deep-- > 0) {
-        context[deep] = `with(this.$parentScopes[${deep}])`;
+        context[deep] = `with($parentScopes[${deep}])`;
     }
-    return new Function("code", "event", `${context.join('')}with(this.$scope)return eval(code)`);
+    return new Function("$parentScopes", "$scope", "code", "event", `${context.join('')}with($scope)return eval(code)`);
 };
 var evalcontexts = [createEval(0)];
-function $eval(search, scope, event) {
+
+function $$eval(search, scope, target = this, event) {
     var needpop = scope && scope !== this.$scope;
     if (needpop) {
         this.$parentScopes.push(this.$scope);
@@ -810,11 +847,15 @@ function $eval(search, scope, event) {
     var length = this.$parentScopes ? this.$parentScopes.length : 0;
     if (!evalcontexts[length]) evalcontexts[length] = createEval(length);
     var eval2 = evalcontexts[length];
-    var res = eval2.call(this, search, event);
+    var res = eval2.call(target, this.$parentScopes, this.$scope, search, event);
     if (needpop) this.$scope = this.$parentScopes.pop();
     return res;
 }
 
+function $eval(search, scope, event) {
+    return $$eval.call(this, search, scope, this, event);
+}
+
 class Struct {
     constructor(ons, types, copys, binds, attrs, props, ids, once) {
         this.ons = ons;
@@ -834,6 +875,7 @@ function createStructure(element) {
     if (isArrayLike(element)) return Array.prototype.map.call(element, createStructure);
     if (element.$struct) return element.$struct;
     // 处理结构流
+    if (!element.attributes) console.log(element)
     var attrs = Array.prototype.slice.call(element.attributes);
     var types = {};
     var emiter_reg = /^(?:(v|ng|on|once)?\-|v\-on\:|@|once|on)/i;
@@ -846,6 +888,10 @@ function createStructure(element) {
     var ids = [];
     for (var attr of attrs) {
         var { name, value } = attr;
+        if (name === 'elementid' || name === 'renderid' || name === 'id') {
+            ids.push(value);
+            continue;
+        }
         if (/^#/.test(name)) {
             ids.push(name.slice(1));
             element.removeAttribute(name);
@@ -940,9 +986,9 @@ function render(element, scope, parentScopes, lazy = true) {
 var digest = lazy(refresh, -{});
 render.digest = render.apply = render.refresh = digest;
 render.parseRepeat = parseRepeat;
-var eventsBinders = "fullscreenchange,resize,load,change,click,paste,resize,keydown,keypress,keyup,input,drop".split(",").map(k => on(k));
+"fullscreenchange,resize,load,hashchange".split(",").forEach(e => on(e)(window, digest));
+var eventsBinders = "change,click,paste,cut,resize,keydown,keypress,keyup,input,drop".split(",").map(k => on(k));
 var userChanged = false;
-eventsBinders.splice(0, 3).forEach(on => on(window, digest));
 var changeListener = function () {
     if (userChanged) {
         userChanged = false;

package/coms/zimoli/resize.js

@@ -52,10 +52,16 @@ var handle = {
         if (dragging) return;
         dragging = getResizer(event);
         if (!dragging) return;
-        event.moveLocked = true;
         var elem = dragging.rect;
         if (elem.offsetParent && /^(absolute|fixed|relative)$/i.test(getComputedStyle(elem.offsetParent).position)) {
-            var pos = getScreenPosition(elem.offsetParent);
+            var parent = elem.offsetParent;
+            var pos = getScreenPosition(parent);
+            pos.left += parent.clientLeft;
+            pos.top += parent.clientTop;
+            pos.right = parent.clientWidth + pos.left;
+            pos.bottom = parent.clientHeight + pos.top;
+            pos.width = parent.clientWidth;
+            pos.height = parent.clientHeight;
         } else {
             var pos = {
                 left: 0,
@@ -88,8 +94,6 @@ var handle = {
     },
     move(event) {
         if (!dragging) return;
-        if (event.moveLocked) return;
-        event.moveLocked = true;
         var limit = dragging.limit;
         var { clientX, clientY } = event;
         var [minx, miny, maxx, maxy] = limit;
@@ -130,8 +134,11 @@ var handle = {
         dragging = null;
     }
 };
-function resize(elem, initialEvent) {
+function resize(elem, initialEvent, limit = elem.limit) {
+    resizingElements.push(elem);
     moveupon(elem, handle, initialEvent);
+    if (limit && dragging) extendIfOccurs(dragging.limit, limit);
+    resizingElements.pop();
 }
 moveupon(window, handle);
 

package/coms/zimoli/rootElements.js

@@ -37,4 +37,18 @@ rootElements.unmount = function (elem) {
     if (!elem.parentNode) return;
     rootElements.pop(elem);
     remove(elem);
-};
+};
+/**
+ * 弹出层
+ */
+on("keydown.esc.only")(document, function (e) {
+    if (e.defaultPrevented) return;
+    if (rootElements.length) {
+        var r = rootElements.pop();
+        if (r) {
+            r.blur();
+            remove(r);
+            e.preventDefault();
+        }
+    }
+});

package/coms/zimoli/view.js

@@ -90,6 +90,37 @@ var init = function () {
         marginRight: -getScrollbarWidth() + "px"
     });
 };
+var isType = function (target, type) {
+    // 记得小时候，不论是苍蝇还是蚊子，飞起来都是有声音的。最近看到的一种像蚊子一样小的飞虫，喜欢像苍蝇一样趴在食物上，飞起来却听不到声音。
+    // 是我的听力下降了？还是外界太过嘈杂？还是飞虫拍打翅膀的频率超出了我的听觉范围？还是飞行可以不产生声音？
+    return target.hasAttribute(type) || hasClass(type);
+}
+var resize2 = function () {
+    var head, body, foot;
+    for (var c of this.children) {
+        if (isType(c, "head")) head = c;
+        else if (isType(c, "body")) body = c;
+        else if (isType(c, "foot")) foot = c;
+    }
+    if (head && body) {
+        var height = head.offsetHeight;
+        css(head, {
+            marginBottom: fromOffset(-height),
+        })
+        css(body, {
+            paddingTop: fromOffset(height)
+        });
+    }
+    if (foot && body) {
+        var height = foot.offsetHeight;
+        css(body, {
+            paddingBottom: fromOffset(height)
+        });
+        css(foot, {
+            marginTop: fromOffset(-height)
+        })
+    }
+};
 function view(element) {
     var window = isNode(element) ? element : document.createElement("form");
     init();
@@ -104,5 +135,7 @@ function view(element) {
         })
         if (window.resizable) resize.on(window);
     }
+    on('resize')(window, resize2);
+    onmounted(window, resize2);
     return window;
 }