psdi-data-conversion 0.1.7__py3-none-any.whl → 0.2.1__py3-none-any.whl

psdi_data_conversion/static/content/psdi-common-header.html

@@ -5,8 +5,10 @@
   <div class="header-left">
     <div class="navbar__brand">
       <a class="navbar__logo" href="https://psdi.ac.uk/">
-        <img src="../img/psdi-logo-darktext.png" alt="PSDI logo" class="lm-only">
-        <img src="../img/psdi-logo-lighttext.png" alt="PSDI logo" class="dm-only">
+        <img src="../img/psdi-logo-darktext.png" alt="PSDI logo"
+          class="lm-only">
+        <img src="../img/psdi-logo-lighttext.png" alt="PSDI logo"
+          class="dm-only">
       </a>
       <a class="navbar__title" href="../../">
         <h5>Data Conversion Service</h5>
@@ -14,18 +16,13 @@
     </div>
   </div>
   <div class="navbar__items navbar__items--right">
-    <!-- This file contains the links that will appear in the top-right of the header bar for .html files in this directory. -->
-    <a href="../../" class="navbar__item navbar__link">Home</a> <a href="report.htm"
-      class="navbar__item navbar__link">Report Missing Format/Conversion</a> <a href="feedback.htm"
-      class="navbar__item navbar__link">Provide Feedback</a> <a href="../../documentation.htm"
-      class="navbar__item navbar__link">Documentation</a> <a href="download.htm"
-      class="navbar__item navbar__link service-only">Download</a> <a href="accessibility.htm"
-      class="navbar__item navbar__link">Accessibility</a> <a href="mailto:support@psdi.ac.uk"
-      class="navbar__item navbar__link" id="mail">Contact Us</a>
+    <!-- This file contains the links that will appear in the top-right of the header bar for .html files in this directory. --> <a href="../../" class="navbar__item navbar__link">Home</a> <a href="../../report.htm" class="navbar__item navbar__link">Report Missing Format/Conversion</a> <a href="feedback.htm" class="navbar__item navbar__link">Provide Feedback</a> <a href="../../documentation.htm" class="navbar__item navbar__link">Documentation</a> <a href="download.htm" class="navbar__item navbar__link service-only">Download</a> <a href="../../accessibility.htm" class="navbar__item navbar__link">Accessibility</a> <a href="mailto:support@psdi.ac.uk" class="navbar__item navbar__link" id="mail">Contact Us</a>
     <button class="clean-btn color-mode-toggle" title="Switch between dark and light mode"
       aria-label="Lightmode/darkmode toggle button">
-      <img src="../img/colormode-toggle-lm.svg" alt="Lightmode toggle icon" class="lm-only">
-      <img src="../img/colormode-toggle-dm.svg" alt="Darkmode toggle icon" class="dm-only">
+      <img src="../img/colormode-toggle-lm.svg" alt="Lightmode toggle icon"
+        class="lm-only">
+      <img src="../img/colormode-toggle-dm.svg" alt="Darkmode toggle icon"
+        class="dm-only">
     </button>
   </div>
 </div>

psdi_data_conversion/static/javascript/accessibility.js

@@ -12,27 +12,27 @@ const LIGHT_MODE = "light";
 const DARK_MODE = "dark";
 
 function toggleMode() {
-  let currentMode = document.documentElement.getAttribute("data-theme");
-  let new_mode;
+    let currentMode = document.documentElement.getAttribute("data-theme");
+    let new_mode;
 
-  if (currentMode == DARK_MODE) {
-    new_mode = LIGHT_MODE;
-  } else {
-    new_mode = DARK_MODE;
-  }
+    if (currentMode == DARK_MODE) {
+        new_mode = LIGHT_MODE;
+    } else {
+        new_mode = DARK_MODE;
+    }
 
-  document.documentElement.setAttribute("data-theme", new_mode);
-  sessionStorage.setItem("mode", new_mode);
+    document.documentElement.setAttribute("data-theme", new_mode);
+    sessionStorage.setItem("mode", new_mode);
 }
 
 function loadOption(jsName, cssSelector, changeFunc) {
-    const opt = sessionStorage.getItem(jsName+"Opt");
-    if (opt!=null)
+    const opt = sessionStorage.getItem(jsName + "Opt");
+    if (opt != null)
         $(cssSelector).val(opt).change();
     $(cssSelector).change(changeFunc);
 }
 
