Skip to content

Commit

Permalink
cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
CodeGoy authored Oct 30, 2024
1 parent 72fb029 commit 93c9ffa
Show file tree
Hide file tree
Showing 4 changed files with 81 additions and 18 deletions.
2 changes: 1 addition & 1 deletion FyneApp.toml
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,5 @@ Website = "https://gitlab.com/codegoy/obs-drops-overlay"
Icon = "Icon.png"
Name = "OBS-drops-overlay"
ID = "codegoy.obs.overlay"
Version = "265.703.618"
Version = "1"
Build = 1
37 changes: 32 additions & 5 deletions control.html
Original file line number Diff line number Diff line change
Expand Up @@ -77,10 +77,9 @@ <h1 style="margin: 0">Audio</h1>
<label for="audioVolume">Audio Volume</label><input type="range" value=1.0 step=0.01 max=1 min=0 id="audioVolume" onchange="setVolume(document.getElementById('audioVolume').value, 'audioVolume')">
<br>
<label for="playbackRate">playbackRate</label><input type="range" value=1.0 step=0.1 max=2.0 min=0.4 id="playbackRate" onchange="let pvr = document.getElementById('playbackRate').value;setVolume(pvr, 'playbackRate');document.getElementById('playbackRateValue').innerText = pvr"> <span id="playbackRateValue">1.0</span> <button onclick="setVolume('1', 'playbackRate');document.getElementById('playbackRate').value = 1;document.getElementById('playbackRateValue').innerText = '1'">[1.0]</button>
<!-- TODO : send echo delay from an input range -->
<br>
<label for="echoChecked">Echo:<input type="checkbox" id="echoChecked"></label>
<label for="echoDelay">Delay:<input min="15" max="50" value="25" step="1" type="range" id="echoDelay" onchange="let edv = document.getElementById('echoDelay').value;setEchoDelay(edv);document.getElementById('echoDelayValue').innerText = edv"></label>
<label for="echoDelay">Delay:<input min="35" max="250" value="50" step="1" type="range" id="echoDelay" onchange="let edv = document.getElementById('echoDelay').value;setEchoDelay(edv);document.getElementById('echoDelayValue').innerText = edv"></label>
<span id="echoDelayValue"></span>
</div>
<div id="dropsAudio"></div>
Expand Down Expand Up @@ -108,6 +107,7 @@ <h1 style="margin: 0">Video</h1>
<button onclick="sendControlMessage('video', 'stop', '');">stop vid</button>
<button onclick="sendVideo(document.getElementById('vid').value)">send vid</button>
<button onclick="sendControlMessage('video', 'pr', '');">vid pause/resume</button>
<span id="videoPlayerState" style="color: green">Ready</span>
<br>
<label for="videoPlaybackRate">Video Playback Rate</label>
<input type="range" value=1.0 step=0.2 max=2 min=0.2 id="videoPlaybackRate" onchange="let vprv = document.getElementById('videoPlaybackRate').value;setVolume(vprv, 'videoPlaybackRate');document.getElementById('videoPlaybackRateValue').innerText = vprv;">
Expand Down Expand Up @@ -143,6 +143,7 @@ <h1 style="margin: 0">Music</h1>
}
};
console.log("Version: {{ .Version }}");
// TODO : clean up vars
let ws;
let host = location.host;
let overlayStatus = false;
Expand All @@ -155,9 +156,10 @@ <h1 style="margin: 0">Music</h1>
let videoProgressIntEm = document.getElementById("videoProgressIntEm");
let videoProgress = document.getElementById("videoProgress");
let videoProgressInteraction = false;
let videoPlayerState = document.getElementById("videoPlayerState");
let videoDropEm = document.getElementById("dropsVideo");
let videoProgressDuration;
let videoProgressCurrent;
let videoProgressDuration = 0;
let videoProgressCurrent = 0;
let videoLoopNext = false;
let videoLoopTitlesEm = document.getElementById("videoLoopTitles");
let videoLoopTitles = [];
Expand All @@ -181,7 +183,14 @@ <h1 style="margin: 0">Music</h1>
let timeFix = (seconds) => {
const date = new Date(0);
date.setSeconds(seconds);
return date.toISOString().substring(11, 19);
let rn;
try {
rn = date.toISOString().substring(19, 11);
} catch (e) {
console.log(`error: Failed to parse seconds ${seconds}: ${e}`);
return;
}
return rn;
};
let continuousPlay = (index) => {
let position = index;
Expand Down Expand Up @@ -230,6 +239,24 @@ <h1 style="margin: 0">Music</h1>
videoProgress.max = value;
videoProgressDuration = value;
break;
case "state":
videoPlayerState.innerText = value;
console.log(`videoPlayerState: ${value}`);
switch (value) {
case "playing":
videoPlayerState.style.color = "green";
break;
case "ready":
videoProgress.max = 1;
videoProgress.value = 0;
videoPlayerState.style.color = "green";
videoProgressCurrent = 0;
videoProgressDuration = 0;
break;
case "paused":
videoPlayerState.style.color = "red";
break;
}
}
videoProgressIntEm.innerText = `${timeFix(videoProgressCurrent)}/${timeFix(videoProgressDuration)}`;
break;
Expand Down
2 changes: 1 addition & 1 deletion main.go
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ var (
controlLink string
overlayLink string
mediaExt = []string{".mp4", ".mkv", ".mp3"}
version = "265.703.618"
version = "1"
)

