rainbownapkin/fore.st
1
0
Fork 0
Code Issues 13 Pull requests Projects Releases Packages Wiki Activity Actions

Added mod panel, nested fpanel menus, fpanel playlist

Browse source
This commit is contained in:
rainbownapkin 2022-07-19 06:32:22 +00:00
parent 3f653c4893
commit 1da7cab9cd
15 changed files with 556 additions and 146 deletions
Download patch file Download diff file Expand all files Collapse all files

51
www/css/cytube.css
View file

@ -40,21 +40,49 @@ body{
max-width: 100%;
overflow-x: hidden;
}
#mp-show-ip-in-tooltip{
margin-top: 0.5em;
}
#main, #titles{
display: flex;
}
.static-cont{
position: absolute;
width: auto !important;
height: auto !important;
min-width: 100%;
min-height: 100%;
}
.qt{
margin: 0.5em 0;
}
#qt-clearuser{
margin: 0 0.5em;
}
.container-fluid {
padding-left: 15px;
padding-right: 15px;
margin-left: auto;
margin-right: auto;
}
.nmenu{
position: absolute;
bottom: 0;
left: 0;
right: 0;
display: flex;
z-index: 1;
}
.nmenu-btn{
flex-grow: 1;
}
#minicontrol{
display: none;
margin: 0 0.5em 0 0.5em;
}
#vidplay{
}
#viddur{
@ -63,7 +91,14 @@ body{
#loginform > .form-group {
margin-right: 5px;
}
#npoll-timeout{
width: 4em;
}
#npopt{
display: flex;
height: 1.6em;
margin: 0.5em 0;
}
.center {
text-align: center;
}
@ -98,7 +133,7 @@ body{
#messagebuffer, #userlist {
height: 329px;
overflow-x: hidden;
overflow-y: scroll;
overflow-y: auto;
margin-bottom: 0;
}
@ -107,7 +142,12 @@ body{
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.floatcont{
position: absolute;
right: 0;
left: 0;
z-index: 1;
}
.linewrap, .linewrap code {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
@ -420,7 +460,8 @@ label[for="emotealphabox"]{
font-family: Monospace;
}
.fpcont{
overflow: scroll;
overflow-y: auto;
overflow-x: hidden;
}
#optedit, #permedit, #filteredit, #motdedit, #cssedit, #jsedit,
#banlist, #loginhistory, #channelranks, #chanlog {

25
www/css/themes/fore.st.css
View file

@ -88,7 +88,13 @@ sub,sup{
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline
vertical-align:baseline;
}
.btn.btn-sm.btn-default.nmenu-btn.nmenu-border{
border-left: 1px #949494 solid;
}
.nmenu{
border-top: 1px #949494 solid;
}
.label-admin, .label.label-admin{
background-color: #cc0000;
@ -5492,11 +5498,17 @@ a.list-group-item-danger.active:focus,a.list-group-item-danger.active:hover{
text-decoration: none;
}
#pollopenbtn, #prefopenbtn, #emoteopenbtn, #chatsend, #motdwrap, #chatline, #rightcontrols, #chatheader, #userlist, #messagebuffer, #videowrap-header, .embed-responsive, #rightpane, #mainrow{
.panelback, .embed-responsive{
background-color: #111111C0;
backdrop-filter: blur(12px);
}
.nmenu-btn{
background-color: #00000000;
backdrop-filter: blur(12px);
}
#fpaneldiv{
border: 1px #949494 solid;
background-color: #1119;
@ -5513,6 +5525,15 @@ a.list-group-item-danger.active:focus,a.list-group-item-danger.active:hover{
background-color: #111111C0;
padding: 10px;
border: 1px solid #949494;
position:absolute;
left: 50%;
right 50%;
transform: translate(-50%);
top: 10%;
width: 40%;
}
.npoll-opt{
width: 50%;
}
#chatwrap, #videowrap{
padding-right: 0px;

4
www/js/callbacks.js
View file

@ -222,7 +222,9 @@ Callbacks = {
$("<p/>").appendTo(div)
.html("Go watch one of the channels that actually exists <a href='/'>here</a>.");
$("#ytapiplayer").append('<embed type="text/html" src="https://vid.puffyan.us/embed/HS-xJLNROqE?Autoplay=1&loop=1">')//KSSSSSSSSSSSSSSSSSSSSSSSH
$("#ytapiplayer").removeClass("embed-responsive-item").addClass("static-cont");
$("#ytapiplayer").append('<video src="' + location.origin +'/vid/static.webm" autoplay loop class="static-cont">');//KSSSSSSSSSSSSSSSSSSSSSSSH
handleWindowResize();
},
setMotd: function(motd) {

1
www/js/data.js
View file

@ -181,6 +181,7 @@ var USEROPTS = {
chat_tab_method : getOrDefault("chat_tab_method", "Cycle options"),
notifications : getOrDefault("notifications", "never"),
show_ip_in_tooltip : getOrDefault("show_ip_in_tooltip", true),
show_playlist : getOrDefault("show_playlist", false),
show_orientation : getOrDefault("show_orientation", "true")
};

280
www/js/fpanel.js
View file

@ -20,6 +20,9 @@ CURRENTFPANEL = null;
//---Global Functions---
function closeFPanel(cb){//close and null out fpanel, cb function to call when panel is closed
$("#fpaneldiv").hide("slide", 250,function(){
if(typeof CURRENTFPANEL.ccall === 'function'){
CURRENTFPANEL.ccall();
}
$("#fpcontdiv").empty();
$("#fptitle").html("null Panel");
$("#closefpanel").prop("title", "Close null panel.");
@ -49,14 +52,19 @@ function panelbtn(panel){
}
//---base panel---
function fpmenu(title, elm, data, ocall){//fpmenu constructor
function fpmenu(title, elm, data, ocall, ccall){//fpmenu constructor
this.title = title;//title of menu
this.elm = elm;//elements to insert (good for simple menus)
this.data = data;//menu data (not used for all menus)
this.ocall = function ocall(){};//function to call upon menu opening (used for more advanced menus)
this.ocall = ocall;//function to call upon menu opening (used for more advanced menus)
this.ccall = ccall;//function to call upon menu closing
}
fpmenu.prototype.popMenu = function(idata){//POP goes the weasal!
if(CURRENTFPANEL != null)
if(typeof CURRENTFPANEL.ccall === 'function'){
CURRENTFPANEL.ccall();
}
this.data = idata//set data
$("#fpcontdiv").empty();//empty content div
$("#fptitle").html(this.title + " Panel");//set panel tittle
@ -66,6 +74,34 @@ fpmenu.prototype.popMenu = function(idata){//POP goes the weasal!
CURRENTFPANEL = this;
$("#fpaneldiv").show("slide", 250, function() {sizeFPDiv()});//show panel and correct size once open
}
//---base nested menu bar---
function nmenu(title,p,menus,elm){//nested menu constructor(title(defaults to formatted parent title), parent, menu object array,append element(defaults to #fpcontdiv)
this.title = (title == null ? p.title.toLowerCase().replace(' ','-') + "-nested" : title);
this.parent = p;
this.menus = menus;
this.elm = (elm == null ? $("#fpcontdiv") : elm);
}
nmenu.prototype.popMenu = function(){//instantiate nested menu, to be thrown at end of ocall
melm = $("<div>").attr("id",this.title).addClass("nmenu");//create nmenu div
par = this.parent;
this.elm.append(melm.append(
$("<button>").addClass("btn btn-sm btn-default nmenu-btn panelback").attr("id",this.parent.title.toLowerCase().replace(' ','-')+"-nested-btn").html(this.parent.title).click(function(ev){
if(CURRENTFPANEL !== par){
par.popMenu();
}
})
));
this.menus.map(function(menu){//for every menu in menus array
melm.append(
$("<button>").addClass("btn btn-sm btn-default nmenu-btn nmenu-border panelback").attr("id",menu.title.toLowerCase().replace(' ','-')+"-nested-btn").html(menu.title).click(function(){
if(CURRENTFPANEL !== menu){
menu.popMenu();
}
})
);
});
}
//---fpanel poll---
var fpoll = new fpmenu("Poll");//create new panel fpoll
@ -330,3 +366,243 @@ fpset.loadSettings = function(){
$("#qs-timestamp-second").prop("checked", USEROPTS.show_seconds);
}
//---admin/mod panel---
var fpmod = new fpmenu("Mod");//create new panel fpmod
fpmod.elm = [//fpmod element array
]
fpmod.ocall = function(){
//---Local Functions---
//---Poll Creation---
function addOpt(){
i = $("#opts").children().length;
$("#opts").append(
$("<input>").addClass("npoll-opt qs-form").prop("type","text").attr("placeholder","Option " + i)
);
}
function rmOpt(){
if($("#opts").children().length > 2){
$("#opts").children()[$("#opts").children().length - 1].remove();
}
}
//Mod Message
function modMsg(){
var names = [];
var msg = $("#qt-modmsg").val().toString();
$("#userlist").children().map(function(i, usr){
cn = usr.children[1].className;
if((cn === "userlist_siteadmin" || cn === "userlist_owner" || cn === "userlist_op") && usr.children[1].innerHTML !== CLIENT.name){//for all mods
var meta = {};//sendem msg
if (msg.trim() === "") {
return;
}
if (USEROPTS.modhat && CLIENT.rank >= Rank.Moderator) {
meta.modflair = CLIENT.rank;
}
if (CLIENT.rank >= 2 && msg.indexOf("/m ") === 0) {
meta.modflair = CLIENT.rank;
msg = msg.substring(3);
}
socket.emit("pm", {
to: usr.children[1].innerHTML,
msg: msg,
meta: meta
});
}
});
$("#qt-modmsg").val("");
}
//---Main Append---
$("#fpcontdiv").append(//main append
$("<h4>").html("Poll Creation"),
$("<form>").append(
$("<input>").prop("id","npoll-title").prop("type","text").addClass("qs-form").attr("placeholder","Poll Title"),
$("<input>").prop("id","npoll-timeout").prop("type","text").addClass("qs-form").attr("placeholder","Timer"),
$("<button/>").addClass("btn btn-primary btn-ln").text("Create Poll").prop("type","button").click(function(){
var menu = $("#fpcontdiv");
var title = $("#npoll-title");
var timeout = $("#npoll-timeout");
var hidden = $("#npoll-hide-result");
var retainVotes = $("#npoll-keep-vote");
var t = timeout.val().trim();
if (t) {
try {
t = parseTimeout(t);
} catch (e) {
if (timeoutError) {
timeoutError.remove();
}
timeoutError = $("<p/>").addClass("text-danger").text(e.message);
timeoutError.insertAfter(timeout);
timeout.focus();
return;
}
} else {
t = undefined;
}
var opts = [];
menu.find(".npoll-opt").each(function() {
if($(this).val() != "")
opts.push($(this).val());
});
socket.emit("newPoll", {
title: title.val(),
opts: opts,
obscured: hidden.prop("checked"),
retainVotes: retainVotes.prop("checked"),
timeout: t
}, function ack(result) {
if (result.error) {
modalAlert({
title: 'Error creating poll',
textContent: result.error.message
});
}
});
}),
),
$("<form>").append(
$("<label>").prop("for","npoll-hide-result").html("Hide result until poll closes: "),
$("<input>").prop("id","npoll-hide-result").prop("type","checkbox").addClass("qs-form")
),
$("<form>").append(
$("<label>").prop("for","npoll-keep-vote").html("Keep user's vote after disconnect: "),
$("<input>").prop("id","npoll-keep-vote").prop("type","checkbox").addClass("qs-form")
),
$("<span>").append(
$("<button/>").addClass("btn btn-primary btn-ln").text("-").prop("type","button").click(rmOpt),
$("<p>").html(" Poll Opts "),
$("<button/>").addClass("btn btn-primary btn-ln").text("+").prop("type","button").click(addOpt)
).attr("id","npopt"),
$("<form>").attr("id", "opts"),
//---Quick Tools---
$("<h4>").html("Quick Tools"),
$("<form>").addClass("qt").append(
$("<button/>").addClass("btn btn-primary btn-ln").attr("id","qt-announcebtn").text("!announce").prop("type","button").click(function(){
chatsmack("!announce " + $("#qt-announce").val());
}),
$("<input>").prop("id","qt-announce").prop("type","text").addClass("qs-form").attr("placeholder","Announce text.").keydown(function(ev){
if(ev.keyCode==13){
chatsmack("!announce " + $("#qt-announce").val());
return false;
}
})
),
$("<form>").addClass("qt").append(
$("<button/>").addClass("btn btn-primary btn-ln").attr("id","qt-clearbtn").text("!clear").prop("type","button").click(function(){
chatsmack("!clear " + $("#qt-clearuser").val());
}),
$("<select>").prop("id","qt-clearuser").addClass("qs-form").append($('<option value=""></option>'))
),
$("<form>").addClass("qt").append(
$("<input>").prop("id","qt-modmsg").prop("type","text").addClass("qs-form").attr("placeholder","Mod Message").keydown(function(ev){
if(ev.keyCode==13){
modMsg();
return false;
}
}),
$("<button/>").addClass("btn btn-primary btn-ln").text("Send Mod Msg").prop("type","button").click(modMsg)
),
//---Preferences---
$("<h4>").html("Quick Settings"),
$("<span>").addClass("qt").attr("id","qt-modflair").addClass($("#modflair").attr("class")).html("Modflair").click(modflair),
$("<form>").append(
$("<label>").prop("for","mp-show-ip-in-tooltip").html("Show IP in profile tooltips: "),
$("<input>").prop("id","mp-show-ip-in-tooltip").prop("type","checkbox").addClass("qs-form").prop("checked",USEROPTS.show_ip_in_tooltip).change(function() {
USEROPTS.show_ip_in_tooltip = $("#mp-show-ip-in-tooltip").prop("checked");
processOpts();
}),
),
$("<form>").append(
$("<label>").prop("for","mp-shadowchat").html("Show Shadowmuted Messages: "),
$("<input>").prop("id","mp-shadowchat").prop("type","checkbox").addClass("qs-form").prop("checked",USEROPTS.show_shadowchat).change(function() {
USEROPTS.show_shadowchat = $("#mp-shadowchat").prop("checked");
processOpts();
}),
),
$("<form>").append(
$("<label>").prop("for","mp-show-playlist").html("Legacy Playlist: "),
$("<input>").prop("id","mp-show-playlist").prop("type","checkbox").addClass("qs-form").prop("checked",USEROPTS.show_playlist).change(function() {
USEROPTS.show_playlist = $("#mp-show-playlist").prop("checked");
processOpts();
}),
),
);
//after-append
//---Poll Creation---
addOpt();
addOpt();
//---Quick Tools---
usrColors[0].map(function(u){
$("#qt-clearuser").append($('<option value="' + u + '">' + u + "</option>"));
});
modNested.popMenu();
}
//---Mod Panel Nested Panels---
//---Playlist---
var fpplaylist = new fpmenu("Playlist");//create new panel fpmod
fpplaylist.elm = [//fpmod element array
]
fpplaylist.ocall = function(){
modNested.popMenu();
if(!USEROPTS.show_playlist){
nesth = $("#mod-nested").outerHeight();
panlh = $("#fpcontdiv").outerHeight();
prow = $("#playlistrow").show().appendTo("#fpcontdiv");
prow.find("#rightcontrols").show().addClass("floatcont").prependTo("#fpcontdiv");
conth = $("#rightcontrols").outerHeight();
$("#rightpane").css("background-color","rgba(0,0,0,0)");
prow.find("#queue").css("max-height", panlh - conth - nesth + "px").css("margin-top",conth + "px").css("margin-bottom", nesth + "px");
}else{
$("<h4>").html("Please disable the Legacy Playlist setting to use this tab.").appendTo("#fpcontdiv");
}
}
fpplaylist.ccall = function(){
if(!USEROPTS.show_playlist){
$("#rightcontrols").hide().removeClass("floatcont").prependTo("#rightpane-inner");
$("#playlistrow").hide().appendTo($(".container")[0]);
$("#queue").css("max-height","500px").css("margin-top","0px").css("margin-bottom","0px");
$("#rightpane").css("background-color","");
}
}
//---Autobump---
var fpbump = new fpmenu("Auto Bump");//create new panel fpmod
fpbump.elm = [//fpmod element array
]
fpbump.ocall = function(){
modNested.popMenu();
}
//---Tokebot---
var fptoke = new fpmenu("Tokebot");//create new panel fpmod
fptoke.elm = [//fpmod element array
]
fptoke.ocall = function(){
modNested.popMenu();
}
//---Mod Panel Nested Menu---
modNested = new nmenu(null,fpmod,[fpplaylist,fpbump,fptoke]);

15
www/js/ui.js
View file

@ -151,29 +151,38 @@ $("#blindchat").click(function() {
blindChat();
});
$("#modflair").click(function () {
$("#modflair").click(modflair);
function modflair(){
var m = $("#modflair");
var q = $("#qt-modflair");
if (m.hasClass("label-success")) {
USEROPTS.modhat = false;
m.removeClass("label-success");
q.removeClass("label-success");
if (SUPERADMIN) {
USEROPTS.adminhat = true;
m.addClass("label-admin");
q.addClass("label-admin");
} else {
m.addClass("label-default");
q.addClass("label-default");
}
} else if (m.hasClass("label-admin")) {
USEROPTS.adminhat = false;
m.removeClass("label-admin")
.addClass("label-default");
q.removeClass("label-admin")
.addClass("label-default");
} else {
USEROPTS.modhat = true;
m.removeClass("label-default")
.addClass("label-success");
q.removeClass("label-default")
.addClass("label-success");
}
$("#us-modflair").prop("checked", USEROPTS.modhat);
setOpt('modhat', USEROPTS.modhat);
});
}
$("#usercount").mouseenter(function (ev) {
var breakdown = calcUserBreakdown();
@ -527,6 +536,8 @@ function setDur(){
/* playlist controls */
$("#queue").sortable({
scroll: true,
containment: "parent",
start: function(ev, ui) {
PL_FROM = ui.item.data("uid");
},

28
www/js/util.js
View file

@ -520,7 +520,7 @@ function scrollQueue() {
li = $(li);
$("#queue").scrollTop(0);
var scroll = li.position().top - $("#queue").position().top;
$("#queue").scrollTop(scroll);
$("#queue").scrollTop(scroll - (!USEROPTS.show_playlist ? $("#rightcontrols").outerHeight() + 1 : 0));
}
function makeQueueEntry(item, addbtns) {
@ -731,6 +731,7 @@ function showUserOptions() {
$("#us-modflair").prop("checked", USEROPTS.modhat);
$("#us-shadowchat").prop("checked", USEROPTS.show_shadowchat);
$("#us-show-ip-in-tooltip").prop("checked", USEROPTS.show_ip_in_tooltip);
$("#us-show-playlist").prop("checked", USEROPTS.show_playlist);
formatScriptAccessPrefs();
@ -744,6 +745,7 @@ function saveUserOptions() {
USEROPTS.ignore_channelcss = $("#us-no-channelcss").prop("checked");
USEROPTS.ignore_channeljs = $("#us-no-channeljs").prop("checked");
USEROPTS.show_ip_in_tooltip = $("#us-show-ip-in-tooltip").prop("checked");
USEROPTS.show_playlist = $("#us-show-playlist").prop("checked");
USEROPTS.synch = $("#us-synch").prop("checked");
USEROPTS.sync_accuracy = parseFloat($("#us-synch-accuracy").val()) || 2;
@ -815,6 +817,16 @@ function applyOpts() {
removeVideo();
}
if(hasPermission("playlistadd")){
if(USEROPTS.show_playlist){
$("#showplaylist").click();
}else{
$("#rightcontrols").hide();
$("#playlistrow").hide();
$("#showplaylist").hide();
}
}
$("#chatbtn").remove();
if(false) {
var btn = $("<button/>").addClass("btn btn-default btn-block")
@ -1085,6 +1097,7 @@ function handlePermissionChange() {
setVisible("#showchansettings", CLIENT.rank >= 2);
setVisible("#playlistmanagerwrap", CLIENT.rank >= 1);
setVisible("#modflair", CLIENT.rank >= 2);
setVisible("#modopenbtn", CLIENT.rank >= 2);
setVisible("#guestlogin", CLIENT.rank < 0);
setVisible("#chatline", CLIENT.rank >= 0);
setVisible("#queue", hasPermission("seeplaylist"));
@ -1128,6 +1141,11 @@ function handlePermissionChange() {
}
}
if(CLIENT.rank > 2){
$("#modopenbtn").html("ADMN").attr("title","Admin Panel");
fpmod.title = "Admin";
}
if(hasPermission("playlistmove")) {
$("#queue").sortable("enable");
$("#queue").addClass("queue_sortable");
@ -1180,6 +1198,13 @@ function handlePermissionChange() {
$("#chatline").attr("placeholder", "");
}
rebuildPlaylist();
if(!USEROPTS.show_playlist && $("#playlistrow").parent()[0].className == "container"){
$("#hideplaylist").click();
$("#rightcontrols").hide();
$("#playlistrow").hide();
$("#showplaylist").hide();
}
}
function fixWeirdButtonAlignmentIssue() {
@ -1831,6 +1856,7 @@ function handleWindowResize() {
($("#motdwrap").is(":visible") ? $("#motdwrap").outerHeight() : 0) -
($("#footer").is(":visible") ? $("#footer").outerHeight() : 0) -
($(".navbar").is(":visible") ? $(".navbar").outerHeight() : 0) -
($("#announcements").is(":visible") ? $("#announcements").outerHeight() : 0) -
$("#chatheader").outerHeight() - 1;
var h = rawh - $("#chatline").outerHeight();

BIN
www/vid/static.webm Normal file
View file

Binary file not shown.