Refactor to utilize Electron.

.gitattributes

@@ -1 +1 @@
-asset/* linguist-vendored
+sources/asset/fontawesome/* linguist-vendored

.gitignore

@@ -1,3 +1,8 @@
-/content/media/*.pdf
-/content/media/*.zip
-/content/media/*.html
+node_modules/
+builds/
+.DS_Store
+*/.DS_Store
+
+sources/content/media/*.pdf
+sources/content/media/*.zip
+sources/content/media/*.html

README.md

@@ -1,15 +1,34 @@
 # Memex
 
-Memex is a simple open-source bookmarks and notes application to help with storage and overview.
+Memex is a simple open-source bookmarks and notes application to help with storage and overview
 
-[Live version here](https://kormyen.github.io/memex/).
+[Live web version here](https://kormyen.github.io/memex/)
+
+<img src='https://raw.githubusercontent.com/kormyen/memex/master/PREVIEW.jpg' width="600"/>
+
+Memex has two modes:
+
+- standalone application for bookmark and note cataloging
+- read-only static 'sever-less' website for sharing with sorting/filtering
+
+Memex supports:
+
+- links
+- images
+- notes
+- quotes
+- terms
+- tagging
+- type filting
 
 ## Data
 
-- [content/database.ndtl](content/database.ndtl)
+Data is stored in a flat-file, human-readable database format called [Indental](https://wiki.xxiivv.com/#indental) by Devine Lu Linvega
+
+- [sources/content/database.ndtl](sources/content/database.ndtl)
 
 ## Dependencies
 
-- Flat-file database: [Indental](https://wiki.xxiivv.com/#indental).
-- Templating: [Runic](https://wiki.xxiivv.com/#runic).
+- Database parser: [Indental](https://wiki.xxiivv.com/#indental).
+- Template parser: [Runic](https://wiki.xxiivv.com/#runic).
 - Grid layout: [Masonry](https://masonry.desandro.com/).

main.js

@@ -0,0 +1,96 @@
+const {app, BrowserWindow, webFrame, Menu} = require('electron')
+const path = require('path')
+const url = require('url')
+const shell = require('electron').shell;
+
+let is_shown = true;
+
+this.handleRedirect = (e, url) => 
+{
+  if(url != app.win.webContents.getURL())
+  {
+    e.preventDefault()
+    require('electron').shell.openExternal(url)
+  }
+}
+
+app.inspect = function()
+{
+  app.win.toggleDevTools();
+}
+
+app.toggle_fullscreen = function()
+{
+  app.win.setFullScreen(app.win.isFullScreen() ? false : true);
+}
+
+app.toggle_visible = function()
+{
+  if(process.platform == "win32"){
+    if(!app.win.isMinimized()){ app.win.minimize(); } else{ app.win.restore(); }
+  } else {
+    if(is_shown){ app.win.hide(); } else{ app.win.show(); }
+  }
+}
+
+app.inject_menu = function(m)
+{
+  Menu.setApplicationMenu(Menu.buildFromTemplate(m));
+}
+
+app.path = function()
+{
+  return __dirname
+}
+
+app.win = null;
+
+app.on('ready', () => 
+{
+  app.win = new BrowserWindow({
+    webPreferences: {
+      nodeIntegration: false
+    }, width: 950, height: 950, backgroundColor:"#000", minWidth: 587, minHeight: 540, frame:true, autoHideMenuBar: true, icon: __dirname + '/icon.ico'})
+
+  app.win.loadURL(`file://${__dirname}/sources/index.html`)
+  // app.win.toggleDevTools();
+  
+  app.win.on('closed', () => {
+    win = null
+    app.quit()
+  })
+
+  app.win.on('hide',function() {
+    is_shown = false;
+  })
+
+  app.win.on('show',function() {
+    is_shown = true;
+  })
+
+  // app.win.webContents.on('new-window', function(event, url){
+  //   event.preventDefault();
+  //   // open(url);
+  //   console.log('CALLED NEW WIN');
+  //   child_process.execSync('start ' + url)
+  // })
+
+  app.win.webContents.on('will-navigate', this.handleRedirect)
+  app.win.webContents.on('new-window', this.handleRedirect)
+})
+
+
+
+
+
+
+app.on('window-all-closed', () => 
+{
+  app.quit()
+})
+
+app.on('activate', () => {
+  if (app.win === null) {
+    createWindow()
+  }
+})

package.json

@@ -0,0 +1,20 @@
+{
+  "name": "Memex",
+  "productName": "Memex",
+  "version": "0.1.0",
+  "main": "main.js",
+  "scripts": {
+    "start": "electron .",
+    "clean": "rm -r builds/Memex-darwin-x64/ ; rm -r builds/Memex-linux-x64/ ; rm -r builds/Memex-win32-x64/ ; rm -r builds/Memex-linux-armv7l ; echo 'cleaned build location'",
+    "build_osx": "electron-packager . Memex --platform=darwin --arch=x64 --out builds/ --overwrite --icon=icon.icns && echo 'Built for OSX'",
+    "build_linux": "electron-packager . Memex --platform=linux  --arch=x64 --out builds/ --overwrite --icon=icon.ico && echo 'Built for LINUX'",
+    "build_win": "electron-packager . Memex --platform=win32  --arch=x64 --out builds/ --overwrite --icon=icon.ico && echo 'Built for WIN'",
+    "build_pi": "electron-packager . Memex --platform=linux  --arch=armv7l --out builds/ --overwrite --icon=icon.ico ; echo 'Built for PI'"
+  },
+  "devDependencies": {
+    "electron": "^1.8.1"
+  },
+  "dependencies": {
+    "electron-packager": "^12.0.1"
+  }
+}

settingsUser.js

@@ -1,6 +0,0 @@
-// READ ME: In order to use these custom settings copy this file into the /content/ folder!
-
-function SettingsUser()
-{
-  this.database = "content/other.ndtl";
-}

sources/asset/style.css

@@ -254,7 +254,7 @@ body {
   opacity: 0;
 }
 .grid-item-image:hover .image-overlay { 
-  opacity: 0.1;
+  opacity: 0.2;
 }
 
 /* LINK */
