| 795 | charLimit: number; |
| 796 | constructor( |
| 797 | label: string, |
| 798 | onSubmit: (str: string) => void, |
| 799 | owner: Options, |
| 800 | {initText = "", charLimit = -1} = {}, |
| 801 | ) { |
| 802 | this.label = label; |
| 803 | this.value = initText; |
| 804 | this.owner = owner; |
| 805 | this.onSubmit = onSubmit; |
| 806 | this.charLimit = charLimit; |
| 807 | } |
| 808 | generateHTML(): HTMLDivElement { |
| 809 | const div = document.createElement("div"); |
| 810 | const span = document.createElement("span"); |
| 811 | span.textContent = this.label; |
| 812 | div.append(span); |
| 813 | div.append(document.createElement("br")); |
| 814 | const input = document.createElement("textarea"); |
| 815 | input.value = this.value; |
| 816 | let hintText: undefined | HTMLElement; |
| 817 | input.oninput = () => { |
| 818 | this.onChange(); |
| 819 | if (this.charLimit !== -1) { |
| 820 | const left = this.charLimit - this.value.length; |
| 821 | if (left / this.charLimit < 0.2) { |
| 822 | if (!hintText) { |
| 823 | hintText = document.createElement("span"); |
| 824 | hintText.classList.add("hintTextInput"); |
| 825 | } |
| 826 | div.append(hintText); |
| 827 | hintText.textContent = I18n.charLeft(left + ""); |
| 828 | } else if (hintText) { |
| 829 | hintText.remove(); |
| 830 | } |
| 831 | } |
| 832 | }; |
| 833 | if (this.charLimit !== -1) input.maxLength = this.charLimit; |
| 834 | this.input = new WeakRef(input); |
| 835 | div.append(input); |
| 836 | return div; |
| 837 | } |
| 838 | onChange() { |
| 839 | this.owner.changed(); |
| 840 | const input = this.input.deref(); |
| 841 | if (input) { |
| 842 | const value = input.value as string; |
| 843 | this.onchange(value); |
| 844 | this.value = value; |
| 845 | } |
| 846 | } |
| 847 | onchange: (str: string) => void = (_) => {}; |
| 848 | watchForChange(func: (str: string) => void) { |