fix(control): open_inode_action and icon is now correct

This commit is contained in:
E44
2026-01-19 23:10:53 +01:00
parent 9e325566c5
commit a5ee1b28d9
5 changed files with 80 additions and 68 deletions
@@ -1,5 +1,5 @@
<script lang="ts">
import { ArrowRight, Ban, FileIcon, Folder, Play } from 'lucide-svelte';
import { ArrowRight, Ban, FileIcon, Folder, Play, Triangle, TriangleAlert } from 'lucide-svelte';
import {
current_height,
get_selectable_color_classes,
@@ -31,11 +31,15 @@
import RefreshPlay from '../svgs/RefreshPlay.svelte';
import { get_file_size_display_string, get_file_type } from '$lib/ts/utils';
import { open_file } from '$lib/ts/api_handler';
import { get_display_by_id, run_on_all_selected_displays, selected_online_display_ids } from '$lib/ts/stores/displays';
import {
get_display_by_id,
run_on_all_selected_displays,
selected_online_display_ids
} from '$lib/ts/stores/displays';
import { get_thumbnail_url } from '$lib/ts/stores/thumbnails';
import { liveQuery, type Observable } from 'dexie';
import { db } from '$lib/ts/database';
import { file_transfer_tasks } from '$lib/ts/file_transfer_handler';
import { add_sync_recursively, file_transfer_tasks } from '$lib/ts/file_transfer_handler';
let { file, not_interactable = false }: { file: Inode; not_interactable?: boolean } = $props();
@@ -50,6 +54,10 @@
missing_colliding_displays_ids = liveQuery(() => get_missing_colliding_display_ids(f, s));
});
let colliding_warning: boolean = $derived(
!!$missing_colliding_displays_ids && $missing_colliding_displays_ids.colliding.length !== 0
);
let file_size: Observable<number> | undefined = $state();
$effect(() => {
const f = file;
@@ -160,6 +168,11 @@
async function open() {
if (file_is_folder) {
await change_file_path($current_file_path + file.name + '/');
} else if (
!!$missing_colliding_displays_ids &&
$missing_colliding_displays_ids.missing.length !== 0
) {
await add_sync_recursively(get_file_primary_key(file), $selected_online_display_ids, true);
} else {
const path_to_file = $current_file_path + file.name;
await run_on_all_selected_displays((d) => open_file(d.ip, path_to_file));
@@ -238,33 +251,43 @@
{#if !not_interactable}
<div class="h-{$current_height.file} aspect-square max-w-15 flex">
<Button
disabled={!file_is_folder && get_file_type(file) === null}
title={!file_is_folder && get_file_type(file) === null ? 'Dateityp nicht unterstützt' : ''}
disabled={(!file_is_folder && get_file_type(file) === null) || colliding_warning}
title={!file_is_folder && get_file_type(file) === null
? 'Dateityp nicht unterstützt'
: colliding_warning
? 'Dateien kollidieren auf verschiedenen Bildschirmen'
: ''}
className="flex rounded-l-lg rounded-r-none {file_is_folder
? 'text-stone-450'
: 'text-stone-800'} w-full"
div_class="w-full"
bg={get_selectable_color_classes(
!file_is_folder && get_file_type(file) !== null,
{
bg: true
},
-50
)}
hover_bg={get_selectable_color_classes(
!file_is_folder,
{
bg: true
},
50
)}
active_bg={get_selectable_color_classes(
!file_is_folder,
{
bg: true
},
100
)}
bg={colliding_warning
? 'bg-red-400'
: get_selectable_color_classes(
!file_is_folder && get_file_type(file) !== null,
{
bg: true
},
-50
)}
hover_bg={colliding_warning
? 'bg-red-500'
: get_selectable_color_classes(
!file_is_folder,
{
bg: true
},
50
)}
active_bg={colliding_warning
? 'bg-red-500'
: get_selectable_color_classes(
!file_is_folder,
{
bg: true
},
100
)}
click_function={(e) => {
open();
e.stopPropagation();
@@ -272,12 +295,14 @@
>
{#if file_is_folder}
<ArrowRight class="size-full" strokeWidth="3" />
{:else if $missing_colliding_displays_ids && $missing_colliding_displays_ids.missing.length !== 0}
<RefreshPlay className="size-full" />
{:else if get_file_type(file) !== null}
<Play class="size-full" strokeWidth="3" />
{:else}
{:else if get_file_type(file) === null}
<Ban class="size-full" strokeWidth="3" />
{:else if colliding_warning}
<TriangleAlert class="size-full" strokeWidth="3" />
{:else if !!$missing_colliding_displays_ids && $missing_colliding_displays_ids.missing.length !== 0}
<RefreshPlay className="size-full" />
{:else}
<Play class="size-full" strokeWidth="3" />
{/if}
</Button>
</div>
@@ -326,33 +351,6 @@
is_selected(file_primary_key, $selected_file_ids)
)} duration-200 transition-colors"
>
<!-- {#if get_display_ids_where_file_is_missing($current_file_path, file, $selected_display_ids, $all_files)[1].length !== 0}
<Button
className="h-8 aspect-square transition-colors duration-200 !p-1.5 text-stone-100"
bg="bg-red-500"
click_function={(e) => {
e.stopPropagation();
}}
>
<TriangleAlert class="size-full" />
</Button>
{:else if get_display_ids_where_file_is_missing($current_file_path, file, $selected_display_ids, $all_files)[0].length !== 0}
<Button
className="h-8 aspect-square transition-colors duration-200 !p-1.5"
bg="bg-transparent"
hover_bg={get_selectable_color_classes(false, {
bg: true
})}
active_bg={get_selectable_color_classes(false, {
bg: true
})}
click_function={(e) => {
e.stopPropagation();
}}
>
<RefreshCcwDot class="size-full" />
</Button>
{/if} -->
<div
class="w-14 content-center text-center select-none text-xs whitespace-nowrap"
title={get_created_info($date_mapping, true)}
@@ -1,6 +1,6 @@
import { get, writable, type Writable } from 'svelte/store';
import { db } from './database';
import { get_display_by_id } from './stores/displays';
import { get_display_by_id, run_on_all_selected_displays } from './stores/displays';
import {
create_path_on_all_selected_displays,
get_folder_elements,
@@ -20,6 +20,7 @@ import {
type ShortDisplay
} from './types';
import { get_sanitized_file_url, get_uuid, make_valid_name } from './utils';
import { open_file } from './api_handler';
const START_LOADING_DATA = {
percentage: 0,
@@ -102,7 +103,8 @@ export async function add_upload(
export async function add_sync_recursively(
selected_file_id: string,
selected_display_ids: string[]
selected_display_ids: string[],
open_file_afterwards: boolean = false
) {
const file_data = await find_file_data_on_active_selected_display(
selected_file_id,
@@ -134,7 +136,8 @@ export async function add_sync_recursively(
destination_display_data: file_data.short_displays_without_file.map((display) => ({
display,
loading_data: START_LOADING_DATA
}))
})),
open_file_afterwards_on_display_ids: open_file_afterwards ? selected_display_ids : []
},
display: file_data.short_display_with_file,
path: file_data.file.path,
@@ -285,6 +288,12 @@ export async function sync(file_primary_key: string, task: FileTransferTask) {
}
await dir.removeEntry(temp_name);
// open file, if required
if (task.data.open_file_afterwards_on_display_ids.length !== 0) {
const path_to_file = task.path + task.file_name;
await run_on_all_selected_displays((d) => open_file(d.ip, path_to_file), true, task.data.open_file_afterwards_on_display_ids);
}
} catch (e) {
show_general_error(file_primary_key, task, String(e));
}
@@ -295,8 +304,7 @@ export async function download_file(selected_file_id: string, selected_display_i
selected_file_id,
selected_display_ids
);
if (!file_data || is_folder(file_data.file))
return console.warn('Download cancelled: is folder');
if (!file_data || is_folder(file_data.file)) return console.warn('Download cancelled: is folder');
try {
const url = `http://${file_data.short_display_with_file.ip}:1323/api${get_sanitized_file_url(file_data.file.path + file_data.file.name)}`;
@@ -455,7 +463,11 @@ function update_current_loading_data(
});
}
function get_updated_task(current_loading_data: FileLoadingData, destination_display_id: string | null, task: FileTransferTask): FileTransferTask {
function get_updated_task(
current_loading_data: FileLoadingData,
destination_display_id: string | null,
task: FileTransferTask
): FileTransferTask {
if (destination_display_id && task.data.type === 'sync') {
const updatedDestinations = task.data.destination_display_data.map((dd) =>
dd.display.id === destination_display_id ? { ...dd, loading_data: current_loading_data } : dd
@@ -197,17 +197,18 @@ export function screenshot_loop(display_id: string) {
export async function run_on_all_selected_displays(
run_function: (display: Display) => void | Promise<void>,
update_screenshot_afterwards: boolean = true,
ignore_offline: boolean = true
display_ids: string[] | null = null
) {
if (!display_ids) display_ids = get(selected_online_display_ids);
const maybe_displays: (Display | null)[] = await Promise.all(
// fails when only a single promis fails
get(selected_display_ids).map(async (id) => await get_display_by_id(id))
display_ids.map(async (id) => await get_display_by_id(id))
);
const displays: Display[] = maybe_displays.filter((d): d is Display => d !== null);
await Promise.all(
displays.map(async (display) => {
if (!display || (ignore_offline && display.status === 'host_offline')) return;
if (!display) return;
await run_function(display);
if (update_screenshot_afterwards) {
screenshot_loop(display.id);
+1
View File
@@ -48,6 +48,7 @@ export type FileTransferTaskData =
display: ShortDisplay;
loading_data: FileLoadingData;
}[];
open_file_afterwards_on_display_ids: string[];
};
export type FileLoadingData = {
@@ -122,7 +122,7 @@
db.displays.update(d.id, { status: 'app_offline' });
},
false,
false
$selected_display_ids
);
}