diff --git a/svelte/src/filesystem/filemanager/FileManager.svelte b/svelte/src/filesystem/filemanager/FileManager.svelte index 98b9d54..9c606cd 100644 --- a/svelte/src/filesystem/filemanager/FileManager.svelte +++ b/svelte/src/filesystem/filemanager/FileManager.svelte @@ -17,6 +17,13 @@ let mode = "viewing" let creating_dir = false let show_hidden = false +$: selected_files = state.children.reduce((acc, file) => { + if (file.fm_selected) { + acc++ + } + return acc +}, 0) + export const upload = files => { return uploader.upload(files) } @@ -34,12 +41,13 @@ const node_click = e => { fs_navigator.navigate(state.children[index].path, true) } else if (mode === "moving") { // If we are moving files we can only enter directories, and only if - // they're not selected + // they're not selected. That last requirement prevents people from + // moving a directory into itself if (state.children[index].type === "dir" && !state.children[index].fm_selected) { fs_navigator.navigate(state.children[index].path, true) } } else if (mode === "selecting") { - state.children[index].fm_selected = !state.children[index].fm_selected + select_node(index) } } let node_context = e => { @@ -152,6 +160,34 @@ const toggle_large_icons = () => { let moving_items = [] +// We need to detect if shift is pressed so we can select multiple items +let shift_pressed = false +let last_selected_node = -1 +const detect_shift = (e) => { + if (e.key === "Shift") { + shift_pressed = e.type === "keydown" + } +} + +const select_node = index => { + if (shift_pressed) { + // If shift is pressed we do a range select. We select all files between + // the last selected file and the file that is being selected now + let id_low = Math.min(last_selected_node, index) + let id_high = Math.max(last_selected_node, index) + + for (let i = id_low; i <= id_high; i++) { + if (i != last_selected_node) { + state.children[i].fm_selected = !state.children[i].fm_selected + } + } + } else { + state.children[index].fm_selected = !state.children[index].fm_selected + } + + last_selected_node = index +} + // When the directory is reloaded we want to keep our selection, so this // function watches the children array for changes and updates the selection // when it changes @@ -166,15 +202,26 @@ const update = (children) => { } } } + +let moving_files = 0 +let moving_directories = 0 const move_start = () => { + moving_files = 0 + moving_directories = 0 moving_items = state.children.reduce((acc, child) => { if (child.fm_selected) { + if (child.type === "file") { + moving_files++ + } else if (child.type === "dir") { + moving_directories++ + } acc.push(child) } return acc }, []) mode = "moving" } + const move_here = async () => { dispatch("loading", true) @@ -209,6 +256,8 @@ onMount(() => { }) + +
{#if mode === "viewing"} @@ -266,7 +315,9 @@ onMount(() => { {:else if mode === "selecting"}