specter/CyTube
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Fix a bunch of stuff; refactor clientside

Browse source
This commit is contained in:
calzoneman 2013-04-03 17:56:03 -05:00
parent 5880be6f68
commit 28a0a95851
4 changed files with 183 additions and 214 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
channel.js
View file

@ -277,7 +277,7 @@ Channel.prototype.userJoin = function(user) {
// Set the new guy up
this.sendPlaylist(user);
this.sendMediaUpdate(user);
user.socket.emit("queueLock", {locked: this.qlocked});
user.socket.emit("queueLock", {locked: !this.openqueue});
this.sendUserlist(user);
this.sendRecentChat(user);
if(this.poll) {
@ -355,7 +355,7 @@ Channel.prototype.sendPlaylist = function(user) {
pl: this.queue
});
user.socket.emit("updatePlaylistIdx", {
idx: this.currentPosition
idx: this.position
});
}
@ -695,8 +695,7 @@ Channel.prototype.tryUpdate = function(user, data) {
return;
}
if(data.id == undefined || data.title == undefined ||
data.seconds == undefined || data.type == undefined) {
if(data.id == undefined || data.currentTime == undefined) {
return;
}
@ -705,7 +704,11 @@ Channel.prototype.tryUpdate = function(user, data) {
return;
}
this.media = new Media(data.id, data.title, data.seconds, data.type);
if(this.media.id != data.id) {
return;
}
this.media.currentTime = data.currentTime;
this.sendAll("mediaUpdate", this.media.packupdate());
}

293
www/assets/js/callbacks.js
View file

