efront 3.25.7 → 3.25.11

package/coms/zimoli/list.js

@@ -2,9 +2,12 @@
 function ylist(container, generator, $Y) {
     const cache_height = 2000;
     var restHeight = cache_height;
+    /**
+     * @type {HTMLElement}
+     */
     var list = container || div();
     list.autoFix = true;
-    var saved_itemIndex;
+    var saved_itemIndex = 0;
     addClass(list, 'list-' + $Y.toLowerCase());
     if (!list.renders) {
         list.renders = [];
@@ -15,7 +18,11 @@ function ylist(container, generator, $Y) {
         if (a !== void 0) scrollTo(a);
     });
     var getNodeTarget = function (node) {
-        if (node.nodeType === 8 && node.template) return node.template;
+        if (node.nodeType === 8 && node.$template) {
+            var t = node.$template;
+            if (!isFinite(t.index)) t.index = node.index;
+            return node.$template;
+        }
         return node;
     };
     //取底部元素
@@ -109,7 +116,9 @@ function ylist(container, generator, $Y) {
         for (var cx = 0, dx = children.length; cx < dx; cx++) {
             var child = children[cx];
             if (isFinite(child.index) && child.index !== null) {
-                map[child.index] = child;
+                if (!map[child.index] || child.$template === map[child.index]) {
+                    map[child.index] = child;
+                }
             }
         }
         return map;
@@ -203,10 +212,12 @@ function ylist(container, generator, $Y) {
         return y;
     }, false);
     var rebuild = function () {
-        if (!/^(?:auto|scroll)$/i.test(getComputedStyle(list).overflowY)) return;
         runbuild();
     };
-    on("scroll")(list, rebuild);
+    oncemount(list, function () {
+        if (!/^(?:auto|scroll)$/i.test(getComputedStyle(list).overflowY)) return;
+        on("scroll")(list, rebuild);
+    });
     var topinsert = document.createElement('ylist-insert');
     list.insertBefore(topinsert, list.firstChild);
     //计算当前高度
@@ -228,17 +239,17 @@ function ylist(container, generator, $Y) {
         return bottom_element ? bottom_element.nextSibling : null;
     };
     var getOffsetHeight = function (element) {
+        element = getNodeTarget(element);
         var temp = element;
         do {
             var next = getNextSibling(temp);
             if (!next) return element.offsetHeight;
-            temp = next;
+            temp = getNodeTarget(next);
         } while (next.offsetTop === element.offsetTop);
         return next.offsetTop - element.offsetTop;
     };
     var patchBottom = function (deltaY = 0) {
         var cache_height = list.offsetHeight;
-
         var childrenMap = getChildrenMap();
         var last_element = getLastElement(1);
         if (!last_element || !last_element.offsetHeight) return;
@@ -271,7 +282,7 @@ function ylist(container, generator, $Y) {
         var collection = [];
         for (var k in childrenMap) {
             let item = childrenMap[k];
-            if (item.offsetTop + getOffsetHeight(item) + cache_height < scrollTop) {
+            if (getNodeTarget(item).offsetTop + getOffsetHeight(item) + cache_height < scrollTop) {
                 collection.push(item);
             }
         }
@@ -283,7 +294,7 @@ function ylist(container, generator, $Y) {
                 item = collection.pop();
             }
             var item = collection[collection.length - 1];
-            if (item) scrollTop -= item.offsetTop + getOffsetHeight(item) - collection[0].offsetTop;
+            if (item) scrollTop -= getNodeTarget(item).offsetTop + getOffsetHeight(item) - getNodeTarget(collection[0]).offsetTop;
             if (paddingCount > 0 && paddingMax > 0 && paddingCount < paddingMax) {
                 let item = collection[collection.length - 1];
                 while (paddingCount > 0) {
@@ -337,6 +348,7 @@ function ylist(container, generator, $Y) {
         var { clientHeight } = list;
         while (last_element && last_element.offsetTop > clientHeight + scrollTop + cache_height) {
             remove(last_element);
+            remove(last_element.$comment);
             last_element = getLastElement(1);
         }
         return scrollTop - list.scrollTop;
@@ -364,8 +376,11 @@ function ylist(container, generator, $Y) {
             }
         }
     };
+    bind('resize')(list, function () {
+        patchBottom(0);
+    });
     list.getLastVisibleElement = getLastVisibleElement;
-    list.$stopY = function (count, spd) {
+    list.$stopY = function (t, spd) {
         var firstElement = getFirstVisibleElement();
         var lastElement = getLastVisibleElement();
         if (!firstElement || !lastElement || !list.clientHeight) return false;
@@ -387,16 +402,16 @@ function ylist(container, generator, $Y) {
             var target_by = last_y - scrolled_b * lastElement.offsetHeight;
         }
         var target_y = Math.abs(target_ty - last_y) > Math.abs(target_by - last_y) ? target_by : target_ty;
-        var delta = Math.min(calcPixel(60), list.clientHeight >> 2);
-        var deltay = Math.abs(target_y - last_y), y;
-        if (deltay >= delta) {
+        var delta = Math.min(calcPixel(30), list.clientHeight >> 2);
+        var absy = Math.abs(target_y - last_y), y;
+        if (absy >= delta) {
             return false;
         }
-        if (deltay < 2) y = target_y;
+        if (absy <= 1) y = target_y;
         else {
             var speed = Math.abs(spd.read()[0]);
             if (speed < 1) speed = 1;
-            if (deltay < 3) speed = .5;
+            if (absy < 3) speed = .5;
             y = last_y + (target_y > last_y ? speed : -speed);
         }
         list.$Top(y);
@@ -410,7 +425,8 @@ function ylist(container, generator, $Y) {
     list.$Height = function () {
         var elem = getLastElement(2);
         var listRestHeight = elem ? elem.offsetHeight + elem.offsetTop - list.scrollTop : list.clientHeight;
-        return currentY() + listRestHeight + restHeight;
+        var paddingHeight = elem ? 0 : restHeight;
+        return currentY() + listRestHeight + paddingHeight;
     };
     list.$Top = function (y) {
         if (isFinite(y)) {
@@ -442,13 +458,126 @@ function ylist(container, generator, $Y) {
     list.patchBottom = patchBottom;
     list.patchTop = patchTop;
     list.scrollIfNotCover = scrollIfNotCover;
+    list.getLastElement = getLastElement;
     vbox(list, $Y);
     on("remove")(list, function () {
         saved_itemIndex = list.index();
     });
     onmounted(list, function () {
         if (isFinite(saved_itemIndex)) list.go(saved_itemIndex);
-    })
+    });
+    /**
+     * @param {Element|null} focused 
+     * @param {boolean} animate
+     */
+    list.setFocus = function (focused, animate) {
+        if (focused && (focused.hasAttribute("disabled") || focused.hasAttribute("line"))) return;
+        if (!focused) {
+            if (list.focused) {
+                removeClass(list.focused, 'focus');
+                list.focused = null;
+            }
+            return;
+        }
+        if (list.focused === focused) return;
+        if (list.focused) removeClass(list.focused, 'focus');
+        addClass(focused, "focus");
+        var scrollTop = list.scrollTop;
+        var firstElement = getFirstElement(1);
+        var sideheight = 0;
+        if (firstElement) {
+            sideheight += parseFloat(getComputedStyle(firstElement).paddingTop + firstElement.clientTop);
+            sideheight += (firstElement.offsetHeight - sideheight - sideheight) * .3;
+            sideheight += parseFloat(getComputedStyle(list).paddingTop);
+        }
+        if (focused.offsetTop + focused.offsetHeight + sideheight > list.scrollTop + list.clientHeight) {
+            scrollTop = focused.offsetTop + focused.offsetHeight + sideheight - list.clientHeight;
+        }
+        if (focused.offsetTop < list.scrollTop + sideheight) {
+            scrollTop = focused.offsetTop - sideheight;
+        }
+        if (scrollTop !== list.scrollTop) scrollBy(scrollTop - list.scrollTop, animate);
+        list.focused = focused;
+    };
+
+    /**
+     * @param {number|"up"|"down"|"home"|"end"|"pageup"|"pagedown"}delta
+     * @param {boolean} emit
+     */
+    list.moveFocus = function (delta, emit = true) {
+        var focused = list.focused;
+        var newIndex = 0, total = 0;
+        if (delta === 'up') delta = -1;
+        if (delta === 'down') delta = 1;
+        if (typeof delta === 'string') {
+            switch (delta.toLowerCase()) {
+                case "home":
+                    newIndex = 0;
+                    delta = 1;
+                    break;
+                case "end":
+                    var lastElement = getLastElement(1);
+                    if (!lastElement) return;
+                    newIndex = lastElement.index;
+                    delta = -1;
+                    break;
+                case "pageup":
+                    var firstElement = getFirstVisibleElement();
+                    if (!firstElement) return;
+                    newIndex = firstElement.index;
+                    list.scrollBy(-list.clientHeight + firstElement.offsetHeight);
+                    var lastElement = getLastVisibleElement();
+                    if (lastElement.index < newIndex) newIndex = lastElement.index;
+                    delta = -1;
+                    break;
+                case "pagedown":
+                    var lastElement = getLastVisibleElement();
+                    if (!lastElement) return;
+                    newIndex = lastElement.index;
+                    list.scrollBy(list.clientHeight - lastElement.offsetHeight);
+                    var firstElement = getFirstVisibleElement();
+                    if (firstElement.index > newIndex) newIndex = firstElement.index;
+                    delta = 1;
+                    break;
+            }
+        }
+        else if (!focused) {
+            var lastElement = getLastElement(1);
+            if (!lastElement) return;
+            total = lastElement.index + 1;
+            if (delta > 0) newIndex = 0;
+            else newIndex = total - 1;
+        }
+        else {
+            var newIndex = focused.index + delta;
+            var lastElement = getLastElement(1);
+            var total = lastElement.index + 1;
+            if (newIndex < 0) newIndex = total + newIndex;
+            if (newIndex > total - 1) newIndex = newIndex - total;
+        }
+        var savedIndex = newIndex;
+        var e = list.getIndexedElement(newIndex);
+        while (e && (e.hasAttribute("disabled") || e.hasAttribute("line"))) {
+            if (delta > 0) {
+                newIndex++;
+                if (newIndex >= total) {
+                    if (!total) return;
+                    newIndex = 0;
+                }
+            } else {
+                newIndex--;
+                if (newIndex < 0) {
+                    if (!total) return;
+                    newIndex = total - 1;
+                }
+            }
+            if (savedIndex === newIndex) return;
+            e = list.getIndexedElement(newIndex);
+        }
+        if (!e) list.setFocus(null);
+        else if (emit) list.setFocus(e, true), dispatch(list, 'focused');
+        else list.setFocus(e);
+    };
     return list;
 }
 var allArgumentsNames = arguments[arguments.length - 1];

package/coms/zimoli/menu.js

@@ -89,13 +89,18 @@ var getTreeNodes = function (elem) {
     [].forEach.call(elem.children, run);
     return nodes;
 };
+/**
+ * @param {any} item
+ * @param {Event} event
+ */
 var emitEvent = function (item, event) {
+    if (event.defaultPrevented) return;
     event.preventDefault(true);
     if (item.disabled) return;
     active(this, item, item, this.$src ? createItemTarget.call(this, item) : this);
 }
 function bindGlobalkey(elem, keymap, emit) {
-    if (elem.keymap) {
+    if (elem.keyoff) {
         for (var off of elem.keyoff) {
             off();
         }
@@ -103,7 +108,7 @@ function bindGlobalkey(elem, keymap, emit) {
     if (!keymap) return;
     var keyoff = [];
     for (let k in keymap) {
-        keyoff.push(bind("keydown." + k)(elem, emitEvent.bind(elem, keymap[k])));
+        keyoff.push(bind("keydown.only." + k)(elem, emitEvent.bind(elem, keymap[k])));
     }
     elem.keyoff = keyoff;
 }
@@ -190,7 +195,6 @@ function main(elem, mode) {
                     active(elem, item, null, elem.$src ? createItemTarget.call(elem, item, target) : target);
                 };
                 if ("$src" in elem) {
-                    getGenerator(elem, 'menu-item');
                     var src0 = [];
                     menuList(elem, src0, emit, direction);
                     care(elem, function (src) {

package/coms/zimoli/menuItem.html

@@ -1,6 +1,11 @@
-<i ng-class="icon?" ng-if='useIcon||hasIcon'></i>
-<span ng-html="name?"></span>
-<template -if="hotkey?">
+<template -if='useIcon||hasIcon||icon'>
+    <i -class="icon?" -style="{color:color?}"></i>
+    <template -if="name?">
+        &nbsp;&nbsp;
+    </template>
+</template>
+<span -html="name?" -style="{color:color?}"></span>
+<template -if="hotkey?.length">
     &nbsp;&nbsp; <span ng-repeat="k of hotkey" class="hotkey" ng-html="k"></span>
 </template>
 <s></s>

package/coms/zimoli/menuItem.js

@@ -17,6 +17,6 @@ function main(elem, scope, hasIcon) {
     }
     render(item.children, scope, hasIcon instanceof Array ? hasIcon : [{ useIcon: hasIcon, hasIcon }]);
     if (scope.line) item.setAttribute("line", ''), on("click")(item, preventDefault);
-    if (scope.hotkey) bindAccesskey(item, scope.hotkey);
     return item;
-}
+}
+main.template = menuItem;

package/coms/zimoli/menuItem.less

@@ -1,6 +1,6 @@
 i {
     display: inline-block;
-    width: 1em;
+    vertical-align: middle;
 }
 
 .hotkey {
@@ -17,7 +17,8 @@ i {
     }
 
     border-radius: 0;
-    color: #999;
+    color: #000;
+    opacity: .4;
 }
 
 &.line,