upload direct + bug fixes

src/css/style.scss

@@ -1,9 +1,7 @@
 $page-width: 1024px;
-$page-height: 512px;
 $page-padding: 10px;
 $page-margin-top: 20px;
 $dropzone-border-width: 2px;
-$dropzone-height: ($page-height - ($dropzone-border-width * 2)) / 2;
 
 $upload-progress-padding: 2px;
 $upload-progress-height: 20px;
@@ -51,11 +49,15 @@ a:hover { text-decoration: underline; }
 
 #dropzone {
     border: $dropzone-border-width dashed #333;
-    line-height: $dropzone-height;
+    line-height: 100px;
     text-align: center;
     font-size: 50px;
 }
 
+#dropzone small {
+    font-size: 20px;
+}
+
 #page-upload {
     display: none;
     padding: 10px 10px 0px 10px;
@@ -196,7 +198,6 @@ a:hover { text-decoration: underline; }
 #page-view .file-info {
     display: grid;
     grid-template-columns: 25% 25% 25% 25%;
-    text-align: center;
     border: 1px solid #aaa;
     margin: 10px 0px 0px 0px;
     padding: 5px;
@@ -288,7 +289,7 @@ a:hover { text-decoration: underline; }
         margin-top: 0;
         border-radius: 0;
     }
-
+    
     .header {
         border-radius: 0;
     }

src/js/App.js

@@ -35,6 +35,12 @@ const App = {
      * Sets up the page
      */
     Init: async function () {
+        window.site_info = await Api.GetSiteInfo();
+
+        App.Elements.PageView.style.display = "none";
+        App.Elements.PageUpload.style.display = "none";
+        App.Elements.PageFaq.style.display = "none";
+
         if (location.hash !== "") {
             if (location.hash == "#faq") {
                 let faq_headers = document.querySelectorAll('#page-faq .faq-header');
@@ -43,26 +49,22 @@ const App = {
                         this.nextElementSibling.classList.toggle("show");
                     }.bind(faq_headers[x]));
                 }
-                App.Elements.PageUpload.style.display = "none";
                 App.Elements.PageFaq.style.display = "block";
             } else {
-                App.Elements.PageUpload.style.display = "none";
                 App.Elements.PageView.style.display = "block";
                 new ViewManager();
             }
         } else {
             App.Elements.PageUpload.style.display = "block";
-            App.Elements.PageView.style.display = "none";
+            $('#dropzone').innerHTML = `Click me!<br><small>(${Utils.FormatBytes(window.site_info.data.max_upload_size)} max)</small>`;
             new DropzoneManager(App.Elements.Dropzone);
-
         }
-        
-        let stats = await Api.GetSiteInfo();
-        if(stats.ok){
+
+        if(window.site_info.ok){
             let elms = document.querySelectorAll("#footer-stats div span");
-            elms[0].textContent = stats.data.basic_stats.Files;
-            elms[1].textContent = Utils.FormatBytes(stats.data.basic_stats.Size, 2);
-            elms[2].textContent = Utils.FormatBytes(stats.data.basic_stats.Transfer_24h, 2);
+            elms[0].textContent = window.site_info.data.basic_stats.Files;
+            elms[1].textContent = Utils.FormatBytes(window.site_info.data.basic_stats.Size, 2);
+            elms[2].textContent = Utils.FormatBytes(window.site_info.data.basic_stats.Transfer_24h, 2);
         }
     }
 };

src/js/DropzoneManager.js

@@ -17,8 +17,10 @@ const DropzoneManager = function (dz) {
         i.addEventListener('change', function (evt) {
             this.SetUI();
             let fl = evt.target.files;
+            let host = window.site_info.ok ? window.site_info.data.upload_host : window.location.host;
+
             for (let z = 0; z < fl.length; z++) {
-                new FileUpload(fl[z]).ProcessUpload();
+                new FileUpload(fl[z], host).ProcessUpload();
             }
         }.bind(this));
         i.click();

src/js/FileUpload.js

@@ -2,10 +2,12 @@
  * File upload handler class
  * @class
  * @param {File} file - The file handle to upload
+ * @param {string} host - The hostname to upload to
  */
-const FileUpload = function (file) {
+const FileUpload = function (file, host) {
     this.hasCrypto = typeof window.crypto.subtle === "object";
     this.file = file;
+    this.host = host;
     this.domNode = null;
     this.key = null;
     this.hmackey = null;
@@ -243,7 +245,7 @@ const FileUpload = function (file) {
     this.UploadData = async function (fileData) {
         this.uploadStats.lastProgress = new Date().getTime();
         this.HandleProgress('state-upload-start');
-        let uploadResult = await XHR("POST", "/upload", fileData, undefined, function (ev) {
+        let uploadResult = await XHR("POST", `${window.location.protocol}//${this.host}/upload`, fileData, undefined, function (ev) {
             let now = new Date().getTime();
             let dxLoaded = ev.loaded - this.uploadStats.lastLoaded;
             let dxTime = now - this.uploadStats.lastProgress;

src/php/api.php

@@ -27,7 +27,9 @@
                     $rsp->ok = true;
                     $rsp->data = array(
                         "max_upload_size" => Config::$Instance->max_upload_size,
-                        "basic_stats" => Stats::Get()
+                        "basic_stats" => Stats::Get(),
+                        "upload_host" => Upload::GetUploadHost(),
+                        "geoip_info" => geoip_database_info()
                     );
                     break;
                 }

src/php/upload.php

@@ -91,5 +91,20 @@
 
             return $id;
         }
+
+        public static function GetUploadHost() : string {
+            $cont = geoip_continent_code_by_name(USER_IP);
+            if($cont === False){
+                $cont = "EU";
+            }
+
+            $redis = StaticRedis::$Instance;
+            $map = $redis->hGetAll(REDIS_PREFIX . "upload-region-mapping");
+            if($map !== False && isset($map[$cont])) {
+                return $map[$cont];
+            } else {
+                return $_SERVER["HTTP_HOST"];
+            }
+        }
     }
 ?>