commit
13fb726332
12 changed files with 1373 additions and 50 deletions
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,2 @@ |
|||||||
|
export const OPEN = 'open'; |
||||||
|
export const TABOPEN = 'tabopen'; |
@ -0,0 +1,46 @@ |
|||||||
|
.vimvixen-footerline { |
||||||
|
border-top: 1px solid gray; |
||||||
|
bottom: 0; |
||||||
|
box-sizing: border-box; |
||||||
|
font-family: monospace; |
||||||
|
font-size: 12px; |
||||||
|
left: 0; |
||||||
|
margin: 0; |
||||||
|
padding: 0; |
||||||
|
position: fixed; |
||||||
|
right: 0; |
||||||
|
z-index: 10000; |
||||||
|
} |
||||||
|
|
||||||
|
.vimvixen-footerline-title { |
||||||
|
background-color: lightgray; |
||||||
|
font-weight: bold; |
||||||
|
margin: 0; |
||||||
|
padding: 0; |
||||||
|
} |
||||||
|
|
||||||
|
.vimvixen-footerline-container-outer { |
||||||
|
background-color: white; |
||||||
|
position: relative; |
||||||
|
} |
||||||
|
|
||||||
|
.vimvixen-footerline-container-outer:before { |
||||||
|
content: ':'; |
||||||
|
background-color: white; |
||||||
|
float: left; |
||||||
|
text-align: right; |
||||||
|
width: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.vimvixen-footerline-container-inner { |
||||||
|
position: absolute; |
||||||
|
left: 12px; |
||||||
|
right: 0; |
||||||
|
} |
||||||
|
|
||||||
|
.vimvixen-footerline-input { |
||||||
|
margin: 0; |
||||||
|
padding: 0; |
||||||
|
width: 100%; |
||||||
|
border: none; |
||||||
|
} |
@ -0,0 +1,78 @@ |
|||||||
|
import './footer-line.css'; |
||||||
|
|
||||||
|
export default class FooterLine { |
||||||
|
constructor(doc, initial = '') { |
||||||
|
this.initUi(doc); |
||||||
|
|
||||||
|
this.enteredCallback = () => {} |
||||||
|
this.promptChangeCallback = () => {} |
||||||
|
|
||||||
|
this.input.addEventListener('blur', this.handleBlur.bind(this)); |
||||||
|
this.input.addEventListener('keydown', this.handleKeydown.bind(this)); |
||||||
|
this.input.addEventListener('keyup', this.handleKeyup.bind(this)); |
||||||
|
this.input.value = initial; |
||||||
|
} |
||||||
|
|
||||||
|
initUi(doc) { |
||||||
|
this.title = doc.createElement('p'); |
||||||
|
this.title.className = 'vimvixen-footerline-title'; |
||||||
|
|
||||||
|
let containerInner = doc.createElement('div'); |
||||||
|
containerInner.className = 'vimvixen-footerline-container-inner'; |
||||||
|
|
||||||
|
let containerOuter = doc.createElement('div'); |
||||||
|
containerOuter.className = 'vimvixen-footerline-container-outer'; |
||||||
|
|
||||||
|
this.input = doc.createElement('input'); |
||||||
|
this.input.className = 'vimvixen-footerline-input'; |
||||||
|
|
||||||
|
this.wrapper = doc.createElement('div'); |
||||||
|
this.wrapper.className = 'vimvixen-footerline'; |
||||||
|
|
||||||
|
containerOuter.append(containerInner); |
||||||
|
containerInner.append(this.input); |
||||||
|
this.wrapper.append(this.title); |
||||||
|
this.wrapper.append(containerOuter); |
||||||
|
doc.body.append(this.wrapper) |
||||||
|
} |
||||||
|
|
||||||
|
focus() { |
||||||
|
this.input.focus(); |
||||||
|
} |
||||||
|
|
||||||
|
remove() { |
||||||
|
this.wrapper.remove(); |
||||||
|
} |
||||||
|
|
||||||
|
onPromptChange(callback) { |
||||||
|
this.promptChangeCallback = callback; |
||||||
|
} |
||||||
|
|
||||||
|
onEntered(callback) { |
||||||
|
this.enteredCallback = callback; |
||||||
|
} |
||||||
|
|
||||||
|
handleBlur() { |
||||||
|
this.remove(); |
||||||
|
} |
||||||
|
|
||||||
|
handleKeydown(e) { |
||||||
|
this.prevValue = e.target.value; |
||||||
|
switch(e.keyCode) { |
||||||
|
case KeyboardEvent.DOM_VK_ESCAPE: |
||||||
|
this.remove(); |
||||||
|
break; |
||||||
|
case KeyboardEvent.DOM_VK_RETURN: |
||||||
|
this.enteredCallback(e); |
||||||
|
break; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
handleKeyup(e) { |
||||||
|
if (e.target.value === this.prevValue) { |
||||||
|
return; |
||||||
|
} |
||||||
|
this.promptChangeCallback(e); |
||||||
|
this.prevValue = e.target.value; |
||||||
|
} |
||||||
|
} |
Reference in new issue