add assets & rudimentary playing
Signed-off-by: Christian Richter <crichter@owncloud.com>
This commit is contained in:
77
assets/index.html
Normal file
77
assets/index.html
Normal file
@@ -0,0 +1,77 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<script type='text/javascript' src='http://www.youtube.com/player_api'></script>
|
||||||
|
<title>Weirdradio</title></head>
|
||||||
|
<body onload="connectSocket()">
|
||||||
|
<div id="player"></div>
|
||||||
|
</body>
|
||||||
|
<script>
|
||||||
|
// 2. This code loads the IFrame Player API code asynchronously.
|
||||||
|
var tag = document.createElement('script');
|
||||||
|
|
||||||
|
tag.src = "https://www.youtube.com/iframe_api";
|
||||||
|
var firstScriptTag = document.getElementsByTagName('script')[0];
|
||||||
|
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
|
||||||
|
|
||||||
|
// 3. This function creates an <iframe> (and YouTube player)
|
||||||
|
// after the API code downloads.
|
||||||
|
var player;
|
||||||
|
function onYouTubeIframeAPIReady() {
|
||||||
|
player = new YT.Player('player', {
|
||||||
|
height: '390',
|
||||||
|
width: '640',
|
||||||
|
videoId: 'Wch3gJG2GJ4',
|
||||||
|
playerVars: {
|
||||||
|
'playsinline': 1
|
||||||
|
},
|
||||||
|
events: {
|
||||||
|
'onReady': onPlayerReady,
|
||||||
|
'onStateChange': onPlayerStateChange
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 4. The API will call this function when the video player is ready.
|
||||||
|
function onPlayerReady(event) {
|
||||||
|
event.target.playVideo();
|
||||||
|
}
|
||||||
|
|
||||||
|
// 5. The API calls this function when the player's state changes.
|
||||||
|
// The function indicates that when playing a video (state=1),
|
||||||
|
// the player should play for six seconds and then stop.
|
||||||
|
var done = false;
|
||||||
|
function onPlayerStateChange(event) {
|
||||||
|
if (event.data == 0) {
|
||||||
|
console.log("playing stopped")
|
||||||
|
}
|
||||||
|
//if (event.data == YT.PlayerState.PLAYING && !done) {
|
||||||
|
// setTimeout(stopVideo, 6000);
|
||||||
|
// done = true;
|
||||||
|
//}
|
||||||
|
}
|
||||||
|
function stopVideo() {
|
||||||
|
player.stopVideo();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script lang="Javascript">
|
||||||
|
|
||||||
|
function connectSocket() {
|
||||||
|
baseUrl = (window.location.host).replace("8080", "8090")
|
||||||
|
let socket = new WebSocket("ws://"+baseUrl);
|
||||||
|
socket.onopen = function(e) {
|
||||||
|
console.log("[open] Connection established");
|
||||||
|
};
|
||||||
|
socket.onmessage = function(event) {
|
||||||
|
data = JSON.parse(event.data)
|
||||||
|
if (data["videoId"] != undefined && data["videoId"] != null) {
|
||||||
|
player.loadVideoById(data["videoId"])
|
||||||
|
player.playVideo()
|
||||||
|
console.log(`[message] Data received from server: ${event.data}`);
|
||||||
|
} else {
|
||||||
|
console.log(`[unparseable message] Data received from server ${event.data}`)
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</html>
|
||||||
@@ -81,14 +81,16 @@ client.on("room.message", (roomId, event) => {
|
|||||||
//link_matches = body.match(/https?:\/\/[^\ ]*youtu[^\ ]*/g);
|
//link_matches = body.match(/https?:\/\/[^\ ]*youtu[^\ ]*/g);
|
||||||
var r = new RegExp(/https?:\/\/[^\ ]*youtube.com\/watch\?v=([^\ ]*)/g);
|
var r = new RegExp(/https?:\/\/[^\ ]*youtube.com\/watch\?v=([^\ ]*)/g);
|
||||||
link_matches = r.exec(body);
|
link_matches = r.exec(body);
|
||||||
console.log(link_matches);
|
|
||||||
if (link_matches && link_matches.length > 1) {
|
if (link_matches && link_matches.length > 1) {
|
||||||
console.log("Relaying: " + link_matches[0]);
|
|
||||||
// pass to server
|
// pass to server
|
||||||
var obj = {
|
var obj = {
|
||||||
link:
|
link: link_matches[0],
|
||||||
|
embedLink:
|
||||||
"https://www.youtube.com/embed/" + link_matches[1] + "?autoplay=1",
|
"https://www.youtube.com/embed/" + link_matches[1] + "?autoplay=1",
|
||||||
|
videoId: link_matches[1],
|
||||||
|
|
||||||
};
|
};
|
||||||
|
console.log("Relaying: " + obj.link);
|
||||||
sockets.forEach((s) => s.send(JSON.stringify(obj)));
|
sockets.forEach((s) => s.send(JSON.stringify(obj)));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user