type Server struct {
Expand Down
58 changes: 47 additions & 11 deletions overlay.html
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
</head>
<body>
<div id="videoDiv" class="hide">
<video id="videoEm" src="" onended="videoControl('', false)"></video>
<video id="videoEm" src="" onended="videoControl('', false);isVideoEnded = true;videoEnded()"></video>
</div>
<script>
console.log("Version: {{ .Version }}");
Expand All @@ -48,48 +48,60 @@
let assetUrl = `http://${host}/assets?file=`
let cws;
let connectionStatus = false;
let echoLoopCount = 7;
let playingAudio = [];
let playingAudioCount = 0;
let playingMusic;
let audioVol = 0.8;
let audioPlaybackRate = 1.0;
let videoPlaybackRate = 1.0;
let isVideoEnded = false;
let musicVol = 0.2;
let videoVol = 0.8;
let videoPlayerState = "ready";
let vidDiv = document.getElementById("videoDiv");
let vid = document.getElementById("videoEm");
let videoControl = (data, show) => {
if (data.length > 0) {
console.log(`videoControl: ${data} -> ${show}`);
if (data !== "") {
console.log(`videoControl: ${data}`);
vid.src = data;
}
if (show) {
isVideoEnded = false;
vidDiv.classList.remove("hide");
vidDiv.classList.add("show");
vid.currentTime = 0;
vid.play();
vid.playbackRate = videoPlaybackRate;
vid.volume = videoVol;
} else {
vid.pause()
vid.currentTime = 0;
vid.src = "";
vidDiv.classList.remove("show");
vidDiv.classList.add("hide");
}
};
let echoTimeout = 35; // ms
let echo = (count, audioFilename) => {
let echo = (count, audioFilename, vol) => {
if (count <= 0) {
console.log("echo loop finished");
return
}
let nv = vol/1.3
//console.log(`echo ${count}: ${nv}`);
setTimeout(echo.bind(this, count - 1, audioFilename, nv), echoTimeout);
let na = new Audio(`${assetUrl}${audioFilename}`);
playingAudio.push(na);
na.playbackRate = audioPlaybackRate;
na.volume = audioVol / 2.3;
na.volume = nv;
na.play();
console.log(`Echo: ${count} ${audioFilename}`);
setTimeout(echo.bind(this, count - 1, audioFilename), echoTimeout);
playingAudioCount++;
na.onended = () => {
playingAudioCount--;
}
};
let processControlMessage = (msg) => {
//console.log(msg);
let jd;
try {
jd = JSON.parse(msg.data);
Expand All @@ -106,6 +118,7 @@
case "video":
switch (key) {
case "play":
console.log(`${value} play`);
if (`${value}`.includes("https://")||`${value}`.includes("http://")) {
videoControl(`${value}`, true);
} else {
Expand Down Expand Up @@ -150,24 +163,27 @@
case "audio":
switch (key) {
case "echoDelay":
console.log(`echoDelay: ${value}`);
echoTimeout = value;
break;
case "echo":
console.log(`echo: ${value}`);
echo(5, value);
echo(echoLoopCount, value, audioVol);
break;
case "play":
let na = new Audio(`${assetUrl}${value}`);
playingAudio.push(na);
na.playbackRate = audioPlaybackRate;
na.volume = audioVol;
na.play();
playingAudioCount++;
na.onended = () => {
playingAudioCount--;
}
break;
case "stop":
playingAudio.forEach((item) => {
item.pause();
});
playingAudioCount = 0;
playingAudio = [];
break;
}
Expand Down Expand Up @@ -237,16 +253,36 @@
console.log("Socket is closed, connecting...");
connect();
}
if (playingAudioCount === 0 && playingAudio.length > 0) {
console.log(`Playing Audio count ${playingAudioCount}, all audio ended`);
playingAudio = [];
}
}, 5000);

let videoEnded = () => {
videoPlayerState = "ready";
cws.send(JSON.stringify({a: "video", k: "state", v: "ready"}));

};
setInterval(() => {
cws.send(JSON.stringify({a: "status", k: "connection", v: "connected"}));
if (playingMusic != null) {
cws.send(JSON.stringify({a: "music", k: "progress", v: playingMusic.currentTime}));
cws.send(JSON.stringify({a: "music", k: "duration", v: playingMusic.duration}));
}
if (vid.currentTime > 0 && !vid.paused && !vid.ended && vid.readyState > 2) {
if (videoPlayerState !== "playing") {
cws.send(JSON.stringify({a: "video", k: "state", v: "playing"}))
videoPlayerState = "playing";
}
cws.send(JSON.stringify({a: "video", k: "progress", v: vid.currentTime}));
cws.send(JSON.stringify({a: "video", k: "duration", v: vid.duration}));
} else if (vid.paused && !vid.ended && !isVideoEnded) {
console.log(`${vid.src} paused ${vid.paused}`);
if (videoPlayerState !== "paused") {
videoPlayerState = "paused";
cws.send(JSON.stringify({a: "video", k: "state", v: "paused"}));
}
}
}, 100);
</script>
Expand Down

0 comments on commit 93c9ffa

Please sign in to comment.