feat: batch selection with Shift

AlistGo · Aug 19, 2022 · 9c2b0e5 · 9c2b0e5
1 parent 3bb6725
commit 9c2b0e5
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 15 deletions.
diff --git a/src/app/index.tsx b/src/app/index.tsx
@@ -17,7 +17,7 @@ const Index = () => {
     <HopeProvider config={theme}>
       <ErrorBoundary
         fallback={(err) => {
-          console.log("error", err);
+          console.error("error", err);
           return <Error msg={`System error: ${err.message}`} />;
         }}
       >

diff --git a/src/pages/home/folder/GridItem.tsx b/src/pages/home/folder/GridItem.tsx
@@ -30,13 +30,13 @@ export const GridItem = (props: { obj: StoreObj; index: number }) => {
       }}
       as={LinkWithPush}
       href={props.obj.name}
-      onMouseEnter={() => {
+      onMouseOver={() => {
         setHover(true);
         if (props.obj.is_dir) {
           setPathAsDir(props.obj.name, true);
         }
       }}
-      onMouseLeave={() => {
+      onMouseOut={() => {
         setHover(false);
       }}
     >
@@ -58,7 +58,7 @@ export const GridItem = (props: { obj: StoreObj; index: number }) => {
           <Checkbox
             pos="absolute"
             left="$1"
-            top="$1" 
+            top="$1"
             // colorScheme="neutral"
             // @ts-ignore
             on:click={(e) => {

diff --git a/src/pages/manage/settings/Common.tsx b/src/pages/manage/settings/Common.tsx
@@ -63,7 +63,6 @@ const CommonSettings = (props: CommonSettingsProps) => {
         <Button
           loading={saveLoading()}
           onClick={async () => {
-            console.log(settings);
             const resp: Resp<{}> = await saveSettings();
             handleRresp(resp, () => notify.success(t("global.save_success")));
           }}

diff --git a/src/store/key-event.ts b/src/store/key-event.ts
@@ -0,0 +1,8 @@
+export const keyPressed: Record<string, boolean> = {};
+document.addEventListener("keydown", (e) => {
+  keyPressed[e.key] = true;
+});
+document.addEventListener("keyup", (e) => {
+  // keyPressed[e.key] = false;
+  delete keyPressed[e.key];
+});
diff --git a/src/store/obj.ts b/src/store/obj.ts
@@ -3,6 +3,7 @@ import { createSignal } from "solid-js";
 import { createStore, produce } from "solid-js/store";
 import { Obj, StoreObj } from "~/types";
 import { log } from "~/utils";
+import { keyPressed } from "./key-event";
 
 export enum State {
   Initial, // Initial state
@@ -47,6 +48,7 @@ const [selectedNum, setSelectedNum] = createSignal(0);
 
 const setObjs = (objs: Obj[]) => {
   setSelectedNum(0);
+  lastChecked = { index: -1, selected: false };
   setObjStore("objs", objs);
 };
 
@@ -101,17 +103,43 @@ export const appendObjs = (objs: Obj[]) => {
   );
 };
 
+let lastChecked = {
+  index: -1,
+  selected: false,
+};
+
 export const selectIndex = (index: number, selected: boolean) => {
-  setObjStore(
-    "objs",
-    index,
-    produce((obj) => {
-      if (obj.selected !== selected) {
-        setSelectedNum(selected ? selectedNum() + 1 : selectedNum() - 1);
-      }
-      obj.selected = selected;
-    })
-  );
+  if (
+    keyPressed["Shift"] &&
+    lastChecked.index !== -1 &&
+    lastChecked.selected === selected
+  ) {
+    const start = Math.min(lastChecked.index, index);
+    const end = Math.max(lastChecked.index, index);
+    const curCheckedNum = objStore.objs
+      .slice(start, end + 1)
+      .filter((o) => o.selected).length;
+
+    setObjStore("objs", { from: start, to: end }, () => ({
+      selected: selected,
+    }));
+    // update selected num
+    const newSelectedNum =
+      selectedNum() - curCheckedNum + (selected ? end - start + 1 : 0);
+    setSelectedNum(newSelectedNum);
+  } else {
+    setObjStore(
+      "objs",
+      index,
+      produce((obj) => {
+        if (obj.selected !== selected) {
+          setSelectedNum(selected ? selectedNum() + 1 : selectedNum() - 1);
+        }
+        obj.selected = selected;
+      })
+    );
+  }
+  lastChecked = { index, selected };
 };
 
 export const selectAll = (selected: boolean) => {