pastebin/js/views/editor/wrapper-buttons.ts
2019-11-25 20:26:15 +01:00

79 lines
2.9 KiB
TypeScript

import { Wrapper } from './types'
export default class WrapperButtons {
buttonsContainer: HTMLSpanElement
compilerOptions: HTMLInputElement
buttons: HTMLSpanElement
run: (wrapper: Wrapper, compilerOptions: string) => void
abortController: AbortController
select: HTMLSelectElement
optionMap = new WeakMap<HTMLOptionElement, { identifier: string, wrappers: Wrapper[] }>()
globalKeyEvent: (e: KeyboardEvent) => void | null = null
constructor(buttonsContainer, run) {
this.buttonsContainer = buttonsContainer
this.compilerOptions = document.createElement('input')
this.compilerOptions.placeholder = 'Compiler options'
this.buttons = document.createElement('span')
this.run = run
this.abortController = null
}
update(implementations) {
this.clear()
this.select = document.createElement('select')
for (const { label, identifier, wrappers } of implementations) {
const option = document.createElement('option')
option.textContent = label
this.optionMap.set(option, { identifier, wrappers })
this.select.append(option)
}
this.buttonsContainer.textContent = ''
if (implementations.length > 1) {
this.buttonsContainer.append(this.select)
this.select.addEventListener('change', () => this.updateButtons())
}
if (implementations.length !== 0) {
this.buttonsContainer.append(this.compilerOptions, this.buttons)
}
this.updateButtons()
}
clear() {
document.removeEventListener('keydown', this.globalKeyEvent)
this.globalKeyEvent = null
this.buttonsContainer.textContent = ''
}
updateButtons() {
this.buttons.textContent = ''
let options = this.select.selectedOptions
if (options.length === 0) {
options = this.select.options
}
if (options.length !== 0) {
const option = options[0]
let first = true
for (const wrapper of this.optionMap.get(option).wrappers) {
const button = document.createElement('button')
button.textContent = wrapper.label
const event = (e: Event) => {
e.preventDefault()
this.run(wrapper, this.compilerOptions.value)
}
if (first) {
this.globalKeyEvent = e => {
if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
event(e)
}
}
document.addEventListener('keydown', this.globalKeyEvent)
first = false
}
button.addEventListener('click', event)
this.buttons.append(button)
}
}
}
}