mirror of https://github.com/calzoneman/sync.git
Push to github
This commit is contained in:
calzoneman
commit
68fc74edd5
|
|
@ -0,0 +1,4 @@
|
|||
I promise to actually document this at some point.
|
||||
|
||||
If you want to try it, edit settings in config.js and update
|
||||
`IO_URL` in www/assets/js/client.js
|
||||
|
|
@ -0,0 +1,67 @@
|
|||
var mysql = require('mysql-libmysqlclient');
|
||||
var Config = require('./config.js');
|
||||
|
||||
// Check if a name is taken
|
||||
exports.isRegistered = function(name) {
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'SELECT * FROM registrations WHERE uname="{}"'
|
||||
.replace(/\{\}/, name);
|
||||
var results = db.querySync(query);
|
||||
var rows = results.fetchAllSync();
|
||||
db.closeSync();
|
||||
return rows.length > 0;
|
||||
}
|
||||
|
||||
// Check if a name is valid
|
||||
// Valid names are 1-20 characters, alphanumeric and underscores
|
||||
exports.validateName = function(name) {
|
||||
if(name.length > 20)
|
||||
return false;
|
||||
const VALID_REGEX = /^[a-zA-Z0-9_]+$/;
|
||||
return name.match(VALID_REGEX) != null;
|
||||
}
|
||||
|
||||
// Try to register a new account
|
||||
exports.register = function(name, sha256) {
|
||||
if(!exports.validateName(name))
|
||||
return false;
|
||||
if(exports.isRegistered(name))
|
||||
return false;
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'INSERT INTO registrations VALUES (NULL, "{1}", "{2}", 0)'
|
||||
.replace(/\{1\}/, name)
|
||||
.replace(/\{2\}/, sha256);
|
||||
var results = db.querySync(query);
|
||||
db.closeSync();
|
||||
return results;
|
||||
}
|
||||
|
||||
// Try to login
|
||||
exports.login = function(name, sha256) {
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'SELECT * FROM registrations WHERE uname="{1}" AND pw="{2}"'
|
||||
.replace(/\{1\}/, name)
|
||||
.replace(/\{2\}/, sha256);
|
||||
var results = db.querySync(query);
|
||||
var rows = results.fetchAllSync();
|
||||
db.closeSync();
|
||||
if(rows.length > 0) {
|
||||
return rows[0];
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
|
@ -0,0 +1,563 @@
|
|||
var mysql = require('mysql-libmysqlclient');
|
||||
var Config = require('./config.js');
|
||||
var Rank = require('./rank.js');
|
||||
// I should use the <noun><verb>er naming scheme more often
|
||||
var InfoGetter = require('./get-info.js');
|
||||
var Media = require('./media.js').Media;
|
||||
|
||||
var Channel = function(name) {
|
||||
console.log("Opening channel " + name);
|
||||
this.name = name;
|
||||
this.registered = false;
|
||||
this.users = [];
|
||||
this.queue = [];
|
||||
this.library = {};
|
||||
this.currentPosition = -1;
|
||||
this.currentMedia = null;
|
||||
this.leader = null;
|
||||
this.recentChat = [];
|
||||
|
||||
this.loadMysql();
|
||||
};
|
||||
|
||||
// Check if this channel is registered
|
||||
// If it is, fetch the library
|
||||
Channel.prototype.loadMysql = function() {
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
// Check if channel exists
|
||||
var query = 'SELECT * FROM channels WHERE name="{}"'
|
||||
.replace(/\{\}/, this.name);
|
||||
var results = db.querySync(query);
|
||||
var rows = results.fetchAllSync();
|
||||
if(rows.length == 0) {
|
||||
console.log("Channel " + this.name + " is unregistered");
|
||||
return;
|
||||
}
|
||||
this.registered = true;
|
||||
|
||||
// Load library
|
||||
var query = 'SELECT * FROM chan_{}_library'
|
||||
.replace(/\{\}/, this.name);
|
||||
var results = db.querySync(query);
|
||||
var rows = results.fetchAllSync();
|
||||
for(var i = 0; i < rows.length; i++) {
|
||||
this.library[rows[i].id] = new Media(rows[i].id, rows[i].title, rows[i].seconds, rows[i].type);
|
||||
}
|
||||
console.log("Loaded channel " + this.name + " from MySQL DB");
|
||||
db.closeSync();
|
||||
}
|
||||
|
||||
// Creates a new channel record in the MySQL Database
|
||||
// Currently unused, but might be useful if I add a registration page
|
||||
Channel.prototype.createTables = function() {
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
// Create library table
|
||||
var query= "CREATE TABLE `chan_{}_library` \
|
||||
(`id` VARCHAR(255) NOT NULL, \
|
||||
`title` VARCHAR(255) NOT NULL, \
|
||||
`seconds` INT NOT NULL, \
|
||||
`playtime` VARCHAR(8) NOT NULL, \
|
||||
`type` VARCHAR(2) NOT NULL, \
|
||||
PRIMARY KEY (`id`)) \
|
||||
ENGINE = MyISAM;"
|
||||
.replace(/\{\}/, this.name);
|
||||
var results = db.querySync(query);
|
||||
|
||||
// Create rank table
|
||||
var query = "CREATE TABLE `chan_{}_ranks` (\
|
||||
`name` VARCHAR( 32 ) NOT NULL ,\
|
||||
`rank` INT NOT NULL ,\
|
||||
UNIQUE (\
|
||||
`name`\
|
||||
)\
|
||||
) ENGINE = MYISAM"
|
||||
.replace(/\{\}/, this.name);
|
||||
results = db.querySync(query) || results;
|
||||
|
||||
// Insert into global channel table
|
||||
var query = 'INSERT INTO channels VALUES (NULL, "{}")'
|
||||
.replace(/\{\}/, this.name);
|
||||
db.closeSync();
|
||||
return results;
|
||||
}
|
||||
|
||||
// Retrieves a user's rank from the database
|
||||
Channel.prototype.getRank = function(name) {
|
||||
if(!this.isRegistered)
|
||||
return Rank.Guest;
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'SELECT * FROM chan_{1}_ranks WHERE name="{2}"'
|
||||
.replace(/\{1\}/, this.name)
|
||||
.replace(/\{2\}/, name);
|
||||
var results = db.querySync(query);
|
||||
var rows = results.fetchAllSync();
|
||||
if(rows.length == 0) {
|
||||
return Rank.Guest;
|
||||
}
|
||||
|
||||
db.closeSync();
|
||||
return rows[0].rank;
|
||||
}
|
||||
|
||||
// Saves a user's rank to the database
|
||||
Channel.prototype.saveRank = function(user) {
|
||||
if(!this.registered)
|
||||
return false;
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'UPDATE chan_{1}_ranks SET rank={2} WHERE name={3}'
|
||||
.replace(/\{1\}/, this.name)
|
||||
.replace(/\{2\}/, user.rank)
|
||||
.replace(/\{3\}/, user.name);
|
||||
var results = db.querySync(query);
|
||||
// Gonna have to insert a new one, bugger
|
||||
if(!results) {
|
||||
var query = 'INSERT INTO chan_{1}_ranks SET VALUES({2}, {3})'
|
||||
.replace(/\{1\}/, this.name)
|
||||
.replace(/\{2\}/, user.name)
|
||||
.replace(/\{3\}/, user.rank);
|
||||
results = db.querySync(query);
|
||||
}
|
||||
db.closeSync();
|
||||
return results;
|
||||
}
|
||||
|
||||
// Caches media metadata to the channel library.
|
||||
// If the channel is registered, stores it in the database as well
|
||||
Channel.prototype.addToLibrary = function(media) {
|
||||
this.library[media.id] = media;
|
||||
if(!this.registered)
|
||||
return;
|
||||
var db = mysql.createConnectionSync();
|
||||
db.connectSync(Config.MYSQL_SERVER, Config.MYSQL_USER,
|
||||
Config.MYSQL_PASSWORD, Config.MYSQL_DB);
|
||||
if(!db.connectedSync()) {
|
||||
throw "[](/abchaos) MySQL Connection Failed";
|
||||
}
|
||||
var query = 'INSERT INTO chan_{1}_library VALUES ("{2}", "{3}", {4}, "{5}", "{6}")'
|
||||
.replace(/\{1\}/, this.name)
|
||||
.replace(/\{2\}/, media.id)
|
||||
.replace(/\{3\}/, media.title)
|
||||
.replace(/\{4\}/, media.seconds)
|
||||
.replace(/\{5\}/, media.duration)
|
||||
.replace(/\{6\}/, media.type);
|
||||
var results = db.querySync(query);
|
||||
db.closeSync();
|
||||
return results;
|
||||
}
|
||||
|
||||
// Searches the local library for media titles containing query
|
||||
Channel.prototype.searchLibrary = function(query) {
|
||||
query = query.toLowerCase();
|
||||
var results = [];
|
||||
for(var id in this.library) {
|
||||
if(this.library[id].title.toLowerCase().indexOf(query) != -1) {
|
||||
results.push(this.library[id]);
|
||||
}
|
||||
}
|
||||
results.sort(function(a, b) {
|
||||
var x = a.title.toLowerCase();
|
||||
var y = b.title.toLowerCase();
|
||||
|
||||
return (x == y) ? 0 : (x < y ? -1 : 1);
|
||||
});
|
||||
return results;
|
||||
}
|
||||
|
||||
// Called when a new user enters the channel
|
||||
Channel.prototype.userJoin = function(user) {
|
||||
// If the channel is empty and isn't registered, the first person
|
||||
// gets ownership of the channel (temporarily)
|
||||
if(this.users.length == 0 && !this.registered) {
|
||||
user.rank = (user.rank < Rank.Owner) ? Rank.Owner : user.rank;
|
||||
}
|
||||
this.users.push(user);
|
||||
if(user.name != "") {
|
||||
this.broadcastNewUser(user);
|
||||
}
|
||||
// Set the new guy up
|
||||
this.sendPlaylist(user);
|
||||
this.sendUserlist(user);
|
||||
this.sendRecentChat(user);
|
||||
if(user.playerReady)
|
||||
this.sendMediaUpdate(user);
|
||||
console.log(user.ip + " joined channel " + this.name);
|
||||
}
|
||||
|
||||
// Called when a user leaves the channel
|
||||
Channel.prototype.userLeave = function(user) {
|
||||
this.users.splice(this.users.indexOf(user), 1);
|
||||
if(user.name != "") {
|
||||
this.sendAll('userLeave', {
|
||||
name: user.name
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Queues a new media
|
||||
Channel.prototype.enqueue = function(data) {
|
||||
var idx = data.pos == "next" ? this.currentPosition + 1 : this.queue.length;
|
||||
// Try to look up cached metadata first
|
||||
if(data.id in this.library) {
|
||||
this.queue.splice(idx, 0, this.library[data.id]);
|
||||
this.sendAll('queue', {
|
||||
media: this.library[data.id].pack(),
|
||||
pos: idx
|
||||
});
|
||||
}
|
||||
// Query metadata from YouTube
|
||||
else if(data.type == "yt") {
|
||||
var callback = (function(chan, id) { return function(res, data) {
|
||||
if(res != 200) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Whoever decided on this variable name should be fired
|
||||
var seconds = data.entry.media$group.yt$duration.seconds;
|
||||
// This one's slightly better
|
||||
var title = data.entry.title.$t;
|
||||
var vid = new Media(id, title, seconds, "yt");
|
||||
chan.queue.splice(idx, 0, vid);
|
||||
chan.sendAll('queue', {
|
||||
media: vid.pack(),
|
||||
pos: idx
|
||||
});
|
||||
chan.addToLibrary(vid);
|
||||
}})(this, data.id);
|
||||
InfoGetter.getYTInfo(data.id, callback);
|
||||
}
|
||||
// Set up twitch metadata
|
||||
else if(data.type == "tw") {
|
||||
var media = new Media(data.id, "Twitch ~ " + data.id, 0, "tw");
|
||||
this.queue.splice(idx, 0, media);
|
||||
this.sendAll('queue', {
|
||||
media: media.pack(),
|
||||
pos: idx
|
||||
});
|
||||
}
|
||||
// Query metadata from Soundcloud
|
||||
else if(data.type == "sc") {
|
||||
var callback = (function(chan, id) { return function(res, data) {
|
||||
if(res != 200) {
|
||||
return;
|
||||
}
|
||||
|
||||
var seconds = data.duration / 1000;
|
||||
var title = data.title;
|
||||
var vid = new Media(id, title, seconds, "sc");
|
||||
chan.queue.splice(idx, 0, vid);
|
||||
chan.sendAll('queue', {
|
||||
media: vid.pack(),
|
||||
pos: idx
|
||||
});
|
||||
chan.addToLibrary(vid);
|
||||
}})(this, data.id);
|
||||
InfoGetter.getSCInfo(data.id, callback);
|
||||
}
|
||||
// Query metadata from Vimeo
|
||||
else if(data.type == "vi") {
|
||||
var callback = (function(chan, id) { return function(res, data) {
|
||||
if(res != 200) {
|
||||
return;
|
||||
}
|
||||
|
||||
data = data[0];
|
||||
var seconds = data.duration;
|
||||
var title = data.title;
|
||||
var vid = new Media(id, title, seconds, "vi");
|
||||
chan.queue.splice(idx, 0, vid);
|
||||
chan.sendAll('queue', {
|
||||
media: vid.pack(),
|
||||
pos: idx
|
||||
});
|
||||
chan.addToLibrary(vid);
|
||||
}})(this, data.id);
|
||||
InfoGetter.getVIInfo(data.id, callback);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Removes a media from the play queue
|
||||
Channel.prototype.unqueue = function(data) {
|
||||
// Stop trying to break my server
|
||||
if(data.pos < 0 || data.pos >= this.queue.length)
|
||||
return;
|
||||
|
||||
this.queue.splice(data.pos, 1);
|
||||
this.sendAll('unqueue', {
|
||||
pos: data.pos
|
||||
});
|
||||
|
||||
if(data.pos < this.currentPosition) {
|
||||
this.currentPosition--;
|
||||
this.sendAll('updatePlaylistIdx', {
|
||||
idx: this.currentPosition
|
||||
});
|
||||
}
|
||||
if(data.pos == this.currentPosition) {
|
||||
this.currentPosition--;
|
||||
this.playNext();
|
||||
}
|
||||
}
|
||||
|
||||
// Play the next media in the queue
|
||||
Channel.prototype.playNext = function() {
|
||||
if(this.currentPosition + 1 >= this.queue.length)
|
||||
return;
|
||||
this.currentPosition++;
|
||||
this.currentMedia = this.queue[this.currentPosition];
|
||||
this.currentMedia.currentTime = 0;
|
||||
|
||||
this.sendAll('mediaUpdate', this.currentMedia.packupdate());
|
||||
this.sendAll('updatePlaylistIdx', {
|
||||
idx: this.currentPosition
|
||||
});
|
||||
// Enable autolead for non-twitch
|
||||
if(this.leader == null && this.currentMedia.type != "tw") {
|
||||
time = new Date().getTime();
|
||||
channelVideoUpdate(this, this.currentMedia.id);
|
||||
}
|
||||
}
|
||||
|
||||
// Synchronize to a sync packet from the leader
|
||||
Channel.prototype.update = function(data) {
|
||||
if(this.currentMedia == null)
|
||||
this.currentMedia = data;
|
||||
else
|
||||
this.currentMedia.currentTime = data.seconds;
|
||||
this.sendAll('mediaUpdate', this.currentMedia.packupdate());
|
||||
}
|
||||
|
||||
// Move something around in the queue
|
||||
Channel.prototype.moveMedia = function(data) {
|
||||
if(data.src < 0 || data.src >= this.queue.length)
|
||||
return;
|
||||
if(data.dest < 0 || data.dest > this.queue.length)
|
||||
return;
|
||||
|
||||
var media = this.queue[data.src];
|
||||
this.queue.splice(data.src, 1);
|
||||
this.queue.splice(data.dest, 0, media);
|
||||
this.sendAll('moveVideo', {
|
||||
src: data.src,
|
||||
dest: data.dest
|
||||
});
|
||||
|
||||
if(data.src < this.currentPosition && data.dest >= this.currentPosition) {
|
||||
this.currentPosition--;
|
||||
}
|
||||
if(data.src > this.currentPosition && data.dest < this.currentPosition) {
|
||||
this.currentPosition++
|
||||
}
|
||||
}
|
||||
|
||||
// Chat message from a user
|
||||
Channel.prototype.chatMessage = function(user, msg) {
|
||||
// Temporary code
|
||||
// When I add more modifiers I should store them in a table
|
||||
// of some kind
|
||||
var msgclass = "";
|
||||
if(msg.indexOf("/me ") == 0) {
|
||||
msgclass = "action";
|
||||
msg = msg.substring(3);
|
||||
}
|
||||
else if(msg.indexOf("/sp ") == 0) {
|
||||
msgclass = "spoiler";
|
||||
msg = msg.substring(3);
|
||||
}
|
||||
else if(msg.indexOf(">") == 0)
|
||||
msgclass = "greentext";
|
||||
// I don't want HTML from strangers
|
||||
msg = msg.replace(/</g, "<").replace(/>/g, ">");
|
||||
// Match URLs
|
||||
msg = msg.replace(/(((https?)|(ftp))(:\/\/[0-9a-zA-Z\.]+(:[0-9]+)?[^\s$]+))/, "<a href=\"$1\">$1</a>");
|
||||
this.sendAll('chatMsg', {
|
||||
username: user.name,
|
||||
msg: msg,
|
||||
msgclass: msgclass
|
||||
});
|
||||
this.recentChat.push({
|
||||
username: user.name,
|
||||
msg: msg,
|
||||
msgclass: msgclass
|
||||
});
|
||||
if(this.recentChat.length > 15)
|
||||
this.recentChat.shift();
|
||||
}
|
||||
|
||||
// Promotion! Actor is the client who initiated the promotion, name is the
|
||||
// name of the person being promoted
|
||||
Channel.prototype.promoteUser = function(actor, name) {
|
||||
var receiver;
|
||||
for(var i = 0; i < this.users.length; i++) {
|
||||
if(this.users[i].name == name) {
|
||||
receiver = this.users[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if(receiver) {
|
||||
// You can only promote someone if you are 2 ranks or higher above
|
||||
// them. This way you can't promote them to your rank and end
|
||||
// up in a situation where you can't demote them
|
||||
if(actor.rank > receiver.rank + 1) {
|
||||
receiver.rank++;
|
||||
if(receiver.loggedIn) {
|
||||
this.saveRank(receiver);
|
||||
}
|
||||
this.broadcastRankUpdate(receiver);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// You're fired
|
||||
Channel.prototype.demoteUser = function(actor, name) {
|
||||
var receiver;
|
||||
for(var i = 0; i < this.users.length; i++) {
|
||||
if(this.users[i].name == name) {
|
||||
receiver = this.users[i];
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if(receiver) {
|
||||
// Wouldn't it be funny if you could demote people who rank higher
|
||||
// than you? No, it wouldn't.
|
||||
if(actor.rank > receiver.rank) {
|
||||
receiver.rank--;
|
||||
if(receiver.loggedIn) {
|
||||
this.saveRank(receiver);
|
||||
}
|
||||
this.broadcastRankUpdate(receiver);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Manual leader. This shouldn't be necessary since the server autoleads,
|
||||
// but you never know
|
||||
Channel.prototype.changeLeader = function(name) {
|
||||
if(this.leader != null) {
|
||||
this.leader = null;
|
||||
this.broadcastRankUpdate(this.leader);
|
||||
}
|
||||
if(name == "") {
|
||||
return;
|
||||
}
|
||||
for(var i = 0; i < this.users.length; i++) {
|
||||
if(this.users[i].name == name) {
|
||||
this.leader = this.users[i];
|
||||
this.broadcastRankUpdate(this.leader);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Send the userlist to a client
|
||||
// Do you know you're all my very best friends?
|
||||
Channel.prototype.sendUserlist = function(user) {
|
||||
var users = [];
|
||||
for(var i = 0; i < this.users.length; i++) {
|
||||
// Skip people who haven't logged in
|
||||
if(this.users[i].name != "") {
|
||||
users.push({
|
||||
name: this.users[i].name,
|
||||
rank: this.users[i].rank,
|
||||
leader: this.users[i] == this.leader
|
||||
});
|
||||
}
|
||||
}
|
||||
user.socket.emit('userlist', users)
|
||||
}
|
||||
|
||||
// Send the play queue
|
||||
Channel.prototype.sendPlaylist = function(user) {
|
||||
user.socket.emit('playlist', {
|
||||
pl: this.queue
|
||||
});
|
||||
user.socket.emit('updatePlaylistIdx', {
|
||||
idx: this.currentPosition
|
||||
});
|
||||
}
|
||||
|
||||
// Send the last 15 messages for context
|
||||
Channel.prototype.sendRecentChat = function(user) {
|
||||
for(var i = 0; i < this.recentChat.length; i++) {
|
||||
user.socket.emit('chatMsg', this.recentChat[i]);
|
||||
}
|
||||
}
|
||||
|
||||
// Send a sync packet
|
||||
Channel.prototype.sendMediaUpdate = function(user) {
|
||||
if(this.currentMedia != null)
|
||||
user.socket.emit('mediaUpdate', this.currentMedia.packupdate());
|
||||
}
|
||||
|
||||
// Sent when someone logs in, to add them to the user list
|
||||
Channel.prototype.broadcastNewUser = function(user) {
|
||||
this.sendAll('addUser', {
|
||||
name: user.name,
|
||||
rank: user.rank,
|
||||
leader: this.leader == user
|
||||
});
|
||||
}
|
||||
|
||||
// Someone's rank changed, or their leadership status changed
|
||||
Channel.prototype.broadcastRankUpdate = function(user) {
|
||||
this.sendAll('updateUser', {
|
||||
name: user.name,
|
||||
rank: user.rank,
|
||||
leader: this.leader == user
|
||||
});
|
||||
}
|
||||
|
||||
// Send to ALL the clients!
|
||||
Channel.prototype.sendAll = function(message, data) {
|
||||
for(var i = 0; i < this.users.length; i++) {
|
||||
this.users[i].socket.emit(message, data);
|
||||
}
|
||||
}
|
||||
|
||||
// Accumulator
|
||||
var i = 0;
|
||||
// Time of last update
|
||||
var time = new Date().getTime();
|
||||
// Autolead yay
|
||||
function channelVideoUpdate(chan, id) {
|
||||
// Someone changed the video or there's a manual leader, so your
|
||||
// argument is invalid
|
||||
if(id != chan.currentMedia.id || chan.leader != null)
|
||||
return;
|
||||
// Add dt since last update
|
||||
chan.currentMedia.currentTime += (new Date().getTime() - time)/1000.0;
|
||||
// Video over, move on to next
|
||||
if(chan.currentMedia.currentTime > chan.currentMedia.seconds) {
|
||||
chan.playNext();
|
||||
}
|
||||
// Every ~5 seconds send a sync packet to everyone
|
||||
else if(i % 5 == 0)
|
||||
chan.sendAll('mediaUpdate', chan.currentMedia.packupdate());
|
||||
i++;
|
||||
time = new Date().getTime();
|
||||
// Do it all over again in about a second
|
||||
setTimeout(function() { channelVideoUpdate(chan, id); }, 1000);
|
||||
}
|
||||
|
||||
exports.Channel = Channel;
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
exports.MYSQL_SERVER = '';
|
||||
exports.MYSQL_DB = '';
|
||||
exports.MYSQL_USER = '';
|
||||
exports.MYSQL_PASSWORD = '';
|
||||
exports.IO_PORT = 1337;
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
var http = require('http');
|
||||
|
||||
// Helper function for making an HTTP request and getting the result
|
||||
// as JSON
|
||||
function getJSON(options, callback) {
|
||||
var req = http.request(options, function(res){
|
||||
var buffer = '';
|
||||
res.setEncoding('utf8');
|
||||
res.on('data', function (chunk) {
|
||||
buffer += chunk;
|
||||
});
|
||||
res.on('end', function() {
|
||||
var data = JSON.parse(buffer);
|
||||
callback(res.statusCode, data);
|
||||
});
|
||||
});
|
||||
|
||||
req.end();
|
||||
};
|
||||
|
||||
// Look up YouTube metadata
|
||||
// Fairly straightforward
|
||||
exports.getYTInfo = function(id, callback) {
|
||||
getJSON({
|
||||
host: "gdata.youtube.com",
|
||||
port: 80,
|
||||
path: "/feeds/api/videos/" + id + "?v=2&alt=json",
|
||||
method: "GET",
|
||||
dataType: "jsonp",
|
||||
timeout: 1000}, callback);
|
||||
}
|
||||
|
||||
// Look up Soundcloud metadata
|
||||
// Whoever designed this should rethink it. I'll submit a feedback
|
||||
// form on their website.
|
||||
exports.getSCInfo = function(url, callback) {
|
||||
const SC_CLIENT = '2e0c82ab5a020f3a7509318146128abd';
|
||||
// SoundCloud is dumb
|
||||
// I have to request the API URL for the given input URL
|
||||
// Because the sound ID isn't in the URL
|
||||
getJSON({
|
||||
host: "api.soundcloud.com",
|
||||
port: 80,
|
||||
path: "/resolve.json?url="+url+"&client_id=" + SC_CLIENT,
|
||||
method: "GET",
|
||||
dataType: "jsonp",
|
||||
timeout: 1000}, function(status, data) {
|
||||
// This time we can ACTUALLY get the data we want
|
||||
getJSON({
|
||||
host: "api.soundcloud.com",
|
||||
port: 80,
|
||||
path: data.location,
|
||||
method: "GET",
|
||||
dataType: "jsonp",
|
||||
timeout: 1000}, callback);
|
||||
});
|
||||
}
|
||||
|
||||
// Look up Vimeo metadata. Fairly straightforward
|
||||
exports.getVIInfo = function(id, callback) {
|
||||
getJSON({
|
||||
host: "vimeo.com",
|
||||
port: 80,
|
||||
path: "/api/v2/video/" + id + ".json",
|
||||
method: "GET",
|
||||
dataType: "jsonp",
|
||||
timeout: 1000}, callback);
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
// Helper function for formatting a time value in seconds
|
||||
// to the format hh:mm:ss
|
||||
function formatTime(sec) {
|
||||
sec = Math.floor(sec);
|
||||
var hours="", minutes="", seconds="";
|
||||
if(sec > 3600) {
|
||||
hours = ""+Math.floor(sec / 3600);
|
||||
if(hours.length < 2)
|
||||
hours = "0"+hours;
|
||||
sec = sec % 3600;
|
||||
}
|
||||
minutes = ""+Math.floor(sec / 60);
|
||||
while(minutes.length < 2) {
|
||||
minutes = "0"+minutes;
|
||||
}
|
||||
seconds = ""+(sec % 60);
|
||||
while(seconds.length < 2) {
|
||||
seconds = "0"+seconds;
|
||||
}
|
||||
|
||||
var time = "";
|
||||
if(hours != "")
|
||||
time = hours + ":";
|
||||
time += minutes + ":" + seconds;
|
||||
return time;
|
||||
}
|
||||
|
||||
// Represents a media entry
|
||||
var Media = function(id, title, seconds, type) {
|
||||
this.id = id;
|
||||
this.title = title;
|
||||
this.seconds = seconds;
|
||||
this.duration = formatTime(this.seconds);
|
||||
this.type = type;
|
||||
}
|
||||
|
||||
// Returns an object containing the data in this Media but not the
|
||||
// prototype
|
||||
Media.prototype.pack = function() {
|
||||
return {
|
||||
id: this.id,
|
||||
title: this.title,
|
||||
seconds: this.seconds,
|
||||
duration: this.duration,
|
||||
type: this.type
|
||||
};
|
||||
}
|
||||
|
||||
// Same as pack() but includes the currentTime variable set by the channel
|
||||
// when the media is being synchronized
|
||||
Media.prototype.packupdate = function() {
|
||||
return {
|
||||
id: this.id,
|
||||
title: this.title,
|
||||
seconds: this.seconds,
|
||||
duration: this.duration,
|
||||
type: this.type,
|
||||
currentTime: this.currentTime
|
||||
};
|
||||
}
|
||||
|
||||
exports.Media = Media;
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
exports.Guest = 0;
|
||||
exports.Member = 1;
|
||||
exports.Moderator = 4;
|
||||
exports.Owner = 8;
|
||||
exports.Siteadmin = 255;
|
||||
|
||||
var permissions = {
|
||||
queue: exports.Moderator,
|
||||
assignLeader: exports.Moderator,
|
||||
search: exports.Guest,
|
||||
chat: exports.Guest,
|
||||
};
|
||||
|
||||
// Check if someone has permission to do shit
|
||||
exports.hasPermission = function(user, what) {
|
||||
if(what in permissions) {
|
||||
return user.rank >= permissions[what];
|
||||
}
|
||||
else return false;
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
var User = require('./user.js').User;
|
||||
var Config = require('./config.js');
|
||||
var connect = require('connect');
|
||||
var app = connect.createServer(connect.static(__dirname+'/www')).listen(Config.IO_PORT);
|
||||
var io = require('socket.io').listen(app);
|
||||
|
||||
exports.channels = {};
|
||||
|
||||
io.sockets.on('connection', function(socket) {
|
||||
var user = new User(socket, socket.handshake.address.address);
|
||||
console.log('New connection from /' + user.ip);
|
||||
});
|
||||
|
|
@ -0,0 +1,233 @@
|
|||
var Rank = require('./rank.js');
|
||||
var Auth = require('./auth.js');
|
||||
var Channel = require('./channel.js').Channel;
|
||||
var Server = require('./server.js');
|
||||
|
||||
// Represents a client connected via socket.io
|
||||
var User = function(socket, ip) {
|
||||
this.ip = ip;
|
||||
this.socket = socket;
|
||||
this.loggedIn = false;
|
||||
this.rank = Rank.Guest;
|
||||
this.channel = null;
|
||||
this.playerReady = false;
|
||||
this.name = "";
|
||||
|
||||
this.initCallbacks();
|
||||
};
|
||||
|
||||
// Set up socket callbacks
|
||||
User.prototype.initCallbacks = function() {
|
||||
// What a shame
|
||||
this.socket.on('disconnect', function() {
|
||||
if(this.channel != null)
|
||||
this.channel.userLeave(this);
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('joinChannel', function(data) {
|
||||
// Channel already loaded
|
||||
if(data.name in Server.channels) {
|
||||
this.channel = Server.channels[data.name];
|
||||
this.channel.userJoin(this);
|
||||
}
|
||||
// Channel not loaded
|
||||
else {
|
||||
Server.channels[data.name] = new Channel(data.name);
|
||||
this.channel = Server.channels[data.name];
|
||||
this.channel.userJoin(this);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('login', function(data) {
|
||||
this.login(data.name, data.sha256);
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('register', function(data) {
|
||||
this.register(data.name, data.sha256);
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('assignLeader', function(data) {
|
||||
if(Rank.hasPermission(this, "assignLeader")) {
|
||||
if(this.channel != null)
|
||||
this.channel.changeLeader(data.name);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('promote', function(data) {
|
||||
if(this.channel != null) {
|
||||
this.channel.promoteUser(this, data.name);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('demote', function(data) {
|
||||
if(this.channel != null) {
|
||||
this.channel.demoteUser(this, data.name);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('chatMsg', function(data) {
|
||||
if(this.name != "" && this.channel != null) {
|
||||
this.channel.chatMessage(this, data.msg);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('playerReady', function() {
|
||||
if(this.channel != null) {
|
||||
this.channel.sendMediaUpdate(this);
|
||||
}
|
||||
this.playerReady = true;
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('queue', function(data) {
|
||||
if(Rank.hasPermission(this, "queue")) {
|
||||
if(this.channel != null)
|
||||
this.channel.enqueue(data);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('unqueue', function(data) {
|
||||
if(Rank.hasPermission(this, "queue")) {
|
||||
if(this.channel != null)
|
||||
this.channel.unqueue(data);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('moveMedia', function(data) {
|
||||
if(Rank.hasPermission(this, "queue")) {
|
||||
if(this.channel != null)
|
||||
this.channel.moveMedia(data);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('playNext', function() {
|
||||
if(Rank.hasPermission(this, "queue") ||
|
||||
(this.channel != null && this.channel.leader == this)) {
|
||||
this.channel.playNext();
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('mediaUpdate', function(data) {
|
||||
if(this.channel != null && this.channel.leader == this) {
|
||||
this.channel.update(data);
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
this.socket.on('searchLibrary', function(data) {
|
||||
if(this.channel != null && Rank.hasPermission(this, "search")) {
|
||||
this.socket.emit('librarySearchResults', {
|
||||
results: this.channel.searchLibrary(data.query)
|
||||
});
|
||||
}
|
||||
}.bind(this));
|
||||
|
||||
}
|
||||
|
||||
// Attempt to login
|
||||
User.prototype.login = function(name, sha256) {
|
||||
// No password => try guest login
|
||||
if(sha256 == "") {
|
||||
// Sorry bud, can't take that name
|
||||
if(Auth.isRegistered(name)) {
|
||||
this.socket.emit('login', {
|
||||
success: false,
|
||||
error: "That username is already taken"
|
||||
});
|
||||
return false;
|
||||
}
|
||||
// YOUR ARGUMENT IS INVALID
|
||||
else if(!Auth.validateName(name)) {
|
||||
this.socket.emit('login', {
|
||||
success: false,
|
||||
error: "Invalid username. Usernames must be 1-20 characters long and consist only of alphanumeric characters and underscores"
|
||||
});
|
||||
}
|
||||
// Woah, success!
|
||||
else {
|
||||
console.log(this.ip + " signed in as " + name);
|
||||
this.name = name;
|
||||
this.loggedIn = false;
|
||||
this.socket.emit('login', {
|
||||
success: true
|
||||
});
|
||||
this.socket.emit('rank', {
|
||||
rank: this.rank
|
||||
});
|
||||
if(this.channel != null) {
|
||||
if(this.rank >= Rank.Moderator)
|
||||
this.channel.sendPlaylist(this);
|
||||
this.channel.broadcastNewUser(this);
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
var row;
|
||||
if((row = Auth.login(name, sha256))) {
|
||||
this.socket.emit('login', {
|
||||
success: true
|
||||
});
|
||||
console.log(this.ip + " logged in as " + name);
|
||||
// Sweet, let's look up our rank
|
||||
var chanrank = (this.channel != null) ? this.channel.getRank(name)
|
||||
: Rank.Guest;
|
||||
this.rank = (chanrank > row.global_rank) ? chanrank
|
||||
: row.global_rank;
|
||||
this.socket.emit('rank', {
|
||||
rank: this.rank
|
||||
});
|
||||
this.name = name;
|
||||
if(this.channel != null) {
|
||||
if(this.rank >= Rank.Moderator)
|
||||
this.channel.sendPlaylist(this);
|
||||
this.channel.broadcastNewUser(this);
|
||||
}
|
||||
}
|
||||
// Wrong password
|
||||
else {
|
||||
this.socket.emit('login', {
|
||||
success: false,
|
||||
error: "Invalid username/password pair"
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Attempt to register a user account
|
||||
User.prototype.register = function(name, sha256) {
|
||||
if(sha256 == "") {
|
||||
// Sorry bud, password required
|
||||
this.socket.emit('register', {
|
||||
success: false,
|
||||
error: "You must provide a password"
|
||||
});
|
||||
return false;
|
||||
}
|
||||
else if(Auth.isRegistered(name)) {
|
||||
this.socket.emit('register', {
|
||||
success: false,
|
||||
error: "That username is already taken"
|
||||
});
|
||||
return false;
|
||||
}
|
||||
else if(!Auth.validateName(name)) {
|
||||
this.socket.emit('register', {
|
||||
success: false,
|
||||
error: "Invalid username. Usernames must be 1-20 characters long and consist only of alphanumeric characters and underscores"
|
||||
});
|
||||
}
|
||||
else if(Auth.register(name, sha256)) {
|
||||
console.log(this.ip + " registered " + name);
|
||||
this.socket.emit('register', {
|
||||
success: true
|
||||
});
|
||||
this.login(name, sha256);
|
||||
}
|
||||
else {
|
||||
this.socket.emit('register', {
|
||||
success: false,
|
||||
error: "[](/ppshrug) Registration Failed."
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
exports.User = User;
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,75 @@
|
|||
.videolist {
|
||||
list-style: none outside none;
|
||||
margin-left: 0;
|
||||
max-height: 500px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.videolist li {
|
||||
margin: 2px 0 0 auto;
|
||||
padding: 2px;
|
||||
font-size: 8pt;
|
||||
border: 1px solid #aaaaaa; // [](/w21)
|
||||
}
|
||||
|
||||
.qe_btn {
|
||||
height: 20px;
|
||||
font-family: Monospace;
|
||||
padding: 0 5px;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.qe_buttons {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.qe_title {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.qe_time {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.qe_clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#library {
|
||||
width: 640px;
|
||||
}
|
||||
|
||||
#userlist {
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
height: 360px;
|
||||
float: left;
|
||||
width: 200px;
|
||||
border: 1px solid #aaaaaa; // [](/z13)
|
||||
}
|
||||
|
||||
#messagebuffer {
|
||||
overflow-y: scroll;
|
||||
height: 360px;
|
||||
border: 1px solid #aaaaaa; // AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAa
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
#chatline {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.userlist_siteadmin {
|
||||
color: #cc0000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.userlist_owner {
|
||||
color: #0000cc;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.userlist_op {
|
||||
color: #00cc00;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,194 @@
|
|||
// Wrapped in a function so I can ensure that the socket
|
||||
// is defined before these statements are run
|
||||
function initCallbacks() {
|
||||
socket.on('disconnect', function() {
|
||||
$('<div/>').addClass('alert').addClass('alert-error')
|
||||
.insertAfter($('.row')[0])[0]
|
||||
.innerHTML = "<h3>Disconnected from server</h3>";
|
||||
});
|
||||
|
||||
socket.on('rank', function(data) {
|
||||
if(data.rank >= Rank.Moderator)
|
||||
$('#playlist_controls').css("display", "block");
|
||||
RANK = data.rank;
|
||||
});
|
||||
|
||||
socket.on('login', function(data) {
|
||||
if(!data.success)
|
||||
alert(data.error);
|
||||
else {
|
||||
$('#welcome')[0].innerHTML = "Welcome, " + uname;
|
||||
$('#loginform').css("display", "none");
|
||||
$('#loggedin').css("display", "block");
|
||||
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('chatMsg', function(data) {
|
||||
var div = document.createElement('div');
|
||||
var span = document.createElement('span');
|
||||
$(span).addClass(data.msgclass);
|
||||
span.innerHTML = "<strong><" + data.username + "></strong> " + data.msg;
|
||||
div.appendChild(span);
|
||||
$('#messagebuffer')[0].appendChild(div);
|
||||
// Cap chatbox at most recent 100 messages
|
||||
if($('#messagebuffer').children().length > 100) {
|
||||
$($('#messagebufer').children()[0]).remove();
|
||||
}
|
||||
$('#messagebuffer').scrollTop($('#messagebuffer').prop("scrollHeight"));
|
||||
});
|
||||
|
||||
socket.on('playlist', function(data) {
|
||||
var ul = $('#queue')[0];
|
||||
var n = ul.children.length;
|
||||
for(var i = 0; i < n; i++) {
|
||||
ul.removeChild(ul.children[0]);
|
||||
}
|
||||
for(var i = 0; i < data.pl.length; i++) {
|
||||
var li = makeQueueEntry(data.pl[i]);
|
||||
if(RANK >= Rank.Moderator)
|
||||
addQueueButtons(li);
|
||||
$(li).appendTo(ul);
|
||||
}
|
||||
});
|
||||
|
||||
socket.on('queue', function(data) {
|
||||
var li = makeQueueEntry(data.media);
|
||||
if(RANK >= Rank.Moderator)
|
||||
addQueueButtons(li);
|
||||
$(li).css('display', 'none');
|
||||
var idx = data.pos;
|
||||
var ul = $('#queue')[0];
|
||||
$(li).appendTo(ul);
|
||||
if(idx < ul.children.length - 1)
|
||||
moveVideo(ul.children.length - 1, idx);
|
||||
$(li).show('blind');
|
||||
});
|
||||
|
||||
socket.on('unqueue', function(data) {
|
||||
if(data.pos == POSITION && $('#queue').children().length > POSITION + 1) {
|
||||
$($('#queue').children()[POSITION+1]).addClass("alert alert-info");
|
||||
}
|
||||
var li = $('#queue').children()[data.pos];
|
||||
$(li).hide('blind', function() {
|
||||
$(li).remove();
|
||||
});
|
||||
});
|
||||
|
||||
socket.on('moveVideo', function(data) {
|
||||
moveVideo(data.src, data.dest);
|
||||
});
|
||||
|
||||
socket.on('updatePlaylistIdx', function(data) {
|
||||
var liold = $('#queue').children()[POSITION];
|
||||
$(liold).removeClass("alert alert-info");
|
||||
var linew = $('#queue').children()[data.idx];
|
||||
$(linew).addClass("alert alert-info");
|
||||
POSITION= data.idx;
|
||||
});
|
||||
|
||||
socket.on('mediaUpdate', function(data) {
|
||||
if(data.type == "yt")
|
||||
updateYT(data);
|
||||
else if(data.type == "tw")
|
||||
loadTwitch(data.id);
|
||||
else if(data.type == "sc")
|
||||
updateSC(data);
|
||||
else if(data.type == "vi")
|
||||
updateVI(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;
|
||||
if(LEADER) {
|
||||
// I'm a leader! Set up sync function
|
||||
sendVideoUpdate = function() {
|
||||
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.seconds,
|
||||
paused: false,
|
||||
type: "vi"
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
// 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].innerText;
|
||||
// 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].innerText;
|
||||
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++) {
|
||||
$('#library')[0].removeChild($('#library').children()[0]);
|
||||
}
|
||||
var ul = $('#library')[0];
|
||||
for(var i = 0; i < data.results.length; i++) {
|
||||
var li = makeQueueEntry(data.results[i]);
|
||||
if(RANK >= Rank.Moderator)
|
||||
addLibraryButtons(li, data.results[i].id);
|
||||
$(li).appendTo(ul);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -0,0 +1,237 @@
|
|||
const IO_URL = "http://somewebsite:1337";
|
||||
const SYNC_THRESHOLD = 2;
|
||||
var LEADER = false;
|
||||
var PLAYER = false;
|
||||
var MEDIATYPE = "yt";
|
||||
var POSITION = -1;
|
||||
var RANK = 0;
|
||||
var uname = readCookie('sync_uname');
|
||||
var pw = readCookie('sync_pw');
|
||||
|
||||
var Rank = {
|
||||
Guest: 0,
|
||||
Member: 1,
|
||||
Moderator: 4,
|
||||
Owner: 8,
|
||||
Siteadmin: 255
|
||||
};
|
||||
|
||||
var socket = io.connect(IO_URL);
|
||||
initCallbacks();
|
||||
|
||||
var params = {};
|
||||
if(window.location.search) {
|
||||
var parameters = window.location.search.substring(1).split('&');
|
||||
for(var i = 0; i < parameters.length; i++) {
|
||||
var s = parameters[i].split('=');
|
||||
if(s.length != 2)
|
||||
continue;
|
||||
params[s[0]] = s[1];
|
||||
}
|
||||
}
|
||||
|
||||
if(params['channel'] == undefined) {
|
||||
var main = $($('.container')[1]);
|
||||
var container = $('<div/>').addClass('container').insertBefore(main);
|
||||
var row = $('<div/>').addClass('row').appendTo(container);
|
||||
var div = $('<div/>').addClass('span6').appendTo(row);
|
||||
main.css("display", "none");
|
||||
var label = $('<label/>').text('Enter Channel:').appendTo(div);
|
||||
var entry = $('<input/>').attr('type', 'text').appendTo(div);
|
||||
entry.keydown(function(ev) {
|
||||
if(ev.keyCode == 13) {
|
||||
document.location = document.location + "?channel=" + entry.val();
|
||||
socket.emit('joinChannel', {
|
||||
name: entry.val()
|
||||
});
|
||||
container.remove();
|
||||
main.css("display", "");
|
||||
}
|
||||
});
|
||||
}
|
||||
else {
|
||||
socket.emit('joinChannel', {
|
||||
name: params['channel']
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// Load the youtube iframe API
|
||||
var tag = document.createElement('script');
|
||||
tag.src = "http://www.youtube.com/iframe_api";
|
||||
var firstScriptTag = document.getElementsByTagName('script')[0];
|
||||
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
|
||||
|
||||
|
||||
|
||||
if(uname != null && pw != null && pw != "false") {
|
||||
socket.emit('login', {
|
||||
name: uname,
|
||||
sha256: pw
|
||||
});
|
||||
}
|
||||
|
||||
var sendVideoUpdate = function() { }
|
||||
setInterval(function() {
|
||||
sendVideoUpdate();
|
||||
}, 5000);
|
||||
|
||||
$('#queue_end').click(function() {
|
||||
var parsed = parseVideoURL($('#mediaurl').val());
|
||||
var id = parsed[0];
|
||||
var type = parsed[1];
|
||||
if(id) {
|
||||
$('#mediaurl').val("");
|
||||
}
|
||||
socket.emit('queue', {
|
||||
id: id,
|
||||
pos: "end",
|
||||
type: type
|
||||
});
|
||||
});
|
||||
|
||||
$('#queue_next').click(function() {
|
||||
var parsed = parseVideoURL($('#mediaurl').val());
|
||||
var id = parsed[0];
|
||||
var type = parsed[1];
|
||||
if(id) {
|
||||
$('#mediaurl').val("");
|
||||
}
|
||||
socket.emit('queue', {
|
||||
id: id,
|
||||
pos: "next",
|
||||
type: type
|
||||
});
|
||||
});
|
||||
|
||||
$('#play_next').click(function() {
|
||||
socket.emit('playNext');
|
||||
});
|
||||
|
||||
function loginClick() {
|
||||
uname = $('#username').val();
|
||||
if($('#password').val() == "")
|
||||
pw = "";
|
||||
else
|
||||
pw = SHA256($('#password').val());
|
||||
socket.emit('login', {
|
||||
name: uname,
|
||||
sha256: pw
|
||||
});
|
||||
};
|
||||
|
||||
$('#login').click(loginClick);
|
||||
$('#username').keydown(function(ev) {
|
||||
if(ev.key == 13)
|
||||
loginClick();
|
||||
});
|
||||
$('#password').keydown(function(ev) {
|
||||
if(ev.key == 13)
|
||||
loginClick();
|
||||
});
|
||||
|
||||
$('#logout').click(function() {
|
||||
eraseCookie('sync_uname');
|
||||
eraseCookie('sync_pw');
|
||||
document.location.reload(true);
|
||||
});
|
||||
|
||||
$('#register').click(function() {
|
||||
uname = $('#username').val();
|
||||
if($('#password').val() == "")
|
||||
pw = "";
|
||||
else
|
||||
pw = SHA256($('#password').val());
|
||||
socket.emit('register', {
|
||||
name: uname,
|
||||
sha256: pw
|
||||
});
|
||||
});
|
||||
|
||||
$('#chatline').keydown(function(ev) {
|
||||
if(ev.keyCode == 13) {
|
||||
socket.emit('chatMsg', {
|
||||
msg: $('#chatline').val()
|
||||
});
|
||||
$('#chatline').val('');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
function searchLibrary() {
|
||||
socket.emit('searchLibrary', {
|
||||
query: $('#library_query').val()
|
||||
});
|
||||
}
|
||||
$('#library_search').click(searchLibrary);
|
||||
$('#library_query').keydown(function(ev) {
|
||||
if(ev.key == 13)
|
||||
searchLibrary();
|
||||
});
|
||||
|
||||
function onYouTubeIframeAPIReady() {
|
||||
PLAYER = new YT.Player('ytapiplayer', {
|
||||
height: '390',
|
||||
width: '640',
|
||||
videoId: '',
|
||||
playerVars: {
|
||||
'autoplay': 0,
|
||||
'controls': 1,
|
||||
},
|
||||
events: {
|
||||
'onReady': onPlayerReady,
|
||||
'onStateChange': onPlayerStateChange
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function onPlayerReady() {
|
||||
socket.emit('playerReady');
|
||||
}
|
||||
|
||||
function onPlayerStateChange(state) {
|
||||
if(LEADER && state.data == YT.PlayerState.ENDED) {
|
||||
socket.emit('playNext');
|
||||
}
|
||||
else if(LEADER && state.data == YT.PlayerState.PAUSED) {
|
||||
socket.emit('mediaUpdate', {
|
||||
id: parseYTURL(PLAYER.getVideoUrl()),
|
||||
seconds: PLAYER.getCurrentTime(),
|
||||
type: "yt",
|
||||
paused: true
|
||||
});
|
||||
}
|
||||
if(LEADER && state.data == YT.PlayerState.PLAYING) {
|
||||
socket.emit('mediaUpdate', {
|
||||
id: parseYTURL(PLAYER.getVideoUrl()),
|
||||
seconds: PLAYER.getCurrentTime(),
|
||||
type: "yt",
|
||||
paused: false
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function createCookie(name,value,days) {
|
||||
if (days) {
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime()+(days*24*60*60*1000));
|
||||
var expires = "; expires="+date.toGMTString();
|
||||
}
|
||||
else var expires = "";
|
||||
document.cookie = name+"="+value+expires+"; path=/";
|
||||
}
|
||||
|
||||
function readCookie(name) {
|
||||
var nameEQ = name + "=";
|
||||
var ca = document.cookie.split(';');
|
||||
for(var i=0;i < ca.length;i++) {
|
||||
var c = ca[i];
|
||||
while (c.charAt(0)==' ') c = c.substring(1,c.length);
|
||||
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function eraseCookie(name) {
|
||||
createCookie(name,"",-1);
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
var Froogaloop=function(){function e(a){return new e.fn.init(a)}function h(a,c,b){if(!b.contentWindow.postMessage)return!1;var f=b.getAttribute("src").split("?")[0],a=JSON.stringify({method:a,value:c});"//"===f.substr(0,2)&&(f=window.location.protocol+f);b.contentWindow.postMessage(a,f)}function j(a){var c,b;try{c=JSON.parse(a.data),b=c.event||c.method}catch(f){}"ready"==b&&!i&&(i=!0);if(a.origin!=k)return!1;var a=c.value,e=c.data,g=""===g?null:c.player_id;c=g?d[g][b]:d[b];b=[];if(!c)return!1;void 0!==
|
||||
a&&b.push(a);e&&b.push(e);g&&b.push(g);return 0<b.length?c.apply(null,b):c.call()}function l(a,c,b){b?(d[b]||(d[b]={}),d[b][a]=c):d[a]=c}var d={},i=!1,k="";e.fn=e.prototype={element:null,init:function(a){"string"===typeof a&&(a=document.getElementById(a));this.element=a;a=this.element.getAttribute("src");"//"===a.substr(0,2)&&(a=window.location.protocol+a);for(var a=a.split("/"),c="",b=0,f=a.length;b<f;b++){if(3>b)c+=a[b];else break;2>b&&(c+="/")}k=c;return this},api:function(a,c){if(!this.element||
|
||||
!a)return!1;var b=this.element,f=""!==b.id?b.id:null,d=!c||!c.constructor||!c.call||!c.apply?c:null,e=c&&c.constructor&&c.call&&c.apply?c:null;e&&l(a,e,f);h(a,d,b);return this},addEvent:function(a,c){if(!this.element)return!1;var b=this.element,d=""!==b.id?b.id:null;l(a,c,d);"ready"!=a?h("addEventListener",a,b):"ready"==a&&i&&c.call(null,d);return this},removeEvent:function(a){if(!this.element)return!1;var c=this.element,b;a:{if((b=""!==c.id?c.id:null)&&d[b]){if(!d[b][a]){b=!1;break a}d[b][a]=null}else{if(!d[a]){b=
|
||||
!1;break a}d[a]=null}b=!0}"ready"!=a&&b&&h("removeEventListener",a,c)}};e.fn.init.prototype=e.fn;window.addEventListener?window.addEventListener("message",j,!1):window.attachEvent("onmessage",j);return window.Froogaloop=window.$f=e}();
|
||||
|
|
@ -0,0 +1,385 @@
|
|||
// 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);
|
||||
addUserDropdown(div, name);
|
||||
$('#userlist')[0].appendChild(div);
|
||||
}
|
||||
|
||||
// Format a userlist entry based on a person's rank
|
||||
function fmtUserlistItem(div, rank, leader) {
|
||||
var span = div.children[1];
|
||||
if(rank >= Rank.Siteadmin)
|
||||
$(span).attr("class", "userlist_siteadmin");
|
||||
else if(rank >= Rank.Owner)
|
||||
$(span).attr("class", "userlist_owner");
|
||||
else if(rank >= Rank.Moderator)
|
||||
$(span).attr("class", "userlist_op");
|
||||
|
||||
var flair = div.children[0];
|
||||
// denote current leader with [L]
|
||||
if(leader) {
|
||||
flair.innerHTML = "[L]";
|
||||
}
|
||||
else {
|
||||
flair.innerHTML = "";
|
||||
}
|
||||
}
|
||||
|
||||
// Adds a dropdown with user actions (promote/demote/leader)
|
||||
function addUserDropdown(entry, name) {
|
||||
var div = $('<div />').addClass("dropdown").appendTo(entry);
|
||||
var ul = $('<ul />').addClass("dropdown-menu").appendTo(div);
|
||||
ul.attr("role", "menu");
|
||||
ul.attr("aria-labelledby", "dropdownMenu");
|
||||
|
||||
var makeLeader = $('<li />').appendTo(ul);
|
||||
var a = $('<a />').attr("tabindex", "-1").attr("href", "#").appendTo(makeLeader);
|
||||
a.text("Make Leader");
|
||||
a.click(function() {
|
||||
socket.emit('assignLeader', {
|
||||
name: name
|
||||
});
|
||||
});
|
||||
|
||||
var takeLeader = $('<li />').appendTo(ul);
|
||||
var a = $('<a />').attr("tabindex", "-1").attr("href", "#").appendTo(takeLeader);
|
||||
a.text("Take Leader");
|
||||
a.click(function() {
|
||||
socket.emit('assignLeader', {
|
||||
name: ""
|
||||
});
|
||||
});
|
||||
|
||||
$('<li />').addClass("divider").appendTo(ul);
|
||||
|
||||
var promote = $('<li />').appendTo(ul);
|
||||
var a = $('<a />').attr("tabindex", "-1").attr("href", "#").appendTo(promote);
|
||||
a.text("Promote");
|
||||
a.click(function() {
|
||||
socket.emit('promote', {
|
||||
name: name
|
||||
});
|
||||
});
|
||||
|
||||
var demote = $('<li />').appendTo(ul);
|
||||
var a = $('<a />').attr("tabindex", "-1").attr("href", "#").appendTo(demote);
|
||||
a.text("Demote");
|
||||
a.click(function() {
|
||||
socket.emit('demote', {
|
||||
name: name
|
||||
});
|
||||
});
|
||||
|
||||
$(entry).click(function() {
|
||||
if(ul.css("display") == "none") {
|
||||
ul.css("display", "block");
|
||||
}
|
||||
else {
|
||||
ul.css("display", "none");
|
||||
}
|
||||
});
|
||||
return ul;
|
||||
}
|
||||
|
||||
// Creates and formats a queue entry
|
||||
function makeQueueEntry(video) {
|
||||
var li = $('<li />');
|
||||
li.attr("class", "well");
|
||||
var title = $('<span />').attr("class", "qe_title").appendTo(li);
|
||||
title.text(video.title);
|
||||
var time = $('<span />').attr("class", "qe_time").appendTo(li);
|
||||
time.text(video.duration);
|
||||
var clear = $('<div />').attr("class", "qe_clear").appendTo(li);
|
||||
return li;
|
||||
}
|
||||
|
||||
// Add buttons to a queue list entry
|
||||
function addQueueButtons(li) {
|
||||
var btnstrip = $('<div />').attr("class", "btn-group qe_buttons").prependTo(li);
|
||||
|
||||
var btnRemove = $('<button />').attr("class", "btn btn-danger qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-remove").appendTo(btnRemove);
|
||||
|
||||
var btnUp = $('<button />').attr("class", "btn qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-arrow-up").appendTo(btnUp);
|
||||
|
||||
var btnDown = $('<button />').attr("class", "btn qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-arrow-down").appendTo(btnDown);
|
||||
|
||||
var btnNext = $('<button />').attr("class", "btn qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-play").appendTo(btnNext);
|
||||
|
||||
// Callback time
|
||||
$(btnRemove).click(function() {
|
||||
var idx = $('#queue').children().index(li);
|
||||
socket.emit('unqueue', { pos: idx });
|
||||
});
|
||||
|
||||
$(btnUp).click(function() {
|
||||
var idx = $('#queue').children().index(li);
|
||||
socket.emit('moveMedia', {
|
||||
src: idx,
|
||||
dest: idx-1
|
||||
});
|
||||
});
|
||||
|
||||
$(btnDown).click(function() {
|
||||
var idx = $('#queue').children().index(li);
|
||||
socket.emit('moveMedia', {
|
||||
src: idx,
|
||||
dest: idx+1
|
||||
});
|
||||
});
|
||||
|
||||
$(btnNext).click(function() {
|
||||
var idx = $('#queue').children().index(li);
|
||||
var dest = idx < POSITION ? POSITION : POSITION + 1;
|
||||
socket.emit('moveMedia', {
|
||||
src: idx,
|
||||
dest: dest
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Add buttons to a list entry for the library search results
|
||||
function addLibraryButtons(li, id) {
|
||||
var btnstrip = $('<div />').attr("class", "btn-group qe_buttons").prependTo(li);
|
||||
|
||||
|
||||
var btnNext = $('<button />').attr("class", "btn qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-play").appendTo(btnNext);
|
||||
|
||||
var btnEnd = $('<button />').attr("class", "btn qe_btn").appendTo(btnstrip);
|
||||
$('<i />').attr("class", "icon-fast-forward").appendTo(btnEnd);
|
||||
|
||||
// Callback time
|
||||
$(btnNext).click(function() {
|
||||
socket.emit('queue', {
|
||||
id: id,
|
||||
pos: "next"
|
||||
});
|
||||
});
|
||||
|
||||
$(btnEnd).click(function() {
|
||||
socket.emit('queue', {
|
||||
id: id,
|
||||
pos: "end"
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Rearranges the queue
|
||||
function moveVideo(src, dest) {
|
||||
var li = $('#queue').children()[src];
|
||||
var ul = $('#queue')[0];
|
||||
$(li).hide('blind', function() {
|
||||
ul.removeChild(li);
|
||||
if(dest == ul.children.length) {
|
||||
ul.appendChild(li);
|
||||
}
|
||||
else {
|
||||
ul.insertBefore(li, ul.getElementsByTagName('li')[dest]);
|
||||
}
|
||||
$(li).show('blind');
|
||||
});
|
||||
if(src < POSITION && dest >= POSITION)
|
||||
POSITION--;
|
||||
if(src > POSITION && dest < POSITION)
|
||||
POSITION++;
|
||||
}
|
||||
|
||||
// YouTube Synchronization
|
||||
function updateYT(data) {
|
||||
if(MEDIATYPE != "yt") {
|
||||
removeCurrentPlayer();
|
||||
MEDIATYPE = "yt";
|
||||
// Note to Soundcloud/Vimeo API designers:
|
||||
// YouTube's API is actually nice to use
|
||||
PLAYER = new YT.Player('ytapiplayer', {
|
||||
height: '390',
|
||||
width: '640',
|
||||
videoId: '',
|
||||
playerVars: {
|
||||
'autoplay': 0,
|
||||
'controls': 1,
|
||||
},
|
||||
events: {
|
||||
'onReady': onPlayerReady,
|
||||
'onStateChange': onPlayerStateChange
|
||||
}
|
||||
});
|
||||
}
|
||||
// Load new video
|
||||
if(PLAYER.getVideoUrl && data.id != parseYTURL(PLAYER.getVideoUrl())) {
|
||||
PLAYER.loadVideoById(data.id, data.currentTime, $('#quality').val());
|
||||
if(data.paused)
|
||||
PLAYER.pauseVideo();
|
||||
}
|
||||
// Sync playback time
|
||||
else if(PLAYER.seekTo) {
|
||||
if(Math.abs(PLAYER.getCurrentTime() - data.currentTime) > SYNC_THRESHOLD)
|
||||
PLAYER.seekTo(data.currentTime, true);
|
||||
if(!data.paused)
|
||||
PLAYER.playVideo();
|
||||
}
|
||||
}
|
||||
|
||||
// Soundcloud synchronization
|
||||
function updateSC(data) {
|
||||
if(MEDIATYPE != "sc") {
|
||||
var currentEmbed = $("#ytapiplayer");
|
||||
var iframe = $("<iframe/>").insertBefore(currentEmbed);
|
||||
currentEmbed.remove();
|
||||
iframe.attr("id","ytapiplayer");
|
||||
iframe.attr("src", "https://w.soundcloud.com/player/?url=");
|
||||
iframe.css("width", "100%").attr("height", "166")
|
||||
.attr("frameborder", "no");
|
||||
|
||||
PLAYER = SC.Widget('ytapiplayer');
|
||||
MEDIATYPE = "sc";
|
||||
}
|
||||
// Server is on a different soundcloud track than client
|
||||
if(PLAYER.mediaId != data.id) {
|
||||
PLAYER.load(data.id, {
|
||||
auto_play: true
|
||||
});
|
||||
// Keep track of current ID
|
||||
PLAYER.mediaId = data.id;
|
||||
}
|
||||
// Soundcloud's API is async
|
||||
// Query the playback position and compare that with the sync packet
|
||||
PLAYER.getPosition(function(pos) {
|
||||
if(Math.abs(pos - data.currentTime * 1000) > SYNC_THRESHOLD) {
|
||||
PLAYER.seekTo(data.currentTime * 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Vimeo synchronization
|
||||
// URGH building a synchronizing tool is so frustrating when
|
||||
// these APIs are designed to be async
|
||||
function updateVI(data) {
|
||||
if(MEDIATYPE != "vi") {
|
||||
initVI(data);
|
||||
}
|
||||
// Either vimeo's API doesn't support loading a new video
|
||||
// or their terrible documentation doesn't document it
|
||||
else if(data.id != PLAYER.videoid) {
|
||||
initVI(data);
|
||||
}
|
||||
// Hack because of their async api
|
||||
// Set this and wait for playProgress to fire to compare it
|
||||
PLAYER.lastUpdate = data;
|
||||
}
|
||||
|
||||
// Loads up a Vimeo player
|
||||
function initVI(data) {
|
||||
var currentEmbed = $("#ytapiplayer");
|
||||
var div = currentEmbed.parent();
|
||||
currentEmbed.remove();
|
||||
// Ugly but it's the only way I managed to get the API calls to work
|
||||
div[0].innerHTML = '<iframe id="ytapiplayer" src="http://player.vimeo.com/video/' + data.id + '" width="640" height="390" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
|
||||
// $f() is defined by froogaloop, Vimeo's API wrapper
|
||||
PLAYER = $f($('iframe')[0]);
|
||||
// So we can retrieve the ID synchronously instead of waiting for
|
||||
// getVideoId with a callback
|
||||
PLAYER.videoid = data.id;
|
||||
PLAYER.addEvent('ready', function() {
|
||||
// Autoplay
|
||||
PLAYER.api('play');
|
||||
// Watch the progress and compare it with the most recent sync
|
||||
PLAYER.addEvent('playProgress', function(data, id) {
|
||||
if(Math.abs(parseInt(data.seconds) - PLAYER.lastUpdate.currentTime) > SYNC_THRESHOLD) {
|
||||
PLAYER.api('seekTo', PLAYER.lastUpdate.currentTime);
|
||||
}
|
||||
});
|
||||
});
|
||||
MEDIATYPE = "vi";
|
||||
}
|
||||
|
||||
function loadTwitch(channel) {
|
||||
MEDIATYPE = "tw";
|
||||
|
||||
removeCurrentPlayer();
|
||||
var url = "http://www.twitch.tv/widgets/live_embed_player.swf?channel="+channel;
|
||||
var params = {
|
||||
allowFullScreen:"true",
|
||||
allowScriptAccess:"always",
|
||||
allowNetworking:"all",
|
||||
movie:"http://www.twitch.tv/widgets/live_embed_player.swf",
|
||||
id: "live_embed_player_flash",
|
||||
flashvars:"hostname=www.twitch.tv&channel="+channel+"&auto_play=true&start_volume=100"
|
||||
};
|
||||
swfobject.embedSWF( url, "ytapiplayer", '640', '390', "8", null, null, params, {} );
|
||||
}
|
||||
|
||||
function removeCurrentPlayer(){
|
||||
var currentEmbed = $("#ytapiplayer");
|
||||
var placeholder = $("<div/>").insertBefore(currentEmbed);
|
||||
currentEmbed.remove();
|
||||
placeholder.attr("id","ytapiplayer");
|
||||
}
|
||||
|
||||
function parseVideoURL(url){
|
||||
if(typeof(url) != "string")
|
||||
return null;
|
||||
if(url.indexOf("youtu") != -1)
|
||||
return [parseYTURL(url), "yt"];
|
||||
else if(url.indexOf("twitch") != -1)
|
||||
return [parseTwitch(url), "tw"];
|
||||
else if(url.indexOf("soundcloud") != -1)
|
||||
return [url, "sc"];
|
||||
else if(url.indexOf("vimeo") != -1)
|
||||
return [parseVimeo(url), "vi"];
|
||||
}
|
||||
|
||||
function parseYTURL(url) {
|
||||
url = url.replace("feature=player_embedded&", "");
|
||||
if(url.indexOf("&list=") != -1)
|
||||
url = url.substring(0, url.indexOf("&list="));
|
||||
var m = url.match(/youtube\.com\/watch\\?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(/v=([^&]*)/);
|
||||
if(m) {
|
||||
// Extract ID
|
||||
return m[1];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function parseTwitch(url) {
|
||||
var m = url.match(/twitch\.tv\/([a-zA-Z0-9]*)/);
|
||||
if(m) {
|
||||
// Extract channel name
|
||||
return m[1];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function parseVimeo(url) {
|
||||
var m = url.match(/vimeo\.com\/([0-9]+)/);
|
||||
if(m) {
|
||||
// Extract video ID
|
||||
return m[1];
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,780 @@
|
|||
/*! SWFObject v2.2 <http://code.google.com/p/swfobject/>
|
||||
is released under the MIT License <http://www.opensource.org/licenses/mit-license.php>
|
||||
*/
|
||||
console.log('swfobject start');
|
||||
|
||||
var swfobject = function() {
|
||||
|
||||
var UNDEF = "undefined",
|
||||
OBJECT = "object",
|
||||
SHOCKWAVE_FLASH = "Shockwave Flash",
|
||||
SHOCKWAVE_FLASH_AX = "ShockwaveFlash.ShockwaveFlash",
|
||||
FLASH_MIME_TYPE = "application/x-shockwave-flash",
|
||||
EXPRESS_INSTALL_ID = "SWFObjectExprInst",
|
||||
ON_READY_STATE_CHANGE = "onreadystatechange",
|
||||
|
||||
win = window,
|
||||
doc = document,
|
||||
nav = navigator,
|
||||
|
||||
plugin = false,
|
||||
domLoadFnArr = [main],
|
||||
regObjArr = [],
|
||||
objIdArr = [],
|
||||
listenersArr = [],
|
||||
storedAltContent,
|
||||
storedAltContentId,
|
||||
storedCallbackFn,
|
||||
storedCallbackObj,
|
||||
isDomLoaded = false,
|
||||
isExpressInstallActive = false,
|
||||
dynamicStylesheet,
|
||||
dynamicStylesheetMedia,
|
||||
autoHideShow = true,
|
||||
|
||||
/* Centralized function for browser feature detection
|
||||
- User agent string detection is only used when no good alternative is possible
|
||||
- Is executed directly for optimal performance
|
||||
*/
|
||||
ua = function() {
|
||||
var w3cdom = typeof doc.getElementById != UNDEF && typeof doc.getElementsByTagName != UNDEF && typeof doc.createElement != UNDEF,
|
||||
u = nav.userAgent.toLowerCase(),
|
||||
p = nav.platform.toLowerCase(),
|
||||
windows = p ? /win/.test(p) : /win/.test(u),
|
||||
mac = p ? /mac/.test(p) : /mac/.test(u),
|
||||
webkit = /webkit/.test(u) ? parseFloat(u.replace(/^.*webkit\/(\d+(\.\d+)?).*$/, "$1")) : false, // returns either the webkit version or false if not webkit
|
||||
ie = !+"\v1", // feature detection based on Andrea Giammarchi's solution: http://webreflection.blogspot.com/2009/01/32-bytes-to-know-if-your-browser-is-ie.html
|
||||
playerVersion = [0,0,0],
|
||||
d = null;
|
||||
if (typeof nav.plugins != UNDEF && typeof nav.plugins[SHOCKWAVE_FLASH] == OBJECT) {
|
||||
d = nav.plugins[SHOCKWAVE_FLASH].description;
|
||||
if (d && !(typeof nav.mimeTypes != UNDEF && nav.mimeTypes[FLASH_MIME_TYPE] && !nav.mimeTypes[FLASH_MIME_TYPE].enabledPlugin)) { // navigator.mimeTypes["application/x-shockwave-flash"].enabledPlugin indicates whether plug-ins are enabled or disabled in Safari 3+
|
||||
plugin = true;
|
||||
ie = false; // cascaded feature detection for Internet Explorer
|
||||
d = d.replace(/^.*\s+(\S+\s+\S+$)/, "$1");
|
||||
playerVersion[0] = parseInt(d.replace(/^(.*)\..*$/, "$1"), 10);
|
||||
playerVersion[1] = parseInt(d.replace(/^.*\.(.*)\s.*$/, "$1"), 10);
|
||||
playerVersion[2] = /[a-zA-Z]/.test(d) ? parseInt(d.replace(/^.*[a-zA-Z]+(.*)$/, "$1"), 10) : 0;
|
||||
}
|
||||
}
|
||||
else if (typeof win.ActiveXObject != UNDEF) {
|
||||
try {
|
||||
var a = new ActiveXObject(SHOCKWAVE_FLASH_AX);
|
||||
if (a) { // a will return null when ActiveX is disabled
|
||||
d = a.GetVariable("$version");
|
||||
if (d) {
|
||||
ie = true; // cascaded feature detection for Internet Explorer
|
||||
d = d.split(" ")[1].split(",");
|
||||
playerVersion = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
|
||||
}
|
||||
}
|
||||
}
|
||||
catch(e) {}
|
||||
}
|
||||
return { w3:w3cdom, pv:playerVersion, wk:webkit, ie:ie, win:windows, mac:mac };
|
||||
}(),
|
||||
|
||||
/* Cross-browser onDomLoad
|
||||
- Will fire an event as soon as the DOM of a web page is loaded
|
||||
- Internet Explorer workaround based on Diego Perini's solution: http://javascript.nwbox.com/IEContentLoaded/
|
||||
- Regular onload serves as fallback
|
||||
*/
|
||||
onDomLoad = function() {
|
||||
if (!ua.w3) { return; }
|
||||
if ((typeof doc.readyState != UNDEF && doc.readyState == "complete") || (typeof doc.readyState == UNDEF && (doc.getElementsByTagName("body")[0] || doc.body))) { // function is fired after onload, e.g. when script is inserted dynamically
|
||||
callDomLoadFunctions();
|
||||
}
|
||||
if (!isDomLoaded) {
|
||||
if (typeof doc.addEventListener != UNDEF) {
|
||||
doc.addEventListener("DOMContentLoaded", callDomLoadFunctions, false);
|
||||
}
|
||||
if (ua.ie && ua.win) {
|
||||
doc.attachEvent(ON_READY_STATE_CHANGE, function() {
|
||||
if (doc.readyState == "complete") {
|
||||
doc.detachEvent(ON_READY_STATE_CHANGE, arguments.callee);
|
||||
callDomLoadFunctions();
|
||||
}
|
||||
});
|
||||
if (win == top) { // if not inside an iframe
|
||||
(function(){
|
||||
if (isDomLoaded) { return; }
|
||||
try {
|
||||
doc.documentElement.doScroll("left");
|
||||
}
|
||||
catch(e) {
|
||||
setTimeout(arguments.callee, 0);
|
||||
return;
|
||||
}
|
||||
callDomLoadFunctions();
|
||||
})();
|
||||
}
|
||||
}
|
||||
if (ua.wk) {
|
||||
(function(){
|
||||
if (isDomLoaded) { return; }
|
||||
if (!/loaded|complete/.test(doc.readyState)) {
|
||||
setTimeout(arguments.callee, 0);
|
||||
return;
|
||||
}
|
||||
callDomLoadFunctions();
|
||||
})();
|
||||
}
|
||||
addLoadEvent(callDomLoadFunctions);
|
||||
}
|
||||
}();
|
||||
|
||||
function callDomLoadFunctions() {
|
||||
if (isDomLoaded) { return; }
|
||||
try { // test if we can really add/remove elements to/from the DOM; we don't want to fire it too early
|
||||
var t = doc.getElementsByTagName("body")[0].appendChild(createElement("span"));
|
||||
t.parentNode.removeChild(t);
|
||||
}
|
||||
catch (e) { return; }
|
||||
isDomLoaded = true;
|
||||
var dl = domLoadFnArr.length;
|
||||
for (var i = 0; i < dl; i++) {
|
||||
domLoadFnArr[i]();
|
||||
}
|
||||
}
|
||||
|
||||
function addDomLoadEvent(fn) {
|
||||
if (isDomLoaded) {
|
||||
fn();
|
||||
}
|
||||
else {
|
||||
domLoadFnArr[domLoadFnArr.length] = fn; // Array.push() is only available in IE5.5+
|
||||
}
|
||||
}
|
||||
|
||||
/* Cross-browser onload
|
||||
- Based on James Edwards' solution: http://brothercake.com/site/resources/scripts/onload/
|
||||
- Will fire an event as soon as a web page including all of its assets are loaded
|
||||
*/
|
||||
function addLoadEvent(fn) {
|
||||
if (typeof win.addEventListener != UNDEF) {
|
||||
win.addEventListener("load", fn, false);
|
||||
}
|
||||
else if (typeof doc.addEventListener != UNDEF) {
|
||||
doc.addEventListener("load", fn, false);
|
||||
}
|
||||
else if (typeof win.attachEvent != UNDEF) {
|
||||
addListener(win, "onload", fn);
|
||||
}
|
||||
else if (typeof win.onload == "function") {
|
||||
var fnOld = win.onload;
|
||||
win.onload = function() {
|
||||
fnOld();
|
||||
fn();
|
||||
};
|
||||
}
|
||||
else {
|
||||
win.onload = fn;
|
||||
}
|
||||
}
|
||||
|
||||
/* Main function
|
||||
- Will preferably execute onDomLoad, otherwise onload (as a fallback)
|
||||
*/
|
||||
function main() {
|
||||
if (plugin) {
|
||||
testPlayerVersion();
|
||||
}
|
||||
else {
|
||||
matchVersions();
|
||||
}
|
||||
}
|
||||
|
||||
/* Detect the Flash Player version for non-Internet Explorer browsers
|
||||
- Detecting the plug-in version via the object element is more precise than using the plugins collection item's description:
|
||||
a. Both release and build numbers can be detected
|
||||
b. Avoid wrong descriptions by corrupt installers provided by Adobe
|
||||
c. Avoid wrong descriptions by multiple Flash Player entries in the plugin Array, caused by incorrect browser imports
|
||||
- Disadvantage of this method is that it depends on the availability of the DOM, while the plugins collection is immediately available
|
||||
*/
|
||||
function testPlayerVersion() {
|
||||
var b = doc.getElementsByTagName("body")[0];
|
||||
var o = createElement(OBJECT);
|
||||
o.setAttribute("type", FLASH_MIME_TYPE);
|
||||
var t = b.appendChild(o);
|
||||
if (t) {
|
||||
var counter = 0;
|
||||
(function(){
|
||||
if (typeof t.GetVariable != UNDEF) {
|
||||
var d = t.GetVariable("$version");
|
||||
if (d) {
|
||||
d = d.split(" ")[1].split(",");
|
||||
ua.pv = [parseInt(d[0], 10), parseInt(d[1], 10), parseInt(d[2], 10)];
|
||||
}
|
||||
}
|
||||
else if (counter < 10) {
|
||||
counter++;
|
||||
setTimeout(arguments.callee, 10);
|
||||
return;
|
||||
}
|
||||
b.removeChild(o);
|
||||
t = null;
|
||||
matchVersions();
|
||||
})();
|
||||
}
|
||||
else {
|
||||
matchVersions();
|
||||
}
|
||||
}
|
||||
|
||||
/* Perform Flash Player and SWF version matching; static publishing only
|
||||
*/
|
||||
function matchVersions() {
|
||||
var rl = regObjArr.length;
|
||||
if (rl > 0) {
|
||||
for (var i = 0; i < rl; i++) { // for each registered object element
|
||||
var id = regObjArr[i].id;
|
||||
var cb = regObjArr[i].callbackFn;
|
||||
var cbObj = {success:false, id:id};
|
||||
if (ua.pv[0] > 0) {
|
||||
var obj = getElementById(id);
|
||||
if (obj) {
|
||||
if (hasPlayerVersion(regObjArr[i].swfVersion) && !(ua.wk && ua.wk < 312)) { // Flash Player version >= published SWF version: Houston, we have a match!
|
||||
setVisibility(id, true);
|
||||
if (cb) {
|
||||
cbObj.success = true;
|
||||
cbObj.ref = getObjectById(id);
|
||||
cb(cbObj);
|
||||
}
|
||||
}
|
||||
else if (regObjArr[i].expressInstall && canExpressInstall()) { // show the Adobe Express Install dialog if set by the web page author and if supported
|
||||
var att = {};
|
||||
att.data = regObjArr[i].expressInstall;
|
||||
att.width = obj.getAttribute("width") || "0";
|
||||
att.height = obj.getAttribute("height") || "0";
|
||||
if (obj.getAttribute("class")) { att.styleclass = obj.getAttribute("class"); }
|
||||
if (obj.getAttribute("align")) { att.align = obj.getAttribute("align"); }
|
||||
// parse HTML object param element's name-value pairs
|
||||
var par = {};
|
||||
var p = obj.getElementsByTagName("param");
|
||||
var pl = p.length;
|
||||
for (var j = 0; j < pl; j++) {
|
||||
if (p[j].getAttribute("name").toLowerCase() != "movie") {
|
||||
par[p[j].getAttribute("name")] = p[j].getAttribute("value");
|
||||
}
|
||||
}
|
||||
showExpressInstall(att, par, id, cb);
|
||||
}
|
||||
else { // Flash Player and SWF version mismatch or an older Webkit engine that ignores the HTML object element's nested param elements: display alternative content instead of SWF
|
||||
displayAltContent(obj);
|
||||
if (cb) { cb(cbObj); }
|
||||
}
|
||||
}
|
||||
}
|
||||
else { // if no Flash Player is installed or the fp version cannot be detected we let the HTML object element do its job (either show a SWF or alternative content)
|
||||
setVisibility(id, true);
|
||||
if (cb) {
|
||||
var o = getObjectById(id); // test whether there is an HTML object element or not
|
||||
if (o && typeof o.SetVariable != UNDEF) {
|
||||
cbObj.success = true;
|
||||
cbObj.ref = o;
|
||||
}
|
||||
cb(cbObj);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getObjectById(objectIdStr) {
|
||||
var r = null;
|
||||
var o = getElementById(objectIdStr);
|
||||
if (o && o.nodeName == "OBJECT") {
|
||||
if (typeof o.SetVariable != UNDEF) {
|
||||
r = o;
|
||||
}
|
||||
else {
|
||||
var n = o.getElementsByTagName(OBJECT)[0];
|
||||
if (n) {
|
||||
r = n;
|
||||
}
|
||||
}
|
||||
}
|
||||
return r;
|
||||
}
|
||||
|
||||
/* Requirements for Adobe Express Install
|
||||
- only one instance can be active at a time
|
||||
- fp 6.0.65 or higher
|
||||
- Win/Mac OS only
|
||||
- no Webkit engines older than version 312
|
||||
*/
|
||||
function canExpressInstall() {
|
||||
return !isExpressInstallActive && hasPlayerVersion("6.0.65") && (ua.win || ua.mac) && !(ua.wk && ua.wk < 312);
|
||||
}
|
||||
|
||||
/* Show the Adobe Express Install dialog
|
||||
- Reference: http://www.adobe.com/cfusion/knowledgebase/index.cfm?id=6a253b75
|
||||
*/
|
||||
function showExpressInstall(att, par, replaceElemIdStr, callbackFn) {
|
||||
isExpressInstallActive = true;
|
||||
storedCallbackFn = callbackFn || null;
|
||||
storedCallbackObj = {success:false, id:replaceElemIdStr};
|
||||
var obj = getElementById(replaceElemIdStr);
|
||||
if (obj) {
|
||||
if (obj.nodeName == "OBJECT") { // static publishing
|
||||
storedAltContent = abstractAltContent(obj);
|
||||
storedAltContentId = null;
|
||||
}
|
||||
else { // dynamic publishing
|
||||
storedAltContent = obj;
|
||||
storedAltContentId = replaceElemIdStr;
|
||||
}
|
||||
att.id = EXPRESS_INSTALL_ID;
|
||||
if (typeof att.width == UNDEF || (!/%$/.test(att.width) && parseInt(att.width, 10) < 310)) { att.width = "310"; }
|
||||
if (typeof att.height == UNDEF || (!/%$/.test(att.height) && parseInt(att.height, 10) < 137)) { att.height = "137"; }
|
||||
doc.title = doc.title.slice(0, 47) + " - Flash Player Installation";
|
||||
var pt = ua.ie && ua.win ? "ActiveX" : "PlugIn",
|
||||
fv = "MMredirectURL=" + win.location.toString().replace(/&/g,"%26") + "&MMplayerType=" + pt + "&MMdoctitle=" + doc.title;
|
||||
if (typeof par.flashvars != UNDEF) {
|
||||
par.flashvars += "&" + fv;
|
||||
}
|
||||
else {
|
||||
par.flashvars = fv;
|
||||
}
|
||||
// IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
|
||||
// because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
|
||||
if (ua.ie && ua.win && obj.readyState != 4) {
|
||||
var newObj = createElement("div");
|
||||
replaceElemIdStr += "SWFObjectNew";
|
||||
newObj.setAttribute("id", replaceElemIdStr);
|
||||
obj.parentNode.insertBefore(newObj, obj); // insert placeholder div that will be replaced by the object element that loads expressinstall.swf
|
||||
obj.style.display = "none";
|
||||
(function(){
|
||||
if (obj.readyState == 4) {
|
||||
obj.parentNode.removeChild(obj);
|
||||
}
|
||||
else {
|
||||
setTimeout(arguments.callee, 10);
|
||||
}
|
||||
})();
|
||||
}
|
||||
createSWF(att, par, replaceElemIdStr);
|
||||
}
|
||||
}
|
||||
|
||||
/* Functions to abstract and display alternative content
|
||||
*/
|
||||
function displayAltContent(obj) {
|
||||
if (ua.ie && ua.win && obj.readyState != 4) {
|
||||
// IE only: when a SWF is loading (AND: not available in cache) wait for the readyState of the object element to become 4 before removing it,
|
||||
// because you cannot properly cancel a loading SWF file without breaking browser load references, also obj.onreadystatechange doesn't work
|
||||
var el = createElement("div");
|
||||
obj.parentNode.insertBefore(el, obj); // insert placeholder div that will be replaced by the alternative content
|
||||
el.parentNode.replaceChild(abstractAltContent(obj), el);
|
||||
obj.style.display = "none";
|
||||
(function(){
|
||||
if (obj.readyState == 4) {
|
||||
obj.parentNode.removeChild(obj);
|
||||
}
|
||||
else {
|
||||
setTimeout(arguments.callee, 10);
|
||||
}
|
||||
})();
|
||||
}
|
||||
else {
|
||||
obj.parentNode.replaceChild(abstractAltContent(obj), obj);
|
||||
}
|
||||
}
|
||||
|
||||
function abstractAltContent(obj) {
|
||||
var ac = createElement("div");
|
||||
if (ua.win && ua.ie) {
|
||||
ac.innerHTML = obj.innerHTML;
|
||||
}
|
||||
else {
|
||||
var nestedObj = obj.getElementsByTagName(OBJECT)[0];
|
||||
if (nestedObj) {
|
||||
var c = nestedObj.childNodes;
|
||||
if (c) {
|
||||
var cl = c.length;
|
||||
for (var i = 0; i < cl; i++) {
|
||||
if (!(c[i].nodeType == 1 && c[i].nodeName == "PARAM") && !(c[i].nodeType == 8)) {
|
||||
ac.appendChild(c[i].cloneNode(true));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return ac;
|
||||
}
|
||||
|
||||
/* Cross-browser dynamic SWF creation
|
||||
*/
|
||||
function createSWF(attObj, parObj, id) {
|
||||
var r, el = getElementById(id);
|
||||
if (ua.wk && ua.wk < 312) { return r; }
|
||||
if (el) {
|
||||
if (typeof attObj.id == UNDEF) { // if no 'id' is defined for the object element, it will inherit the 'id' from the alternative content
|
||||
attObj.id = id;
|
||||
}
|
||||
if (ua.ie && ua.win) { // Internet Explorer + the HTML object element + W3C DOM methods do not combine: fall back to outerHTML
|
||||
var att = "";
|
||||
for (var i in attObj) {
|
||||
if (attObj[i] != Object.prototype[i]) { // filter out prototype additions from other potential libraries
|
||||
if (i.toLowerCase() == "data") {
|
||||
parObj.movie = attObj[i];
|
||||
}
|
||||
else if (i.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
|
||||
att += ' class="' + attObj[i] + '"';
|
||||
}
|
||||
else if (i.toLowerCase() != "classid") {
|
||||
att += ' ' + i + '="' + attObj[i] + '"';
|
||||
}
|
||||
}
|
||||
}
|
||||
var par = "";
|
||||
for (var j in parObj) {
|
||||
if (parObj[j] != Object.prototype[j]) { // filter out prototype additions from other potential libraries
|
||||
par += '<param name="' + j + '" value="' + parObj[j] + '" />';
|
||||
}
|
||||
}
|
||||
el.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"' + att + '>' + par + '</object>';
|
||||
objIdArr[objIdArr.length] = attObj.id; // stored to fix object 'leaks' on unload (dynamic publishing only)
|
||||
r = getElementById(attObj.id);
|
||||
}
|
||||
else { // well-behaving browsers
|
||||
var o = createElement(OBJECT);
|
||||
o.setAttribute("type", FLASH_MIME_TYPE);
|
||||
for (var m in attObj) {
|
||||
if (attObj[m] != Object.prototype[m]) { // filter out prototype additions from other potential libraries
|
||||
if (m.toLowerCase() == "styleclass") { // 'class' is an ECMA4 reserved keyword
|
||||
o.setAttribute("class", attObj[m]);
|
||||
}
|
||||
else if (m.toLowerCase() != "classid") { // filter out IE specific attribute
|
||||
o.setAttribute(m, attObj[m]);
|
||||
}
|
||||
}
|
||||
}
|
||||
for (var n in parObj) {
|
||||
if (parObj[n] != Object.prototype[n] && n.toLowerCase() != "movie") { // filter out prototype additions from other potential libraries and IE specific param element
|
||||
createObjParam(o, n, parObj[n]);
|
||||
}
|
||||
}
|
||||
el.parentNode.replaceChild(o, el);
|
||||
r = o;
|
||||
}
|
||||
}
|
||||
return r;
|
||||
}
|
||||
|
||||
function createObjParam(el, pName, pValue) {
|
||||
var p = createElement("param");
|
||||
p.setAttribute("name", pName);
|
||||
p.setAttribute("value", pValue);
|
||||
el.appendChild(p);
|
||||
}
|
||||
|
||||
/* Cross-browser SWF removal
|
||||
- Especially needed to safely and completely remove a SWF in Internet Explorer
|
||||
*/
|
||||
function removeSWF(id) {
|
||||
var obj = getElementById(id);
|
||||
if (obj && obj.nodeName == "OBJECT") {
|
||||
if (ua.ie && ua.win) {
|
||||
obj.style.display = "none";
|
||||
(function(){
|
||||
if (obj.readyState == 4) {
|
||||
removeObjectInIE(id);
|
||||
}
|
||||
else {
|
||||
setTimeout(arguments.callee, 10);
|
||||
}
|
||||
})();
|
||||
}
|
||||
else {
|
||||
obj.parentNode.removeChild(obj);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function removeObjectInIE(id) {
|
||||
var obj = getElementById(id);
|
||||
if (obj) {
|
||||
for (var i in obj) {
|
||||
if (typeof obj[i] == "function") {
|
||||
obj[i] = null;
|
||||
}
|
||||
}
|
||||
obj.parentNode.removeChild(obj);
|
||||
}
|
||||
}
|
||||
|
||||
/* Functions to optimize JavaScript compression
|
||||
*/
|
||||
function getElementById(id) {
|
||||
var el = null;
|
||||
try {
|
||||
el = doc.getElementById(id);
|
||||
}
|
||||
catch (e) {}
|
||||
return el;
|
||||
}
|
||||
|
||||
function createElement(el) {
|
||||
return doc.createElement(el);
|
||||
}
|
||||
|
||||
/* Updated attachEvent function for Internet Explorer
|
||||
- Stores attachEvent information in an Array, so on unload the detachEvent functions can be called to avoid memory leaks
|
||||
*/
|
||||
function addListener(target, eventType, fn) {
|
||||
target.attachEvent(eventType, fn);
|
||||
listenersArr[listenersArr.length] = [target, eventType, fn];
|
||||
}
|
||||
|
||||
/* Flash Player and SWF content version matching
|
||||
*/
|
||||
function hasPlayerVersion(rv) {
|
||||
var pv = ua.pv, v = rv.split(".");
|
||||
v[0] = parseInt(v[0], 10);
|
||||
v[1] = parseInt(v[1], 10) || 0; // supports short notation, e.g. "9" instead of "9.0.0"
|
||||
v[2] = parseInt(v[2], 10) || 0;
|
||||
return (pv[0] > v[0] || (pv[0] == v[0] && pv[1] > v[1]) || (pv[0] == v[0] && pv[1] == v[1] && pv[2] >= v[2])) ? true : false;
|
||||
}
|
||||
|
||||
/* Cross-browser dynamic CSS creation
|
||||
- Based on Bobby van der Sluis' solution: http://www.bobbyvandersluis.com/articles/dynamicCSS.php
|
||||
*/
|
||||
function createCSS(sel, decl, media, newStyle) {
|
||||
if (ua.ie && ua.mac) { return; }
|
||||
var h = doc.getElementsByTagName("head")[0];
|
||||
if (!h) { return; } // to also support badly authored HTML pages that lack a head element
|
||||
var m = (media && typeof media == "string") ? media : "screen";
|
||||
if (newStyle) {
|
||||
dynamicStylesheet = null;
|
||||
dynamicStylesheetMedia = null;
|
||||
}
|
||||
if (!dynamicStylesheet || dynamicStylesheetMedia != m) {
|
||||
// create dynamic stylesheet + get a global reference to it
|
||||
var s = createElement("style");
|
||||
s.setAttribute("type", "text/css");
|
||||
s.setAttribute("media", m);
|
||||
dynamicStylesheet = h.appendChild(s);
|
||||
if (ua.ie && ua.win && typeof doc.styleSheets != UNDEF && doc.styleSheets.length > 0) {
|
||||
dynamicStylesheet = doc.styleSheets[doc.styleSheets.length - 1];
|
||||
}
|
||||
dynamicStylesheetMedia = m;
|
||||
}
|
||||
// add style rule
|
||||
if (ua.ie && ua.win) {
|
||||
if (dynamicStylesheet && typeof dynamicStylesheet.addRule == OBJECT) {
|
||||
dynamicStylesheet.addRule(sel, decl);
|
||||
}
|
||||
}
|
||||
else {
|
||||
if (dynamicStylesheet && typeof doc.createTextNode != UNDEF) {
|
||||
dynamicStylesheet.appendChild(doc.createTextNode(sel + " {" + decl + "}"));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setVisibility(id, isVisible) {
|
||||
if (!autoHideShow) { return; }
|
||||
var v = isVisible ? "visible" : "hidden";
|
||||
if (isDomLoaded && getElementById(id)) {
|
||||
getElementById(id).style.visibility = v;
|
||||
}
|
||||
else {
|
||||
createCSS("#" + id, "visibility:" + v);
|
||||
}
|
||||
}
|
||||
|
||||
/* Filter to avoid XSS attacks
|
||||
*/
|
||||
function urlEncodeIfNecessary(s) {
|
||||
var regex = /[\\\"<>\.;]/;
|
||||
var hasBadChars = regex.exec(s) != null;
|
||||
return hasBadChars && typeof encodeURIComponent != UNDEF ? encodeURIComponent(s) : s;
|
||||
}
|
||||
|
||||
/* Release memory to avoid memory leaks caused by closures, fix hanging audio/video threads and force open sockets/NetConnections to disconnect (Internet Explorer only)
|
||||
*/
|
||||
var cleanup = function() {
|
||||
if (ua.ie && ua.win) {
|
||||
window.attachEvent("onunload", function() {
|
||||
// remove listeners to avoid memory leaks
|
||||
var ll = listenersArr.length;
|
||||
for (var i = 0; i < ll; i++) {
|
||||
listenersArr[i][0].detachEvent(listenersArr[i][1], listenersArr[i][2]);
|
||||
}
|
||||
// cleanup dynamically embedded objects to fix audio/video threads and force open sockets and NetConnections to disconnect
|
||||
var il = objIdArr.length;
|
||||
for (var j = 0; j < il; j++) {
|
||||
removeSWF(objIdArr[j]);
|
||||
}
|
||||
// cleanup library's main closures to avoid memory leaks
|
||||
for (var k in ua) {
|
||||
ua[k] = null;
|
||||
}
|
||||
ua = null;
|
||||
for (var l in swfobject) {
|
||||
swfobject[l] = null;
|
||||
}
|
||||
swfobject = null;
|
||||
});
|
||||
}
|
||||
}();
|
||||
|
||||
return {
|
||||
/* Public API
|
||||
- Reference: http://code.google.com/p/swfobject/wiki/documentation
|
||||
*/
|
||||
registerObject: function(objectIdStr, swfVersionStr, xiSwfUrlStr, callbackFn) {
|
||||
if (ua.w3 && objectIdStr && swfVersionStr) {
|
||||
var regObj = {};
|
||||
regObj.id = objectIdStr;
|
||||
regObj.swfVersion = swfVersionStr;
|
||||
regObj.expressInstall = xiSwfUrlStr;
|
||||
regObj.callbackFn = callbackFn;
|
||||
regObjArr[regObjArr.length] = regObj;
|
||||
setVisibility(objectIdStr, false);
|
||||
}
|
||||
else if (callbackFn) {
|
||||
callbackFn({success:false, id:objectIdStr});
|
||||
}
|
||||
},
|
||||
|
||||
getObjectById: function(objectIdStr) {
|
||||
if (ua.w3) {
|
||||
return getObjectById(objectIdStr);
|
||||
}
|
||||
},
|
||||
|
||||
embedSWF: function(swfUrlStr, replaceElemIdStr, widthStr, heightStr, swfVersionStr, xiSwfUrlStr, flashvarsObj, parObj, attObj, callbackFn) {
|
||||
var callbackObj = {success:false, id:replaceElemIdStr};
|
||||
if (ua.w3 && !(ua.wk && ua.wk < 312) && swfUrlStr && replaceElemIdStr && widthStr && heightStr && swfVersionStr) {
|
||||
setVisibility(replaceElemIdStr, false);
|
||||
addDomLoadEvent(function() {
|
||||
widthStr += ""; // auto-convert to string
|
||||
heightStr += "";
|
||||
var att = {};
|
||||
if (attObj && typeof attObj === OBJECT) {
|
||||
for (var i in attObj) { // copy object to avoid the use of references, because web authors often reuse attObj for multiple SWFs
|
||||
att[i] = attObj[i];
|
||||
}
|
||||
}
|
||||
att.data = swfUrlStr;
|
||||
att.width = widthStr;
|
||||
att.height = heightStr;
|
||||
var par = {};
|
||||
if (parObj && typeof parObj === OBJECT) {
|
||||
for (var j in parObj) { // copy object to avoid the use of references, because web authors often reuse parObj for multiple SWFs
|
||||
par[j] = parObj[j];
|
||||
}
|
||||
}
|
||||
if (flashvarsObj && typeof flashvarsObj === OBJECT) {
|
||||
for (var k in flashvarsObj) { // copy object to avoid the use of references, because web authors often reuse flashvarsObj for multiple SWFs
|
||||
if (typeof par.flashvars != UNDEF) {
|
||||
par.flashvars += "&" + k + "=" + flashvarsObj[k];
|
||||
}
|
||||
else {
|
||||
par.flashvars = k + "=" + flashvarsObj[k];
|
||||
}
|
||||
}
|
||||
}
|
||||
if (hasPlayerVersion(swfVersionStr)) { // create SWF
|
||||
var obj = createSWF(att, par, replaceElemIdStr);
|
||||
if (att.id == replaceElemIdStr) {
|
||||
setVisibility(replaceElemIdStr, true);
|
||||
}
|
||||
callbackObj.success = true;
|
||||
callbackObj.ref = obj;
|
||||
}
|
||||
else if (xiSwfUrlStr && canExpressInstall()) { // show Adobe Express Install
|
||||
att.data = xiSwfUrlStr;
|
||||
showExpressInstall(att, par, replaceElemIdStr, callbackFn);
|
||||
return;
|
||||
}
|
||||
else { // show alternative content
|
||||
setVisibility(replaceElemIdStr, true);
|
||||
}
|
||||
if (callbackFn) { callbackFn(callbackObj); }
|
||||
});
|
||||
}
|
||||
else if (callbackFn) { callbackFn(callbackObj); }
|
||||
},
|
||||
|
||||
switchOffAutoHideShow: function() {
|
||||
autoHideShow = false;
|
||||
},
|
||||
|
||||
ua: ua,
|
||||
|
||||
getFlashPlayerVersion: function() {
|
||||
return { major:ua.pv[0], minor:ua.pv[1], release:ua.pv[2] };
|
||||
},
|
||||
|
||||
hasFlashPlayerVersion: hasPlayerVersion,
|
||||
|
||||
createSWF: function(attObj, parObj, replaceElemIdStr) {
|
||||
if (ua.w3) {
|
||||
return createSWF(attObj, parObj, replaceElemIdStr);
|
||||
}
|
||||
else {
|
||||
return undefined;
|
||||
}
|
||||
},
|
||||
|
||||
showExpressInstall: function(att, par, replaceElemIdStr, callbackFn) {
|
||||
if (ua.w3 && canExpressInstall()) {
|
||||
showExpressInstall(att, par, replaceElemIdStr, callbackFn);
|
||||
}
|
||||
},
|
||||
|
||||
removeSWF: function(objElemIdStr) {
|
||||
if (ua.w3) {
|
||||
removeSWF(objElemIdStr);
|
||||
}
|
||||
},
|
||||
|
||||
createCSS: function(selStr, declStr, mediaStr, newStyleBoolean) {
|
||||
if (ua.w3) {
|
||||
createCSS(selStr, declStr, mediaStr, newStyleBoolean);
|
||||
}
|
||||
},
|
||||
|
||||
addDomLoadEvent: addDomLoadEvent,
|
||||
|
||||
addLoadEvent: addLoadEvent,
|
||||
|
||||
getQueryParamValue: function(param) {
|
||||
var q = doc.location.search || doc.location.hash;
|
||||
if (q) {
|
||||
if (/\?/.test(q)) { q = q.split("?")[1]; } // strip question mark
|
||||
if (param == null) {
|
||||
return urlEncodeIfNecessary(q);
|
||||
}
|
||||
var pairs = q.split("&");
|
||||
for (var i = 0; i < pairs.length; i++) {
|
||||
if (pairs[i].substring(0, pairs[i].indexOf("=")) == param) {
|
||||
return urlEncodeIfNecessary(pairs[i].substring((pairs[i].indexOf("=") + 1)));
|
||||
}
|
||||
}
|
||||
}
|
||||
return "";
|
||||
},
|
||||
|
||||
// For internal usage only
|
||||
expressInstallCallback: function() {
|
||||
if (isExpressInstallActive) {
|
||||
var obj = getElementById(EXPRESS_INSTALL_ID);
|
||||
if (obj && storedAltContent) {
|
||||
obj.parentNode.replaceChild(storedAltContent, obj);
|
||||
if (storedAltContentId) {
|
||||
setVisibility(storedAltContentId, true);
|
||||
if (ua.ie && ua.win) { storedAltContent.style.display = "block"; }
|
||||
}
|
||||
if (storedCallbackFn) { storedCallbackFn(storedCallbackObj); }
|
||||
}
|
||||
isExpressInstallActive = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
}();
|
||||
|
||||
console.log('swfobject');
|
||||
|
|
@ -0,0 +1,127 @@
|
|||
/**
|
||||
*
|
||||
* Secure Hash Algorithm (SHA256)
|
||||
* http://www.webtoolkit.info/
|
||||
*
|
||||
* Original code by Angel Marin, Paul Johnston.
|
||||
*
|
||||
**/
|
||||
|
||||
function SHA256(s){
|
||||
|
||||
var chrsz = 8;
|
||||
var hexcase = 0;
|
||||
|
||||
function safe_add (x, y) {
|
||||
var lsw = (x & 0xFFFF) + (y & 0xFFFF);
|
||||
var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
|
||||
return (msw << 16) | (lsw & 0xFFFF);
|
||||
}
|
||||
|
||||
function S (X, n) { return ( X >>> n ) | (X << (32 - n)); }
|
||||
function R (X, n) { return ( X >>> n ); }
|
||||
function Ch(x, y, z) { return ((x & y) ^ ((~x) & z)); }
|
||||
function Maj(x, y, z) { return ((x & y) ^ (x & z) ^ (y & z)); }
|
||||
function Sigma0256(x) { return (S(x, 2) ^ S(x, 13) ^ S(x, 22)); }
|
||||
function Sigma1256(x) { return (S(x, 6) ^ S(x, 11) ^ S(x, 25)); }
|
||||
function Gamma0256(x) { return (S(x, 7) ^ S(x, 18) ^ R(x, 3)); }
|
||||
function Gamma1256(x) { return (S(x, 17) ^ S(x, 19) ^ R(x, 10)); }
|
||||
|
||||
function core_sha256 (m, l) {
|
||||
var K = new Array(0x428A2F98, 0x71374491, 0xB5C0FBCF, 0xE9B5DBA5, 0x3956C25B, 0x59F111F1, 0x923F82A4, 0xAB1C5ED5, 0xD807AA98, 0x12835B01, 0x243185BE, 0x550C7DC3, 0x72BE5D74, 0x80DEB1FE, 0x9BDC06A7, 0xC19BF174, 0xE49B69C1, 0xEFBE4786, 0xFC19DC6, 0x240CA1CC, 0x2DE92C6F, 0x4A7484AA, 0x5CB0A9DC, 0x76F988DA, 0x983E5152, 0xA831C66D, 0xB00327C8, 0xBF597FC7, 0xC6E00BF3, 0xD5A79147, 0x6CA6351, 0x14292967, 0x27B70A85, 0x2E1B2138, 0x4D2C6DFC, 0x53380D13, 0x650A7354, 0x766A0ABB, 0x81C2C92E, 0x92722C85, 0xA2BFE8A1, 0xA81A664B, 0xC24B8B70, 0xC76C51A3, 0xD192E819, 0xD6990624, 0xF40E3585, 0x106AA070, 0x19A4C116, 0x1E376C08, 0x2748774C, 0x34B0BCB5, 0x391C0CB3, 0x4ED8AA4A, 0x5B9CCA4F, 0x682E6FF3, 0x748F82EE, 0x78A5636F, 0x84C87814, 0x8CC70208, 0x90BEFFFA, 0xA4506CEB, 0xBEF9A3F7, 0xC67178F2);
|
||||
var HASH = new Array(0x6A09E667, 0xBB67AE85, 0x3C6EF372, 0xA54FF53A, 0x510E527F, 0x9B05688C, 0x1F83D9AB, 0x5BE0CD19);
|
||||
var W = new Array(64);
|
||||
var a, b, c, d, e, f, g, h, i, j;
|
||||
var T1, T2;
|
||||
|
||||
m[l >> 5] |= 0x80 << (24 - l % 32);
|
||||
m[((l + 64 >> 9) << 4) + 15] = l;
|
||||
|
||||
for ( var i = 0; i<m.length; i+=16 ) {
|
||||
a = HASH[0];
|
||||
b = HASH[1];
|
||||
c = HASH[2];
|
||||
d = HASH[3];
|
||||
e = HASH[4];
|
||||
f = HASH[5];
|
||||
g = HASH[6];
|
||||
h = HASH[7];
|
||||
|
||||
for ( var j = 0; j<64; j++) {
|
||||
if (j < 16) W[j] = m[j + i];
|
||||
else W[j] = safe_add(safe_add(safe_add(Gamma1256(W[j - 2]), W[j - 7]), Gamma0256(W[j - 15])), W[j - 16]);
|
||||
|
||||
T1 = safe_add(safe_add(safe_add(safe_add(h, Sigma1256(e)), Ch(e, f, g)), K[j]), W[j]);
|
||||
T2 = safe_add(Sigma0256(a), Maj(a, b, c));
|
||||
|
||||
h = g;
|
||||
g = f;
|
||||
f = e;
|
||||
e = safe_add(d, T1);
|
||||
d = c;
|
||||
c = b;
|
||||
b = a;
|
||||
a = safe_add(T1, T2);
|
||||
}
|
||||
|
||||
HASH[0] = safe_add(a, HASH[0]);
|
||||
HASH[1] = safe_add(b, HASH[1]);
|
||||
HASH[2] = safe_add(c, HASH[2]);
|
||||
HASH[3] = safe_add(d, HASH[3]);
|
||||
HASH[4] = safe_add(e, HASH[4]);
|
||||
HASH[5] = safe_add(f, HASH[5]);
|
||||
HASH[6] = safe_add(g, HASH[6]);
|
||||
HASH[7] = safe_add(h, HASH[7]);
|
||||
}
|
||||
return HASH;
|
||||
}
|
||||
|
||||
function str2binb (str) {
|
||||
var bin = Array();
|
||||
var mask = (1 << chrsz) - 1;
|
||||
for(var i = 0; i < str.length * chrsz; i += chrsz) {
|
||||
bin[i>>5] |= (str.charCodeAt(i / chrsz) & mask) << (24 - i%32);
|
||||
}
|
||||
return bin;
|
||||
}
|
||||
|
||||
function Utf8Encode(string) {
|
||||
string = string.replace(/\r\n/g,"\n");
|
||||
var utftext = "";
|
||||
|
||||
for (var n = 0; n < string.length; n++) {
|
||||
|
||||
var c = string.charCodeAt(n);
|
||||
|
||||
if (c < 128) {
|
||||
utftext += String.fromCharCode(c);
|
||||
}
|
||||
else if((c > 127) && (c < 2048)) {
|
||||
utftext += String.fromCharCode((c >> 6) | 192);
|
||||
utftext += String.fromCharCode((c & 63) | 128);
|
||||
}
|
||||
else {
|
||||
utftext += String.fromCharCode((c >> 12) | 224);
|
||||
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
|
||||
utftext += String.fromCharCode((c & 63) | 128);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return utftext;
|
||||
}
|
||||
|
||||
function binb2hex (binarray) {
|
||||
var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
|
||||
var str = "";
|
||||
for(var i = 0; i < binarray.length * 4; i++) {
|
||||
str += hex_tab.charAt((binarray[i>>2] >> ((3 - i%4)*8+4)) & 0xF) +
|
||||
hex_tab.charAt((binarray[i>>2] >> ((3 - i%4)*8 )) & 0xF);
|
||||
}
|
||||
return str;
|
||||
}
|
||||
|
||||
s = Utf8Encode(s);
|
||||
return binb2hex(core_sha256(str2binb(s), s.length * chrsz));
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,104 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Sync</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="Calvin 'calzoneman' Montgomery">
|
||||
|
||||
<link href="./assets/css/bootstrap.css" rel="stylesheet">
|
||||
<link href="./assets/css/ytsync.css" rel="stylesheet">
|
||||
<style>
|
||||
body {
|
||||
padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
|
||||
}
|
||||
</style>
|
||||
<link href="./assets/css/bootstrap-responsive.css" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="navbar navbar-inverse navbar-fixed-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container">
|
||||
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="brand" href="#">Sync</a>
|
||||
<div class="nav-collapse collapse">
|
||||
<ul class="nav">
|
||||
<li class="active"><a href="#">Home</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div id="loginform" class="span4">
|
||||
<label for="username">Username</label>
|
||||
<input type="text" id="username">
|
||||
<label for="password">Password (leave blank to log in as a guest)</label>
|
||||
<input type="password" id="password">
|
||||
<br>
|
||||
<div class="btn-panel">
|
||||
<button class="btn" id="login">Login</button>
|
||||
<button class="btn" id="register">Register</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="loggedin" class="span6" style="display: none;">
|
||||
<h3 id="welcome"></h3>
|
||||
<button class="btn" id="logout">Logout</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top: 20px;">
|
||||
<div class="span6">
|
||||
<div id="userlist">
|
||||
</div>
|
||||
<div id="messagebuffer">
|
||||
</div>
|
||||
<input type="text" id="chatline">
|
||||
</div>
|
||||
<div class="span6">
|
||||
<div id="ytapiplayer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top: 50px;">
|
||||
<div class="span6">
|
||||
<div id="playlist_controls" style="display: none;">
|
||||
<input type="text" id="mediaurl" style="margin:auto;">
|
||||
<div class="btn-group">
|
||||
<button class="btn" id="queue_next">Queue Next</button>
|
||||
<button class="btn" id="queue_end">Queue @ End</button>
|
||||
</div>
|
||||
<button class="btn btn-inverse" id="play_next">Play Next</button>
|
||||
</div>
|
||||
<ul id="queue" class="videolist">
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span6">
|
||||
<input type="text" id="library_query" style="margin:auto;">
|
||||
<button class="btn" id="library_search">Search Library</button>
|
||||
<ul id="library" class="videolist">
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div> <!-- /container -->
|
||||
|
||||
<script src="https://w.soundcloud.com/player/api.js"></script>
|
||||
<script src="./assets/js/froogaloop.min.js"></script>
|
||||
<script src="./assets/js/jquery.js"></script>
|
||||
<script src="./assets/js/webtoolkit.sha256.js" type="text/javascript"></script>
|
||||
<script src="./socket.io/socket.io.js"></script>
|
||||
<script src="./assets/js/functions.js"></script>
|
||||
<script src="./assets/js/callbacks.js"></script>
|
||||
<script src="./assets/js/client.js"></script>
|
||||
<script src="./assets/js/swf.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue