A few version changes.

New database function to get all tages.
New database function to get like tags.
Added those changes to electron IPC.
Changed list to support all image formats possible.
Added debounce lib for events.
Working on new timechain tags view.

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "time-chain",
-  "version": "1.1.0",
+  "version": "1.1.3",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "time-chain",
-      "version": "1.1.0",
+      "version": "1.1.3",
       "license": "UNLICENSED",
       "dependencies": {
         "@sentry/browser": "^6.17.6",
@@ -15,6 +15,7 @@
         "better-sqlite3": "^7.5.0",
         "conf": "^10.1.1",
         "dayjs": "^1.10.7",
+        "debounce": "^1.2.1",
         "electron-config": "^2.0.0",
         "empty-lite": "^1.2.0",
         "es6-interface": "^3.2.1",
@@ -4509,6 +4510,11 @@
       "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz",
       "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig=="
     },
+    "node_modules/debounce": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz",
+      "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
+    },
     "node_modules/debounce-fn": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/debounce-fn/-/debounce-fn-4.0.0.tgz",
@@ -16803,6 +16809,11 @@
       "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.7.tgz",
       "integrity": "sha512-P6twpd70BcPK34K26uJ1KT3wlhpuOAPoMwJzpsIWUxHZ7wpmbdZL/hQqBDfz7hGurYSa5PhzdhDHtt319hL3ig=="
     },
+    "debounce": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/debounce/-/debounce-1.2.1.tgz",
+      "integrity": "sha512-XRRe6Glud4rd/ZGQfiV1ruXSfbvfJedlV9Y6zOlP+2K04vBYiJEte6stfFkCP03aMnY5tsipamumUjL14fofug=="
+    },
     "debounce-fn": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/debounce-fn/-/debounce-fn-4.0.0.tgz",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "time-chain",
-  "version": "1.1.2",
+  "version": "1.1.4",
   "description": "timechain",
   "author": "Jaosn Tudisco",
   "license": "UNLICENSED",
@@ -44,6 +44,7 @@
     "better-sqlite3": "^7.5.0",
     "conf": "^10.1.1",
     "dayjs": "^1.10.7",
+    "debounce": "^1.2.1",
     "electron-config": "^2.0.0",
     "empty-lite": "^1.2.0",
     "es6-interface": "^3.2.1",

src/data/sqlite-client.js

@@ -32,6 +32,14 @@ class TimeChainDataSqliteTag //extends Interface(InterfaceTag)
         return this.send('has',{tag:tag})
     }
 
+    all(){
+        return this.send('all',{})
+    }
+
+    like(str){
+        return this.send('like',{str:str})
+    }
+
 }
 
 class TimeChainDataSqliteTagLink //extends Interface(InterfaceTagLink)

src/data/sqlite-electron-ipc.js

@@ -153,6 +153,12 @@ ipcMain.handle('timechain-tag', async (event, arg) => {
     case 'has':
       res = await DbTag.delete(arg.tag)
       break
+    case 'all':
+      res = await DbTag.all()
+      break;
+    case 'like':
+      res = await DbTag.like(arg.str)
+      break;  
     default:
       res = new Error('Command Unknown')
   }

src/data/sqlite.js

@@ -54,6 +54,20 @@ class TimeChainDataSqliteTag extends Interface(InterfaceTag) {
     return this._table_get
   }
 
+  get table_get_like () {
+    if (!this._table_get) {
+      this._table_get = db.prepare('SELECT * FROM tags WHERE tag LIKE ?')
+    }
+    return this._table_get
+  }
+
+  get table_get_all() {
+    if (!this._table_get_all) {
+      this._table_get_all = db.prepare('SELECT * FROM tags')
+    }
+    return this._table_get_all
+  }
+
   get table_count () {
     if (!this._table_count) {
       this._table_count = db.prepare('SELECT count(tag) as cnt FROM tags WHERE tag = ?')
@@ -75,6 +89,20 @@ class TimeChainDataSqliteTag extends Interface(InterfaceTag) {
     })
   }
 
+  all() {
+    return new Promise(resolve => {
+      const res = this.table_get_all.all();
+      return resolve(res);
+    })
+  }
+
+  like(str){
+    return new Promise(resolve => {
+      const res = this.table_get_like.all(str + '%');
+      return resolve(res);
+    })
+  }
+
   delete (tag) {
     return new Promise(resolve => {
       const dt = Math.floor(Date.now())

src/ui/timechain-list.riot

@@ -106,7 +106,7 @@
 			processImages(){
 				var URLObj = window.URL || window.webkitURL;
 				this.state.records.forEach(r=>{
-					if(r.mime == "image/jpeg" || r.mime == "image/png"){
+					if(typeof r.mime == 'string' && r.mime.startsWith("image/")){
 						r.imageURL = r.content;
 					}
 				});

src/ui/timechain-tag.riot

@@ -6,6 +6,11 @@
 	<script>
 		import Tagify from '@yaireo/tagify'
 		const pubsub = require('pubsub-js');
+		const debounce = require('debounce');
+
+		const {
+			TimeChainDataSqliteTag
+		} = require('../data/sqlite-client');
 
 		export default {
 			state:{
@@ -14,7 +19,7 @@
 			},
 			onBeforeMount(props){
 				this.state.id = "tagging"+this.makeid(5);
-
+				this.tagdb = new TimeChainDataSqliteTag();
 			},
 			onMounted(props, state){
 				const inputElm = this.$('#'+this.state.id);
@@ -37,9 +42,11 @@
 				inputElm.addEventListener('change', this.onChange.bind(this));
 				this.event_clean = pubsub.subscribe('tag.clean', this.onClean.bind(this));
 
+				this.tagify.on('input', debounce( this.onInputEvent.bind(this), 400) )
+
 				if(props.tags){
 					this.setFocus();
-					this.tagify.on('keydown', this.onKeyDown.bind(this));
+					this.tagify.on('keydown',  this.onKeyDown.bind(this) );
 				}
 
 			},
@@ -103,6 +110,23 @@
 					}
 
 				}
+			},
+			onInputEvent(e){
+				const val = e.detail.value;
+				this.tagify.whitelist = null;
+
+				console.log('%c Value '+val,'background-color:black;');
+
+				this.tagify.loading(true); //dropdown.hide();
+
+				this.tagdb.like(val).then(res=>{
+					const cleaned = res.map(r=>r.tag);
+					console.log(cleaned);
+					this.tagify.whitelist = cleaned;
+					this.tagify.loading(false).dropdown.show(val);
+				})
+
+
 			}
 		}
 	</script>

src/ui/timechain-tags.riot

@@ -0,0 +1,3 @@
+<timechain-tags>
+
+</timechain-tags>