From 10c5fa7cda1264677693e8e88968f3192c21c476 Mon Sep 17 00:00:00 2001
From: Sander Vocke <sander.vocke@screenpointmed.com>
Date: Thu, 16 Jan 2020 16:19:16 +0100
Subject: [PATCH] Add a photo table line with simple CSS

---
 public/resources/no_image_available.png | Bin 0 -> 9655 bytes
 public/resources/no_thumb_available.png | Bin 0 -> 9655 bytes
 src/PhotoTableLine.css                  |  32 ++++++++++++++++++++++
 src/index.js                            |  17 ++++++------
 src/media.js                            |  35 +++++++++++++++++++++++-
 src/queries.js                          |  25 +++++++++++++++++
 6 files changed, 99 insertions(+), 10 deletions(-)
 create mode 100644 public/resources/no_image_available.png
 create mode 100644 public/resources/no_thumb_available.png
 create mode 100644 src/PhotoTableLine.css
 create mode 100644 src/queries.js

diff --git a/public/resources/no_image_available.png b/public/resources/no_image_available.png
new file mode 100644
index 0000000000000000000000000000000000000000..55d198036ab61ab744018b697e658914637dbadd
GIT binary patch
literal 9655
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

literal 0
HcmV?d00001

diff --git a/public/resources/no_thumb_available.png b/public/resources/no_thumb_available.png
new file mode 100644
index 0000000000000000000000000000000000000000..55d198036ab61ab744018b697e658914637dbadd
GIT binary patch
literal 9655
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

literal 0
HcmV?d00001

diff --git a/src/PhotoTableLine.css b/src/PhotoTableLine.css
new file mode 100644
index 0000000..5a5702e
--- /dev/null
+++ b/src/PhotoTableLine.css
@@ -0,0 +1,32 @@
+.PhotoTableLine_body {
+    border: 2px solid black;
+    background-color: lightgrey;
+    height:80px;
+}
+
+.PhotoTableLine_thumb {
+    height: inherit;
+}
+
+.PhotoTableLine_field {
+    border: 2px solid black;
+    float: left;
+    height: inherit;
+}
+
+.PhotoTableLine_textsubfield {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: inherit;
+}
+
+.PhotoTableLine_textsubsubfield {
+    margin: 8px;
+    border: 0 solid black;
+}
+
+a {
+    height: inherit;
+    display: block;
+}
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 04083eb..e13a848 100644
--- a/src/index.js
+++ b/src/index.js
@@ -2,7 +2,8 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { Fetch } from './fetch.js';
 import { ProvideDB, DBQueryConsole, DBTypeEnum, DBSourceEnum } from './database.js';
-import { Photo, PhotoView } from './media.js';
+import { PhotoView, PhotoThumbView, PhotoTableLine } from './media.js';
+import { find_photos } from './queries.js';
 
 import './index.css';
 
@@ -33,19 +34,15 @@ export class PhotoFromDB extends React.Component {
   }
 
   componentDidMount() {
-    this.props.database.queries_async(["SELECT Images.uniqueHash FROM Images;"])
-      .then(res => {
-        var photo = new Photo;
-        var imagepath = process.env.PUBLIC_URL + "/test_photos_thumbs/" + res[0]["uniqueHash"] + ".jpg";
-        photo.state.path = imagepath;
-        this.setState({ done: true, photo: photo });
-      });
+    find_photos("", this.props.database, "/test_photos", "/test_photos_thumbs").then(photos => {
+      this.setState({ done: true, photo: photos[0] });
+    });
   }
 
   render() {
     return (
       <>
-        {this.state.done && <PhotoView photo={this.state.photo} />}
+        {this.state.photo && <PhotoTableLine photo={this.state.photo} />}
       </>
     );
   }
@@ -59,7 +56,9 @@ const TestDBFetch = ({ sqlite_file }) => (
         {loading && <DBLoading sqlite_file={sqlite_file} />}
         {error && <DBError error={error} />}
         {done && <DBFinished sqlite_file={sqlite_file} db={db} />}
+        <h2>DB Query Console</h2>
         {done && <DBQueryConsole database={db} />}
+        <h2>Example photo from DB</h2>
         {done && <PhotoFromDB database={db} />}
       </>
     )}
diff --git a/src/media.js b/src/media.js
index 90406d5..8415639 100644
--- a/src/media.js
+++ b/src/media.js
@@ -1,12 +1,45 @@
 import React from 'react';
+import './PhotoTableLine.css';
 
 export class Media {}
 
 export class Photo extends Media {
   state = {
+    id: false,
+    name: false,
     path: false,
     thumbnailpath: false
   }
 }
 
-export const PhotoView = ({ photo }) => <img src={ photo.state.path } alt=""/>;
+export function create_photo(maybe_id, maybe_name, maybe_path, maybe_thumbnail_path) {
+  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; }
+  return p;
+}
+
+export const PhotoView = ({ photo }) => <img src={ photo.state.path ? photo.state.path : "/resources/no_image_available.png"} alt=""/>;
+
+export class PhotoThumbView extends React.Component {
+  render() {
+    return (
+           <>
+           <a href={ this.props.href }>
+           <img class={ this.props.class } src={ this.props.photo.state.thumbnailpath ? this.props.photo.state.thumbnailpath : "/resources/no_thumb_available.png"} alt=""/>
+           </a>
+           </>
+    );
+  }
+}
+
+export const PhotoTableLine = ({ photo }) => (
+  <>
+  <div class="PhotoTableLine_body">
+    <div class="PhotoTableLine_field"><PhotoThumbView photo={photo} class="PhotoTableLine_thumb" href={photo.state.path}/></div>
+    <div class="PhotoTableLine_field"><div class="PhotoTableLine_textsubfield"><div class="PhotoTableLine_textsubsubfield"><p>{photo.state.name ? photo.state.name : "Unknown"}</p></div></div></div>
+  </div>
+  </>
+)
\ No newline at end of file
diff --git a/src/queries.js b/src/queries.js
new file mode 100644
index 0000000..35bb1e4
--- /dev/null
+++ b/src/queries.js
@@ -0,0 +1,25 @@
+
+import { Photo, PhotoView, PhotoThumbView, create_photo } from './media.js';
+
+// This query will return database entries with the fields "id", "uniqueHash", "relativePath" (of the album) and "name" for each matching image.
+export function images_query(maybe_where) {
+    return "SELECT Images.id, Images.name, Images.uniqueHash, Albums.relativePath FROM Images INNER JOIN Albums ON Images.album=Albums.id " + (maybe_where ? maybe_where : "") + ";";
+}
+
+export function find_photos(maybe_where, database, collection_path, collection_thumbs_path) {
+    return new Promise(function (resolve, reject) {
+        var queries = [];
+        queries.push(images_query(maybe_where));
+        database.queries_async(queries).then(res => {
+            var photos = [];
+            if (res && Array.isArray(res)) {
+                res.forEach(row => {
+                    var imagepath = process.env.PUBLIC_URL + collection_path + "/" + res[0]["relativePath"] + "/" + res[0]["name"];
+                    var thumbpath = process.env.PUBLIC_URL + collection_thumbs_path + "/" + res[0]["uniqueHash"] + ".jpg";
+                    photos.push(create_photo(res[0]["id"], res[0]["name"], imagepath, thumbpath));
+                });
+            }
+            resolve(photos);
+        });
+    });
+}
\ No newline at end of file