@@ -328,7 +328,6 @@ body {
 }
 .grid-item-image:hover .grid-item-upper-content a .type i  {
   display: initial;
-  text-shadow: 0 0 3em #000;
   color: var(--color-content-image-i);
 }
 .grid-item-image:hover .grid-item-upper-content a:hover .type i {
@@ -358,13 +357,13 @@ body {
 .grid-item:hover .prog {
 	color: var(--color-content-item-e);
 }
-.grid-item-image .link, 
-.grid-item-image .note, 
-.grid-item-image .quote, 
-.grid-item-image .term, 
-.grid-item-image .tags,
-.grid-item-image .prog {
-  color: #CE0000; 
+.grid-item-image .grid-item-lower-content .link, 
+.grid-item-image .grid-item-lower-content .note, 
+.grid-item-image .grid-item-lower-content .quote, 
+.grid-item-image .grid-item-lower-content .term, 
+.grid-item-image .grid-item-lower-content .tags,
+.grid-item-image .grid-item-lower-content .prog {
+  color: var(--color-content-image-t); 
 }
 
 .grid-item-image .grid-item-lower-content {

sources/content/database.ndtl

@@ -1631,14 +1631,14 @@ SLIDE
   TYPE : image
   DONE : true
   WIDE : true
-  TAGS : log, example, hamish
+  TAGS : log, hamish
 
 VAN
   DATE : 12017-01-20
   FILE : 12017-01-20_van.jpg
   TYPE : image
   PROJ : Van
-  TAGS : diy, log, example
+  TAGS : log
   DONE : true
 
 FPV MOD
@@ -1646,17 +1646,19 @@ FPV MOD
   FILE : 12018-03-20_fpvMod.jpg
   TYPE : image
   PROJ : Drone
-  TAGS : diy, log, example
+  TAGS : log, kor
   DONE : true
+  NOTE : Diy modified large battery and record module onto drone fpv headset
 
 SWITCH PANEL
   DATE : 12018-03-20
   FILE : 12018-07-10_switchPanel.jpg
   TYPE : image
   PROJ : Van
-  TAGS : diy, arduino, log, example, hamish
+  TAGS : arduino, log, hamish, kor
   DONE : true
   LINK : https://github.com/kormyen/VNS
+  NOTE : Self built light/fan/mode switch panel for RV IoT system.
 
 APPLIED MINIMALISM
   PERS : Symbol
@@ -1690,26 +1692,26 @@ WHITE
   DATE : 12018-07-19
   FILE : 12018-07-19_white.jpg
   TYPE : image
-  TAGS : b+w, example, hamish
+  TAGS : hamish, test
 
 BLACK
   DATE : 12018-07-19
   FILE : 12018-07-19_black.jpg
   TYPE : image
-  TAGS : b+w, example, hamish
+  TAGS : hamish, test
 
 TALL CUT SHORT
   DATE : 12018-07-19
   FILE : 12018-07-19_tall.jpg
   TYPE : image
-  TAGS : b+w, example, hamish
+  TAGS : hamish, test
 
 RANGITOTO
   DATE : 12018-07-19
   FILE : 12018-07-19_wide.jpg
   TYPE : image
   WIDE : true
-  TAGS : log, wide, example
+  TAGS : log
 
 MQTT
   PERS : autophagy
@@ -2003,4 +2005,32 @@ VR LEARNINGS
 RADICAL MARKETS
   LINK : http://radicalmarkets.com/chapters/
   TYPE : book
+
+ARDUSAMBER TIME
+  TYPE : image
+  TAGS : log, kor, arduino
+  FILE : 12018-05-18_ardusamberTimeAndDate.jpg
+  LINK : https://github.com/kormyen/ardusamber
+  NOTE : Arduino experiements with Devine Lu Linvega's time format Desamber.
+
+ARDUSAMBER
+  TYPE : image
+  TAGS : log, kor, arduino
+  FILE : 12018-06-04_ardusamber.jpg
+  LINK : https://github.com/kormyen/ardusamber
+  NOTE : Arduino experiements with Devine Lu Linvega's time format Desamber.
+
+DASTIME
+  TYPE : image
+  TAGS : log, kor, arduino
+  FILE : 12018-07-04_dastime.jpg
+  NOTE : Self designed/built clock. Shows year, month, day and lunation visually from an overview perspective of Earth.
+  LINK : https://github.com/kormyen/dastime
+
+VAN NERVOUS SYSTEM
+  TYPE : image
+  TAGS : log, kor, arduino
+  FILE : 12018-07-05_vns.jpg
+  NOTE : Power distribution unit of self built RV IoT system.
+  LINK : https://github.com/kormyen/VNS
 `

sources/index.html

@@ -6,14 +6,11 @@
   <link rel="stylesheet" href="asset/fontawesome/css/all.css">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-  <script src="asset/imagesloaded.pkgd.min.js"></script>
+  <!-- <script src="asset/imagesloaded.pkgd.min.js"></script> -->
   <script src="asset/masonry.pkgd.min.js"></script>
   <script src="logic/runic.js"></script>
   <script src="logic/indental.js"></script>
 
-  <script src="content/settingsUser.js"></script>
-  <script src="logic/settings.js"></script>
-
   <script src="content/database.ndtl"></script>
   <script src="logic/datawrap.js"></script>
   <script src="logic/viewmasonry.js"></script>
@@ -28,17 +25,6 @@
   </div>
 
   <script>
-    if (typeof SettingsUser !== 'undefined' )
-    {
-      var settings = new SettingsUser();
-      console.log('USER settings!');
-    }
-    else
-    {
-      var settings = new SettingsDefault();
-      console.log('DEFAULT settings!');
-    }
-
     var main = new Main();
     main.install();
     main.start();

sources/logic/viewmasonry.js

@@ -32,10 +32,10 @@ function ViewMasonry()
 
       ///////////////////////////
       // Fix squashed image divs
-      var imgLoad = imagesLoaded('.grid');
-      imgLoad.on( 'always', function (instance) { parent.msnry.layout(); } );
-      // Above imgLoad on always msnry.layout() should work but occassionally doesn't in Chrome and NEVER does in Firefox.
-      window.onload = function () { parent.msnry.layout(); }
+      // var imgLoad = imagesLoaded('.grid');
+      // imgLoad.on( 'always', function (instance) { parent.msnry.layout(); } );
+      // // Above imgLoad on always msnry.layout() should work but occassionally doesn't in Chrome and NEVER does in Firefox.
+      // window.onload = function () { parent.msnry.layout(); }
       // msnry.layout() called by window onload fixes things but not ideal. 
       ///////////////////////////
     }