-$(document).ready(function() {
+$(document).ready(function () {
 
     loadOption("font", "#font", changeFont);
     loadOption("size", "#size", changeFontSize);
@@ -45,7 +45,7 @@ $(document).ready(function() {
     loadOption("darkBack", "#dark-background", changeDarkBackground);
 
     $("#resetButton").click(resetSelections);
-    $("#applyButton").click(applyAllSettings);
+    $("#saveButton").click(saveSettings);
 });
 
 // Changes the font for accessibility purposes
@@ -53,9 +53,9 @@ function changeFont(event) {
     const fontSelection = $("#font").find(":selected");
     const font = fontSelection.text().trim();
 
-    if (font=="Default") {
-        r.style.setProperty('--ifm-font-family-base', s.getPropertyValue('--psdi-default-font'));
-        r.style.setProperty('--ifm-heading-font-family', s.getPropertyValue('--psdi-default-heading-font'));
+    if (font == "Default") {
+        r.style.setProperty('--ifm-font-family-base', sessionStorage.getItem('psdi-default-font'));
+        r.style.setProperty('--ifm-heading-font-family', sessionStorage.getItem('psdi-default-heading-font'));
     } else {
         // To avoid duplication of font settings, we retrieve the style to apply from what's applied to the font in the
         // selection box
@@ -70,18 +70,18 @@ function changeLetterSpacing(event) {
     const space = $("#letter").find(":selected").text();
 
     if (space == "Default") {
-        r.style.setProperty('--psdi-letter-spacing-base', s.getPropertyValue('--psdi-default-letter-spacing'));
+        r.style.setProperty('--psdi-letter-spacing-base', sessionStorage.getItem('psdi-default-letter-spacing'));
     } else {
-        r.style.setProperty('--psdi-letter-spacing-base', space+"px");
+        r.style.setProperty('--psdi-letter-spacing-base', space + "px");
     }
 }
 
 // Changes the line spacing for accessibility purposes.
 function changeLineSpacing(event) {
     const space = $("#line").find(":selected").text();
-    
-    if (space=="Default") {
-        r.style.setProperty('--ifm-line-height-base', s.getPropertyValue('--psdi-default-line-height'));
+
+    if (space == "Default") {
+        r.style.setProperty('--ifm-line-height-base', sessionStorage.getItem('psdi-default-line-height'));
     } else {
         r.style.setProperty('--ifm-line-height-base', space);
     }
@@ -91,10 +91,10 @@ function changeLineSpacing(event) {
 function changeFontSize(event) {
     const size = $("#size").find(":selected").text();
 
-    if (size=="Default") {
-        r.style.setProperty('--ifm-font-size-base', s.getPropertyValue('--psdi-default-font-size'));
+    if (size == "Default") {
+        r.style.setProperty('--ifm-font-size-base', sessionStorage.getItem('psdi-default-font-size'));
     } else {
-        r.style.setProperty('--ifm-font-size-base', size+"px");
+        r.style.setProperty('--ifm-font-size-base', size + "px");
     }
 }
 
@@ -102,8 +102,8 @@ function changeFontSize(event) {
 function changeFontWeight(event) {
     const weight = $("#weight").find(":selected").text();
 
-    if (weight=="Default") {
-        r.style.setProperty('--ifm-font-weight-base', s.getPropertyValue('--psdi-default-font-weight'));
+    if (weight == "Default") {
+        r.style.setProperty('--ifm-font-weight-base', sessionStorage.getItem('psdi-default-font-weight'));
     } else {
         r.style.setProperty('--ifm-font-weight-base', weight.toLowerCase());
     }
@@ -119,18 +119,18 @@ function changeFontColourLight(event) {
     return changeFontColour(event, "light");
 }
 
-function changeFontColour(event, lightOrDark="dark") {
-    
-    const colour = $("#"+lightOrDark+"-colour").find(":selected").text();
+function changeFontColour(event, lightOrDark = "dark") {
+
+    const colour = $("#" + lightOrDark + "-colour").find(":selected").text();
 
-    if (colour==='Default') {
-        r.style.setProperty('--psdi-'+lightOrDark+'-text-color-body',
-            s.getPropertyValue('--psdi-default-'+lightOrDark+'-text-color-body'));
-        r.style.setProperty('--psdi-'+lightOrDark+'-text-color-heading',
-            s.getPropertyValue('--psdi-default-'+lightOrDark+'-text-color-heading'));
+    if (colour === 'Default') {
+        r.style.setProperty('--psdi-' + lightOrDark + '-text-color-body',
+            sessionStorage.getItem('psdi-default-' + lightOrDark + '-text-color-body'));
+        r.style.setProperty('--psdi-' + lightOrDark + '-text-color-heading',
+            sessionStorage.getItem('psdi-default-' + lightOrDark + '-text-color-heading'));
     } else {
-        r.style.setProperty('--psdi-'+lightOrDark+'-text-color-body', colour);
-        r.style.setProperty('--psdi-'+lightOrDark+'-text-color-heading', colour);
+        r.style.setProperty('--psdi-' + lightOrDark + '-text-color-body', colour);
+        r.style.setProperty('--psdi-' + lightOrDark + '-text-color-heading', colour);
     }
 }
 
@@ -138,8 +138,8 @@ function changeFontColour(event, lightOrDark="dark") {
 function changeLightBackground(event) {
     const colour = $("#light-background").find(":selected").text();
 
-    if (colour=="Default") {
-        r.style.setProperty('--ifm-background-color', s.getPropertyValue('--psdi-default-background-color'));
+    if (colour == "Default") {
+        r.style.setProperty('--ifm-background-color', sessionStorage.getItem('psdi-default-background-color'));
     } else {
         r.style.setProperty('--ifm-background-color', colour);
     }
@@ -149,8 +149,8 @@ function changeLightBackground(event) {
 function changeDarkBackground(event) {
     const colour = $("#dark-background").find(":selected").text();
 
-    if (colour=="Default") {
-        r.style.setProperty('--ifm-color-primary', s.getPropertyValue('--psdi-default-color-primary'));
+    if (colour == "Default") {
+        r.style.setProperty('--ifm-color-primary', sessionStorage.getItem('psdi-default-color-primary'));
     } else {
         r.style.setProperty('--ifm-color-primary', colour);
     }
@@ -160,37 +160,64 @@ function changeDarkBackground(event) {
 function resetSelections(event) {
     ["#font", "#size", "#weight", "#letter", "#line", "#dark-colour", "#light-colour", "#light-background",
         "#dark-background"].forEach(function (selector) {
-        // Don't trigger a change event if it's already on Default
-        if ($(selector).find(":selected").val() != "Default")
-            $(selector).val("Default").change();
-    });
+            // Don't trigger a change event if it's already on Default
+            if ($(selector).find(":selected").val() != "Default")
+                $(selector).val("Default").change();
+        });
 }
 
 // Save a setting for one accessibility option to sessionStorage
-function applySetting(jsName, cssSelector, cssVar) {
+function applySetting(jsName, cssSelector, cssVar, settingsData) {
 
     // Check if set to default and not previously set, in which case don't save anything to storage
     let selectedVal = $(cssSelector).find(":selected").val();
-    if (selectedVal=="Default" && sessionStorage.getItem(jsName)==null)
+
+    let val = s.getPropertyValue(cssVar);
+
+    settingsData[jsName] = val;
+    settingsData[jsName + "Opt"] = selectedVal;
+
+    if (selectedVal == "Default" && sessionStorage.getItem(jsName) == null)
         return;
 
-    sessionStorage.setItem(jsName, s.getPropertyValue(cssVar));
-    sessionStorage.setItem(jsName+"Opt", selectedVal);
+    sessionStorage.setItem(jsName, val);
+    sessionStorage.setItem(jsName + "Opt", selectedVal);
+
 }
 
 // Applies accessibility settings to the entire website.
-function applyAllSettings(event) {
-    applySetting("font", "#font", "--ifm-font-family-base");
-    applySetting("hfont", "#font", "--ifm-heading-font-family");
-    applySetting("size", "#size", "--ifm-font-size-base");
-    applySetting("weight", "#weight", "--ifm-font-weight-base");
-    applySetting("letter", "#letter", "--psdi-letter-spacing-base");
-    applySetting("line", "#line", "--ifm-line-height-base");
-    applySetting("darkColour", "#dark-colour", "--psdi-dark-text-color-body");
-    applySetting("lightColour", "#light-colour", "--psdi-light-text-color-body");
-    applySetting("lightBack", "#light-background", "--ifm-background-color");
-    applySetting("darkBack", "#dark-background", "--ifm-color-primary");
-
-    alert("The settings have been applied to the entire website.");
+function saveSettings(event) {
+
+    let settingsData = new Object();
+
+    applySetting("font", "#font", "--ifm-font-family-base", settingsData);
+    applySetting("hfont", "#font", "--ifm-heading-font-family", settingsData);
+    applySetting("size", "#size", "--ifm-font-size-base", settingsData);
+    applySetting("weight", "#weight", "--ifm-font-weight-base", settingsData);
+    applySetting("letter", "#letter", "--psdi-letter-spacing-base", settingsData);
+    applySetting("line", "#line", "--ifm-line-height-base", settingsData);
+    applySetting("darkColour", "#dark-colour", "--psdi-dark-text-color-body", settingsData);
+    applySetting("lightColour", "#light-colour", "--psdi-light-text-color-body", settingsData);
+    applySetting("lightBack", "#light-background", "--ifm-background-color", settingsData);
+    applySetting("darkBack", "#dark-background", "--ifm-color-primary", settingsData);
+
+    $.post(`/save_accessibility/`, {
+        'data': JSON.stringify(settingsData)
+    })
+        .done(() => {
+            alert("Your accessibility settings have been saved. If you accidentally save settings which are " +
+                "unreadable and can't find the \"Reset\" button, you can restore the default settings by deleting " +
+                "this site's cookie in your browser's settings.");
+        })
+        .fail(function (e) {
+            alert("ERROR: Could not save accessibility settings. Your settings should still persist for this " +
+                "session, but will not be restored for future sessions. Please use the \"Contact\" link in the " +
+                "header to report this error to us.");
+
+            // For debugging
+            console.error("Error saving accessibility settings", e.status, e.responseText);
+        });
+
+
 }
 

psdi_data_conversion/static/javascript/data.js

@@ -1,10 +1,8 @@
 // data.js
 
-const response = await fetch("/static/data/data.json");
-
 let data = null;
 try {
-    data = JSON.parse(await response.text());
+    data = JSON.parse(await $.get(`/database/`));
 } catch (err) {
     console.log("ERROR: Database could not be loaded, error: " + err)
 }

psdi_data_conversion/static/javascript/load_accessibility.js

@@ -2,8 +2,8 @@ const r = document.querySelector(':root');
 const s = getComputedStyle(document.documentElement);
 
 function setDefault(default_varname, current_varname) {
-  if (s.getPropertyValue('--' + default_varname) == "") {
-    r.style.setProperty('--' + default_varname, s.getPropertyValue('--' + current_varname))
+  if (sessionStorage.getItem(default_varname) != null) {
+    sessionStorage.setItem(default_varname, s.getPropertyValue('--' + current_varname))
   }
 }
 
@@ -27,7 +27,7 @@ setDefault("psdi-default-background-color", "ifm-background-color");
 setDefault("psdi-default-color-primary", "ifm-color-primary");
 
 // Load values from session storage
-const font = sessionStorage.getItem("font"),
+let font = sessionStorage.getItem("font"),
   hfont = sessionStorage.getItem("hfont"),
   size = sessionStorage.getItem("size"),
   weight = sessionStorage.getItem("weight"),
@@ -45,45 +45,62 @@ function loadProperty(current_varname, value) {
   }
 }
 
-loadProperty("ifm-font-family-base", font);
-loadProperty("ifm-heading-font-family", hfont);
+function applyStoredAccessibility() {
 
-loadProperty("ifm-font-size-base", size);
+  loadProperty("ifm-font-family-base", font);
+  loadProperty("ifm-heading-font-family", hfont);
 
-loadProperty("ifm-font-weight-base", weight);
+  loadProperty("ifm-font-size-base", size);
 
-loadProperty("psdi-letter-spacing-base", letter);
+  loadProperty("ifm-font-weight-base", weight);
 
-loadProperty("psdi-dark-text-color-body", darkColour);
-loadProperty("psdi-dark-text-color-heading", darkColour);
-loadProperty("psdi-light-text-color-body", lightColour);
-loadProperty("psdi-light-text-color-heading", lightColour);
+  loadProperty("psdi-letter-spacing-base", letter);
 
-loadProperty("ifm-line-height-base", line);
+  loadProperty("psdi-dark-text-color-body", darkColour);
+  loadProperty("psdi-dark-text-color-heading", darkColour);
+  loadProperty("psdi-light-text-color-body", lightColour);
+  loadProperty("psdi-light-text-color-heading", lightColour);
 
-loadProperty("ifm-background-color", lightBack);
-loadProperty("ifm-color-primary", darkBack);
+  loadProperty("ifm-line-height-base", line);
 
-if (font != null) {
-
-  r.style.setProperty('--ifm-font-family-base', font);
-  r.style.setProperty('--ifm-heading-font-family', hfont);
-
-  r.style.setProperty('--ifm-font-size-base', size);
-
-  r.style.setProperty('--ifm-font-weight-base', weight);
-
-  r.style.setProperty('--psdi-letter-spacing-base', letter);
+  loadProperty("ifm-background-color", lightBack);
+  loadProperty("ifm-color-primary", darkBack);
 
-  r.style.setProperty('--psdi-dark-text-color-body', darkColour);
-  r.style.setProperty('--psdi-dark-text-color-heading', darkColour);
-  r.style.setProperty('--psdi-light-text-color-body', lightColour);
-  r.style.setProperty('--psdi-light-text-color-heading', lightColour);
-
-  r.style.setProperty('--ifm-line-height-base', line);
+}
 
-  r.style.setProperty('--ifm-background-color', lightBack);
-  r.style.setProperty('--ifm-color-primary', darkBack);
+if (font != null) {
+  applyStoredAccessibility();
 }
 
+$.get(`/load_accessibility/`)
+  .done((data) => {
+
+    const oData = JSON.parse(data);
+
+    function getAndSave(key) {
+      let value = oData[key];
+      if (value != null) {
+        sessionStorage.setItem(key, value);
+        sessionStorage.setItem(key + "Opt", oData[key + "Opt"]);
+        return value;
+      } else {
+        return sessionStorage.getItem(key);
+      }
+    }
+
+    font = getAndSave("font");
+    hfont = getAndSave("hfont");
+    size = getAndSave("size");
+    weight = getAndSave("weight");
+    letter = getAndSave("letter");
+    line = getAndSave("line");
+    darkColour = getAndSave("darkColour");
+    lightColour = getAndSave("lightColour");
+    lightBack = getAndSave("lightBack");
+    darkBack = getAndSave("darkBack");
+    mode = getAndSave("mode");
+
+    applyStoredAccessibility();
+  });
+
 document.documentElement.setAttribute("data-theme", mode);

psdi_data_conversion/static/styles/format.css

@@ -21,27 +21,13 @@ form {
 /* Width management for select boxes and forms */
 
 .med-width {
-  width: 25rem;
-}
-
-@media (max-width: 25rem) {
-  .med-width {
-    width: 100%
-  }
+  width    : 100%;
+  max-width: 25rem;
 }
 
 .large-width {
-  width: 50rem;
-}
-
-@media (max-width: 50rem) {
-  .large-width {
-    width: 100%
-  }
-
-  input.large-width {
-    width: calc(100% - 0.5rem)
-  }
+  width    : 100%;
+  max-width: 50rem;
 }
 
 /* Invalid input fields switch to alternate background */
@@ -56,6 +42,11 @@ input:invalid {
   display: none
 }
 
+/* File upload prompt */
+input#fileToUpload {
+  margin-right: 0.25rem;
+}
+
 /* Buttons that are initially disabled */
 input.button.init-disabled {
   background-color: var(--psdi-bg-color-secondary);
@@ -77,6 +68,64 @@ input.button.init-disabled {
   padding: 8rem;
 }
 
+/* Flex styling for pages */
+.flex-panel-display {
+  display        : flex;
+  flex-direction : row;
+  align-items    : flex-start;
+  justify-content: space-between;
+}
+
+.flex-panel-display:has(.instructions-panel) {
+  border       : 1px solid black;
+  border-radius: 1rem;
+  margin-bottom: 2rem;
+}
+
+@media (max-width: 700px) {
+  .flex-panel-display {
+    display: block;
+  }
+}
+
+.flex-panel {
+  flex   : 1 1 50%;
+  padding: 1rem;
+}
+
+.instructions-panel {
+  flex  : 1 1 35%;
+  margin: 0;
+}
+
+.flex-panel-display hr {
+  margin             : -0.5rem 25% 0.5rem 25%;
+  height             : 1px;
+  border-top-style   : none;
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+}
+
+/* Control for elements to only appear on big/small screens */
+.big-screen-only {
+  display: block;
+}
+
+.small-screen-only {
+  display: none;
+}
+
+@media (max-width: 700px) {
+
+  .big-screen-only {
+    display: none;
+  }
+
+  .small-screen-only {
+    display: block;
+  }
+}
+
 /* Grid for textarea label/elements. */
 .access-options {
   display              : grid;
@@ -133,6 +182,11 @@ select#dark-background option {
   color           : var(--psdi-light-text-color-body);
 }
 
+/* Classes to force specific styling for exceptional cases */
+.no-left-margin {
+  margin-left: 0 !important;
+}
+
 /* We use the service-mode variable to control whether elements with the "service-only" or "local-only" class are shown
 */
 [service-mode=True] .local-only {