Support bind behaviour switching

6 files changed, 43 insertions, 16 deletions

diff --git a/application/components/app.vue b/application/components/app.vue
index 6a9dbe3..098aeea 100644
--- a/application/components/app.vue
+++ b/application/components/app.vue
@@ -3,6 +3,7 @@ import Keymap from './keymap.vue'
 import Terminal from './terminal.vue'
 
 import * as config from '../config'
+import { loadBehaviours } from '../api'
 const { loadKeycodes, loadIndexedKeycodes, loadIndexedBehaviours } = require('../keycodes')
 
 export default {
@@ -13,6 +14,7 @@ export default {
   provide() {
     return {
       keycodes: this.keycodes,
+      behaviours: this.behaviours,
       indexedKeycodes: this.indexedKeycodes,
       indexedBehaviours: this.indexedBehaviours
     }
@@ -35,6 +37,7 @@ export default {
     const indexedKeycodes = await loadIndexedKeycodes()
 
     this.keycodes.splice(0, this.keycodes.length, ...keycodes)
+    this.behaviours.splice(0, this.behaviours.length, ...await loadBehaviours())
     Object.assign(this.indexedKeycodes, indexedKeycodes)
     Object.assign(this.indexedBehaviours, await loadIndexedBehaviours())
   },
diff --git a/application/components/key.vue b/application/components/key.vue
index 308c3a4..b342628 100644
--- a/application/components/key.vue
+++ b/application/components/key.vue
@@ -14,8 +14,9 @@
   >
     <span
       v-if="parsed.behaviour"
-      v-text="parsed.behaviour.bind"
+      v-text="parsed.behaviour.code"
       class="behaviour-binding"
+      @click.stop="handleSelectBinding"
     />
     <key-paramlist
       :root="true"
@@ -93,6 +94,16 @@ export default {
         index: this.mapping.index,
         ...event
       })
+    },
+    handleSelectBinding(event) {
+      this.$emit('select-key', {
+        layer: this.mapping.layer,
+        index: this.mapping.index,
+        target: event.target,
+        codeIndex: 0,
+        code: this.parsed.bindCode,
+        param: 'behaviour'
+      })
     }
   }
 }
diff --git a/application/components/keymap.vue b/application/components/keymap.vue
index 1d08f80..6e4dcdb 100644
--- a/application/components/keymap.vue
+++ b/application/components/keymap.vue
@@ -21,7 +21,7 @@ export default {
   },
   props: ['layout', 'keymap'],
   emits: ['keymap-updated'],
-  inject: ['keycodes', 'indexedBehaviours'],
+  inject: ['keycodes', 'behaviours', 'indexedBehaviours'],
   provide() {
     return {
       onSelectKey: this.handleSelectKey
@@ -61,6 +61,8 @@ export default {
         return param.enum.map(v => ({ code: v }))
       }
       switch (param) {
+        case 'behaviour':
+          return this.behaviours
         case 'layer':
           return this.layers
         case 'mod':
diff --git a/application/components/search.vue b/application/components/search.vue
index 834382e..bef4b8c 100644
--- a/application/components/search.vue
+++ b/application/components/search.vue
@@ -131,10 +131,12 @@ export default {
         :title="result.description"
         :data-result-index="i"
         v-for="(result, i) in results"
-        v-html="result.search ? highlight(result.search) : result.code"
         @click="handleClickResult(result)"
         @mouseover="setHighlight(i)"
-      />
+      >
+        <span v-if="result.search" v-html="highlight(result.search)" />
+        <span v-else v-text="result.code" />
+      </li>
     </ul>
   </div>
 </template>
diff --git a/application/keycodes.js b/application/keycodes.js
index ef11c6f..39b4e44 100644
--- a/application/keycodes.js
+++ b/application/keycodes.js
@@ -19,7 +19,7 @@ export function loadIndexedKeycodes() {
 }
 
 export function loadIndexedBehaviours() {
-  return loadBehaviours().then(behaviours => keyBy(behaviours, 'bind'))
+  return loadBehaviours().then(behaviours => keyBy(behaviours, 'code'))
 }
 
 function shortestAlias (aliases) {
diff --git a/application/keymap.js b/application/keymap.js
index 10bf5fb..f1ecb96 100644
--- a/application/keymap.js
+++ b/application/keymap.js
@@ -32,11 +32,15 @@ export function parseKeyBinding(binding, sources) {
     }
   }
 
-  return hydrateParsedKeyBinding({ binding, behaviourBind: bind, params: params.map(parse) }, sources)
+  return hydrateParsedKeyBinding({
+    binding,
+    value: bind,
+    params: params.map(parse)
+  }, sources)
 }
 
-function hydrateParsedKeyBinding(parsed, sources) {
-  const behaviour = sources.behaviours[parsed.behaviourBind]
+function hydrateParsedKeyBinding(parsed, sources, out = {}) {
+  const behaviour = sources.behaviours[parsed.value]
   const firstParsedParam = get(parsed, 'params[0]')
   const commands = keyBy(behaviour.commands, 'code')
   const behaviourParams = [].concat(
@@ -68,9 +72,11 @@ function hydrateParsedKeyBinding(parsed, sources) {
     }
   }
 
-  const hydrated = {
+  const hydrated = out || {}
+
+  Object.assign(hydrated, {
     binding: parsed.binding,
-    behaviourBind: parsed.behaviourBind,
+    value: parsed.value,
     behaviour,
     behaviourParams,
     params: behaviourParams.map((as, i) => (
@@ -78,7 +84,7 @@ function hydrateParsedKeyBinding(parsed, sources) {
         ? hydrate(parsed.params[i], as)
         : { value: undefined, params: [] }
     ))
-  }
+  })
 
   return Object.assign(hydrated, {
     _index: indexKeyBinding(hydrated)
@@ -93,18 +99,21 @@ function hydrateParsedKeyBinding(parsed, sources) {
 export function indexKeyBinding(tree) {
   let index = []
 
-  return (function traverse(tree) {
+  ;(function traverse(tree) {
+    const params = tree.params || []
     tree.index = index.length
     index.push(tree)
-    const params = tree.params || []
     params.forEach(traverse)
-    return index
   })(tree)
+
+  return index
 }
 
 export function updateKeyCode(key, index, source, sources) {
-  key.parsed._index[index].value = source.code
-  Object.assign(key.parsed, hydrateParsedKeyBinding(key.parsed, sources))
+  const code = key.parsed._index[index]
+  code.value = source.code
+  code.params.splice(0, code.params.length)
+  hydrateParsedKeyBinding(key.parsed, sources, key.parsed)
 }
 
 export function encode(parsedKeymap) {