psdi-data-conversion 0.0.33__py3-none-any.whl → 0.0.36__py3-none-any.whl

psdi_data_conversion/static/javascript/convert_common.js

@@ -3,6 +3,8 @@
   Version 1.0, 17th December 2024
 */
 
+import { disableDirtyForms, enableDirtyForms, initDirtyForms } from "./common.js";
+
 const SECOND = 1000; // Milliseconds
 const CONVERT_TIMEOUT = 60 * SECOND;
 const MEGABYTE = 1024 * 1024;
@@ -31,7 +33,18 @@ var token = "",
 
 export function commonConvertReady(converter) {
     token = sessionStorage.getItem("token");
-    max_file_size = sessionStorage.getItem("max_file_size");
+
+    // Open Babel uniquely has its own maximum file size
+    if (converter == "Open Babel") {
+        max_file_size = sessionStorage.getItem("max_file_size_ob");
+    } else {
+        max_file_size = sessionStorage.getItem("max_file_size");
+    }
+
+    // Set the text for displaying the maximum size
+    if (max_file_size > 0) {
+        $(".max-file-size").text(" (max size " + (max_file_size / MEGABYTE).toFixed(2) + " MB)");
+    }
 
     in_str = sessionStorage.getItem("in_str");
     out_str = sessionStorage.getItem("out_str");
@@ -48,16 +61,26 @@ export function commonConvertReady(converter) {
     $("#heading").html("Convert from \'" + in_ext + "\' (" + in_note + ") to \'" + out_ext + "\' (" + out_note +
         ") using " + converter);
 
+    // Connect the buttons to events
     $("#extCheck").click(setExtCheck);
     $("#requestLog").click(setRequestLog);
+    $("#clearUpload").click(clearUploadedFile);
+
+    // Connect the file upload to event and limit the types it can accept
     $("#fileToUpload").change(checkFile);
+    limitFileType();
+
+    initDirtyForms();
 
-    return [token, max_file_size, in_str, in_ext, out_str, out_ext];
+    return [token, in_str, in_ext, out_str, out_ext];
 }
 
 // Converts user-supplied file to another format and downloads the resulting file
 export function convertFile(form_data, download_fname, fname) {
 
+    showSpinner();
+    disableConvertButton();
+
     let convertTimedOut = false;
 
     var jqXHR = $.ajax({
@@ -68,6 +91,12 @@ export function convertFile(form_data, download_fname, fname) {
         contentType: false,
         timeout: CONVERT_TIMEOUT,
         success: async function () {
+
+            hideSpinner();
+            enableConvertButton();
+            clearUploadedFile();
+            disableDirtyForms();
+
             if (!convertTimedOut) {
                 await downloadFile(`../downloads/${download_fname}`, download_fname)
 
@@ -105,6 +134,8 @@ export function convertFile(form_data, download_fname, fname) {
                 })
         },
         error: function (xmlhttprequest, textstatus, message) {
+            hideSpinner();
+            enableConvertButton();
             if (textstatus === "timeout") {
                 convertTimedOut = true;
                 alert("ERROR: Conversion attempt timed out. This may be because the conversion is too complicated, " +
@@ -145,6 +176,13 @@ export function convertFile(form_data, download_fname, fname) {
 
 function setExtCheck(event) {
     extCheck = this.checked;
+
+    // Toggle whether or not the file upload limits uploaded type based on whether or not this box is ticked
+    if (extCheck) {
+        limitFileType();
+    } else {
+        unlimitFileType();
+    }
 }
 
 export function getExtCheck() {
@@ -191,6 +229,9 @@ export function isArchiveExt(ext) {
 // Check that the file meets requirements for upload
 function checkFile(event) {
 
+    // Enable dirty form checking whenever a file is uploaded
+    enableDirtyForms();
+
     let allGood = true;
     let file = this.files[0];
     let message = "";
@@ -216,20 +257,58 @@ function checkFile(event) {
         if (message !== "")
             message += "\n\n";
         message += "The file exceeds the maximum size limit of " + (max_file_size / MEGABYTE).toFixed(2) +
-            " MB; its size is " + (file.size / MEGABYTE).toFixed(2) + " MB.";
+            " MB; its size is " + (file.size / MEGABYTE).toFixed(2) + " MB. Please either log in for an increased " +
+            "file size limit, or see the Downloads page to run the app locally with no limit.";
         allGood = false;
     }
 
     if (allGood) {
-        $("#uploadButton").css({ "background-color": "var(--ifm-color-primary)", "color": "var(--ifm-hero-text-color)" });
-        $("#uploadButton").prop({ disabled: false });
+        enableConvertButton();
     } else {
-        $("#uploadButton").css({ "background-color": "var(--psdi-bg-color-secondary)", "color": "gray" });
-        $("#uploadButton").prop({ disabled: true });
+        disableConvertButton();
         alert(message);
     }
 }
 
+/**
+ * Allow the file upload to only accept the expected type of file
+ */
+function limitFileType() {
+    $("#fileToUpload")[0].accept = "." + in_ext;
+}
+
+/**
+ * Allow the file upload to accept any type of file
+ */
+function unlimitFileType() {
+    $("#fileToUpload")[0].accept = "*";
+}
+
+/**
+ * Clear any uploaded file
+ */
+function clearUploadedFile() {
+    $("#fileToUpload").val('');
+    disableConvertButton();
+}
+
+/**
+ * Enable the "Convert" button
+ */
+function enableConvertButton() {
+    $("#uploadButton").css({ "background-color": "var(--ifm-color-primary)", "color": "var(--ifm-hero-text-color)" });
+    $("#uploadButton").prop({ disabled: false });
+}
+
+
+/**
+ * Disable the "Convert" button
+ */
+function disableConvertButton() {
+    $("#uploadButton").css({ "background-color": "var(--psdi-bg-color-secondary)", "color": "gray" });
+    $("#uploadButton").prop({ disabled: true });
+}
+
 /**
  * Start a download of a file
  * 
@@ -249,4 +328,18 @@ async function downloadFile(path, filename) {
             a.click();
             a.remove();
         });
+}
+
+/**
+ * Show the loading spinner
+ */
+function showSpinner() {
+    $(".loading-spinner").css({ display: "inherit" });
+}
+
+/**
+ * Hide the loading spinner
+ */
+function hideSpinner() {
+    $(".loading-spinner").css({ display: "none" });
 }

psdi_data_conversion/static/javascript/convertato.js

@@ -8,14 +8,13 @@
 import { commonConvertReady, convertFile, getExtCheck, splitArchiveExt, isArchiveExt } from "./convert_common.js"
 
 var token = "",
-    max_file_size = 0,
     in_ext = "",
     out_ext = "",
     in_str = "",
     out_str = "";
 
 $(document).ready(function () {
-    [token, max_file_size, in_str, in_ext, out_str, out_ext] = commonConvertReady("Atomsk");
+    [token, in_str, in_ext, out_str, out_ext] = commonConvertReady("Atomsk");
     $("#uploadButton").click(submitFile);
 });
 

psdi_data_conversion/static/javascript/convertc2x.js

@@ -8,14 +8,13 @@
 import { commonConvertReady, convertFile, getExtCheck, splitArchiveExt, isArchiveExt } from "./convert_common.js"
 
 var token = "",
-    max_file_size = 0,
     in_ext = "",
     out_ext = "",
     in_str = "",
     out_str = "";
 
 $(document).ready(function () {
-    [token, max_file_size, in_str, in_ext, out_str, out_ext] = commonConvertReady("c2x");
+    [token, in_str, in_ext, out_str, out_ext] = commonConvertReady("c2x");
     $("#uploadButton").click(submitFile);
 });
 

psdi_data_conversion/static/javascript/format.js

@@ -5,6 +5,7 @@
   This is the JavaScript which makes the Format and Converter Selection gui work.
 */
 
+import { disableDirtyForms, cleanDirtyForms, initDirtyForms, loadServiceMode, loadProductionMode } from "./common.js";
 import {
     getInputFormats, getOutputFormats, getOutputFormatsForInputFormat,
     getInputFormatsForOutputFormat, getConverters, getConverterByName, getLevelChemInfo
@@ -29,12 +30,16 @@ $(document).ready(function () {
 
     sessionStorage.setItem("token", token);
     sessionStorage.setItem("max_file_size", max_file_size);
+    sessionStorage.setItem("max_file_size_ob", max_file_size_ob);
     sessionStorage.setItem("service_mode", service_mode);
     sessionStorage.setItem("production_mode", production_mode);
     sessionStorage.setItem("in_str", "");
     sessionStorage.setItem("out_str", "");
     sessionStorage.setItem("success", "");
 
+    loadServiceMode();
+    loadProductionMode();
+
     $("#fromList").click(populateConversionSuccess);
     $("#toList").click(populateConversionSuccess);
     $("#searchTo").keyup(filterOptions);
@@ -43,6 +48,8 @@ $(document).ready(function () {
     $("#success").click(showConverterDetails);
     $("#resetButton").click(resetAll);
     $("#showButton").click(showQualityDetails);
+
+    initDirtyForms();
 });
 
 /**
@@ -512,6 +519,9 @@ function getFormat(str) {
 
 // Stores chosen formats and switches to the Conversion page
 function goToConversionPage(event) {
+
+    disableDirtyForms();
+
     var path = ``;
 
     if ($("#name").html() == "Open Babel") {
@@ -604,4 +614,6 @@ function resetAll() {
 
     // Populates the "Convert to" selection list
     getOutputFormats().then(formats => populateList(formats, "to"));
+
+    cleanDirtyForms();
 }

psdi_data_conversion/static/javascript/report.js

@@ -5,6 +5,7 @@
   This is the JavaScript which makes the report.htm gui work.
 */
 
+import { disableDirtyForms, initDirtyForms } from "./common.js";
 import { getAllFormats, getConverters } from "./data.js";
 
 var token = "",
@@ -53,6 +54,8 @@ $(document).ready(function () {
     $("#resetButton").click(resetAll);
     $("#resetButton2").click(resetAll);
     $("#reportButton").click(submitUserInput);
+
+    initDirtyForms();
 });
 
 // Included in this file for convenience. When the 'Report' button is clicked, a user's missing conversion report
@@ -131,6 +134,7 @@ function hideConverterDetails() {
 
 // Submits user input
 function submitUserInput() {
+
     const from = $("#searchFrom").val(),
         to = $("#searchTo").val();
 
@@ -205,6 +209,8 @@ function hideOffer() { }
 
 // Submit feedback
 function submitFeedback(data) {
+    disableDirtyForms();
+
     $.post(`/feedback/`, {
         'token': token,
         'data': JSON.stringify(data)

psdi_data_conversion/static/styles/format.css

@@ -144,4 +144,17 @@ select#dark-background option {
 
 [production-mode=False] .dev-only {
   display: none;
+}
+
+/* Convert button and loading spinner */
+.convert-button-and-spinner {
+  display       : flex;
+  flex-direction: row;
+  align-items   : center;
+}
+
+.loading-spinner {
+  display: none;
+  color  : var(--ifm-color-primary);
+  scale  : 75%;
 }

psdi_data_conversion/static/styles/psdi-common.css

@@ -640,8 +640,11 @@ a svg {
 }
 
 .footer__hline hr {
-  margin: 0.5rem 0;
-  height: 2px;
+  margin             : 0.5rem 0;
+  height             : 2px;
+  border-top-style   : none;
+  border-bottom-style: inset;
+  border-bottom-width: 1px;
 }
 
 .max-width-box .footer__col {

psdi_data_conversion/templates/index.htm

@@ -18,10 +18,13 @@
 
   <script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4="
     crossorigin="anonymous"></script>
+  <script src="https://cdn.jsdelivr.net/jquery.dirtyforms/2.0.0/jquery.dirtyforms.min.js"></script>
+
   {% for item in data %}
   <script>
     const token = "{{item.token}}";
     const max_file_size = "{{item.max_file_size}}";
+    const max_file_size_ob = "{{item.max_file_size_ob}}";
     const service_mode = "{{item.service_mode}}";
     const production_mode = "{{item.production_mode}}";
     document.documentElement.setAttribute("service-mode", service_mode);
@@ -52,7 +55,7 @@
     </div>
   </div>
 
-  <form name="gui">
+  <form name="gui" class="gui">
     <div class="max-width-box">
       <p>Select 'from' and 'to' file formats in the 'Convert from/to' boxes, in either order. Typing where indicated
         filters the options (case insensitive); for example, typing 'can' or 'NON' reduces the number of options to one: