enabled && setShown(true)}>
@@ -75,19 +85,35 @@ const EmojiButton = (props: { events: Registry }) => {
{!shown ? undefined :
+ //
{
+ // if (enabled) {
+ // settings.setValue(Settings.KEY_CHAT_LAST_USED_EMOJI, emoji.id as string);
+ // props.events.fire("action_insert_text", { text: emoji.native, focus: true });
+ // }
+ // }}
+ // />
{
- if(enabled) {
- settings.setValue(Settings.KEY_CHAT_LAST_USED_EMOJI, emoji.id as string);
+ onEmojiSelect={(emoji: any) => {
+ if (enabled) {
+ //settings.setValue(Settings.KEY_CHAT_LAST_USED_EMOJI, emoji.id as string);
props.events.fire("action_insert_text", { text: emoji.native, focus: true });
}
}}
@@ -101,27 +127,27 @@ const EmojiButton = (props: { events: Registry }) => {
const pasteTextTransformElement = document.createElement("div");
const nodeToText = (element: Node) => {
- if(element instanceof Text) {
+ if (element instanceof Text) {
return element.textContent;
- } else if(element instanceof HTMLElement) {
- if(element instanceof HTMLImageElement) {
+ } else if (element instanceof HTMLElement) {
+ if (element instanceof HTMLImageElement) {
return element.alt || element.title;
- } else if(element instanceof HTMLBRElement) {
+ } else if (element instanceof HTMLBRElement) {
return '\n';
- } else if(element instanceof HTMLAnchorElement) {
+ } else if (element instanceof HTMLAnchorElement) {
const content = [...element.childNodes].map(nodeToText).join("");
- if(element.href) {
- if(settings.getValue(Settings.KEY_CHAT_ENABLE_MARKDOWN)) {
- if(content && element.title) {
+ if (element.href) {
+ if (settings.getValue(Settings.KEY_CHAT_ENABLE_MARKDOWN)) {
+ if (content && element.title) {
return `[${content}](${element.href} "${element.title}")`;
- } else if(content) {
+ } else if (content) {
return `[${content}](${element.href})`;
} else {
return `[${element.href}](${element.href})`;
}
- } else if(settings.getValue(Settings.KEY_CHAT_ENABLE_BBCODE)) {
- if(content) {
+ } else if (settings.getValue(Settings.KEY_CHAT_ENABLE_BBCODE)) {
+ if (content) {
return `[url=${element.href}]${content}"[/url]`;
} else {
return `[url]${element.href}"[/url]`;
@@ -134,11 +160,11 @@ const nodeToText = (element: Node) => {
}
}
- if(element.children.length > 0) {
+ if (element.children.length > 0) {
return [...element.childNodes].map(nodeToText).join("");
}
- return typeof(element.innerText) === "string" ? element.innerText : "";
+ return typeof (element.innerText) === "string" ? element.innerText : "";
} else {
return "";
}
@@ -146,19 +172,19 @@ const nodeToText = (element: Node) => {
const htmlEscape = (message: string) => {
pasteTextTransformElement.innerText = message;
- message = pasteTextTransformElement.innerHTML;
+ message = pasteTextTransformElement.innerHTML;
return message.replace(/ /g, ' ');
};
const TextInput = (props: { events: Registry, enabled?: boolean, placeholder?: string }) => {
- const [ enabled, setEnabled ] = useState(!!props.enabled);
- const [ historyIndex, setHistoryIndex ] = useState(-1);
+ const [enabled, setEnabled] = useState(!!props.enabled);
+ const [historyIndex, setHistoryIndex] = useState(-1);
const history = useRef([]);
const refInput = useRef();
const typingTimeout = useRef(undefined);
const triggerTyping = () => {
- if(typeof typingTimeout.current === "number")
+ if (typeof typingTimeout.current === "number")
return;
props.events.fire("notify_typing");
@@ -182,7 +208,7 @@ const TextInput = (props: { events: Registry, enabled?: boolean,
event.preventDefault();
const clipboard = event.clipboardData || (window as any).clipboardData;
- if(!clipboard) return;
+ if (!clipboard) return;
const rawText = clipboard.getData('text/plain');
const selection = window.getSelection();
@@ -191,7 +217,7 @@ const TextInput = (props: { events: Registry, enabled?: boolean,
}
let htmlXML = clipboard.getData('text/html');
- if(!htmlXML) {
+ if (!htmlXML) {
pasteTextTransformElement.textContent = rawText;
htmlXML = pasteTextTransformElement.innerHTML;
}
@@ -235,33 +261,33 @@ const TextInput = (props: { events: Registry, enabled?: boolean,
triggerTyping();
const inputEmpty = refInput.current.innerText.trim().length === 0;
- if(event.key === "Enter" && !event.shiftKey) {
- if(inputEmpty) {
+ if (event.key === "Enter" && !event.shiftKey) {
+ if (inputEmpty) {
return;
}
const text = refInput.current.innerText;
props.events.fire("action_submit_message", { message: text });
history.current.push(text);
- while(history.current.length > 10) {
+ while (history.current.length > 10) {
history.current.pop_front();
}
refInput.current.innerText = "";
setHistoryIndex(-1);
event.preventDefault();
- } else if(event.key === "ArrowUp") {
+ } else if (event.key === "ArrowUp") {
const inputOriginal = history.current[historyIndex] === refInput.current.innerText;
- if(inputEmpty && (historyIndex === -1 || !inputOriginal)) {
+ if (inputEmpty && (historyIndex === -1 || !inputOriginal)) {
setHistory(history.current.length - 1);
event.preventDefault();
- } else if(historyIndex > 0 && inputOriginal) {
+ } else if (historyIndex > 0 && inputOriginal) {
setHistory(historyIndex - 1);
event.preventDefault();
}
- } else if(event.key === "ArrowDown") {
- if(history.current[historyIndex] === refInput.current.innerText) {
- if(historyIndex < history.current.length - 1) {
+ } else if (event.key === "ArrowDown") {
+ if (history.current[historyIndex] === refInput.current.innerText) {
+ if (historyIndex < history.current.length - 1) {
setHistory(historyIndex + 1);
} else {
setHistory(-1);
@@ -273,7 +299,7 @@ const TextInput = (props: { events: Registry, enabled?: boolean,
props.events.reactUse("action_request_focus", () => refInput.current?.focus());
props.events.reactUse("notify_typing", () => {
- if(typeof typingTimeout.current === "number") {
+ if (typeof typingTimeout.current === "number") {
return;
}
@@ -281,15 +307,15 @@ const TextInput = (props: { events: Registry, enabled?: boolean,
});
props.events.reactUse("action_insert_text", event => {
refInput.current.innerHTML = refInput.current.innerHTML + event.text;
- if(event.focus) {
+ if (event.focus) {
refInput.current.focus();
}
});
props.events.reactUse("action_set_enabled", event => {
setEnabled(event.enabled);
- if(!event.enabled) {
+ if (!event.enabled) {
const text = refInput.current.innerText;
- if(text.trim().length !== 0)
+ if (text.trim().length !== 0)
history.current.push(text);
refInput.current.innerText = "";
}
@@ -324,17 +350,17 @@ export interface ChatBoxState {
}
const MarkdownFormatHelper = () => {
- const [ visible, setVisible ] = useState(settings.getValue(Settings.KEY_CHAT_ENABLE_MARKDOWN));
+ const [visible, setVisible] = useState(settings.getValue(Settings.KEY_CHAT_ENABLE_MARKDOWN));
settings.events.reactUse("notify_setting_changed", event => {
- if(event.setting !== Settings.KEY_CHAT_ENABLE_MARKDOWN.key) {
+ if (event.setting !== Settings.KEY_CHAT_ENABLE_MARKDOWN.key) {
return;
}
setVisible(settings.getValue(Settings.KEY_CHAT_ENABLE_MARKDOWN));
});
- if(visible) {
+ if (visible) {
return (
*italic*, **bold**, ~~strikethrough~~, `code`, and more...
);
@@ -380,7 +406,7 @@ export class ChatBox extends React.Component {
}
componentDidUpdate(prevProps: Readonly, prevState: Readonly, snapshot?: any): void {
- if(prevState.enabled !== this.state.enabled) {
+ if (prevState.enabled !== this.state.enabled) {
this.events.fire_react("action_set_enabled", { enabled: this.state.enabled });
}
}
![{""}]({"img/smiley-smile.svg"})
;
- }
+ // const settingValue = useGlobalSetting(Settings.KEY_CHAT_LAST_USED_EMOJI);
- return (
-