改进dock逻辑

改进launchpad逻辑

css/index.css

@@ -974,7 +974,7 @@ body {
     flex-flow: row nowrap;
     place-content: stretch center;
     align-items: center;
-    display:flex;
+    display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
     justify-content: center;
@@ -1008,7 +1008,7 @@ body {
 
 .dock-item img {
     border: none;
-    margin: 5px;
+    margin: 0 5px;
     width: 100%;
 }
 
@@ -1038,7 +1038,6 @@ body {
 
 .search .serach-box {
     position: relative;
-    background-color: rgba(229, 231, 235, 0.1);
 }
 
 .search label {
@@ -1054,7 +1053,7 @@ body {
 
 .search .input-search {
     -webkit-appearance: textfield;
-    background-color: rgba(229, 231, 235, 0.1);
+    background-color: rgba(229, 231, 235, 0.2);
     border-radius: .25em;
     border-color: rgba(229, 231, 235, 0.3);
     border-width: 1px;
@@ -1252,10 +1251,7 @@ body {
     #dock .dock-container {
         width: 100%;
         border-radius: 0;
-        flex-flow: row nowrap;
+        padding: 0;
-        place-content: stretch center;
-        align-items: center;
-        left: 0;
     }
 
     #dock a.dock-item {
@@ -1264,4 +1260,9 @@ body {
         position: static;
     }
 
+    #dock .dock-item img {
+        margin: 0;
+        width: 90%;
+    }
+
 }

index.html

@@ -11,7 +11,7 @@
     <link rel='Shortcut Icon' type='image/x-icon' href='./img/favicon.ico'>
     <link rel="stylesheet" href="https://lf9-cdn-tos.bytecdntp.com/cdn/expire-1-M/animate.css/4.1.1/animate.min.css">
     <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.min.css">
-    <link rel="stylesheet" href="./css/index.css">
+    <link rel="stylesheet" href="./css/index.min.css">
     <link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
 </head>
 
@@ -121,7 +121,7 @@
                         alt="trashicon" /></a>
             </div>
         </div>
-		<div id="launchpad" class="backgroud_blur hidden">
+		<div id="launchpad" class="launchpad backgroud_blur hidden">
 			<div id="app-serach-box" class="app-serach-box">
 				<form action="" class="search">
 				    <div class="serach-box">
@@ -154,7 +154,7 @@
     src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/2.2.4/jquery.min.js"></script>
 <script type="text/javascript" src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/layer/3.5.1/layer.min.js"></script>
 <script type="text/javascript" src="./js/interface.min.js"></script>
-<script type="text/javascript" src="./js/index.js"></script>
+<script type="text/javascript" src="./js/index.min.js"></script>
 <script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
 <script>
     Macui.onReady(function () {

js/index.js

@@ -357,6 +357,7 @@ window.Macui = {
             }, 500)
         });
         $("#mac .launchpad").click(function () {
+            console.log($(this))
             if ($("#launchpad").hasClass("hidden")) {
                 Macui.renderLaunchpad();
                 Macui.menuClose();
@@ -584,22 +585,26 @@ window.Macui = {
             }
         });
         //launchpad 搜索功能
-        $("#launchpad .input-search").on("input propertychange", function () {
+        $("#launchpad .app-serach-box").on("click",function (e){
-            //在输入框中打印输入的值
+            //避免点击事件影响
-            var searchName = $(this).val();
+            e.stopPropagation();
-            if (searchName == "") {
+            $(this).find(".input-search").on("input propertychange", function (e) {
-                $("#app-shortcuts .shortcut").show();
+                //在输入框中打印输入的值
-            } else {
+                var searchName = $(this).val();
-                $("#app-shortcuts .shortcut").each(function () {
+                if (searchName === "") {
-                    var appName = $(this).children(".title").text().toLowerCase();
+                    $("#app-shortcuts .shortcut").show();
-                    if (appName.indexOf(searchName.toLowerCase()) != -1) {
+                } else {
-                        $(this).show();
+                    $("#app-shortcuts .shortcut").each(function () {
-                    } else {
+                        var appName = $(this).children(".title").text().toLowerCase();
-                        $(this).hide();
+                        if (appName.indexOf(searchName.toLowerCase()) !== -1) {
-                    }
+                            $(this).show();
-                });
+                        } else {
-            }
+                            $(this).hide();
-        });
+                        }
+                    });
+                }
+            });
+        })
 
         /**
          * WIN10-UI v1.1.2.2 桌面舞台支持补丁
@@ -975,8 +980,8 @@ window.Macui = {
     renderDocks: function () {
         let cell_width = 50;
         let width = document.body.clientWidth;
-        let docks = $(".dock .dock-container a");
+        let docks = $("#dock .dock-container a");
-        let max_num = width / cell_width - 1;
+        let max_num = parseInt((width - 10) / cell_width);
         for (let i = 0; i <= docks.length; i++) {
             if (i >= max_num) {
                 docks.eq(i).hide();
@@ -997,23 +1002,8 @@ window.Macui = {
                 halign: 'center'
             })
         } else {
-            for (let i = 0; i <= max_num; i++) {
+            $("#dock .dock-container").off('mousemove').off('mouseover').off('mouseout')
-                docks.on('mouseover', function (e) {
+            docks.off('mousemove').off('mouseover').off('mouseout')
-                    e.preventDefault();
-                });
-                docks.on('mouseout', function (e) {
-                    e.preventDefault();
-                });
-                docks.on('click', function (e) {
-                    e.preventDefault();
-                });
-                docks.unbind("mouseover").unbind('mouseout').unbind('click').css({
-                    "width": cell_width
-                });
-                if (i === 0) {
-                    docks.eq(i).css("margin-left", 0);
-                }
-            }
         }
     },
     commandCenterToggle: function () {