diff options
author | Florrie <towerofnix@gmail.com> | 2018-09-13 21:52:47 -0300 |
---|---|---|
committer | Florrie <towerofnix@gmail.com> | 2018-09-13 21:53:22 -0300 |
commit | 06c9ab090b6307b21226e6d8e7b34fc69380594b (patch) | |
tree | a34a2b198d9c5c99b5ad71c653eaf25fdaa7b7d7 /ui.js | |
parent | 7000c1109f66b7591e6056a82f270f57bf8ae6b5 (diff) |
Show preview of "Jump to" result
Also let the user cancel (esc) the "jump to" to restore the selected index to wherever it was before. A neat thing you can do with this: Your cursor will automatically move to whatever the matched result of your query is while typing. If nothing is found, your cursor will stay where it was the last time it found something: so, if you press enter to confirm, AFTER you've queried something but WHILE your query doesn't currently mathc anything, it'll keep the cursor at whatever was most recently matched. So basically, Ctrl-F'ing "excir" will match "Excursions", since "exc" will have matched it already.
Diffstat (limited to 'ui.js')
-rw-r--r-- | ui.js | 33 |
1 files changed, 18 insertions, 15 deletions
diff --git a/ui.js b/ui.js index 73a9732..2c74f8e 100644 --- a/ui.js +++ b/ui.js @@ -711,12 +711,11 @@ class GrouplikeListingElement extends Form { this.jumpElement = new ListingJumpElement() this.addInput(this.jumpElement) this.jumpElement.visible = false + this.oldFocusedIndex = null // To restore to, if a jump is canceled. - this.jumpElement.on('cancel', () => { - this.hideJumpElement() - }) - - this.jumpElement.on('value', value => this.handleJumpValue(value)) + this.jumpElement.on('cancel', () => this.hideJumpElement(true)) + this.jumpElement.on('change', value => this.handleJumpValue(value, false)) + this.jumpElement.on('confirm', value => this.handleJumpValue(value, true)) this.pathElement = new PathElement() this.addInput(this.pathElement) @@ -770,6 +769,7 @@ class GrouplikeListingElement extends Form { loadGrouplike(grouplike, resetIndex = true) { this.grouplike = grouplike this.buildItems(resetIndex) + if (this.root.select) this.hideJumpElement() } buildItems(resetIndex = false) { @@ -855,7 +855,7 @@ class GrouplikeListingElement extends Form { this.form.selectAndShow(item) } - handleJumpValue(value) { + handleJumpValue(value, isConfirm) { // Don't perform the search if the user didn't enter anything. if (value.length) { const lower = value.toLowerCase() @@ -874,16 +874,23 @@ class GrouplikeListingElement extends Form { } } - this.hideJumpElement() + if (isConfirm) { + this.hideJumpElement() + } } showJumpElement() { + this.oldFocusedIndex = this.form.curIndex this.jumpElement.visible = true this.root.select(this.jumpElement) this.fixLayout() } - hideJumpElement() { + hideJumpElement(isCancel) { + if (isCancel) { + this.form.curIndex = this.oldFocusedIndex + this.form.scrollSelectedElementIntoView() + } this.jumpElement.visible = false this.root.select(this) this.fixLayout() @@ -1068,13 +1075,9 @@ class ListingJumpElement extends Form { this.input = new TextInput() this.addInput(this.input) - this.input.on('value', value => { - this.emit('value', value) - }) - - this.input.on('cancel', () => { - this.emit('cancel') - }) + this.input.on('confirm', value => this.emit('confirm', value)) + this.input.on('change', value => this.emit('change', value)) + this.input.on('cancel', () => this.emit('cancel')) } selected() { |