Update framework

framework/ui/text/index.d.ts

@@ -0,0 +1,28 @@
+import * as EventEmitter from 'eventemitter3';
+import { SoundSet } from '../menu/interfaces/sound-set';
+import { Line } from './line';
+export declare class ScrollingText extends EventEmitter {
+    private text;
+    private delimiter;
+    private soundSet;
+    private appearingCharacters;
+    private characterAppearSpeed;
+    private currentLineIndex;
+    private currentLine;
+    private lines;
+    private wrapper;
+    private container;
+    private soundManager;
+    private keyboardManager;
+    constructor(text?: string, delimiter?: string, soundSet?: SoundSet, appearingCharacters?: boolean, characterAppearSpeed?: number);
+    setText(text: string): this;
+    setSoundSet(soundSet: SoundSet): this;
+    setDelimiter(delimiter: string): this;
+    setAppearingCharacters(appearing: boolean): this;
+    setAppearingCharacterSpeed(speed: number): this;
+    init(): void;
+    run(element: HTMLElement): Promise<void>;
+    displayLine(index: number): Promise<void>;
+    getContainer(): HTMLElement;
+    getCurrentLine(): Line;
+}

framework/ui/text/index.js

@@ -0,0 +1,102 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import * as EventEmitter from 'eventemitter3';
+import { Line } from './line';
+import { SoundManager } from './sound-manager';
+import { KeyboardManager } from './keyboard-manager';
+export class ScrollingText extends EventEmitter {
+    constructor(text = null, delimiter = '\n', soundSet = null, appearingCharacters = false, characterAppearSpeed = 0) {
+        super();
+        this.text = text;
+        this.delimiter = delimiter;
+        this.soundSet = soundSet;
+        this.appearingCharacters = appearingCharacters;
+        this.characterAppearSpeed = characterAppearSpeed;
+        this.lines = [];
+        this.soundManager = new SoundManager(this, this.soundSet);
+        this.keyboardManager = new KeyboardManager(this);
+        this.init();
+    }
+    setText(text) {
+        this.text = text;
+        this.init();
+        return this;
+    }
+    setSoundSet(soundSet) {
+        this.soundSet = soundSet;
+        this.init();
+        this.soundManager.setSoundSet(this.soundSet);
+        return this;
+    }
+    setDelimiter(delimiter) {
+        this.delimiter = delimiter;
+        this.init();
+        return this;
+    }
+    setAppearingCharacters(appearing) {
+        this.appearingCharacters = appearing;
+        this.init();
+        return this;
+    }
+    setAppearingCharacterSpeed(speed) {
+        this.characterAppearSpeed = speed;
+        this.init();
+        return this;
+    }
+    init() {
+        const split = this.text.split(this.delimiter);
+        this.lines = split.map((line) => new Line(line));
+    }
+    run(element) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => __awaiter(this, void 0, void 0, function* () {
+                this.wrapper = document.createElement('div');
+                this.wrapper.setAttribute('aria-role', 'polite');
+                this.container = document.createElement('div');
+                this.wrapper.appendChild(this.container);
+                element.appendChild(this.wrapper);
+                this.soundManager.init();
+                this.keyboardManager.init();
+                this.emit('open');
+                let index = 0;
+                this.currentLineIndex = 0;
+                while (index < this.lines.length) {
+                    this.currentLineIndex = index;
+                    yield this.displayLine(index);
+                    index++;
+                }
+                this.emit('close');
+                this.keyboardManager.release();
+                this.container.remove();
+                resolve();
+            }));
+        });
+    }
+    displayLine(index) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return new Promise((resolve, reject) => {
+                this.container.innerHTML = '';
+                this.container.appendChild(this.lines[index].getDOMNode());
+                this.lines[index].display(this.container, this.appearingCharacters, this.characterAppearSpeed);
+                this.lines[index].on('character.appear', (event) => this.emit('character.appear', event));
+                this.lines[index].on('advance', () => {
+                    this.emit('advance');
+                    resolve();
+                });
+            });
+        });
+    }
+    getContainer() {
+        return this.wrapper;
+    }
+    getCurrentLine() {
+        return this.lines[this.currentLineIndex];
+    }
+}

