Images string query working.

src/index.js

@@ -3,9 +3,10 @@ import ReactDOM from 'react-dom';
 import { Fetch } from './fetch.js';
 import { ProvideDB, DBQueryConsole, DBQueryBar, DBTypeEnum, DBSourceEnum } from './database.js';
 import { PhotoView, PhotoThumbView, PhotoTableLine } from './media.js';
-import { do_image_query, image_query_with_where, user_query_from_search_string } from './queries.js';
+import { do_image_query, image_query_with_where, user_query_from_search_string, maybe_image_query } from './queries.js';
 
 import './index.css';
+import { thisExpression } from '@babel/types';
 
 const URLLoading = ({ url }) => <p>Loading: {url}</p>;
 const URLError = ({ error }) => <p>Failed to load URL resource: {error.message}</p>;
@@ -34,7 +35,7 @@ export class PhotoFromDB extends React.Component {
   }
 
   componentDidMount() {
-    do_image_query(image_query_with_where(""), this.props.database, "/test_photos", "/test_photos_thumbs").then(photos => {
+    do_image_query(this.props.sql_query, this.props.database, "/test_photos", "/test_photos_thumbs").then(photos => {
       this.setState({ done: true, photo: photos[0] });
     });
   }
@@ -42,6 +43,7 @@ export class PhotoFromDB extends React.Component {
   render() {
     return (
       <>
+        {!this.state.done && <p>>Querying photo from DB: {this.props.sql_query}</p> }
         {this.state.photo && <PhotoTableLine photo={this.state.photo} />}
       </>
     );
@@ -78,70 +80,93 @@ export class ImageWhereConsole extends React.Component {
   }
 }
 
-export class StringToQueryConsole extends React.Component {
+const PhotosTable = ({ photos }) => (
+  <>
+    {
+    photos.map((value, index) => {
+      return <PhotoTableLine photo={value} />
+    })
+    }
+  </>
+)
+
+export class TestDBStringQuery extends React.Component {
   state = {
     string: false,
     query: false,
+    sql_query: false,
+    photos: false
   }
 
   onQueryChangeHandler = str => { this.setState({ string: str }); }
   onQuerySubmitHandler = () => {
-    this.setState({ query: user_query_from_search_string(this.state.string) });
+    var q = user_query_from_search_string(this.state.string);
+    var sql_q = maybe_image_query(q);
+    this.setState({ query: q, sql_query: sql_q  });
+    do_image_query(sql_q, this.props.db, "/test_photos", "/test_photos_thumbs").then(photos => {
+      console.log(photos);
+      this.setState({ done: true, photos: photos });
+    });
   }
 
   render() {
+    
     return (
       <>
         <div>
           <DBQueryBar onChange={this.onQueryChangeHandler}/>
           <button onClick={this.onQuerySubmitHandler}>Submit</button>
+          { this.state.photos && <p>Found {this.state.photos.length} photos.</p> }
+          { this.state.photos && <PhotosTable photos={this.state.photos} /> }
         </div>
       </>
     );
   }
 }
 
-const TestDBFetch = ({ sqlite_file }) => (
+const TestDBFetch = ({ db }) => (
-  <ProvideDB db_file={sqlite_file} db_source_type={DBTypeEnum.SQLJS_SQLITE} db_target_type={DBTypeEnum.ALASQL_NATIVE}
-    db_source_name="sqlite_db" db_target_name="db" db_source={DBSourceEnum.ATTACHFILE}>
-    {({ loading, error, done, db }) => (
       <>
-        {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} />}
+        <DBQueryConsole database={db} />
         <h2>Example photo from DB</h2>
-        {done && <PhotoFromDB database={db} />}
+        <PhotoFromDB database={db} sql_query={image_query_with_where("")} />
         <h2>DB WHERE clause image search</h2>
-        {done && <ImageWhereConsole database={db} />}
+        <ImageWhereConsole database={db} />
       </>
-    )}
-  </ProvideDB>
 )
 
-const TestDBPlayground = ({ db_name }) => (
+const TestDBPlayground = ({ db }) => (
-  <ProvideDB db_source_type={DBTypeEnum.ALASQL_INDEXEDDB} db_target_type={DBTypeEnum.ALASQL_INDEXEDDB}
-    db_source_name={db_name} db_target_name={db_name} db_source={DBSourceEnum.CREATE}>
-    {({ loading, error, done, db }) => (
       <>
-        {error && <DBError error={error} />}
+        <DBQueryConsole database={db} />
-        {done && <DBQueryConsole database={db} />}
       </>
-    )}
-  </ProvideDB>
 )
 
 ReactDOM.render(
   <>
     <h1>Test file fetching:</h1>
     <TestFetch url={process.env.PUBLIC_URL + "/stuff"} />
-    <h1>IndexedDB playground:</h1>
+    <ProvideDB db_file={process.env.PUBLIC_URL + "/test_photos_db/digikam4.db"} db_source_type={DBTypeEnum.SQLJS_SQLITE} db_target_type={DBTypeEnum.ALASQL_NATIVE}
-    <TestDBPlayground db_name="playground_db" />
+    db_source_name="sqlite_db" db_target_name="db" db_source={DBSourceEnum.ATTACHFILE}>
-    <h1>Test DB fetching:</h1>
+      {({ loading, error, done, db }) => (
-    <TestDBFetch sqlite_file={process.env.PUBLIC_URL + "/test_photos_db/digikam4.db"} />
+        
-    <h1>Test query parsing:</h1>
+        <>
-    <StringToQueryConsole/>
+        {loading && <DBLoading sqlite_file={process.env.PUBLIC_URL + "/test_photos_db/digikam4.db"} />}
+        {error && <DBError error={error} />}
+        {done && (
+          <>
+          <DBFinished sqlite_file={process.env.PUBLIC_URL + "/test_photos_db/digikam4.db"} db={db} />
+          <h1>IndexedDB playground:</h1>
+          <TestDBPlayground db={db} />
+          <h1>Test DB fetching:</h1>
+          <TestDBFetch db={db} />
+          <h1>Test queries:</h1>
+          <TestDBStringQuery db={db} />
+          </>
+        )
+        }
+        </>
+      )}
+    </ProvideDB>
   </>,
   document.getElementById('root')
 );

src/queries.js

@@ -9,9 +9,9 @@ export function do_image_query(query, database, collection_path, collection_thum
             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 imagepath = process.env.PUBLIC_URL + collection_path + "/" + row["relativePath"] + "/" + row["name"];
-                    var thumbpath = process.env.PUBLIC_URL + collection_thumbs_path + "/" + res[0]["uniqueHash"] + ".jpg";
+                    var thumbpath = process.env.PUBLIC_URL + collection_thumbs_path + "/" + row["uniqueHash"] + ".jpg";
-                    photos.push(create_photo(res[0]["id"], res[0]["name"], imagepath, thumbpath));
+                    photos.push(create_photo(row["id"], row["name"], imagepath, thumbpath));
                 });
             }
             resolve(photos);
@@ -54,7 +54,7 @@ export class ConstFilter extends ResultFilter {
 
 function match_column_name(result_type, match_against) {
     if(match_against == MatchAgainstEnum.MATCH_IMAGE_NAME) {
-        return "Image.name";
+        return "Images.name";
     }
     if(match_against == MatchAgainstEnum.MATCH_ALBUM_NAME) {
         return "Album.name";
@@ -103,7 +103,7 @@ export class MatchingFilter extends ResultFilter {
             throw new Error('Unsupported match type: ' + this.match_type);
         }
     
-        return "(" + (this.negate ? "NOT " : "") + match_against_str + "\"" + match_type_str + "\"" + this.match_from + ")";
+        return "(" + (this.negate ? "NOT " : "")  + match_against_str + match_type_str + this.match_from + ")";
     }
 }
 
@@ -153,7 +153,7 @@ export function maybe_image_query(user_query) {
 
 function filter_from_text_segment(result_type, segment) {
     return new MatchingFilter(result_type, MatchAgainstEnum.MATCH_RESULT_NAME,
-        segment['text'], MatchTypeEnum.MATCH_EQUALS, segment['negated']);
+        "\"" + segment['text'] + "\"", MatchTypeEnum.MATCH_EQUALS, segment['negated']);
 }
 
 export function user_query_from_search_string(search_string) {
@@ -176,4 +176,6 @@ export function user_query_from_search_string(search_string) {
     console.log(search_string);
     console.log(r);
     console.log(maybe_image_query(r));
+
+    return r;
 }