Sizes fetched from DB instead of from thumbs

src/gridgallery.js

@@ -10,14 +10,14 @@ const useStyles = makeStyles(theme => ({
 }));
 
 const photo_to_gallery_photo = (photo) => {
-    if (!photo.state.thumbnailsize) {
-        throw new Error("Photo for gallery does not have a thumbnail size.");
+    if (!photo.state.fullsize) {
+        throw new Error("Photo for gallery does not have a size.");
     }
     return {
         src: photo.state.path,
         thumbnail: photo.state.thumbnailpath,
-        thumbnailWidth: photo.state.thumbnailsize[0],
-        thumbnailHeight: photo.state.thumbnailsize[1],
+        thumbnailWidth: photo.state.fullsize[0],
+        thumbnailHeight: photo.state.fullsize[1],
         caption: photo.state.name,
     }
 }

src/main.js

@@ -82,15 +82,7 @@ export function LoadedMainPage(props) {
         setPhotos(false);
         do_image_query(sql_image_query, database, photos_dir, thumbs_dir)
             .then(got_photos => {
-                // Make each photo fetch its thumbnail size before proceeding
-                var promises = [];
-                got_photos.forEach(elem => {
-                    promises.push(elem.fetch_thumb_size());
-                })
-                Promise.all(promises)
-                    .then(() => {
-                        setPhotos(got_photos);
-                    });
+                setPhotos(got_photos);
             });
     }
 

src/media.js

@@ -9,23 +9,7 @@ export class Photo extends Media {
     name: false,
     path: false,
     thumbnailpath: false,
-    thumbnailsize: false,
-  }
-
-  fetch_thumb_size() {
-    var self = this;
-    return new Promise(function (resolve, reject) {
-      if(self.state.thumbnailpath) {
-        var img = new Image();
-        img.onload = function() {
-          self.state.thumbnailsize = [ this.width, this.height ];
-          resolve();
-        }
-        img.src = self.state.thumbnailpath;
-      } else {
-        reject();
-      }
-    });
+    fullsize: false,
   }
 }
 
@@ -44,12 +28,18 @@ export class Tag extends Media {
   }
 }
 
-export function create_photo(maybe_id, maybe_name, maybe_path, maybe_thumbnail_path) {
+export function create_photo(
+  maybe_id,
+  maybe_name,
+  maybe_path,
+  maybe_thumbnail_path,
+  maybe_fullsize) {
   var p = new Photo();
   if (maybe_id) { p.state.id = maybe_id; }
   if (maybe_name) { p.state.name = maybe_name; }
   if (maybe_path) { p.state.path = maybe_path; }
   if (maybe_thumbnail_path) { p.state.thumbnailpath = maybe_thumbnail_path; }
+  if (maybe_fullsize) { p.state.fullsize = maybe_fullsize; }
   return p;
 }
 

src/queries.js

@@ -18,7 +18,7 @@ export function do_image_query(query, database, collection_path, collection_thum
                         ids.push(row["id"]); //uniquify
                         var imagepath = process.env.PUBLIC_URL + collection_path + "/" + row["relativePath"] + "/" + row["name"];
                         var thumbpath = process.env.PUBLIC_URL + collection_thumbs_path + "/" + row["uniqueHash"] + ".jpg";
-                        photos.push(create_photo(row["id"], row["name"], imagepath, thumbpath));
+                        photos.push(create_photo(row["id"], row["name"], imagepath, thumbpath, [row["width"], row["height"]]));
                     }
                 });
             }
@@ -223,7 +223,12 @@ export class UserQuery {
 
 // This query will return database entries with the fields "id", "uniqueHash", "relativePath" (of the album) and "name" for each matching image.
 export function image_query_with_where(maybe_where) {
-    return "SELECT Images.id, Images.name, Images.uniqueHash, Albums.relativePath FROM Images INNER JOIN Albums ON Images.album=Albums.id LEFT JOIN ImageTags ON Images.id=ImageTags.imageid LEFT JOIN Tags ON ImageTags.tagid=Tags.id " + (maybe_where ? maybe_where : "");
+    return "SELECT Images.id, Images.name, Images.uniqueHash, Albums.relativePath, "
+    + "ImageInformation.width, ImageInformation.height "
+    + "FROM Images INNER JOIN Albums ON Images.album=Albums.id "
+    + "LEFT JOIN ImageTags ON Images.id=ImageTags.imageid "
+    + "LEFT JOIN ImageInformation ON Images.id=ImageInformation.imageid "
+    + "LEFT JOIN Tags ON ImageTags.tagid=Tags.id " + (maybe_where ? maybe_where : "");
     // TODO: the following for some reason breaks the query:
     //+ " GROUP BY Images.id;";
 }