Optimized all the pictures

.gitignore

@@ -15,4 +15,5 @@ error.log
 /python/update.sh
 !/html/composer.json
 /html/composer.lock
-/html/vendor/
+/html/vendor/
+.DS_STORE

html/include/all.php

@@ -11,10 +11,10 @@ include 'functions.php';
 <link rel="manifest" href="/favicon/site.webmanifest">
 <link rel="stylesheet" type="text/css" href="/css/website.css" />
 <script type="text/javascript" src="/javascript/jquery.js"></script>
-<script type="text/javascript" src="/javascript/jquery-ui.min.js"></script>
-<link rel="stylesheet" href="/css/jquery-ui.min.css">
-<script type="text/javascript" src="/javascript/functions.js"></script>
-<script type="text/javascript" src="/javascript/cookie.js"></script>
+<script defer="true" type="text/javascript" src="/javascript/jquery-ui.min.js"></script>
+<link defer="true" rel="stylesheet" href="/css/jquery-ui.min.css">
+<script defer="true" type="text/javascript" src="/javascript/functions.js"></script>
+<script defer="true" type="text/javascript" src="/javascript/cookie.js"></script>
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
@@ -37,12 +37,13 @@ if (isset($DESCRIPTION)) {
 /**
  * Creates an image that loads a simple image before loading the entire image.
  * @param string $img used as the name of the image
+ * @param string $alt used as the alternate text
  */
 function createImage($img, $alt, $style="width:100%;") {
   global $MOBILE;
-  echo "<img id='first$img' onload='imageLoad(`$img`, `first`)' src='/img/$img.first.jpg' alt='$alt' style='$style'>";
-  echo "<img id='min$img' src='' alt='$alt' style='$style display: none;'>";
-  if (! $MOBILE) {
-    echo "<img id='$img' src='' alt='$alt' style='$style display: none;'>";
+  if ($MOBILE && !in_array($img, ["notFound"])) {
+    echo "<img src='/img/$img.mobile.jpg' alt='$alt' style='$style'>";
+  } else {
+    echo "<img src='/img/$img.jpg' alt='$alt' style='$style'>";
   }
 }

html/javascript/functions.js

@@ -39,22 +39,6 @@ function lastElement(array) { // returns the last element in an array
     return array[array.length - 1];
 }
 
-function imageLoad(name, quality) { // used for better loading of image
-    if (quality == "first") {
-        $(`#min${name}`).attr("src", `/img/${name}.min.jpg`);
-        $(`#min${name}`).attr("onload", `imageLoad('${name}', 'medium')`);
-    }else if (quality == "medium") {
-        $(`#first${name}`).hide();
-        $(`#min${name}`).show();
-        if (! mobile) {
-            $(`#${name}`).attr("src", `/img/${name}.jpg`);
-            $(`#${name}`).attr("onload", `imageLoad('${name}', false)`);
-        }
-    } else {
-        $(`#min${name}`).hide();
-        $(`#${name}`).show()
-    }
-}
 
 function beautify(val) // Will make a big number easier to read
 {