46 lines
1.5 KiB
JavaScript
46 lines
1.5 KiB
JavaScript
|
import * as EventEmitter from 'eventemitter3';
|
||
|
export class Line extends EventEmitter {
|
||
|
constructor(text) {
|
||
|
super();
|
||
|
this.text = text;
|
||
|
this.active = false;
|
||
|
}
|
||
|
getDOMNode() {
|
||
|
this.container = document.createElement('div');
|
||
|
this.container.setAttribute('aria-role', 'polite');
|
||
|
this.textField = document.createElement('div');
|
||
|
this.container.appendChild(this.textField);
|
||
|
this.advanceButton = document.createElement('button');
|
||
|
this.advanceButton.textContent = 'Advance';
|
||
|
this.advanceButton.addEventListener('click', (event) => {
|
||
|
this.emit('advance');
|
||
|
this.active = false;
|
||
|
});
|
||
|
this.container.appendChild(this.advanceButton);
|
||
|
return this.container;
|
||
|
}
|
||
|
display(element, appearingCharacters = false, appearingCharacterSpeed = 0) {
|
||
|
this.active = true;
|
||
|
this.textField.focus();
|
||
|
if (!appearingCharacters) {
|
||
|
this.textField.textContent = this.text;
|
||
|
}
|
||
|
else {
|
||
|
this.fillText(0, appearingCharacterSpeed);
|
||
|
}
|
||
|
}
|
||
|
fillText(index, speed) {
|
||
|
if (!this.active)
|
||
|
return;
|
||
|
if (index > this.text.length) {
|
||
|
return;
|
||
|
}
|
||
|
this.textField.textContent += this.text.charAt(index);
|
||
|
this.emit('character.appear', this.textField.textContent);
|
||
|
setTimeout(() => this.fillText((index += 1), speed), speed);
|
||
|
}
|
||
|
getAdvanceButton() {
|
||
|
return this.advanceButton;
|
||
|
}
|
||
|
}
|