From ef127142c01ac9540199a16884c02d753b04c497 Mon Sep 17 00:00:00 2001 From: Nick Coutsos Date: Sat, 16 Oct 2021 20:37:17 -0400 Subject: Move search prompt logic out of component --- application/components/key.vue | 20 ++++++++++++++++++-- application/components/keymap.vue | 13 ++++++++----- application/components/search.vue | 18 ++++++++---------- 3 files changed, 34 insertions(+), 17 deletions(-) diff --git a/application/components/key.vue b/application/components/key.vue index 315a2e9..b44fb1e 100644 --- a/application/components/key.vue +++ b/application/components/key.vue @@ -31,6 +31,7 @@ :code="editing.code" :param="editing.param" :targets="editing.targets" + :prompt="createPromptMessage(editing.param)" @select="handleSelectValue" @cancel="editing = null" /> @@ -153,6 +154,21 @@ export default { } }, methods: { + createPromptMessage(param) { + const promptMapping = { + layer: 'Select layer', + mod: 'Select modifier', + behaviour: 'Select behaviour', + command: 'Select command', + keycode: 'Select key code' + } + + if (param.name) { + return `Select ${param.name}` + } + + return promptMapping[param] || promptMapping.keycode + }, onMouseOver(event) { const old = document.querySelector('.highlight') old && old.classList.remove('highlight') @@ -163,12 +179,12 @@ export default { }, handleSelectCode(event) { this.editing = pick(event, ['target', 'codeIndex', 'code', 'param']) - this.editing.targets = this.getSearchTargets(this.editing.param) + this.editing.targets = this.getSearchTargets(this.editing.param, this.value) }, handleSelectBehaviour(event) { this.editing = { target: event.target, - targets: this.getSearchTargets('behaviour'), + targets: this.getSearchTargets('behaviour', this.value), codeIndex: 0, code: this.value, param: 'behaviour' diff --git a/application/components/keymap.vue b/application/components/keymap.vue index e6ec245..a370a79 100644 --- a/application/components/keymap.vue +++ b/application/components/keymap.vue @@ -65,23 +65,26 @@ export default { get(this.keymap, 'layers.length', 0) > 0 ) }, - getSearchTargets(param, key) { - const { keycodes } = this + getSearchTargets(param, behaviour) { + // Special case for behaviour commands which can dynamically add another + // parameter that isn't defined at the root level of the behaviour. + // Currently this is just `&bt BT_SEL` and is only represented as an enum. if (param.enum) { return param.enum.map(v => ({ code: v })) } + switch (param) { case 'behaviour': return this.behaviours case 'layer': return this.availableLayers case 'mod': - return filter(keycodes, 'isModifier') + return filter(this.keycodes, 'isModifier') case 'command': - get(this.sources, ['behaviours', key.parsed.value, 'commands'], []) + get(this.sources, ['behaviours', behaviour, 'commands'], []) case 'kc': default: - return keycodes + return this.keycodes } }, boundingBox() { diff --git a/application/components/search.vue b/application/components/search.vue index c0f667a..a5ecdf5 100644 --- a/application/components/search.vue +++ b/application/components/search.vue @@ -9,7 +9,14 @@ const cycle = (array, index, step=1) => { export default { name: 'search', emits: ['cancel', 'select'], - props: ['target', 'targets', 'param', 'code'], + props: { + target: Object, + targets: Array, + param: [String, Object], + code: String, + prompt: String, + searchKey: String + }, data() { return { query: null, @@ -23,15 +30,6 @@ export default { document.body.removeEventListener('click', this.handleClickOutside, true) }, computed: { - prompt() { - if (this.param === 'layer') { - return 'Select layer...' - } else if (this.param === 'mod') { - return 'Select modifier...' - } else { - return 'Select key code...' - } - }, results() { const { query, targets } = this const options = { key: 'code', limit: 30 } -- cgit v1.2.3