diff --git a/res/template/filesystem.html b/res/template/filesystem.html index 7bf6446..c209d68 100644 --- a/res/template/filesystem.html +++ b/res/template/filesystem.html @@ -24,6 +24,7 @@ {{ template "opengraph" .OGData }} diff --git a/svelte/rollup.config.js b/svelte/rollup.config.js index dafb6a8..d422e92 100644 --- a/svelte/rollup.config.js +++ b/svelte/rollup.config.js @@ -31,7 +31,6 @@ const builddir = "../res/static/svelte" export default [ "file_viewer", "filesystem", - "modal", "user_home", "user_file_manager", "admin_panel", diff --git a/svelte/src/filesystem/DetailsWindow.svelte b/svelte/src/filesystem/DetailsWindow.svelte index a074d86..d179d5b 100644 --- a/svelte/src/filesystem/DetailsWindow.svelte +++ b/svelte/src/filesystem/DetailsWindow.svelte @@ -148,7 +148,10 @@ let update_chart = async (base, timespan, interval) => { {/if} {#if state.base.type === "file"} File type{state.base.file_type} - File size{formatDataVolume(state.base.file_size)} + + File size + {formatDataVolume(state.base.file_size, 4)} ( {formatThousands(state.base.file_size)} B ) + Unique downloads{formatThousands(total_downloads)} Free bandwidth used @@ -193,7 +196,6 @@ let update_chart = async (base, timespan, interval) => { diff --git a/svelte/src/filesystem/upload_widget/UploadFunc.js b/svelte/src/filesystem/upload_widget/UploadFunc.js new file mode 100644 index 0000000..bb463a8 --- /dev/null +++ b/svelte/src/filesystem/upload_widget/UploadFunc.js @@ -0,0 +1,106 @@ +// Uploads a file to the logged in user's pixeldrain account. If no user is +// logged in the file is uploaded anonymously. +// +// on_progress reports progress on the file upload, parameter 1 is the uploaded +// file size and parameter 2 is the total file size +// +// on_success is called when the upload is done, the only parameter is the file +// ID +// +// on_error is called when the upload has failed. The parameters are the error + +import { fs_get_node, fs_mkdirall } from "../FilesystemAPI" +import { fs_path_url, fs_split_path } from "../FilesystemUtil" + +// code and an error message +export const upload_file = async (file, bucket, path, on_progress, on_success, on_error) => { + // Check the file size limit. For free accounts it's 20 GB + if (window.user.subscription.file_size_limit === 0) { + window.user.subscription.file_size_limit = 20e9 + } + + if (file.size > window.user.subscription.file_size_limit) { + on_failure( + "file_too_large", + "This file is too large. Check out the Pro subscription to increase the file size limit" + ) + return + } + + // Check if the parent directory exists + try { + await ensure_parent_dir(bucket, path) + } catch (err) { + if (err.value && err.message) { + on_error(err.value, err.message) + } else { + on_error(err, err) + } + return + } + + let xhr = new XMLHttpRequest(); + xhr.open("PUT", fs_path_url(bucket, path), true); + xhr.timeout = 86400000; // 24 hours, to account for slow connections + + xhr.upload.addEventListener("progress", evt => { + if (on_progress && evt.lengthComputable) { + on_progress(evt.loaded, evt.total) + } + }); + + xhr.onreadystatechange = () => { + // readystate 4 means the upload is done + if (xhr.readyState !== 4) { + return + } + + if (xhr.status >= 100 && xhr.status < 400) { + // Request is a success + on_success(JSON.parse(xhr.response).id) + } else if (xhr.status >= 400) { + // Request failed + console.log("Upload error. status: " + xhr.status + " response: " + xhr.response); + + let resp; + if (xhr.status === 429) { + resp = { + value: "too_many_requests", + message: "Too many requests. Please wait a few seconds", + } + } else { + resp = JSON.parse(xhr.response) + } + + on_error(resp.value, resp.message) + } else if (xhr.status === 0) { + on_error("request_failed", "Your request did not arrive, check your network connection") + } else { + on_error(xhr.responseText, xhr.responseText) + } + }; + + xhr.send(file); +} + +const ensure_parent_dir = async (bucket, path) => { + let parent = fs_split_path(path).parent + + console.debug("Checking if parent directory exists", parent) + + try { + let node = await fs_get_node(bucket, parent) + if (node.path[node.base_index].type !== "dir") { + throw "Path " + path + " is not a directory" + } + } catch (err) { + if (err.value && err.value === "path_not_found") { + // Directory does not exist. Create it + await fs_mkdirall(bucket, parent) + + console.debug("Created parent directory", parent) + } else { + throw err + } + } +} diff --git a/svelte/src/filesystem/upload_widget/UploadProgress.svelte b/svelte/src/filesystem/upload_widget/UploadProgress.svelte new file mode 100644 index 0000000..1204318 --- /dev/null +++ b/svelte/src/filesystem/upload_widget/UploadProgress.svelte @@ -0,0 +1,68 @@ + + +
+ {job.file.name}
+ {#if error_code !== ""} + {error_message}
+ {error_code}
+ {/if} + +
+ + diff --git a/svelte/src/filesystem/upload_widget/UploadWidget.svelte b/svelte/src/filesystem/upload_widget/UploadWidget.svelte new file mode 100644 index 0000000..580213f --- /dev/null +++ b/svelte/src/filesystem/upload_widget/UploadWidget.svelte @@ -0,0 +1,202 @@ + + + + + + +{#if visible} +
+
+ {#if state === "idle"} + Waiting for files + {:else if state === "uploading"} + Uploading files... + {:else if state === "finished"} + Done + {/if} +
+
+ {#each upload_queue as job} + {#if job.status !== "finished"} + + {/if} + {/each} +
+
+{/if} + +{#if drop_upload} + upload_files(e.detail)} on:upload_file={e => upload_file(e.detail)}/> +{/if} + + diff --git a/svelte/src/modal.js b/svelte/src/modal.js deleted file mode 100644 index 8df591e..0000000 --- a/svelte/src/modal.js +++ /dev/null @@ -1,10 +0,0 @@ -import App from './modal/App.svelte'; - -const app = new App({ - target: document.body, - props: { - name: 'world' - } -}); - -export default app; diff --git a/svelte/src/modal/App.svelte b/svelte/src/modal/App.svelte deleted file mode 100644 index 2253be3..0000000 --- a/svelte/src/modal/App.svelte +++ /dev/null @@ -1,45 +0,0 @@ - - - - -
- - - logo - - -
    -
  1. of or relating to modality in logic
    2. -
  2. containing provisions as to the mode of procedure or the manner of taking effect —used of a contract or legacy
    3. -
  3. of or relating to a musical mode
    4. -
  4. of or relating to structure as opposed to substance
    5. -
    6. -
  6. of, relating to, or constituting a grammatical form or category characteristically indicating predication
    7. -
  7. of or relating to a statistical mode
    8. -
- - merriam-webster.com - - - -
    -
  1. of or relating to modality in logic
    2. -
  2. containing provisions as to the mode of procedure or the manner of taking effect —used of a contract or legacy
    3. -
  3. of or relating to a musical mode
    4. -
  4. of or relating to structure as opposed to substance
    5. -
  5. of, relating to, or constituting a grammatical form or category characteristically indicating predication
    6. -
  6. of or relating to a statistical mode
    7. -
- - merriam-webster.com -
- - - diff --git a/svelte/src/util/Form.svelte b/svelte/src/util/Form.svelte index cac5f2a..b661a2a 100644 --- a/svelte/src/util/Form.svelte +++ b/svelte/src/util/Form.svelte @@ -108,11 +108,6 @@ let handle_errors = (response) => {
- {#if loading} - - {/if} {#if submitted} {#if submit_result.messages}
@@ -239,15 +234,20 @@ let handle_errors = (response) => { {/if}
+ + {#if loading} + + {/if}
diff --git a/svelte/src/util/LoadingIndicator.svelte b/svelte/src/util/LoadingIndicator.svelte index 4612caf..e43faf3 100644 --- a/svelte/src/util/LoadingIndicator.svelte +++ b/svelte/src/util/LoadingIndicator.svelte @@ -17,6 +17,5 @@ export let loading = false right: 10px; height: 120px; width: 120px; - z-index: 1000; } diff --git a/svelte/src/util/upload_widget/UploadFunc.js b/svelte/src/util/upload_widget/UploadFunc.js index 9add1e2..ddd3b60 100644 --- a/svelte/src/util/upload_widget/UploadFunc.js +++ b/svelte/src/util/upload_widget/UploadFunc.js @@ -56,11 +56,11 @@ export const upload_file = (file, name, on_progress, on_success, on_error) => { resp = JSON.parse(xhr.response) } - on_failure(resp.value, resp.message) + on_error(resp.value, resp.message) } else if (xhr.status === 0) { - on_failure("request_failed", "Your request did not arrive, check your network connection") + on_error("request_failed", "Your request did not arrive, check your network connection") } else { - on_failure(xhr.responseText, xhr.responseText) + on_error(xhr.responseText, xhr.responseText) } }; diff --git a/svelte/src/util/upload_widget/UploadProgress.svelte b/svelte/src/util/upload_widget/UploadProgress.svelte index 0bedf5b..875c03d 100644 --- a/svelte/src/util/upload_widget/UploadProgress.svelte +++ b/svelte/src/util/upload_widget/UploadProgress.svelte @@ -1,6 +1,6 @@