Enable propellerads

svelte/src/filesystem/Filesystem.svelte

@@ -1,6 +1,6 @@
 <script>
 import { onMount } from 'svelte';
-import { formatDate, formatDataVolume, formatThousands, formatNumber } from '../util/Formatting.svelte'
+import { formatDate, formatDataVolume, formatThousands } from '../util/Formatting.svelte'
 import { fs_get_file_url, fs_get_node } from './FilesystemAPI.svelte'
 import Sharebar from './Sharebar.svelte'
 import Spinner from '../util/Spinner.svelte'
@@ -9,13 +9,12 @@ import FileManager from './filemanager/FileManager.svelte';
 import Audio from './viewers/Audio.svelte';
 import Image from './viewers/Image.svelte';
 import Video from './viewers/Video.svelte';
-import { current_component } from 'svelte/internal';
 
 // Elements
 let file_viewer
 let header_bar
 
-let toolbar_visible = (window.innerWidth > 800)
+let toolbar_visible = (window.innerWidth > 600)
 let toolbar_toggle = () => {
 	toolbar_visible = !toolbar_visible
 	if (!toolbar_visible) {
@@ -38,7 +37,10 @@ let state = {
 	// When navigating into a file or directory the siblings array will be
 	// populated with the previous base's children
 	siblings: [],
+	current_sibling: -1,
 
+	// Root path of the bucket. Used for navigation by prepending it to a file
+	// path
 	path_root: "/d/"+initialNode.bucket.id,
 	loading: true,
 	viewer_type: ""
@@ -85,6 +87,23 @@ const openNode = (node) => {
 	// Sort directory children
 	sort_children(node.base.children)
 
+	// If the new node is a child of the previous node we save the parent's
+	// children array
+	if (node.parents.length > 0 && node.parents[node.parents.length-1].path === state.base.path) {
+		console.debug("Current parent path and new node path match. Saving siblings")
+		state.siblings = state.base.children
+		state.current_sibling = -1
+
+		// Find which sibling is currently open
+		for (let i = 0; i < state.siblings.length; i++) {
+			if (state.siblings[i].name === node.base.name) {
+				state.current_sibling = i
+				console.debug("Current sibling ID is", i)
+				break
+			}
+		}
+	}
+
 	// Update shared state
 	state.bucket = node.bucket
 	state.parents = node.parents
@@ -167,11 +186,13 @@ window.onpopstate = (e) => {
 
 const keydown = e => {
 	switch (e.key) {
-		case 'Escape':
+		case "Escape":
 			hide();
 			return;
-		case 'i':
+		case "i":
 			details_window.toggle()
+		case "s":
+			download()
 	}
 };
 
@@ -197,7 +218,12 @@ const download = () => {
 		<a href="/" id="button_home" class="button button_home"><i class="icon">home</i></a>
 		<div class="file_viewer_headerbar_title">
 			{#each state.parents as parent}
-			<div class="breadcrumb breadcrumb_button" on:click={() => {navigate(parent.path, true)}}>{parent.name}</div> /
+			<a
+				href={state.path_root+parent.path}
+				class="breadcrumb breadcrumb_button"
+				on:click|preventDefault={() => {navigate(parent.path, true)}}>
+				{parent.name}
+			</a> /
 			{/each}
 			<div class="breadcrumb breadcrumb_last">{state.base.name}</div>
 		</div>
@@ -331,6 +357,8 @@ const download = () => {
 }
 .breadcrumb_button {
 	cursor: pointer;
+	text-decoration: none;
+	color: var(--text_color);
 	background-color: var(--layer_2_color);
 	transition: 0.2s background-color, 0.2s color;
 }

svelte/src/filesystem/FilesystemAPI.svelte

@@ -1,36 +1,34 @@
 <script context="module">
 
-export const fs_create_directory = (bucket, path, dir_name) => {
+export const fs_create_directory = async (bucket, path, dir_name) => {
 	if (!path.startsWith("/")) {
 		path = "/" + path
 	}
 
-	let form = new FormData()
+	const form = new FormData()
 	form.append("type", "dir")
 
-	return fetch(
-		window.api_endpoint + "/filesystem/" + bucket + encodeURIComponent(path + "/" + dir_name),
-		{method: "POST", body: form},
-	).then(resp => {
-		if (resp.status >= 400) {
-			throw new Error(resp.text())
-		}
-	})
+	const resp=await fetch(
+		window.api_endpoint+"/filesystem/"+bucket+encodeURIComponent(path+"/"+dir_name),
+		{ method: "POST", body: form }
+	);
+	if(resp.status >= 400) {
+		throw new Error(resp.text());
+	}
 }
 
-export const fs_get_node = (bucket, path) => {
+export const fs_get_node = async (bucket, path) => {
 	if (!path.startsWith("/")) {
 		path = "/" + path
 	}
 
-	return fetch(
-		window.api_endpoint + "/filesystem/" + bucket + encodeURIComponent(path) + "?stat",
-	).then(resp => {
-		if (resp.status >= 400) {
-			throw new Error(resp.text())
-		}
-		return resp.json()
-	})
+	const resp = await fetch(
+		window.api_endpoint+"/filesystem/"+bucket+encodeURIComponent(path)+"?stat"
+	);
+	if(resp.status >= 400) {
+		throw new Error(resp.text());
+	}
+	return resp.json();
 }
 
 export const fs_get_file_url = (bucket, path) => {
@@ -40,19 +38,18 @@ export const fs_get_file_url = (bucket, path) => {
 	return window.api_endpoint + "/filesystem/" + bucket + encodeURIComponent(path)
 }
 
-export const fs_delete_node = (bucket, path) => {
+export const fs_delete_node = async (bucket, path) => {
 	if (!path.startsWith("/")) {
 		path = "/" + path
 	}
 
-	return fetch(
-		window.api_endpoint + "/filesystem/" + bucket + encodeURIComponent(path),
-		{method: "DELETE"},
-	).then(resp => {
-		if (resp.status >= 400) {
-			throw new Error(resp.text())
-		}
-	})
+	const resp = await fetch(
+		window.api_endpoint+"/filesystem/"+bucket+encodeURIComponent(path),
+		{ method: "DELETE" }
+	);
+	if(resp.status >= 400) {
+		throw new Error(resp.text());
+	}
 }
 
 </script>