mmcghen/TwitchChatRandomizer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adds Spin button to page

Browse Source
This commit is contained in:
Michael McGhen
2024-06-09 13:57:09 -04:00
parent 6485396900
commit 8ac072d84b
10 changed files with 39 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Twitch Chat Randomizer.py
+2
View File
@@ -1,3 +1,5 @@
##Twitch Chat Randomizer
import os import os
import asyncio import asyncio
import websockets import websockets
client/build/asset-manifest.json
+3 -3
View File
@@ -1,15 +1,15 @@
{ {
"files": { "files": {
"main.css": "/static/css/main.e6c13ad2.css", "main.css": "/static/css/main.e6c13ad2.css",
"main.js": "/static/js/main.f0e38a7d.js", "main.js": "/static/js/main.ab5d588b.js",
"static/js/453.419a5d54.chunk.js": "/static/js/453.419a5d54.chunk.js", "static/js/453.419a5d54.chunk.js": "/static/js/453.419a5d54.chunk.js",
"index.html": "/index.html", "index.html": "/index.html",
"main.e6c13ad2.css.map": "/static/css/main.e6c13ad2.css.map", "main.e6c13ad2.css.map": "/static/css/main.e6c13ad2.css.map",
"main.f0e38a7d.js.map": "/static/js/main.f0e38a7d.js.map", "main.ab5d588b.js.map": "/static/js/main.ab5d588b.js.map",
"453.419a5d54.chunk.js.map": "/static/js/453.419a5d54.chunk.js.map" "453.419a5d54.chunk.js.map": "/static/js/453.419a5d54.chunk.js.map"
}, },
"entrypoints": [ "entrypoints": [
"static/css/main.e6c13ad2.css", "static/css/main.e6c13ad2.css",
"static/js/main.f0e38a7d.js" "static/js/main.ab5d588b.js"
] ]
} }
client/build/index.html
+1 -1
View File
@@ -1 +1 @@
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>React App</title><script defer="defer" src="/static/js/main.f0e38a7d.js"></script><link href="/static/css/main.e6c13ad2.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html> <!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>React App</title><script defer="defer" src="/static/js/main.ab5d588b.js"></script><link href="/static/css/main.e6c13ad2.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
client/build/static/css/main.e6c13ad2.css.map
+1 -1
View File
@@ -1 +1 @@
{"version":3,"file":"static/css/main.e6c13ad2.css","mappings":"AAAA,KAKE,kCAAmC,CACnC,iCAAkC,CAJlC,mIAEY,CAHZ,QAMF,CAEA,KACE,uEAEF","sources":["index.css"],"sourcesContent":["body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n monospace;\n}\n"],"names":[],"sourceRoot":""} {"version":3,"file":"static/css/main.e6c13ad2.css","mappings":"AAAA,KAKE,kCAAmC,CACnC,iCAAkC,CAJlC,mIAEY,CAHZ,QAMF,CAEA,KACE,uEAEF","sources":["index.css"],"sourcesContent":["body {\r\n margin: 0;\r\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\r\n 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\r\n sans-serif;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n}\r\n\r\ncode {\r\n font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\r\n monospace;\r\n}\r\n"],"names":[],"sourceRoot":""}
client/build/static/js/main.f0e38a7d.js → client/build/static/js/main.ab5d588b.js
+3 -3
View File
File diff suppressed because one or more lines are too long
client/build/static/js/main.f0e38a7d.js.LICENSE.txt → client/build/static/js/main.ab5d588b.js.LICENSE.txt
View File
client/build/static/js/main.f0e38a7d.js.map → client/build/static/js/main.ab5d588b.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long
client/src/App.js
+1 -1
View File
@@ -7,7 +7,7 @@ function App() {
<header className="App-header"> <header className="App-header">
<h1>Twitch Chat Randomizer</h1> <h1>Twitch Chat Randomizer</h1>
<WheelComponent /> <WheelComponent />
</header> </header>
</div> </div>
); );
} }
client/src/WheelComponent.js
+7 -2
View File
@@ -46,12 +46,12 @@ const WheelComponent = () => {
fetchMessages(); fetchMessages();
}, []); }, []);
useEffect(() => { const startSpin = () => {
if (data.length > 0) { if (data.length > 0) {
setPrizeNumber(Math.floor(Math.random() * data.length)); setPrizeNumber(Math.floor(Math.random() * data.length));
setMustSpin(true); setMustSpin(true);
} }
}, [data]); };
const handleSpinComplete = () => { const handleSpinComplete = () => {
setMustSpin(false); setMustSpin(false);
@@ -73,8 +73,13 @@ const WheelComponent = () => {
mustStartSpinning={mustSpin} mustStartSpinning={mustSpin}
prizeNumber={prizeNumber} prizeNumber={prizeNumber}
data={data} data={data}
spinDuration={.5}
disableInitialAnimation={true}
onStopSpinning={handleSpinComplete} onStopSpinning={handleSpinComplete}
/> />
<button onClick={startSpin} disabled={mustSpin || data.length === 0}>
Start Spin
</button>
</div> </div>
); );
}; };
server.js
+20
View File
@@ -2,6 +2,7 @@ const express = require('express');
const cors = require('cors'); const cors = require('cors');
const bodyParser = require('body-parser'); const bodyParser = require('body-parser');
const path = require('path'); const path = require('path');
const WebSocket = require('ws');
const app = express(); const app = express();
app.use(cors()); app.use(cors());
@@ -11,17 +12,36 @@ const port = process.env.PORT || 5000;
let messagesDict = {}; let messagesDict = {};
// Serve static files from the React app
app.use(express.static(path.join(__dirname, 'client/build'))); app.use(express.static(path.join(__dirname, 'client/build')));
// API endpoint to get the messages dictionary
app.get('/api/selected', (req, res) => { app.get('/api/selected', (req, res) => {
res.json(messagesDict); res.json(messagesDict);
}); });
// WebSocket server setup
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (ws) => {
console.log('Client connected');
ws.on('close', () => console.log('Client disconnected'));
});
// Endpoint to set the messages dictionary
app.post('/api/selected', (req, res) => { app.post('/api/selected', (req, res) => {
messagesDict = req.body; messagesDict = req.body;
res.status(200).send(); res.status(200).send();
// Send updates to all connected WebSocket clients
wss.clients.forEach(client => {
if (client.readyState === WebSocket.OPEN) {
client.send(JSON.stringify(messagesDict));
}
});
}); });
// Serve React app
app.get('*', (req, res) => { app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, 'client/build', 'index.html')); res.sendFile(path.join(__dirname, 'client/build', 'index.html'));
}); });