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

File viewer gallery view

Browse Source
This commit is contained in:
Fornax
2021-11-23 23:45:42 +01:00
parent 3a77f8c13a
commit 55f7cf7307
9 changed files with 533 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

159
svelte/src/file_viewer/EditWindow.svelte
View File

@@ -1,21 +1,41 @@
<script>
import { createEventDispatcher } from "svelte";
import Spinner from "../util/Spinner.svelte"
let dispatch = createEventDispatcher()
export let file = {
id: "",
name: "",
get_href: "",
can_edit: false,
}
export let list = {
id: "",
title: "",
files: [],
can_edit: false,
info_href: "",
}
let file_name = ""
let loading = false
let result_success = false
let result_text = ""
let file_name = ""
$: update_file(file.id)
let update_file = () => {
file_name = file.name
}
let list_name = ""
$: update_list(list.id)
let update_list = () => {
list_name = list.title
}
let rename_file = async e => {
e.preventDefault()
loading = true
const form = new FormData()
form.append("action", "rename")
@@ -32,6 +52,9 @@ let rename_file = async e => {
} catch (err) {
result_success = false
result_text = "Could not change file name: " + err
} finally {
loading = false
dispatch("reload")
}
}
@@ -39,6 +62,7 @@ let delete_file = async e => {
if (!confirm("Are you sure you want to delete '" + file.name + "'?")) {
return
}
loading = true
try {
const resp = await fetch(file.get_href, { method: "DELETE" });
@@ -51,39 +75,132 @@ let delete_file = async e => {
} catch (err) {
result_success = false
result_text = "Could not delete file: " + err
} finally {
loading = false
}
}
let rename_list = async e => {
e.preventDefault()
loading = true
let listjson = {
title: list_name,
files: [],
}
list.files.forEach(f => {
listjson.files.push({
id: f.id,
})
})
try {
const resp = await fetch(
list.info_href,
{ method: "PUT", body: JSON.stringify(listjson) },
);
if (resp.status >= 400) {
throw (await resp.json()).message
}
result_success = true
result_text = "Album name has been changed. Reload the page to see the changes"
} catch (err) {
result_success = false
result_text = "Could not change album name: " + err
} finally {
loading = false
dispatch("reload")
}
}
let delete_list = async e => {
if (!confirm("Are you sure you want to delete '" + list.title + "'?")) {
return
}
loading = true
try {
const resp = await fetch(list.info_href, { method: "DELETE" });
if (resp.status >= 400) {
throw (await resp.json()).message
}
result_success = true
result_text = "This album has been deleted, you can close the page"
} catch (err) {
result_success = false
result_text = "Could not delete album: " + err
} finally {
loading = false
}
}
</script>
<div>
{#if loading}
<div class="spinner_container">
<Spinner></Spinner>
</div>
{/if}
{#if result_text !== ""}
<div class:highlight_green={result_success} class:highligt_red={!result_success}>
{result_text}
</div>
{/if}
<h3>Rename</h3>
<form on:submit={rename_file} style="display: flex; width: 100%">
<input bind:value={file_name} type="text" style="flex: 1 1 auto"/>
<button type="submit" style="flex: 0 0 auto">
<i class="icon">save</i> Save
</button>
</form>
<h3>Delete</h3>
<p>
When you delete a file it cannot be recovered.
Nobody will be able to download it and the link will
stop working. The file will also disappear from any
lists it's contained in.
</p>
<div style="text-align: center;">
<button on:click={delete_file} class="button_red">
<i class="icon small">delete</i> Delete this file
</button>
</div>
{#if list.can_edit}
<h3>Edit album</h3>
<h4>Rename</h4>
<form on:submit={rename_list} class="indent" style="display: flex;">
<input bind:value={list_name} type="text" style="flex: 1 1 auto"/>
<button type="submit" style="flex: 0 0 auto">
<i class="icon">save</i> Save
</button>
</form>
<h4>Delete</h4>
<p>
When you delete an album the files in the album will not be deleted,
only the album itself.
</p>
<div class="indent">
<button on:click={delete_list} class="button_red">
<i class="icon small">delete</i> Delete album
</button>
</div>
{/if}
{#if file.can_edit}
<h3>Edit file</h3>
<h4>Rename</h4>
<form on:submit={rename_file} class="indent" style="display: flex;">
<input bind:value={file_name} type="text" style="flex: 1 1 auto"/>
<button type="submit" style="flex: 0 0 auto">
<i class="icon">save</i> Save
</button>
</form>
<h4>Delete</h4>
<p>
When you delete a file it cannot be recovered.
Nobody will be able to download it and the link will
stop working. The file will also disappear from any
lists it's contained in.
</p>
<div class="indent">
<button on:click={delete_file} class="button_red">
<i class="icon small">delete</i> Delete file
</button>
</div>
{/if}
</div>
<style>
.spinner_container {
position: absolute;
top: 10px;
left: 10px;
height: 100px;
width: 100px;
}
</style>