pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace event dispatcher with a callback in filemanager

Browse Source
This commit is contained in:
Wim Brand
2025-10-13 23:20:42 +02:00
parent 6d89c5ddd9
commit 75d9ed3023
41 changed files with 326 additions and 255 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
svelte/src/wrap/MainMenu.svelte
View File

@@ -6,7 +6,7 @@ import { formatDataVolume } from "util/Formatting";
import Router from "wrap/Router.svelte";
import Bookmarks from "./Bookmarks.svelte";
import { onMount } from "svelte";
import { fs_get_node } from "lib/FilesystemAPI";
import { fs_get_node } from "lib/FilesystemAPI.svelte";
import { css_from_path } from "filesystem/edit_window/Branding";
import { loading_run, loading_store } from "lib/Loading";
import Spinner from "util/Spinner.svelte";
@@ -25,82 +25,84 @@ onMount(async () => {
</script>
<div class="nav_container">
<nav class="nav">
<a class="button" href="/" use:highlight_current_page>
<i class="icon">home</i>
<span class="hide_small">Home</span>
</a>
<div class="scroll_container">
<nav class="nav">
<a class="button" href="/" use:highlight_current_page>
<i class="icon">home</i>
<span class="hide_small">Home</span>
</a>
{#if $user.username !== undefined && $user.username !== ""}
<div class="separator hide_small"></div>
{#if $user.username !== undefined && $user.username !== ""}
<div class="separator hide_small"></div>
<div class="username hide_small">
{$user.username}
</div>
<div class="username hide_small">
{$user.username}
</div>
<div class="separator"></div>
<div class="stats_table hide_small">
<div>Subscription</div>
<div>{$user.subscription.name}</div>
{#if $user.subscription.type === "prepaid"}
<div>Credit</div>
<div><Euro amount={$user.balance_micro_eur}/></div>
{/if}
<div>Storage used</div>
<div>{formatDataVolume($user.filesystem_storage_used, 3)}</div>
<div>Transfer used</div>
<div>{formatDataVolume($user.monthly_transfer_used, 3)}</div>
</div>
<div class="separator hide_small"></div>
<a class="button" href="/d/me" use:highlight_current_page>
<i class="icon">folder</i>
<span class="hide_small">Filesystem</span>
</a>
<a class="button" href="/user" use:highlight_current_page>
<i class="icon">dashboard</i>
<span class="hide_small">Dashboard</span>
</a>
{#if $user.is_admin}
<a class="button" href="/admin" use:highlight_current_page>
<i class="icon">admin_panel_settings</i>
<span class="hide_small">Admin Panel</span>
</a>
{/if}
<button class="button" onclick={()=> logout_user("/")}>
<i class="icon">logout</i>
<span class="hide_small">Log out</span>
</button>
{:else}
<a class="button" href="/login" use:highlight_current_page>
<i class="icon">login</i>
<span class="hide_small">Login</span>
</a>
<a class="button" href="/register" use:highlight_current_page>
<i class="icon">how_to_reg</i>
<span class="hide_small">Register</span>
</a>
{/if}
<div class="separator"></div>
<div class="stats_table hide_small">
<div>Subscription</div>
<div>{$user.subscription.name}</div>
{#if $user.subscription.type === "prepaid"}
<div>Credit</div>
<div><Euro amount={$user.balance_micro_eur}/></div>
{/if}
<div>Storage used</div>
<div>{formatDataVolume($user.filesystem_storage_used, 3)}</div>
<div>Transfer used</div>
<div>{formatDataVolume($user.monthly_transfer_used, 3)}</div>
</div>
<div class="separator hide_small"></div>
<a class="button" href="/d/me" use:highlight_current_page>
<i class="icon">folder</i>
<span class="hide_small">Filesystem</span>
<a class="button" href="/speedtest" use:highlight_current_page>
<i class="icon">speed</i>
<span class="hide_small">Speedtest</span>
</a>
<a class="button" href="/user" use:highlight_current_page>
<i class="icon">dashboard</i>
<span class="hide_small">Dashboard</span>
<a class="button" href="/appearance" use:highlight_current_page>
<i class="icon">palette</i>
<span class="hide_small">Themes</span>
</a>
{#if $user.is_admin}
<a class="button" href="/admin" use:highlight_current_page>
<i class="icon">admin_panel_settings</i>
<span class="hide_small">Admin Panel</span>
</a>
{/if}
<button class="button" onclick={()=> logout_user("/")}>
<i class="icon">logout</i>
<span class="hide_small">Log out</span>
</button>
{:else}
<a class="button" href="/login" use:highlight_current_page>
<i class="icon">login</i>
<span class="hide_small">Login</span>
</a>
<a class="button" href="/register" use:highlight_current_page>
<i class="icon">how_to_reg</i>
<span class="hide_small">Register</span>
</a>
{/if}
<div class="separator"></div>
<div class="separator"></div>
<a class="button" href="/speedtest" use:highlight_current_page>
<i class="icon">speed</i>
<span class="hide_small">Speedtest</span>
</a>
<a class="button" href="/appearance" use:highlight_current_page>
<i class="icon">palette</i>
<span class="hide_small">Themes</span>
</a>
<div class="separator"></div>
<Bookmarks/>
</nav>
<Bookmarks/>
</nav>
</div>
</div>
<div class="page">
@@ -133,13 +135,17 @@ onMount(async () => {
background: var(--shaded_background);
backdrop-filter: blur(4px);
}
.scroll_container {
position: sticky;
top: 0;
max-height: 100vh;
overflow-x: hidden;
overflow-y: auto;
}
.nav {
display: flex;
flex-direction: column;
max-width: 15em;
position: sticky;
top: 0;
}
.nav > .button {
background: none;
@@ -165,7 +171,7 @@ onMount(async () => {
display: grid;
grid-template-columns: auto auto;
gap: 0.2em 1em;
margin: 3px;
margin: 5px;
}
@media(max-width: 1000px) {