From 8bb4e5fac4e06005903b76edbd0ed3dd031dbff2 Mon Sep 17 00:00:00 2001 From: G2-Games Date: Mon, 21 Oct 2024 05:05:19 -0500 Subject: [PATCH] Improved everything, still only uploads --- Cargo.lock | 74 +------------------------------------- Cargo.toml | 2 +- src/js/form_handler.js | 28 --------------- src/main.rs | 31 ++++++++++------ src/static/form_handler.js | 41 +++++++++++++++++++++ src/static/main.css | 51 ++++++++++++++++++++++++++ 6 files changed, 115 insertions(+), 112 deletions(-) delete mode 100644 src/js/form_handler.js create mode 100644 src/static/form_handler.js create mode 100644 src/static/main.css diff --git a/Cargo.lock b/Cargo.lock index cd90495..31cced0 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -107,15 +107,6 @@ version = "2.6.0" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "b048fb63fd8b5923fc5aa7b340d8e156aec7ec02f0c78fa8a6ddc2613f6f71de" -[[package]] -name = "block-buffer" -version = "0.10.4" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "3078c7629b62d3f0439517fa394996acacc5cbc91c5a20d8c658e77abd503a71" -dependencies = [ - "generic-array", -] - [[package]] name = "bytemuck" version = "1.19.0" @@ -160,16 +151,6 @@ dependencies = [ "version_check", ] -[[package]] -name = "crypto-common" -version = "0.1.6" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "1bfb12502f3fc46cca1bb51ac28df9d618d813cdc3d2f25b9fe775a34af26bb3" -dependencies = [ - "generic-array", - "typenum", -] - [[package]] name = "deranged" version = "0.3.11" @@ -212,16 +193,6 @@ dependencies = [ "syn", ] -[[package]] -name = "digest" -version = "0.10.7" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "9ed9a281f7bc9b7576e61468ba615a66a5c8cfdff42420a70aa82701a3b1e292" -dependencies = [ - "block-buffer", - "crypto-common", -] - [[package]] name = "either" version = "1.13.0" @@ -357,16 +328,6 @@ dependencies = [ "windows", ] -[[package]] -name = "generic-array" -version = "0.14.7" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "85649ca51fd72272d7821adaf274ad91c288277713d9c18820d8499a7ff69e9a" -dependencies = [ - "typenum", - "version_check", -] - [[package]] name = "getrandom" version = "0.2.15" @@ -611,16 +572,6 @@ dependencies = [ "syn", ] -[[package]] -name = "md-5" -version = "0.10.6" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "d89e7ee0cfbedfc4da3340218492196241d89eefb6dab27de5df917a6d2e78cf" -dependencies = [ - "cfg-if", - "digest", -] - [[package]] name = "memchr" version = "2.7.4" @@ -659,8 +610,8 @@ name = "mochihost" version = "0.1.0" dependencies = [ "maud", + "rand", "rocket", - "uuid", ] [[package]] @@ -1130,12 +1081,6 @@ dependencies = [ "serde", ] -[[package]] -name = "sha1_smol" -version = "1.0.1" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "bbfa15b3dddfee50a0fff136974b3e1bde555604ba463834a7eb7deb6417705d" - [[package]] name = "sharded-slab" version = "0.1.7" @@ -1433,12 +1378,6 @@ version = "0.2.5" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "e421abadd41a4225275504ea4d6566923418b7f05506fbc9c0fe86ba7396114b" -[[package]] -name = "typenum" -version = "1.17.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "42ff0bf0c66b8238c6f3b578df37d0b7848e55df8577b3f74f92a69acceeb825" - [[package]] name = "ubyte" version = "0.10.4" @@ -1470,17 +1409,6 @@ version = "0.2.6" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "ebc1c04c71510c7f702b52b7c350734c9ff1295c464a03335b00bb84fc54f853" -[[package]] -name = "uuid" -version = "1.11.0" -source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "f8c5f0a0af699448548ad1a2fbf920fb4bee257eae39953ba95cb84891a0446a" -dependencies = [ - "getrandom", - "md-5", - "sha1_smol", -] - [[package]] name = "valuable" version = "0.1.0" diff --git a/Cargo.toml b/Cargo.toml index 9c8090d..1544876 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -5,5 +5,5 @@ edition = "2021" [dependencies] maud = { version = "0.26", features = ["rocket"] } +rand = "0.8" rocket = "0.5" -uuid = { version = "1.11.0", features = ["v3", "v4", "v5"] } diff --git a/src/js/form_handler.js b/src/js/form_handler.js deleted file mode 100644 index e80b57f..0000000 --- a/src/js/form_handler.js +++ /dev/null @@ -1,28 +0,0 @@ -function formSubmit(form) { - let url = "/upload"; - let request = new XMLHttpRequest(); - request.open('POST', url, true); - request.onload = function() { // request successful - // we can use server response to our request now - console.log(request.responseText); - }; - - request.onerror = function() { - // request failed - }; - - // Create and send FormData - request.send(new FormData(form)); - - // Reset the form data since we've successfully submitted it - form.reset(); -} - -// and you can attach form submit event like this for example -function attachFormSubmitEvent(formId){ - document.getElementById(formId).addEventListener("submit", formSubmit); -} - -document.addEventListener("DOMContentLoaded", function(event){ - attachFormSubmitEvent("uploadForm"); -}) diff --git a/src/main.rs b/src/main.rs index e56f754..a1e1af7 100644 --- a/src/main.rs +++ b/src/main.rs @@ -2,19 +2,20 @@ use std::path::PathBuf; use maud::{html, Markup, DOCTYPE, PreEscaped}; +use rand::Rng; use rocket::{ form::Form, fs::{FileServer, Options, TempFile}, get, post, routes, FromForm }; -use uuid::Uuid; - -const FORM_HANDLER_JS: &str = include_str!("js/form_handler.js"); fn head(page_title: &str) -> Markup { html! { (DOCTYPE) meta charset="utf-8"; title { (page_title) } - script { (PreEscaped(FORM_HANDLER_JS)) } + // Javascript stuff for client side handling + script { (PreEscaped(include_str!("static/form_handler.js"))) } + // CSS for styling the sheets + style { (PreEscaped(include_str!("static/main.css"))) } } } @@ -24,11 +25,15 @@ fn home() -> Markup { (head("Mochi")) body { h1 { "File Hosting!" } - h2 { "Everything will be deleted in like 24 hours or something idk" } form id="uploadForm" { - input type="file" name="fileUpload" onchange="formSubmit(this.parentNode)" { - "Select File (Or drag here)" + label for="fileUpload" class="file-upload" onclick="document.getElementById('fileInput').click()" { + "Upload File" } + input id="fileInput" type="file" name="fileUpload" onchange="formSubmit(this.parentNode)" style="display:none;"; + } + div class="progress-box" { + progress id="uploadProgress" value="0" max="100" {} + p id="uploadProgressValue" class="progress-value" { "0%" } } } } @@ -44,15 +49,21 @@ struct Upload<'r> { #[post("/upload", data = "")] async fn handle_upload(mut file_data: Form>) -> Result<(), std::io::Error> { let mut out_path = PathBuf::from("files/"); - out_path.push(get_filename()); + out_path.push(get_filename(file_data.file.name().unwrap())); file_data.file.persist_to(out_path).await?; Ok(()) } /// Get a random filename for use as the uploaded file's name -fn get_filename() -> String { - let uuid = Uuid::new_v4().to_string(); +fn get_filename(name: &str) -> String { + let rand_string: String = rand::thread_rng() + .sample_iter(&rand::distributions::Alphanumeric) + .take(8) + .map(char::from) + .collect(); + + let uuid = rand_string + "_" + name; uuid } diff --git a/src/static/form_handler.js b/src/static/form_handler.js new file mode 100644 index 0000000..dca807c --- /dev/null +++ b/src/static/form_handler.js @@ -0,0 +1,41 @@ +let progressBar = null; +let progressValue = null; + +function formSubmit(form) { + let url = "/upload"; + let request = new XMLHttpRequest(); + request.open('POST', url, true); + request.onload = function() { // request successful + console.log(request.responseText); + }; + + request.upload.onprogress = uploadProgress; + + request.onerror = function() { + console.log(request.responseText); + }; + + // Create and send FormData + request.send(new FormData(form)); + + // Reset the form data since we've successfully submitted it + form.reset(); +} + +function uploadProgress(progress) { + if (progress.lengthComputable) { + const progressPercent = Math.floor((progress.loaded / progress.total) * 100); + progressBar.value = progressPercent; + progressValue.textContent = progressPercent + "%"; + } +} + +function attachFormSubmitEvent(formId) { + document.getElementById(formId).addEventListener("submit", formSubmit); +} + +document.addEventListener("DOMContentLoaded", function(_event){ + attachFormSubmitEvent("uploadForm"); + progressBar = document.getElementById("uploadProgress"); + progressValue = document.getElementById("uploadProgressValue"); +}) diff --git a/src/static/main.css b/src/static/main.css new file mode 100644 index 0000000..26cc835 --- /dev/null +++ b/src/static/main.css @@ -0,0 +1,51 @@ +@import url('https://g2games.dev/assets/fonts/fonts.css'); +@import url('https://g2games.dev/assets/main-style.css'); + +.file-upload { + padding: 20px; + position: relative; + display: block; + font-size: 16pt; + font-weight: bold; + + background-color: #fff098; + color: black; + width: fit-content; + border-radius: 13px; + border: 2px solid grey; + + margin: 10px auto; + cursor: pointer; +} + +progress[value] { + border-radius: 5px; + /* Reset the default appearance */ + -webkit-appearance: none; + appearance: none; + + width: 100%; + height: 100%; +} + +progress[value]::-webkit-progress-bar, progress[value]::-moz-progress-bar { + background-color: #a6e3a1; + border-radius: 5px; +} + +.progress-box { + display: flex; + position: relative; + width: 500px; + height: 20px; + margin: 10px auto; + + .progress-value { + width: fit-content; + position: absolute; + left: 50%; + top: 50%; + translate: -50% -50%; + color: black; + } +}