@ -12,18 +12,30 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
// Wrapped in a function so I can ensure that the socket
// is defined before these statements are run
function initCallbacks() {
/* REGION Globals */
socket.on("disconnect", function() {
$("<div/>").addClass("alert").addClass("alert-error")
.insertAfter($(".row")[0])[0]
.innerHTML = "<h3>Disconnected from server</h3>";
});
socket.on("announcement", function(data) {
showAnnouncement(data.title, data.text);
});
/* REGION Channel Meta */
socket.on("channelNotRegistered", function() {
showChannelRegistration();
});
socket.on("announcement", function(data) {
showAnnouncement(data.title, data.text);
socket.on("registerChannel", function(data) {
if(data.success) {
$("#chregnotice").remove();
}
else {
alert(data.error);
}
});
socket.on("updateMotd", function(data) {
@ -39,41 +51,6 @@ function initCallbacks() {
updateChatFilters(data.filters);
});
socket.on("registerChannel", function(data) {
if(data.success) {
$("#chregnotice").remove();
}
else {
alert(data.error);
}
});
socket.on("rank", function(data) {
RANK = data.rank;
handleRankChange();
});
socket.on("login", function(data) {
if(!data.success)
alert(data.error);
else {
$("#welcome")[0].innerHTML = "Welcome, " + uname;
$("#loginform").css("display", "none");
$("#logoutform").css("display", "");
$("#loggedin").css("display", "");
if(pw != "") {
createCookie("sync_uname", uname, 1);
createCookie("sync_pw", pw, 1);
}
}
});
socket.on("register", function(data) {
if(data.error) {
alert(data.error);
}
});
socket.on("channelOpts", function(opts) {
$("#opt_qopen_allow_qnext").prop("checked", opts.qopen_allow_qnext);
$("#opt_qopen_allow_move").prop("checked", opts.qopen_allow_move);
@ -95,6 +72,8 @@ function initCallbacks() {
CHANNELOPTS = opts;
if(opts.qopen_allow_qnext)
$("#queue_next").attr("disabled", false);
else if(RANK < Rank.Moderator && !LEADER)
$("#queue_next").attr("disabled", true);
if(opts.qopen_allow_playnext)
$("#play_next").attr("disabled", false);
else if(RANK < Rank.Moderator && !LEADER)
@ -111,13 +90,44 @@ function initCallbacks() {
updateBanlist(data.entries);
});
/* REGION Rank Stuff */
socket.on("rank", function(data) {
RANK = data.rank;
handleRankChange();
});
socket.on("register", function(data) {
if(data.error) {
alert(data.error);
}
});
socket.on("login", function(data) {
if(!data.success)
alert(data.error);
else {
$("#welcome")[0].innerHTML = "Welcome, " + uname;
$("#loginform").css("display", "none");
$("#logoutform").css("display", "");
$("#loggedin").css("display", "");
if(pw != "") {
createCookie("sync_uname", uname, 1);
createCookie("sync_pw", pw, 1);
}
}
});
/* REGION Chat */
socket.on("usercount", function(data) {
$("#usercount").text(data.count + " connected users");
});
socket.on("chatMsg", function(data) {
var div = formatChatMessage(data);
$("#messagebuffer")[0].appendChild(div);
div.appendTo($("#messagebuffer"));
// Cap chatbox at most recent 100 messages
if($("#messagebuffer").children().length > 100) {
$($("#messagebufer").children()[0]).remove();
@ -126,7 +136,63 @@ function initCallbacks() {
$("#messagebuffer").scrollTop($("#messagebuffer").prop("scrollHeight"));
});
socket.on("userlist", function(data) {
for(var i = 0; i < data.length; i++) {
addUser(data[i].name, data[i].rank, data[i].leader);
}
});
socket.on("addUser", function(data) {
addUser(data.name, data.rank, data.leader);
});
socket.on("updateUser", function(data) {
if(data.name == uname) {
LEADER = data.leader;
handleRankChange();
if(LEADER) {
// I'm a leader! Set up sync function
sendVideoUpdate = function() {
PLAYER.getTime(function(seconds) {
socket.emit("mediaUpdate", {
id: PLAYER.id,
currentTime: seconds,
paused: false,
type: PLAYER.type
});
});
};
}
// I'm not a leader. Don't send syncs to the server
else {
sendVideoUpdate = function() { }
}
}
var users = $("#userlist").children();
for(var i = 0; i < users.length; i++) {
var name = users[i].children[1].innerHTML;
// Reformat user
if(name == data.name) {
fmtUserlistItem(users[i], data.rank, data.leader);
}
}
});
socket.on("userLeave", function(data) {
var users = $("#userlist").children();
for(var i = 0; i < users.length; i++) {
var name = users[i].children[1].innerHTML;
if(name == data.name) {
$("#userlist")[0].removeChild(users[i]);
}
}
});
/* REGION Playlist Stuff */
socket.on("playlist", function(data) {
// Clear the playlist first
var ul = $("#queue")[0];
var n = ul.children.length;
for(var i = 0; i < n; i++) {
@ -155,15 +221,38 @@ function initCallbacks() {
socket.on("unqueue", function(data) {
var li = $("#queue").children()[data.pos];
//$(li).hide("blind", function() {
$(li).remove();
//});
$(li).remove();
});
socket.on("moveVideo", function(data) {
moveVideo(data.src, data.dest);
});
socket.on("updatePlaylistIdx", function(data) {
if(data.old != undefined) {
var liold = $("#queue").children()[data.old];
$(liold).removeClass("alert alert-info");
}
var linew = $("#queue").children()[data.idx];
$(linew).addClass("alert alert-info");
POSITION = data.idx;
$("#voteskip").attr("disabled", false);
});
socket.on("mediaUpdate", function(data) {
$("#currenttitle").text("Currently Playing: " + data.title);
if(data.type != "sc" && MEDIATYPE == "sc")
// [](/goddamnitmango)
fixSoundcloudShit();
if(data.type != MEDIATYPE) {
MEDIATYPE = data.type;
PLAYER = new Media(data);
}
else if(PLAYER.update) {
PLAYER.update(data);
}
});
socket.on("queueLock", function(data) {
OPENQUEUE = !data.locked;
if(OPENQUEUE) {
@ -177,8 +266,9 @@ function initCallbacks() {
$("#play_next").attr("disabled", true);
}
}
else if(RANK < Rank.Moderator) {
else if(RANK < Rank.Moderator && !LEADER) {
$("#playlist_controls").css("display", "none");
rebuildPlaylist();
}
if(OPENQUEUE) {
$("#qlockbtn").removeClass("btn-danger")
@ -192,123 +282,6 @@ function initCallbacks() {
}
});
socket.on("updatePlaylistIdx", function(data) {
if(data.old != undefined) {
console.log("unhighlight", data.old);
var liold = $("#queue").children()[data.old];
$(liold).removeClass("alert alert-info");
}
var linew = $("#queue").children()[data.idx];
$(linew).addClass("alert alert-info");
POSITION = data.idx;
$("#voteskip").attr("disabled", false);
});
socket.on("mediaUpdate", function(data) {
$("#currenttitle").text("Currently Playing: " + data.title);
if(data.type != "sc" && MEDIATYPE == "sc")
fixSoundcloudShit();
if(data.type != MEDIATYPE) {
MEDIATYPE = data.type;
PLAYER = new Media(data);
}
else {
PLAYER.update(data);
}
});
socket.on("userlist", function(data) {
for(var i = 0; i < data.length; i++) {
addUser(data[i].name, data[i].rank, data[i].leader);
}
});
socket.on("addUser", function(data) {
addUser(data.name, data.rank, data.leader);
});
socket.on("updateUser", function(data) {
if(data.name == uname) {
LEADER = data.leader;
handleRankChange();
if(LEADER) {
// I'm a leader! Set up sync function
sendVideoUpdate = function() {
PLAYER.getTime(function(seconds) {
socket.emit("mediaUpdate", {
id: PLAYER.id,
seconds: seconds,
paused: false,
type: PLAYER.type
});
});
/*
if(MEDIATYPE == "yt") {
socket.emit("mediaUpdate", {
id: parseYTURL(PLAYER.getVideoUrl()),
seconds: PLAYER.getCurrentTime(),
paused: PLAYER.getPlayerState() == YT.PlayerState.PAUSED,
type: "yt"
});
}
else if(MEDIATYPE == "sc") {
PLAYER.getPosition(function(pos) {
socket.emit("mediaUpdate", {
id: PLAYER.mediaId,
seconds: pos / 1000,
paused: false,
type: "sc"
});
});
}
else if(MEDIATYPE == "vi") {
PLAYER.api("getCurrentTime", function(data) {
socket.emit("mediaUpdate", {
id: PLAYER.videoid,
seconds: data,
paused: false,
type: "vi"
});
});
}
else if(MEDIATYPE == "dm") {
socket.emit("mediaUpdate", {
id: PLAYER.mediaId,
seconds: PLAYER.currentTime,
paused: PLAYER.paused,
type: "dm"
});
}
*/
};
}
// I'm not a leader. Don"t send syncs to the server
else {
sendVideoUpdate = function() { }
}
}
var users = $("#userlist").children();
for(var i = 0; i < users.length; i++) {
var name = users[i].children[1].innerHTML;
// Reformat user
if(name == data.name) {
fmtUserlistItem(users[i], data.rank, data.leader);
}
}
});
socket.on("userLeave", function(data) {
var users = $("#userlist").children();
for(var i = 0; i < users.length; i++) {
var name = users[i].children[1].innerHTML;
if(name == data.name) {
$("#userlist")[0].removeChild(users[i]);
}
}
});
socket.on("librarySearchResults", function(data) {
var n = $("#library").children().length;
for(var i = 0; i < n; i++) {
@ -323,6 +296,8 @@ function initCallbacks() {
}
});
/* REGION Poll */
socket.on("newPoll", function(data) {
addPoll(data);
if(SCROLLCHAT) {

81
www/assets/js/functions.js
View file

@ -11,36 +11,32 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
// Adds a user to the chatbox userlist
function addUser(name, rank, leader) {
var div = document.createElement("div");
$(div).attr("class", "userlist_item");
var span = document.createElement("span");
var flair = document.createElement("span");
span.innerHTML = name;
div.appendChild(flair);
div.appendChild(span);
fmtUserlistItem(div, rank, leader);
var div = $("<div/>").attr("class", "userlist_item");
var flair = $("<span/>").appendTo(div);
var nametag = $("<span/>").text(name).appendTo(div);
fmtUserlistItem(div[0], rank, leader);
if(RANK >= Rank.Moderator)
addUserDropdown(div, name);
var users = $("#userlist").children();
for(var i = 0; i < users.length; i++) {
var othername = users[i].children[1].innerHTML;
if(othername.toLowerCase() > name.toLowerCase()) {
$(div).insertBefore(users[i]);
div.insertBefore(users[i]);
return;
}
}
$("#userlist")[0].appendChild(div);
div.appendTo($("#userlist"));
}
// Format a userlist entry based on a person"s rank
function fmtUserlistItem(div, rank, leader) {
var span = div.children[1];
var name = div.children[1];
if(rank >= Rank.Siteadmin)
$(span).attr("class", "userlist_siteadmin");
$(name).attr("class", "userlist_siteadmin");
else if(rank >= Rank.Owner)
$(span).attr("class", "userlist_owner");
$(name).attr("class", "userlist_owner");
else if(rank >= Rank.Moderator)
$(span).attr("class", "userlist_op");
$(name).attr("class", "userlist_op");
var flair = div.children[0];
// denote current leader with [L]
@ -127,9 +123,9 @@ function addUserDropdown(entry, name) {
}
function formatChatMessage(data) {
var div = document.createElement("div");
var div = $("<div/>");
if(data.msg.toUpperCase().indexOf(uname.toUpperCase()) != -1) {
$(div).addClass("nick-highlight");
div.addClass("nick-highlight");
if(!FOCUSED) {
TITLE_BLINK = setInterval(function() {
if(document.title == "*Chat*")
@ -140,21 +136,18 @@ function formatChatMessage(data) {
}
}
if(data.msgclass == "action") {
var message = document.createElement("span");
$(message).addClass("action");
message.innerHTML = data.username + " " + data.msg;
div.appendChild(message);
var message = $("<span/>").text(data.username + " " + data.msg)
.addClass("action")
.appendTo(div);
}
else {
var name = document.createElement("span");
var message = document.createElement("span");
name.innerHTML = "<strong>&lt;" + data.username + "&gt;</strong> ";
var name = $("<span/>");
$("<strong/>").text("<" + data.username + ">").appendTo(name);
if(data.msgclass == "shout")
$(name).addClass("shout");
$(message).addClass(data.msgclass);
message.innerHTML = data.msg;
div.appendChild(name);
div.appendChild(message);
name.addClass("shout");
var message = $("<span/>").text(data.msg).addClass(data.msgclass);
name.appendTo(div);
message.appendTo(div);
}
return div;
}
@ -265,6 +258,8 @@ function addLibraryButtons(li, id) {
var btnNext = $("<button />").attr("class", "btn qe_btn").appendTo(btnstrip);
//$("<i />").attr("class", "icon-play").appendTo(btnNext);
btnNext.text("Next");
if(!CHANNELOPTS.qopen_allow_qnext)
btnNext.attr("disabled", true);
var btnEnd = $("<button />").attr("class", "btn qe_btn").appendTo(btnstrip);
//$("<i />").attr("class", "icon-fast-forward").appendTo(btnEnd);
@ -288,25 +283,25 @@ function addLibraryButtons(li, id) {
// Rearranges the queue
function moveVideo(src, dest, noanim) {
var li = $("#queue").children()[src];
var li = $($("#queue").children()[src]);
var ul = $("#queue")[0];
if(noanim) {
ul.removeChild(li);
li.detach();
if(dest == ul.children.length) {
ul.appendChild(li);
li.appendTo(ul);
}
else {
ul.insertBefore(li, ul.getElementsByTagName("li")[dest]);
li.insertBefore(ul.getElementsByTagName("li")[dest]);
}
}
else {
$(li).hide("blind", function() {
ul.removeChild(li);
li.hide("blind", function() {
li.detach();
if(dest == ul.children.length) {
ul.appendChild(li);
li.appendTo(ul);
}
else {
ul.insertBefore(li, ul.getElementsByTagName("li")[dest]);
li.insertBefore(ul.getElementsByTagName("li")[dest]);
}
$(li).show("blind");
});
@ -342,18 +337,14 @@ function parseVideoURL(url){
function parseYTURL(url) {
var m = url.match(/v=([^&#]+)/);
if(m) {
// Extract ID
return m[1];
}
var m = url.match(/youtu\.be\/([^&#]+)/);
if(m) {
// Extract ID
return m[1];
}
// Final try
var m = url.match(/([^&#]*)/);
if(m) {
// Extract ID
return m[1];
}
return null;
@ -370,7 +361,6 @@ function parseYTPlaylist(url) {
function parseTwitch(url) {
var m = url.match(/twitch\.tv\/([a-zA-Z0-9]+)/);
if(m) {
// Extract channel name
return m[1];
}
return null;
@ -379,7 +369,6 @@ function parseTwitch(url) {
function parseLivestream(url) {
var m = url.match(/livestream\.com\/([a-zA-Z0-9]+)/);
if(m) {
// Extract channel name
return m[1];
}
return null;
@ -388,7 +377,6 @@ function parseLivestream(url) {
function parseVimeo(url) {
var m = url.match(/vimeo\.com\/([0-9]+)/);
if(m) {
// Extract video ID
return m[1];
}
return null;
@ -435,7 +423,6 @@ function addPoll(data) {
$("<h3/>").text(data.title).appendTo(poll);
for(var i = 0; i < data.options.length; i++) {
var callback = (function(i) { return function() {
console.log(i);
socket.emit("vote", {
option: i
});
@ -600,13 +587,13 @@ function handleRankChange() {
$("#modnav").show();
$("#chancontrols").show();
}
else {
else if(!LEADER) {
if(OPENQUEUE) {
if(CHANNELOPTS.qopen_allow_qnext || LEADER)
if(CHANNELOPTS.qopen_allow_qnext)
$("#queue_next").attr("disabled", false);
else
$("#queue_next").attr("disabled", true);
if(CHANNELOPTS.qopen_allow_playnext || LEADER)
if(CHANNELOPTS.qopen_allow_playnext)
$("#play_next").attr("disabled", false);
else
$("#play_next").attr("disabled", true);

10
www/assets/js/media.js
View file

@ -44,8 +44,10 @@ Media.prototype.initYouTube = function() {
});
this.load = function(data) {
this.player.loadVideoById(data.id, data.currentTime);
this.id = data.id;
if(this.player.loadVideoById) {
this.player.loadVideoById(data.id, data.currentTime);
this.id = data.id;
}
}
this.pause = function() {
@ -230,7 +232,9 @@ Media.prototype.update = function(data) {
}
this.getTime(function(seconds) {
if(Math.abs(data.currentTime - seconds) > SYNC_THRESHOLD) {
this.seek(data.currentTime);
if(!LEADER) {
this.seek(data.currentTime);
}
}
}.bind(this));
}