*

desktop/sources/scripts/lib/acels.js

@@ -1,7 +1,9 @@
 'use strict'
 
-function Acels () {
+function Acels (client) {
   this.all = {}
+  this.roles = {}
+  this.pipe = null
 
   this.install = (host = window) => {
     host.addEventListener('keydown', this.onKeyDown, false)
@@ -13,6 +15,10 @@ function Acels () {
     this.all[accelerator] = { cat, name, downfn, upfn, accelerator }
   }
 
+  this.add = (cat, role) => {
+    this.all[':' + role] = { cat, name: role, role }
+  }
+
   this.get = (accelerator) => {
     return this.all[accelerator]
   }
@@ -27,29 +33,36 @@ function Acels () {
   }
 
   this.convert = (event) => {
-    const accelerator = event.key.substr(0, 1).toUpperCase() + event.key.substr(1)
+    const accelerator = event.key === ' ' ? 'Space' : event.key.substr(0, 1).toUpperCase() + event.key.substr(1)
     if ((event.ctrlKey || event.metaKey) && event.shiftKey) {
       return `CmdOrCtrl+Shift+${accelerator}`
     }
     if (event.shiftKey) {
       return `Shift+${accelerator}`
     }
+    if (event.altKey) {
+      return `Alt+${accelerator}`
+    }
     if (event.ctrlKey || event.metaKey) {
       return `CmdOrCtrl+${accelerator}`
     }
     return accelerator
   }
 
+  this.pipe = (obj) => {
+    this.pipe = obj
+  }
+
   this.onKeyDown = (e) => {
     const target = this.get(this.convert(e))
-    if (!target || !target.downfn) { return }
+    if (!target || !target.downfn) { return this.pipe ? this.pipe.onKeyDown(e) : null }
     target.downfn()
     e.preventDefault()
   }
 
   this.onKeyUp = (e) => {
     const target = this.get(this.convert(e))
-    if (!target || !target.upfn) { return }
+    if (!target || !target.upfn) { return this.pipe ? this.pipe.onKeyUp(e) : null }
     target.upfn()
     e.preventDefault()
   }
@@ -60,7 +73,7 @@ function Acels () {
     for (const cat in cats) {
       text += `\n### ${cat}\n\n`
       for (const item of cats[cat]) {
-        text += `- \`${item.accelerator}\`: ${item.info}\n`
+        text += item.accelerator ? `- \`${item.accelerator}\`: ${item.info}\n` : ''
       }
     }
     return text.trim()
@@ -71,7 +84,7 @@ function Acels () {
     let text = ''
     for (const cat in cats) {
       for (const item of cats[cat]) {
-        text += `${cat}: ${item.name} | ${item.accelerator}\n`
+        text += item.accelerator ? `${cat}: ${item.name} | ${item.accelerator}\n` : ''
       }
     }
     return text.trim()
@@ -87,12 +100,19 @@ function Acels () {
       label: name,
       submenu: [
         { label: 'About', click: () => { require('electron').shell.openExternal('https://github.com/hundredrabbits/' + name) } },
-        { label: 'Download Themes', click: () => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Themes') } },
+        {
+          label: 'Theme',
+          submenu: [
+            { label: 'Download Themes', click: () => { require('electron').shell.openExternal('https://github.com/hundredrabbits/Themes') } },
+            { label: 'Open Theme', click: () => { client.theme.open() } },
+            { label: 'Reset Theme', click: () => { client.theme.reset() } }
+          ]
+        },
         { label: 'Fullscreen', accelerator: 'CmdOrCtrl+Enter', click: () => { app.toggleFullscreen() } },
         { label: 'Hide', accelerator: 'CmdOrCtrl+H', click: () => { app.toggleVisible() } },
         { label: 'Toggle Menubar', accelerator: 'Alt+H', click: () => { app.toggleMenubar() } },
         { label: 'Inspect', accelerator: 'CmdOrCtrl+.', click: () => { app.inspect() } },
-        { label: 'Quit', accelerator: 'CmdOrCtrl+Q', click: () => { app.exit() } }
+        { role: 'quit' }
       ]
     })
 

desktop/sources/scripts/lib/source.js

@@ -3,7 +3,7 @@
 /* global FileReader */
 /* global MouseEvent */
 
-function Source () {
+function Source (client) {
   this.cache = {}
 
   this.install = () => {
@@ -58,10 +58,6 @@ function Source () {
     this.write(name, ext, content, type, callback)
   }
 
-  this.revert = () => {
-
-  }
-
   // I/O
 
   this.read = (file, callback) => {

desktop/sources/scripts/lib/theme.js

@@ -4,7 +4,7 @@
 /* global FileReader */
 /* global DOMParser */
 
-function Theme () {
+function Theme (client) {
   this.el = document.createElement('style')
   this.el.type = 'text/css'
 
@@ -32,7 +32,7 @@ function Theme () {
     if (isJson(localStorage.theme)) {
       const storage = JSON.parse(localStorage.theme)
       if (isValid(storage)) {
-        console.log('Theme', 'Loading localStorage..')
+        console.log('Theme', 'Loading theme in localStorage..')
         this.load(storage)
         return
       }
@@ -40,6 +40,16 @@ function Theme () {
     this.load(this.default)
   }
 
+  this.open = () => {
+    console.log('Theme', 'Open theme..')
+    const input = document.createElement('input')
+    input.type = 'file'
+    input.onchange = (e) => {
+      this.read(e.target.files[0], this.load)
+    }
+    input.click()
+  }
+
   this.load = (data) => {
     const theme = this.parse(data)
     if (!isValid(theme)) { console.warn('Theme', 'Invalid format'); return }
@@ -84,16 +94,20 @@ function Theme () {
   this.drop = (e) => {
     e.preventDefault()
     const file = e.dataTransfer.files[0]
-    if (!file || !file.name) { console.warn('Theme', 'Could not read file.'); return }
-    if (file.name.indexOf('.svg') < 0) { console.warn('Theme', 'Not a SVG file.'); return }
-    const reader = new FileReader()
-    reader.onload = (e) => {
-      this.load(e.target.result)
+    if (file.name.indexOf('.svg') > -1) {
+      this.read(file, this.load)
     }
-    reader.readAsText(file)
     e.stopPropagation()
   }
 
+  this.read = (file, callback) => {
+    const reader = new FileReader()
+    reader.onload = (event) => {
+      callback(event.target.result)
+    }
+    reader.readAsText(file, 'UTF-8')
+  }
+
   // Helpers
 
   function extract (xml) {