efront 4.21.3 → 4.22.0

package/coms/zimoli/design.js

@@ -1,12 +1,35 @@
 var field_Id = 0;
 function main(fields, types) {
-    var page = form();
-    page.innerHTML = design;
-    var scope = render(page, {
+    var page = fields;
+    if (isElement(fields)) {
+        fields = [];
+        types = [
+            { name: '字符串', key: 'string' },
+            { name: '布尔值', key: 'boolean' },
+            { name: '列表', key: 'array' },
+            { name: '攻举', key: 'enum' },
+            { name: '对象', key: 'object' },
+            { name: '双精度数值', key: 'number' },
+            { name: "时间戳", key: "timestamp" }
+        ];
+    }
+    else {
+        page = form();
+    }
+    var avoid = [].concat(fields);
+    var defines = refilm`
+    /name/显示名 input ^${avoid}
+    */key/键名 input ^${avoid}
+    /type/选择类型 select ${types}
+    `;
+    var scope = {
         select,
         fields,
-        list,
+        field,
+        defines,
+        dlist: list,
         btn: button,
+        drop,
         padding,
         focus(a) {
             addClass(a, 'focus');
@@ -15,23 +38,36 @@ function main(fields, types) {
             removeClass(a, 'focus');
         },
         add() {
-            this.fields.push({
+            var field = {
                 id: ++field_Id
-            });
+            }
+            this.fields.push(field);
+            avoid.push(field);
             setTimeout(() => {
                 fieldsContainer.go(this.fields.length);
             })
         },
         remove(field) {
-            var fields = this.fields;
-            for (var cx = fields.length - 1; cx >= 0; cx--) {
-                if (fields[cx] === field) {
-                    fields.splice(cx, 1);
-                }
-            }
+            removeFromList(this.fields, field);
+            removeFromList(avoid, field);
         },
         types
-    }).$scope;
+    };
+    care(page, function (fields1) {
+        if (isArray(fields1[0])) {
+            [fields1, types] = fields1;
+        }
+        else {
+            fields1 = fields1;
+        }
+        field_Id = fields1.length;
+        fields = scope.fields = fields1;
+        avoid.splice(0, avoid.length, ...fields1);
+        defines[2].options = types;
+    });
+    page.innerHTML = design;
+    render(page, scope);
+
     var [options, fieldsContainer] = page.children;
     // vbox(fieldsContainer);
     autodragchildren(fieldsContainer, fieldsContainer, function (src, dst, dst1) {

package/coms/zimoli/design.less

@@ -1,6 +1,10 @@
 & {
-    padding: 16px 0;
     position: relative;
+    width: 412px;
+    display: block;
+    margin: 0 auto;
+    height: 260px;
+    padding-top: 30px;
 }
 
 
@@ -10,7 +14,23 @@
 >.options {
     text-align: right;
     padding: 0 16px;
-    width: 412px;
+    height: 30px;
+    line-height: 30px;
+    width: 100%;
+    margin-top: -30px;
+
+    >btn {
+        width: auto;
+        padding: 0 16px;
+        height: 28px;
+        line-height: 28px;
+        border-radius: 0 0 0 12px;
+    }
+
+    >btn:nth-last-child(n+2) {
+        padding-right: 32px;
+        margin-right: -16px;
+    }
 }
 
 .padding {
@@ -21,13 +41,21 @@
 .field-item {
     .index {
         position: absolute;
-        font-size: 10px;
-        margin-top: -12px;
+        cursor: grab;
+
+        &:active {
+            cursor: grabbing;
+        }
+
+        font-size: 12px;
+        margin-top: -13px;
         top: 0;
         left: 6px;
         padding: 0 14px;
         line-height: 1;
-        background: #fff;
+        color: #fff;
+        border-radius: 8px 0 0 0;
+        background: #666;
         display: block;
         border: 1px solid;
         border-color: inherit;
@@ -35,7 +63,6 @@
     }
 
     border-radius: 3px;
-    text-align: right;
     display: block;
     width: 390px;
     max-width: 100%;
@@ -49,44 +76,61 @@
 
         .index {
             border-color: inherit;
+            background: #39c;
         }
     }
 
-    >input,
-    >select,
-    >btn {
+    >[field] {
+        vertical-align: top;
         position: relative;
+        padding: 0;
         width: auto;
-        height: 28px;
         border: none;
         line-height: 28px;
         display: inline-block;
-        vertical-align: middle;
         box-sizing: border-box;
         outline: none;
         appearance: none;
     }
 
-    >input {
+    >[field=name] {
         border-radius: 3px 0 0 3px;
         padding-left: 6px;
-        width: 130px;
+        width: 132px;
+    }
+
+    >[field=type] {
+        min-width: 120px;
+    }
+
+    >[field=key] {
+        width: 120px;
     }
 
-    >select {
-        width: 80px;
+    >drop {
+        line-height: 30px;
+        width: 30px;
+        text-align: center;
+        padding: 0;
+        display: none;
+    }
+
+    &:hover,
+    &:focus {
+        >drop {
+            display: block;
+        }
     }
 
     >btn {
         padding: 0 6px;
-        border-radius: 0 3px 3px 0;
+        overflow: hidden;
     }
 }
 
 &>.fields {
-    max-height: 372px;
     overflow: hidden;
-    height: 260px;
+    height: 100%;
 
     >.focus {
         outline: 1px solid #39c;
@@ -98,11 +142,4 @@ i {
     font-style: normal;
     display: inline-block;
     margin-right: 6px;
-}
-
-.add {
-    width: auto;
-    padding: 0 16px;
-    height: 28px;
-    line-height: 28px;
 }

package/coms/zimoli/drag.js

@@ -15,6 +15,11 @@ var getOffset = function (e) {
     if (isFinite(e.screenLeft)) return [e.screenLeft, e.screenTop];
     if (isFinite(e.screenX)) return [e.screenX, e.screenY];
 };
+
+var getMouse = function (e) {
+    console.log(e)
+    return [e.clientX, e.clientY];
+};
 var z;
 var addZIndex = function (clone) {
     if (clone.style) clone.style.zIndex = z + (+clone.style.zIndex || 0);
@@ -47,7 +52,7 @@ function drag(target, initialEvent, preventOverflow, isMovingSource) {
     if ((!target.hasAttribute || target.hasAttribute('draggable')) && target.draggable === false) return;
     initialEvent.preventDefault();
     var target_offset = getOffset(target);
-    var saved_delta = { x: target_offset[0] - initialEvent.screenX, y: target_offset[1] - initialEvent.screenY };
+    var saved_delta = { x: target_offset[0] - initialEvent.clientX, y: target_offset[1] - initialEvent.clientY };
     var clone;
     if (target.style) {
         var saved_opacity = target.style.opacity;
@@ -87,8 +92,8 @@ function drag(target, initialEvent, preventOverflow, isMovingSource) {
             dispatch("dragstart", target);
         }
         event.moveLocked = true;
-        var offsetLeft = saved_delta.x + event.screenX;
-        var offsetTop = saved_delta.y + event.screenY;
+        var offsetLeft = saved_delta.x + event.clientX;
+        var offsetTop = saved_delta.y + event.clientY;
         var [c_left, c_top] = getOffset(clone);
         var cloneDeltaLeft = -c_left, cloneDeltaTop = -c_top;
         var [c_left, c_top] = move.call(clone, offsetLeft, offsetTop, preventOverflow);

package/coms/zimoli/encode62.js

@@ -5,6 +5,17 @@ var encode62 = {
     src,
     map,
     time_delta: parseInt("zzzzz", 36),
+    pack: 'efront-encode62s',
+    packdecode(string) {
+        if (!string) return string;
+        return this.timedecode(string, this.pack);
+    },
+    packencode(string) {
+        return this.timeencode(string, this.pack);
+    },
+    packupdate(string) {
+        return this.timeupdate(string, this.pack);
+    },
     geta(string) {
         string = String(string)
         string = string.length + string + "2017-08-19";
@@ -26,34 +37,51 @@ var encode62 = {
         string = this.encode(string, sign, offset).replace(/\.\.?/g, a => a === '.' ? "%" : ".");
         return decodeURIComponent(string);
     },
-    timedecode(string) {
+    timedecode(string, pack) {
         var { time_delta } = this;
         var time_rest = string.slice(string.length - time_delta.toString(36).length, string.length);
         var time_start = parseInt((new Date() - parseInt(time_rest, 36)) / time_delta) * time_delta;
         var time_stamp = time_start + parseInt(time_rest, 36);
-        return this.safedecode(string.slice(0, string.length - time_delta.toString(36).length), time_stamp.toString(36));
+        string = string.slice(0, string.length - time_delta.toString(36).length);
+        if (pack) {
+            string = this.decode62(string, time_stamp.toString(36) + pack);
+            var sign = string.slice(string.length - 7, string.length);
+            sign = parseInt(sign, 36);
+            sign -= 0x600000000 + (time_stamp & 0xffffffff);
+            string = string.slice(0, string.length - 7);
+            string = decode62S(string);
+            if (crc.string(time_stamp.toString(36) + pack + string) !== sign) throw new Error('数据校验不通过！');
+            return string;
+        }
+        return this.safedecode(string, time_stamp.toString(36));
     },
-    timeencode(string) {
+    timeencode(string, pack) {
         var { time_delta } = this;
         var time_free = time_delta / 6 | 0;
-        var time = +new Date;
-        time = time - time % (time_delta >> 2);
-        var time_stamp = time - time_free;
+        var time_stamp = +new Date() - time_free;
         var time_rest = time_stamp % time_delta;
         var time_rest_str = time_rest.toString(36);
         var time_delta_str = time_delta.toString(36);
-        return this.safeencode(string, time_stamp.toString(36)) + repeat("0", time_delta_str.length - time_rest_str.length) + time_rest_str;
+        if (pack) {
+            var sign = crc.string(time_stamp.toString(36) + pack + string);
+            sign += 0x600000000 + (time_stamp & 0xffffffff);
+            string = encode62S(string) + sign.toString(36);
+            string = this.encode62(string, time_stamp.toString(36) + pack);
+        }
+        else {
+            string = this.safeencode(string, time_stamp.toString(36));
+        }
+        return string + repeat("0", time_delta_str.length - time_rest_str.length) + time_rest_str;
     },
-    timeupdate(string) {
+    timeupdate(string, pack) {
         var { time_delta } = this;
         var time_rest = string.slice(string.length - time_delta.toString(36).length, string.length);
-        var time = +new Date;
-        var time_start = parseInt((time - parseInt(time_rest, 36)) / time_delta) * time_delta;
+        var time_start = parseInt((new Date() - parseInt(time_rest, 36)) / time_delta) * time_delta;
         var time_stamp = time_start + parseInt(time_rest, 36);
-        if (time_stamp + (time_delta >> 1) > time) {
+        if (time_stamp + (time_delta >> 1) > +new Date()) {
             return string;
         } else {
-            return this.timeencode(this.timedecode(string));
+            return this.timeencode(this.timedecode(string, pack), pack);
         }
     },
     encode(data, sign, offset = 0) {

package/coms/zimoli/lattice.js

@@ -80,7 +80,6 @@ function lattice(element, minWidth, _maxWidth, layers) {
         }
     });
     resizingList.set(_box, _box.resize);
-    on('resize')(_box, _box.resize);
     return _box;
 }
 function main() {

package/coms/zimoli/list.js

@@ -9,14 +9,6 @@ function ylist(container, generator, $Y) {
     list.autoFix = true;
     var saved_itemIndex = 0;
     addClass(list, 'list-' + $Y.toLowerCase());
-    if (!list.$renders) {
-        list.$renders = [];
-    }
-    list.$renders.push(function () {
-        var a = saved_itemIndex;
-        saved_itemIndex = void 0;
-        if (a !== void 0) scrollTo(a);
-    });
     var getNodeTarget = function (node) {
         if (node.nodeType === 8 && node.$template) {
             var t = node.$template;

package/coms/zimoli/menu.js

@@ -89,9 +89,11 @@ var getTreeNodes = function (elem) {
     [].forEach.call(elem.children, run);
     return nodes;
 };
-
+var menusList = [];
+var menusActived = data.getInstance('zimoli-actived');
 function main() {
     var [elem, mode] = arguments;
+    var istag = false;
     if (isElement(elem)) {
         // var os = /Samsung|Firefox|Chrome|MSIE|Safari/i.exec(navigator.userAgent);
         // if (os) {
@@ -111,13 +113,16 @@ function main() {
                 || elem.hasAttribute('tools')
                 || elem.hasAttribute('bar')
             ) mode = "toolbar";
+            else if (elem.hasAttribute('tag') || elem.hasAttribute('tagbar')) {
+                mode = 'tag';
+            }
         }
         if (!mode) {
-            if (/^[xyhvtci]/i.test(elem.tagName)) {
+            if (/^[xyhvtcig]/i.test(elem.tagName)) {
                 mode = elem.tagName.slice(0, 1);
                 if (/^t$/i.test(mode)) mode = elem.tagName.slice(0, 2);
             }
-            else if (/[xyhvci]$/i.test(elem.tagName)) {
+            else if (/[xyhvcig]$/i.test(elem.tagName)) {
                 mode = elem.tagName.slice(elem.tagName.length - 1);
             }
         }
@@ -132,7 +137,7 @@ function main() {
                 if (elem) {
                     var generator = getGenerator(elem, 'menu-item');
                     care(elem, function (src) {
-                        if (src) src = getTreeFromData(src);
+                        if (src) src = getTreeFromData(src, selectedId);
                         var hasIcon = src.hasIcon;
                         elem.useIcon = hasIcon;
                         elem.src = src;
@@ -157,6 +162,10 @@ function main() {
             case "toolbar":
                 direction = 't';
                 mode = "toolbar";
+            case "tag":
+            case "tagbar":
+            case "g":
+                istag = true;
             case "h":
             case "x":
             case "horizonal":
@@ -176,7 +185,7 @@ function main() {
                     care(elem, function (src) {
                         bindGlobalkey(elem, src.keymap);
                         src0.splice(0, src0.length);
-                        var s = getTreeFromData(src);
+                        var s = getTreeFromData(src, selectedId);
                         if (s.actived) {
                             elem.selected = s.actived;
                         }
@@ -207,6 +216,21 @@ function main() {
     if (!elem.hasAttribute('mode')) elem.setAttribute('mode', mode);
     if (!elem.hasAttribute(mode)) elem.setAttribute(mode, '');
     elem.target = document.body;
+    var selectedId = null;
+    if (istag) {
+        on("remove")(elem, function () {
+            removeFromList(menusList, elem);
+        });
+        on('append')(elem, function () {
+            selectedId = menusActived[menusList.length] || 1;
+            menusList.push(elem);
+        });
+        on('actived')(elem, function () {
+            var i = menusList.indexOf(elem) + 1;
+            menusList.splice(i, menusList.length - i);
+            data.setInstance('zimoli-actived', menusList.map(e => e.selected?.id));
+        });
+    }
     return elem;
 
 }