framework/ui/text/interfaces/playable-sound.d.ts

@@ -0,0 +1,3 @@
+export interface IPlayableSound {
+    play(): any;
+}

framework/ui/text/interfaces/playable-sound.js

@@ -0,0 +1 @@
+export {};

framework/ui/text/interfaces/sound-set.d.ts

@@ -0,0 +1,7 @@
+import { IPlayableSound } from './playable-sound';
+export interface SoundSet {
+    open?: IPlayableSound;
+    close?: IPlayableSound;
+    scroll?: IPlayableSound;
+    characterAppear?: IPlayableSound;
+}

framework/ui/text/interfaces/sound-set.js

@@ -0,0 +1 @@
+export {};

framework/ui/text/keyboard-manager.d.ts

@@ -0,0 +1,8 @@
+import { ScrollingText } from '.';
+export declare class KeyboardManager {
+    private scrollingText;
+    constructor(scrollingText: ScrollingText);
+    init(): void;
+    release(): void;
+    private handler;
+}

framework/ui/text/keyboard-manager.js

@@ -0,0 +1,25 @@
+export class KeyboardManager {
+    constructor(scrollingText) {
+        this.scrollingText = scrollingText;
+    }
+    init() {
+        this.scrollingText
+            .getContainer()
+            .addEventListener('keydown', (event) => this.handler(event));
+    }
+    release() {
+        this.scrollingText
+            .getContainer()
+            .removeEventListener('keydown', (event) => this.handler(event));
+    }
+    handler(event) {
+        switch (event.key) {
+            case 'Enter':
+                event.preventDefault();
+                this.scrollingText.getCurrentLine().getAdvanceButton().click();
+                break;
+            default:
+                break;
+        }
+    }
+}

framework/ui/text/line.d.ts

@@ -0,0 +1,13 @@
+import * as EventEmitter from 'eventemitter3';
+export declare class Line extends EventEmitter {
+    private text;
+    private container;
+    private textField;
+    private advanceButton;
+    private active;
+    constructor(text: string);
+    getDOMNode(): HTMLElement;
+    display(element: HTMLElement, appearingCharacters?: boolean, appearingCharacterSpeed?: number): void;
+    private fillText;
+    getAdvanceButton(): HTMLElement;
+}

framework/ui/text/line.js

@@ -0,0 +1,45 @@
+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;
+    }
+}

framework/ui/text/sound-manager.d.ts

@@ -0,0 +1,13 @@
+import { SoundSet } from './interfaces/sound-set';
+import { ScrollingText } from '.';
+export declare class SoundManager {
+    private instance;
+    private soundSet;
+    constructor(instance: ScrollingText, soundSet: SoundSet);
+    setSoundSet(soundSet: SoundSet): void;
+    init(): void;
+    private handleOpen;
+    private handleCharacterAppear;
+    private handleAdvance;
+    private handleClose;
+}

framework/ui/text/sound-manager.js

@@ -0,0 +1,27 @@
+export class SoundManager {
+    constructor(instance, soundSet) {
+        this.instance = instance;
+        this.soundSet = soundSet;
+    }
+    setSoundSet(soundSet) {
+        this.soundSet = soundSet;
+    }
+    init() {
+        this.instance.on('character.appear', this.handleCharacterAppear.bind(this));
+        this.instance.on('open', this.handleOpen.bind(this));
+        this.instance.on('close', this.handleClose.bind(this));
+        this.instance.on('advance', this.handleAdvance.bind(this));
+    }
+    handleOpen() {
+        this.soundSet.open && this.soundSet.open.play();
+    }
+    handleCharacterAppear() {
+        this.soundSet.characterAppear && this.soundSet.characterAppear.play();
+    }
+    handleAdvance() {
+        this.soundSet.scroll && this.soundSet.scroll.play();
+    }
+    handleClose() {
+        this.soundSet.close && this.soundSet.close.play();
+    }
+}