X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftwitch-bot%2FControls.js;h=496ff11dd9dae4f977eecb793e25e0f0f2349256;hb=cb1131aef6b342429304ce3e3b92e4b3d700d494;hp=54f4decd1722f0bcb6488e7f3bb68e05cf1da8e1;hpb=167f986f468014e00d82fa2df8193f6be8dca19d;p=alttp.git

diff --git a/resources/js/components/twitch-bot/Controls.js b/resources/js/components/twitch-bot/Controls.js
index 54f4dec..496ff11 100644
--- a/resources/js/components/twitch-bot/Controls.js
+++ b/resources/js/components/twitch-bot/Controls.js
@@ -12,6 +12,8 @@ import ChannelSelect from '../common/ChannelSelect';
 import Icon from '../common/Icon';
 import ToggleSwitch from '../common/ToggleSwitch';
 
+const CHAT_CATEGORIES = ['unclassified', 'hi', 'gl', 'gg', 'lol', 'pog', 'hype', 'o7'];
+
 const Controls = () => {
 	const [channel, setChannel] = React.useState(null);
 	const [chatText, setChatText] = React.useState('');
@@ -33,6 +35,18 @@ const Controls = () => {
 		}
 	}, [channel, chatText, t]);
 
+	const randomChat = React.useCallback(async (category) => {
+		try {
+			await axios.post(`/api/channels/${channel.id}/chat`, {
+				bot_nick: 'horstiebot',
+				category,
+			});
+			toastr.success(t('twitchBot.chatSuccess'));
+		} catch (e) {
+			toastr.error(t('twitchBot.chatError'));
+		}
+	}, [channel, chatText, t]);
+
 	const join = React.useCallback(async (bot_nick) => {
 		try {
 			const rsp = await axios.post(`/api/channels/${channel.id}/join`, { bot_nick });
@@ -200,6 +214,18 @@ const Controls = () => {
 							</Button>
 						</div>
 					</Form.Group>
+					<h3 className="mt-3">{t('twitchBot.randomChat')}</h3>
+					<div className="button-bar">
+						{CHAT_CATEGORIES.map(category =>
+							<Button
+								key={category}
+								onClick={() => { randomChat(category); }}
+								variant="outline-secondary"
+							>
+								{t(`twitchBot.chatCategories.${category}`)}
+							</Button>
+						)}
+					</div>
 				</Col>
 				<Col className="mt-5" md={6}>
 					<h3>{t('twitchBot.chatSettings')}</h3>
@@ -235,11 +261,8 @@ const Controls = () => {
 						<div className="button-bar">
 							{channel.access_key ?
 								<Button
-									onClick={() => {
-										window.open(
-											`/guessing-game/monitor/${channel.access_key}`,
-										);
-									}}
+									href={`/guessing-game/monitor/${channel.access_key}`}
+									target="_blank"
 									title={t('button.browserSource')}
 									variant="outline-secondary"
 								>
@@ -249,7 +272,7 @@ const Controls = () => {
 							<Button
 								onClick={() => {
 									window.open(
-										'/guessing-game/controls',
+										`/guessing-game/controls/${channel.id}`,
 										'',
 										'width=640,height=800,titlebar=0,menubar=0,toolbar=0',
 									);