diff --git a/ext/upload/script.js b/ext/upload/script.js
new file mode 100644
index 00000000..14eef320
--- /dev/null
+++ b/ext/upload/script.js
@@ -0,0 +1,56 @@
+function fileSize(size) {
+ var i = Math.floor(Math.log(size) / Math.log(1024));
+ return (size / Math.pow(1024, i)).toFixed(2) * 1 + ['B', 'kB', 'MB', 'GB', 'TB'][i];
+}
+function updateTracker() {
+ var size = 0;
+ var upbtn = document.getElementById("uploadbutton");
+ var tracker = document.getElementById("upload_size_tracker");
+ var lockbtn = false;
+
+ // check that each individual file is less than the max file size
+ document.querySelectorAll("#large_upload_form input[type='file']").forEach((input) => {
+ var cancelbtn = document.getElementById("cancel"+input.id);
+ var toobig = false;
+ if (input.files.length) {
+ if(cancelbtn) cancelbtn.style.visibility = 'visible';
+ for (var i = 0; i < input.files.length; i++) {
+ size += input.files[i].size;
+ if (window.shm_max_size > 0 && input.files[i].size > window.shm_max_size) {
+ toobig = true;
+ }
+ }
+ if (toobig) {
+ lockbtn = true;
+ input.style = 'color:red';
+ } else {
+ input.style = 'color:initial';
+ }
+ } else {
+ if(cancelbtn) cancelbtn.style.visibility = 'hidden';
+ input.style = 'color:initial';
+ }
+ });
+
+ // check that the total is less than the max total size
+ if (size) {
+ tracker.innerText = fileSize(size);
+ if (window.shm_max_total_size > 0 && size > window.shm_max_total_size) {
+ lockbtn = true;
+ tracker.style = 'color:red';
+ } else {
+ tracker.style = 'color:initial';
+ }
+ } else {
+ tracker.innerText = '0MB';
+ }
+ upbtn.disabled = lockbtn;
+}
+document.addEventListener('DOMContentLoaded', () => {
+ if(document.getElementById("upload_size_tracker")) {
+ document.querySelectorAll("#large_upload_form input[type='file']").forEach((el) => {
+ el.addEventListener('change', updateTracker);
+ });
+ updateTracker();
+ }
+});
diff --git a/ext/upload/theme.php b/ext/upload/theme.php
index 95718e2f..7c9f1c4d 100644
--- a/ext/upload/theme.php
+++ b/ext/upload/theme.php
@@ -17,6 +17,7 @@ use function MicroHTML\NOSCRIPT;
use function MicroHTML\DIV;
use function MicroHTML\BR;
use function MicroHTML\A;
+use function MicroHTML\SPAN;
use function MicroHTML\P;
@@ -43,7 +44,7 @@ class UploadTheme extends Themelet
$max_kb = to_shorthand_int($max_size);
$max_total_size = parse_shorthand_int(ini_get('post_max_size')) - 102400; //leave room for http request data
$max_total_kb = to_shorthand_int($max_total_size);
- $upload_list = $this->h_upload_list_1();
+ $upload_list = $this->build_upload_list();
$form = SHM_FORM("upload", "POST", true, "file_upload");
$form->appendChild(
@@ -58,10 +59,6 @@ class UploadTheme extends Themelet
TD(["colspan" => "5"], INPUT(["name" => "source", "type" => "text"]))
),
$upload_list,
- TR(
- TD(["colspan" => $tl_enabled ? 2 : 4,"id" => "upload_size_tracker"], ""),
- TD(["colspan" => 2], ""),
- ),
TR(
TD(["colspan" => "6"], INPUT(["id" => "uploadbutton", "type" => "submit", "value" => "Post"]))
),
@@ -69,61 +66,17 @@ class UploadTheme extends Themelet
);
$html = emptyHTML(
$form,
- $max_size > 0 ? SMALL("(Max file size is $max_kb)") : null,
- $max_total_size > 0 ? SMALL(BR(), "(Max total size is $max_total_kb)") : null,
+ SMALL(
+ "(",
+ $max_size > 0 ? "Per-file limit: $max_kb" : null,
+ $max_total_size > 0 ? " / Total limit: $max_total_kb" : null,
+ " / Current total: ",
+ SPAN(["id" => "upload_size_tracker"], "0KB"),
+ ")"
+ ),
rawHTML("")
);
@@ -136,7 +89,7 @@ class UploadTheme extends Themelet
}
}
- protected function h_upload_list_1(): HTMLElement
+ protected function build_upload_list(): HTMLElement
{
global $config;
$upload_list = emptyHTML();
@@ -155,7 +108,11 @@ class UploadTheme extends Themelet
for ($i = 0; $i < $upload_count; $i++) {
$upload_list->appendChild(
TR(
- TD(["colspan" => $tl_enabled ? 2 : 4], DIV(["name" => "canceldata{$i}[]","style" => "display:inline;margin-right:5px;font-size:15px;visibility:hidden;","onclick" => "$(\"input[name='data{$i}[]']\")[0].value='';updateTracker();"], "✖"), INPUT(["type" => "file", "name" => "data{$i}[]", "accept" => $accept, "multiple" => true])),
+ TD(
+ ["colspan" => $tl_enabled ? 2 : 4],
+ DIV(["id" => "canceldata{$i}", "style" => "display:inline;margin-right:5px;font-size:15px;visibility:hidden;","onclick" => "document.getElementById('data{$i}').value='';updateTracker();"], "✖"),
+ INPUT(["type" => "file", "id"=>"data{$i}", "name" => "data{$i}[]", "accept" => $accept, "multiple" => true])
+ ),
$tl_enabled ? TD(["colspan" => "2"], INPUT(["type" => "text", "name" => "url{$i}"])) : emptyHTML(),
TD(["colspan" => "2"], INPUT(["type" => "text", "name" => "tags{$i}", "class" => "autocomplete_tags"])),
)
diff --git a/themes/rule34v2/upload.theme.php b/themes/rule34v2/upload.theme.php
index 31b088eb..a40f7f4c 100644
--- a/themes/rule34v2/upload.theme.php
+++ b/themes/rule34v2/upload.theme.php
@@ -35,85 +35,10 @@ class CustomUploadTheme extends UploadTheme
$page->add_block(new Block("Upload", "Disk nearly full, uploads disabled", "head", 20));
}
- // override to add link to tagging guide
- public function display_page(Page $page): void
- {
- global $config, $page;
-
- $tl_enabled = ($config->get_string(UploadConfig::TRANSLOAD_ENGINE, "none") != "none");
- $max_size = $config->get_int(UploadConfig::SIZE);
- $max_kb = to_shorthand_int($max_size);
- $upload_list = $this->h_upload_list_1();
-
- $form = SHM_FORM("upload", "POST", true, "file_upload");
- $form->appendChild(
- TABLE(
- ["id" => "large_upload_form", "class" => "vert"],
- TR(
- TD(["width" => "20"], rawHTML("Common Tags")),
- TD(["colspan" => "5"], INPUT(["name" => "tags", "type" => "text", "placeholder" => "tagme", "autocomplete" => "off"]))
- ),
- TR(
- TD(["width" => "20"], rawHTML("Common Source")),
- TD(["colspan" => "5"], INPUT(["name" => "source", "type" => "text"]))
- ),
- $upload_list,
- TR(
- TD(["colspan" => "6"], INPUT(["id" => "uploadbutton", "type" => "submit", "value" => "Post"]))
- ),
- )
- );
- $html = emptyHTML(
- $form,
- SMALL("(Max file size is $max_kb)")
- );
-
- $page->set_title("Upload");
- $page->set_heading("Upload");
- $page->add_block(new NavBlock());
- $page->add_block(new Block("Upload", $html, "main", 20));
- if ($tl_enabled) {
- $page->add_block(new Block("Bookmarklets", (string)$this->h_bookmarklets(), "left", 20));
- }
- $html = "
- Tagging Guide
- ";
- $page->add_block(new Block(null, $html, "main", 19));
- }
-
// override to remove small uploader and just show a link to
// the big page
protected function build_upload_block(): HTMLElement
{
return A(["href" => make_link("upload"), "style" => 'font-size: 2rem; display: block;'], "Upload");
}
-
- protected function h_upload_list_1(): HTMLElement
- {
- global $config;
- $upload_list = emptyHTML();
- $upload_count = $config->get_int(UploadConfig::COUNT);
- $tl_enabled = ($config->get_string(UploadConfig::TRANSLOAD_ENGINE, "none") != "none");
- $accept = $this->get_accept();
-
- $upload_list->appendChild(
- TR(
- TD(["colspan" => $tl_enabled ? 2 : 4], "Files"),
- $tl_enabled ? TD(["colspan" => "2"], "URLs") : emptyHTML(),
- TD(["colspan" => "2"], "Post-Specific Tags"),
- )
- );
-
- for ($i = 0; $i < $upload_count; $i++) {
- $upload_list->appendChild(
- TR(
- TD(["colspan" => $tl_enabled ? 2 : 4], INPUT(["type" => "file", "name" => "data{$i}[]", "accept" => $accept, "multiple" => true])),
- $tl_enabled ? TD(["colspan" => "2"], INPUT(["type" => "text", "name" => "url{$i}"])) : emptyHTML(),
- TD(["colspan" => "2"], INPUT(["type" => "text", "name" => "tags{$i}", "autocomplete" => "off"])),
- )
- );
- }
-
- return $upload_list;
- }
}