alexvanin/galched-bot
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add twitch point song requests to the bot

Browse source 
This commits adds new feature for galchedbot: video requests
in the twitch chat via highlighted chat messages. This messages
parsed by the bot and added to the video queue, that can be
accessed by the dedicated web server. Video queue requires
authorization based on random token added to the cookies.
This commit is contained in:
Alex Vanin 2020-01-11 22:38:51 +03:00
parent 65fc1ccad4
commit f0f31a8415
18 changed files with 813 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

12
web/index.html Normal file
View file

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="./style.css">
</head>
<body>
<div id="player"></div>
<div><button onclick="nextVideo()">Skip song</button></div>
<div id="video_queue"></div>
<script src="scripts.js"></script>
</body>
</html>

14
web/login.html Normal file
View file

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html>
<body>
<form action="./login" method="post">
<div class="container">
<input type="text" placeholder="Username" name="login" required> <br><br>
<input type="password" placeholder="Password" name="password" required> <br><br>
<button type="submit">Login</button>
</div>
</form>
</body>
</html>

120
web/scripts.js Normal file
View file

@ -0,0 +1,120 @@
// queue is used to play videos
var queue
// player is a iframe youtube player
var player
// vid is a current playing video id
var vid = ""
function updateTable() {
var myTableDiv = document.getElementById("video_queue")
myTableDiv.innerHTML = ""
var table = document.createElement('TABLE')
var tableBody = document.createElement('TBODY')
table.border = '1'
table.appendChild(tableBody);
for (i = 0; i < queue.length; i++) {
var tr = document.createElement('TR');
var td = document.createElement('TD');
td.appendChild(document.createTextNode(queue[i].Duration));
tr.appendChild(td);
var td = document.createElement('TD');
td.appendChild(document.createTextNode(queue[i].Title));
tr.appendChild(td)
var td = document.createElement('TD');
td.appendChild(document.createTextNode( queue[i].From));
tr.appendChild(td)
var td = document.createElement('TD');
td.appendChild(document.createTextNode( queue[i].Views));
tr.appendChild(td)
var td = document.createElement('TD');
td.appendChild(document.createTextNode(((queue[i].Upvotes/(queue[i].Upvotes + queue[i].Downvotes)) * 100).toFixed(2) + '%'));
tr.appendChild(td)
tableBody.appendChild(tr);
}
myTableDiv.appendChild(table)
}
function bgUpdateQueue() {
initQueue()
updateTable()
if (vid === "" && queue.length > 0) {
vid = queue[0].ID
player.loadVideoById(vid)
}
}
function initQueue() {
var request = new XMLHttpRequest()
request.open('GET', './queue', false)
request.onload = function () {
queue = JSON.parse(this.response)
}
request.send()
updateTable()
}
function updateQueue() {
var request = new XMLHttpRequest()
request.open('POST', './queue', false)
request.onload = function () {
queue = JSON.parse(this.response)
}
request.send(vid)
updateTable()
}
function nextVideo() {
updateQueue()
if (queue.length > 0) {
vid = queue[0].ID
} else {
vid = ""
}
player.loadVideoById(vid)
updateTable()
}
function onYouTubeIframeAPIReady() {
if (queue.length != 0) {
vid = queue[0].ID
}
console.log(vid)
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: vid,
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
function onPlayerStateChange(event) {
if (event.data === 0) {
nextVideo()
}
}
initQueue()
setInterval(bgUpdateQueue, 4000);
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

4
web/style.css Normal file
View file

@ -0,0 +1,4 @@
body {
background-color: #000000;
color: #ffffff;
}