Work on playlist items
This commit is contained in:
Calvin Montgomery
parent
38b2816e23
commit
161a116e59
|
|
@ -1,289 +1,293 @@
|
||||||
html, body {
|
html, body {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
height: auto !important;
|
height: auto !important;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin: 0 auto -90px;
|
margin: 0 auto -90px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer, .push {
|
#footer, .push {
|
||||||
margin: 90px 0 0 0;
|
margin: 90px 0 0 0;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
clear: both;
|
clear: both;
|
||||||
}
|
}
|
||||||
|
|
||||||
#welcome {
|
#welcome {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
#usercountwrap, #userlist, #messagebuffer, #videowrap {
|
#usercountwrap, #userlist, #messagebuffer, #videowrap {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
#librarytoggle, #userpltoggle, #playlisttoggle {
|
#librarytoggle, #userpltoggle, #playlisttoggle {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
#librarywrap, #userplaylistwrap, #playlist_controls {
|
#librarywrap, #userplaylistwrap, #playlist_controls {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.videolist {
|
.videolist {
|
||||||
list-style: none outside none;
|
list-style: none outside none;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
max-height: 500px;
|
max-height: 500px;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qe_btn {
|
.qe_btn {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
font-family: Monospace;
|
font-family: Monospace;
|
||||||
padding: 0 5px 0 5px;
|
padding: 0 5px 0 5px;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qe_buttons {
|
.qe_buttons {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qe_title {
|
.qe_title {
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qe_time {
|
.qe_time {
|
||||||
font-family: Monospace;
|
font-family: Monospace;
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.qe_clear {
|
.qe_clear {
|
||||||
clear: both;
|
clear: both;
|
||||||
}
|
}
|
||||||
|
|
||||||
#userpl_list {
|
#userpl_list {
|
||||||
list-style: none outside none;
|
list-style: none outside none;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
max-height: 500px;
|
max-height: 500px;
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
#userpl_list li {
|
#userpl_list li {
|
||||||
clear: both;
|
clear: both;
|
||||||
margin: 2px 0 0 auto;
|
margin: 2px 0 0 auto;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
font-size: 8pt;
|
font-size: 8pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
#usercountwrap, #currenttitle {
|
#usercountwrap, #currenttitle {
|
||||||
border: 1px solid #aaaaaa;
|
border: 1px solid #aaaaaa;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#usercount {
|
#usercount {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pointer {
|
.pointer {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
#leftpane-inner div.span12, #rightpane-inner div.span12,
|
#leftpane-inner div.span12, #rightpane-inner div.span12,
|
||||||
#leftpane-inner ul, #rightpane-inner ul {
|
#leftpane-inner ul, #rightpane-inner ul {
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#queue {
|
#queue {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.queue_entry {
|
.queue_entry {
|
||||||
cursor: row-resize;
|
cursor: row-resize;
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
margin: 2px 0 0 auto;
|
margin: 2px 0 0 auto;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
font-size: 8pt;
|
font-size: 8pt;
|
||||||
border: 1px solid #aaaaaa; // [](/w21)
|
border: 1px solid #aaaaaa; // [](/w21)
|
||||||
}
|
}
|
||||||
|
|
||||||
#plmeta {
|
.queue_temp {
|
||||||
border: 1px solid #aaaaaa;
|
background-image: url(../img/stripe-diagonal.png);
|
||||||
background-color: #ffffff;
|
}
|
||||||
padding: 3px;
|
|
||||||
margin: 0;
|
#plmeta {
|
||||||
font-size: 12pt;
|
border: 1px solid #aaaaaa;
|
||||||
}
|
background-color: #ffffff;
|
||||||
|
padding: 3px;
|
||||||
#plcount {
|
margin: 0;
|
||||||
float: left;
|
font-size: 12pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
#pllength {
|
#plcount {
|
||||||
float: right;
|
float: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
#userlist {
|
#pllength {
|
||||||
overflow-y: scroll;
|
float: right;
|
||||||
overflow-x: hidden;
|
}
|
||||||
height: 347px;
|
|
||||||
float: left;
|
#userlist {
|
||||||
width: 150px;
|
overflow-y: scroll;
|
||||||
border: 1px solid #aaaaaa; // [](/z13)
|
overflow-x: hidden;
|
||||||
border-left: none;
|
height: 347px;
|
||||||
}
|
float: left;
|
||||||
|
width: 150px;
|
||||||
#messagebuffer {
|
border: 1px solid #aaaaaa; // [](/z13)
|
||||||
overflow-y: scroll;
|
border-left: none;
|
||||||
overflow-x: hidden;
|
}
|
||||||
height: 347px;
|
|
||||||
border: 1px solid #aaaaaa; // AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAa
|
#messagebuffer {
|
||||||
border-left: 0;
|
overflow-y: scroll;
|
||||||
}
|
overflow-x: hidden;
|
||||||
|
height: 347px;
|
||||||
#messagebuffer div, #messagebuffer code {
|
border: 1px solid #aaaaaa; // AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAa
|
||||||
white-space: pre-wrap; /* css-3 */
|
border-left: 0;
|
||||||
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
}
|
||||||
white-space: -pre-wrap; /* Opera 4-6 */
|
|
||||||
white-space: -o-pre-wrap; /* Opera 7 */
|
#messagebuffer div, #messagebuffer code {
|
||||||
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
white-space: pre-wrap; /* css-3 */
|
||||||
}
|
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
|
||||||
|
white-space: -pre-wrap; /* Opera 4-6 */
|
||||||
.userlist_siteadmin {
|
white-space: -o-pre-wrap; /* Opera 7 */
|
||||||
color: #cc0000;
|
word-wrap: break-word; /* Internet Explorer 5.5+ */
|
||||||
font-weight: bold;
|
}
|
||||||
}
|
|
||||||
|
.userlist_siteadmin {
|
||||||
.userlist_owner {
|
color: #cc0000;
|
||||||
color: #0000cc;
|
font-weight: bold;
|
||||||
font-weight: bold;
|
}
|
||||||
}
|
|
||||||
|
.userlist_owner {
|
||||||
.userlist_op {
|
color: #0000cc;
|
||||||
color: #00aa00;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.userlist_guest {
|
.userlist_op {
|
||||||
color: #888888;
|
color: #00aa00;
|
||||||
}
|
}
|
||||||
|
|
||||||
.action {
|
.userlist_guest {
|
||||||
font-style: italic;
|
color: #888888;
|
||||||
color: #888888;
|
}
|
||||||
}
|
|
||||||
|
.action {
|
||||||
.spoiler {
|
font-style: italic;
|
||||||
color: #000000;
|
color: #888888;
|
||||||
background-color: #000000;
|
}
|
||||||
}
|
|
||||||
|
.spoiler {
|
||||||
.spoiler:hover {
|
color: #000000;
|
||||||
color: #ffffff;
|
background-color: #000000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.greentext {
|
.spoiler:hover {
|
||||||
color: #789922; /* Color value directly from 4chan */
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shout {
|
.greentext {
|
||||||
color: #ff0000;
|
color: #789922; /* Color value directly from 4chan */
|
||||||
font-weight: bold;
|
}
|
||||||
font-size: 18pt;
|
|
||||||
}
|
.shout {
|
||||||
|
color: #ff0000;
|
||||||
.mono {
|
font-weight: bold;
|
||||||
font-family: Monospace;
|
font-size: 18pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
.server-msg-disconnect {
|
.mono {
|
||||||
border: 1px solid #ff0000;
|
font-family: Monospace;
|
||||||
margin: 5px;
|
}
|
||||||
padding: 5px;
|
|
||||||
color: #ff0000;
|
.server-msg-disconnect {
|
||||||
}
|
border: 1px solid #ff0000;
|
||||||
|
margin: 5px;
|
||||||
.server-msg-reconnect {
|
padding: 5px;
|
||||||
border: 1px solid #009900;
|
color: #ff0000;
|
||||||
margin: 5px;
|
}
|
||||||
padding: 5px;
|
|
||||||
color: #009900;
|
.server-msg-reconnect {
|
||||||
}
|
border: 1px solid #009900;
|
||||||
|
margin: 5px;
|
||||||
.poll-notify {
|
padding: 5px;
|
||||||
color: #0000aa;
|
color: #009900;
|
||||||
font-weight: bold;
|
}
|
||||||
font-size: 14pt;
|
|
||||||
}
|
.poll-notify {
|
||||||
|
color: #0000aa;
|
||||||
.option button {
|
font-weight: bold;
|
||||||
margin-right: 15px;
|
font-size: 14pt;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nick-highlight {
|
.option button {
|
||||||
background-color: #ddffdd;
|
margin-right: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nick-hover {
|
.nick-highlight {
|
||||||
background-color: #ffff99;
|
background-color: #ddffdd;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drink {
|
.nick-hover {
|
||||||
margin: 10px 10px;
|
background-color: #ffff99;
|
||||||
padding: 10px 0px;
|
}
|
||||||
border: 2px solid #0000cc;
|
|
||||||
}
|
.drink {
|
||||||
|
margin: 10px 10px;
|
||||||
#drinkbar {
|
padding: 10px 0px;
|
||||||
margin-left: 0;
|
border: 2px solid #0000cc;
|
||||||
background-color: #000000;
|
}
|
||||||
color: #ffffff;
|
|
||||||
text-align: center;
|
#drinkbar {
|
||||||
}
|
margin-left: 0;
|
||||||
|
background-color: #000000;
|
||||||
#motdtext, #csstext, #jstext {
|
color: #ffffff;
|
||||||
width: 100%;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
#csstext, #jstext {
|
#motdtext, #csstext, #jstext {
|
||||||
font-family: Monospace;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
#queue_next, #queue_end, #library_search, #youtube_search {
|
#csstext, #jstext {
|
||||||
width: 50%;
|
font-family: Monospace;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer {
|
#queue_next, #queue_end, #library_search, #youtube_search {
|
||||||
background-color: #f5f5f5;
|
width: 50%;
|
||||||
height: 30px;
|
}
|
||||||
width: 100%;
|
|
||||||
padding: 0;
|
#footer {
|
||||||
}
|
background-color: #f5f5f5;
|
||||||
|
height: 30px;
|
||||||
#footer p {
|
width: 100%;
|
||||||
text-align: center;
|
padding: 0;
|
||||||
width: 100%;
|
}
|
||||||
}
|
|
||||||
|
#footer p {
|
||||||
.timestamp {
|
text-align: center;
|
||||||
font-size: 8pt;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.profile-box {
|
.timestamp {
|
||||||
z-index: 9999;
|
font-size: 8pt;
|
||||||
position: absolute;
|
}
|
||||||
border: 1px solid #aaaaaa;
|
|
||||||
border-radius: 5px;
|
.profile-box {
|
||||||
background-color: #ffffff;
|
z-index: 9999;
|
||||||
max-width: 200px;
|
position: absolute;
|
||||||
padding: 5px;
|
border: 1px solid #aaaaaa;
|
||||||
}
|
border-radius: 5px;
|
||||||
|
background-color: #ffffff;
|
||||||
.profile-image {
|
max-width: 200px;
|
||||||
width: 80px;
|
padding: 5px;
|
||||||
height: 80px;
|
}
|
||||||
border: 1px solid #aaaaaa;
|
|
||||||
border-radius: 5px;
|
.profile-image {
|
||||||
}
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border: 1px solid #aaaaaa;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
|
||||||
BIN
www/assets/img/stripe-diagonal.png
Normal file
BIN
www/assets/img/stripe-diagonal.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 206 B |
File diff suppressed because it is too large
Load diff
|
|
@ -1,103 +1,108 @@
|
||||||
var CLIENT = {
|
var CLIENT = {
|
||||||
rank: -1,
|
rank: -1,
|
||||||
leader: false,
|
leader: false,
|
||||||
name: "",
|
name: "",
|
||||||
logged_in: false,
|
logged_in: false,
|
||||||
profile: {
|
profile: {
|
||||||
image: "",
|
image: "",
|
||||||
text: ""
|
text: ""
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
var CHANNEL = {
|
var CHANNEL = {
|
||||||
opts: {},
|
opts: {},
|
||||||
openqueue: false,
|
openqueue: false,
|
||||||
perms: {},
|
perms: {},
|
||||||
name: false // TODO load name from URL
|
name: false // TODO load name from URL
|
||||||
};
|
};
|
||||||
|
|
||||||
var PLAYER = false;
|
var PLAYER = false;
|
||||||
var VWIDTH = $("#ytapiplayer").parent().css("width").replace("px", "");
|
var VWIDTH = $("#ytapiplayer").parent().css("width").replace("px", "");
|
||||||
var VHEIGHT = ""+parseInt(parseInt(VWIDTH) * 9 / 16);
|
var VHEIGHT = ""+parseInt(parseInt(VWIDTH) * 9 / 16);
|
||||||
var POSITION = -1;
|
var POSITION = -1;
|
||||||
var socket;
|
var socket = {
|
||||||
var IGNORED = [];
|
emit: function() {
|
||||||
var CHATHIST = [];
|
console.log("socket not initialized");
|
||||||
var CHATHISTIDX = 0;
|
console.log(arguments);
|
||||||
var SCROLLCHAT = true;
|
}
|
||||||
var LASTCHATNAME = "";
|
};
|
||||||
var LASTCHATTIME = 0;
|
var IGNORED = [];
|
||||||
var FOCUSED = true;
|
var CHATHIST = [];
|
||||||
var PAGETITLE = "CyTube";
|
var CHATHISTIDX = 0;
|
||||||
var TITLE_BLINK;
|
var SCROLLCHAT = true;
|
||||||
var KICKED = false;
|
var LASTCHATNAME = "";
|
||||||
var NAME = readCookie("cytube_uname");
|
var LASTCHATTIME = 0;
|
||||||
var SESSION = readCookie("cytube_session");
|
var FOCUSED = true;
|
||||||
var LEADTMR = false;
|
var PAGETITLE = "CyTube";
|
||||||
|
var TITLE_BLINK;
|
||||||
function getOrDefault(k, def) {
|
var KICKED = false;
|
||||||
var v = localStorage.getItem(k);
|
var NAME = readCookie("cytube_uname");
|
||||||
if(v === null)
|
var SESSION = readCookie("cytube_session");
|
||||||
return def;
|
var LEADTMR = false;
|
||||||
if(v === "true")
|
|
||||||
return true;
|
function getOrDefault(k, def) {
|
||||||
if(v === "false")
|
var v = localStorage.getItem(k);
|
||||||
return false;
|
if(v === null)
|
||||||
if(v.match(/[0-9]+/))
|
return def;
|
||||||
return parseInt(v);
|
if(v === "true")
|
||||||
if(v.match(/[0-9\.]+/))
|
return true;
|
||||||
return parseFloat(v);
|
if(v === "false")
|
||||||
return v;
|
return false;
|
||||||
}
|
if(v.match(/[0-9]+/))
|
||||||
|
return parseInt(v);
|
||||||
var USEROPTS = {
|
if(v.match(/[0-9\.]+/))
|
||||||
theme : getOrDefault("theme", "default"),
|
return parseFloat(v);
|
||||||
css : getOrDefault("css", ""),
|
return v;
|
||||||
layout : getOrDefault("layout", "default"),
|
}
|
||||||
synch : getOrDefault("synch", true),
|
|
||||||
hidevid : getOrDefault("hidevid", false),
|
var USEROPTS = {
|
||||||
show_timestamps : getOrDefault("show_timestamps", true),
|
theme : getOrDefault("theme", "default"),
|
||||||
modhat : getOrDefault("modhat", false),
|
css : getOrDefault("css", ""),
|
||||||
blink_title : getOrDefault("blink_title", false),
|
layout : getOrDefault("layout", "default"),
|
||||||
sync_accuracy : getOrDefault("sync_accuracy", 2),
|
synch : getOrDefault("synch", true),
|
||||||
chatbtn : getOrDefault("chatbtn", false),
|
hidevid : getOrDefault("hidevid", false),
|
||||||
altsocket : getOrDefault("altsocket", false)
|
show_timestamps : getOrDefault("show_timestamps", true),
|
||||||
};
|
modhat : getOrDefault("modhat", false),
|
||||||
|
blink_title : getOrDefault("blink_title", false),
|
||||||
var Rank = {
|
sync_accuracy : getOrDefault("sync_accuracy", 2),
|
||||||
Guest: 0,
|
chatbtn : getOrDefault("chatbtn", false),
|
||||||
Member: 1,
|
altsocket : getOrDefault("altsocket", false)
|
||||||
Leader: 1.5,
|
};
|
||||||
Moderator: 2,
|
|
||||||
Admin: 3,
|
var Rank = {
|
||||||
Owner: 10,
|
Guest: 0,
|
||||||
Siteadmin: 255
|
Member: 1,
|
||||||
};
|
Leader: 1.5,
|
||||||
|
Moderator: 2,
|
||||||
function createCookie(name,value,days) {
|
Admin: 3,
|
||||||
if (days) {
|
Owner: 10,
|
||||||
var date = new Date();
|
Siteadmin: 255
|
||||||
date.setTime(date.getTime()+(days*24*60*60*1000));
|
};
|
||||||
var expires = "; expires="+date.toGMTString();
|
|
||||||
}
|
function createCookie(name,value,days) {
|
||||||
else var expires = "";
|
if (days) {
|
||||||
document.cookie = name+"="+value+expires+"; path=/";
|
var date = new Date();
|
||||||
}
|
date.setTime(date.getTime()+(days*24*60*60*1000));
|
||||||
|
var expires = "; expires="+date.toGMTString();
|
||||||
function readCookie(name) {
|
}
|
||||||
var nameEQ = name + "=";
|
else var expires = "";
|
||||||
var ca = document.cookie.split(";");
|
document.cookie = name+"="+value+expires+"; path=/";
|
||||||
for(var i=0;i < ca.length;i++) {
|
}
|
||||||
var c = ca[i];
|
|
||||||
while (c.charAt(0)==" ") c = c.substring(1,c.length);
|
function readCookie(name) {
|
||||||
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
|
var nameEQ = name + "=";
|
||||||
}
|
var ca = document.cookie.split(";");
|
||||||
return null;
|
for(var i=0;i < ca.length;i++) {
|
||||||
}
|
var c = ca[i];
|
||||||
|
while (c.charAt(0)==" ") c = c.substring(1,c.length);
|
||||||
function eraseCookie(name) {
|
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
|
||||||
createCookie(name,"",-1);
|
}
|
||||||
}
|
return null;
|
||||||
|
}
|
||||||
/* to be implemented in callbacks.js */
|
|
||||||
function setupCallbacks() { }
|
function eraseCookie(name) {
|
||||||
|
createCookie(name,"",-1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* to be implemented in callbacks.js */
|
||||||
|
function setupCallbacks() { }
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue