TeaSpeak/TeaWeb
TeaSpeak/TeaWeb
1
0
Fork 0
Code Issues 1 Pull requests Activity

Implemented a basic music bot pannel

Browse source
This commit is contained in:
WolverinDEV 2018-08-10 22:12:14 +02:00
parent af15c098ad
commit fb05359073
4 changed files with 30 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
index.php
View file

@ -178,9 +178,11 @@
</div>
<div id="contextMenu" class="contextMenu"></div>
<!--
<div style="background-color:white;">
<div style=" color: white; mix-blend-mode: difference;">And stay alive... XXXXXXX</div>
</div>
-->
<div id="templates"></div>
<div id="music-test"></div>

66
js/main.ts
View file

@ -72,72 +72,6 @@ function main() {
}
}
let frame = $("#tmpl_music_frame").renderTag({
song_name: "Hello world song and i don't really know what i should write! XXXXXXXXXXXXX"
}).css("align-self", "center");
/* Play/Pause logic */
console.log(frame.find(".button_play"));
frame.find(".button_play").click(handler => {
frame.find(".button_play").addClass("active");
frame.find(".button_pause").removeClass("active");
});
frame.find(".button_pause").click(handler => {
frame.find(".button_pause").addClass("active");
frame.find(".button_play").removeClass("active");
});
/* Required flip card javascript */
frame.find(".right").mouseenter(() => {
frame.find(".controls-overlay").addClass("flipped");
});
frame.find(".right").mouseleave(() => {
frame.find(".controls-overlay").removeClass("flipped");
});
/* Slider */
frame.find(".timeline .slider").on('mousedown', ev => {
let timeline = frame.find(".timeline");
let time = frame.find(".time");
let slider = timeline.find(".slider");
let slider_old = slider.attr("index");
if(!slider_old || slider_old.length == 0) slider_old = "0";
slider.prop("editing", true);
let move_handler = (event: MouseEvent) => {
let max = timeline.width();
let current = event.pageX - timeline.offset().left - slider.width() / 2;
if(current < 0) current = 0;
else if(current > max) current = max;
time.text(Math.ceil(current / max * 100)); //FIXME!
slider.attr("index", current / max * 100);
slider.css("margin-left", current / max * 100 + "%");
};
$(document).on('mousemove', move_handler as any);
$(document).one('mouseup mouseleave mousedown', event => {
console.log("Event (%i | %s): %o", event.button, event.type, event);
if(event.type == "mousedown" && event.button != 2) return;
$(document).unbind("mousemove", move_handler as any);
if(event.type != "mousedown") {
slider.prop("editing", false);
console.log("Done!");
} else { //Restore old
event.preventDefault();
time.text(slider_old); //FIXME!
slider.attr("index", slider_old);
slider.css("margin-left", slider_old + "%");
}
});
ev.preventDefault();
return false;
});
$("#music-test").replaceWith(frame);
/*
let tag = $("#tmpl_music_frame").renderTag({
//thumbnail: "img/loading_image.svg"

32
js/ui/frames/SelectedItemInfo.ts
View file

@ -351,9 +351,34 @@ class MusicInfoManager extends ClientInfoManager {
if(bot.properties.player_state == 2)
button_play.addClass("active");
else if(bot.properties.player_state == 3)
button_play.addClass("active");
button_pause.addClass("active");
}
{ /* Button functions */
_frame.find(".btn-forward").click(() => {
this.handle.handle.serverConnection.sendCommand("musicbotplayeraction", {
botid: bot.properties.client_database_id,
action: 3
}).then(updated => this.triggerUpdate()).catch(error => {
createErrorModal("Failed to execute forward", "Failed to execute pause.<br>{}".format(error)).open();
this.triggerUpdate();
});
});
_frame.find(".btn-rewind").click(() => {
this.handle.handle.serverConnection.sendCommand("musicbotplayeraction", {
botid: bot.properties.client_database_id,
action: 4
}).then(updated => this.triggerUpdate()).catch(error => {
createErrorModal("Failed to execute rewind", "Failed to execute pause.<br>{}".format(error)).open();
this.triggerUpdate();
});
});
_frame.find(".btn-settings").click(() => {
createErrorModal("Not implemented", "This function is not implemented yet!").open();
});
}
/* Required flip card javascript */
frame.find(".right").mouseenter(() => {
frame.find(".controls-overlay").addClass("flipped");
@ -397,7 +422,7 @@ class MusicInfoManager extends ClientInfoManager {
let current_timestamp = info.player_replay_index + Date.now() - timestamp;
this.handle.handle.serverConnection.sendCommand("musicbotplayeraction", {
botid: bot.properties.client_database_id,
action: current_timestamp > target_timestamp ? 5 : 4,
action: current_timestamp > target_timestamp ? 6 : 5,
units: current_timestamp < target_timestamp ? target_timestamp - current_timestamp : current_timestamp - target_timestamp
}).then(() => this.triggerUpdate()).catch(error => {
slider.prop("edited", false);
@ -423,7 +448,7 @@ class MusicInfoManager extends ClientInfoManager {
let player_time = _frame.find(".player_time");
let update_handler = () => {
let time_index = info.player_replay_index + Date.now() - timestamp;
let time_index = info.player_replay_index + (bot.properties.player_state == 2 ? Date.now() - timestamp : 0);
time_bar.css("width", time_index / info.player_max_index * 100 + "%");
if(!slider.prop("editing") && !slider.prop("edited")) {
@ -431,7 +456,6 @@ class MusicInfoManager extends ClientInfoManager {
slider.css("margin-left", time_index / info.player_max_index * 100 + "%");
}
};
this.registerInterval(setInterval(update_handler, 1000));
update_handler();
}

1
js/voice/VoiceHandler.ts
View file

@ -178,7 +178,6 @@ class VoiceConnection {
createSession() {
return;
this._ice_use_cache = true;
let config: RTCConfiguration = {};