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

improved server-whisper, user join/leave messages, layout/UI overhaul

Browse source
This commit is contained in:
rainbownapkin 2022-07-10 03:31:30 +00:00
parent e7adec32d7
commit 5f97baffc6
23 changed files with 729 additions and 917 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

67
README.md
View file

@ -27,6 +27,8 @@ You can reach out by bugging rainbownapkin on the ttn discord or ourfore.st, you
## Pineapple Express Indev Release Notes
This is the first indev release for fore.st 1.1 Pineapple Express. This is the last push before the codebase is merged upstream with the newest version of cytube. Should probably get that done sooner than later. Heres a check list of the planned/completed features in this revision:
dev goals for 1.1 pineapple express:
- quick shit & bugfixes ✓
- change markdown filters to require three symbols on each side, quickest fix for filters ✓
- move refresh button to title bar ✓
@ -46,7 +48,14 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- fix chatbar resizing on new message notification (might just by cytube+) ✓
- relicense to agpl ✓
- disable/remove unregistered channels ✓
- fix fucked up bottom border on chat/video ✓
- rename "legacy playlist buttons" to compact, fix location. This seems like it could be usable if not better than default ✓
- get res/aspect ratio player.js ✓
- base.coffee ✓
- videojs.coffee(hls,videojs,raw-file,gdrive,rtmp) ✓
- dailymotion ~(this is kinda broken, likely not possible client-side without breaking CORS policy. This can wait until next version when an installation script including nginx and cors-proxy config gets added to support the catbox.moe image upload button which faces the same issue.
- vimeo ✓
- add player.js updates to twitch
- save temporary vids to channel library
- slide out panel (not an end user feature in and of itself, however a common UI element used for most menus, made to be quick and ezpz ✓
@ -82,8 +91,10 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- blink title on chat ✓
- chat notification sound ✓
- chat desktop notification ✓
- show timestamps ✓
- show seconds ✓
- trim/tidy default cytube commands
- trim/tidy default cytube command ✓
- replace / with ! as defualt server-side command indicator to match tokebot and TTN commands. / will be used for future client-side commands ✓
- me ✓
- sp ✓
@ -101,31 +112,47 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- cleantitle ✓
- remove/consolidate/add to commands ✓
- say -> announce(change tokebot modflair CSS to announce CSS, make normal modflair for bot/admin rank) ✓
- modflair on announce ✓
- remove kickanons ✓
- remove d (drink) ✓
- add user specific function to clear ('!clear <username>' to clear chats by said user) ✓
- Merge Upstream to newest cytube commit
- Merge Upstream to newest cytube commit ✓
- improved server-whisper system
- public leave/join messages
- server-whisper target parameter for user specific whispers
- server-whisper name
- improved server-whisper system ✓
- public leave/join messages ✓
- server-whisper target parameter for user specific whispers ✓
- server-whisper name ✓
- getplaylistlinks outputs in fpanel
- I mean its pretty fucking simple I dont know how you can screw this one up bud.
- ezpzlmnsqze
- ui sizing overhaul
- rip out all but the ONE TRUE layout. It's not 2014 anymore, one layout with dynamic elements will get you further than multiple static ones.
- chat/player sized to fit canvas with navbar (remove -+ buttons on player)
- theatre mode toggle icon on title bar (hides navbar, player/chat takes up entire screen)
- click to drag chat/player split
- shade player (hide and unload video, titel bar shows title and unshade icon only)
- shade chat (hide chat box, message box, send button. chat header bar collapses, retains user count and expansion arrows. Userlist/poll open/close is independent.)
- popout video button
- popout chat button
- remove legacy cytube themes. If they wheren't compatible after the emote panel, they certainly won't be now lmao
- flex layout/legacy layout ripout ✓
- rip out legacy layout system ✓
- chat/player sized to fit canvas with navbar (remove -+ buttons on player) ✓
- theatre mode toggle icon on title bar (hides navbar, player/chat takes up entire screen) ✓
- click to drag chat/player split ✓
- lock videowrap width to aspect ratio ✓
- lock on join ✓
- unlock on split drag ✓
- show lock button on unlock ✓
- hide lock button when locked ✓
- checklock/move split on window move ✓
- checklock/move split on video load ✓
- videojs.coffee(hls,videojs,raw-file,gdrive,rtmp) ✓
- dailymotion ✓
- vimeo ✓
- shade player ✓
- player controls in title bar when video shaded (play/pause, mute, current time/video duration), hidden when video open ✓
- minicont update in videojs ✓
- minicont update in dailymotion ✓
- minicont update in vimeo ✓
- shade chat (hide chat box, message box, send button. chat header bar collapses, retains user count and expansion arrows. Userlist/poll open/close is independent.) ✓
- scroll over mincont dir to scrub vid ✓
- scroll over minicont mutebtn to change vol ✓
- remove legacy cytube themes. If they wheren't compatible after the emote panel, they certainly won't be now lmao ✓
- fix bugs created by flex layout ✓
- decaffeinate player.js
- Coffee script was a bad idea then, and it makes even less sense now.
@ -135,6 +162,11 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- degoogling
- yt-dlp backend for serverside metadata acquisition of youtube videos w/o registered API key or google account
- potentially leverage yt-dlp backend for other media sources
- implement player.js updates into youtube.coffee
- latching
- getres
- update minicont dur
- update minicont buttons
- invidious embed support for youtube video playback
- youtube source in user prefrences (three or four invidious instances from different countries/continents, official youtube embed, or custom invidious instance)
@ -154,6 +186,7 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- tokefile, list of usernames with toke count. This will be switched to mariadb in the next update
- total tokes listed on profile tooltip
- mod panel
- button on chatbar
- mod message (sends message to all active mods)
@ -165,6 +198,7 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- open playlist below video (if closed, otherwise this does not appear)
- open playlist below video by default
-merge fore.st theme changes to fore.st dusk, consider moving some of them over to cytube.css for easier management
- extra shit(probs wait til next update, or hotfix)
@ -176,7 +210,6 @@ This is the first indev release for fore.st 1.1 Pineapple Express. This is the l
- change background to other themes background or img from url(theme background by default)
- native odysee support (no raw embed)
## License
Original fore.st code is provided under the Affero General Public License v3 in order to prevent fore.st being used in proprietary software.
(see the LICENSE file for the full text.)

3
player/base.coffee
View file

@ -49,4 +49,7 @@ window.Player = class Player
getVolume: (cb) ->
cb(VOLUME)
getRes: (cb) ->
cb();
destroy: ->

25
player/dailymotion.coffee
View file

@ -36,6 +36,7 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
@dm.addEventListener('pause', =>
@paused = true
setMini();
if CLIENT.leader
sendVideoUpdate()
else
@ -44,6 +45,7 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
@dm.addEventListener('playing', =>
@paused = false
setMini();
if CLIENT.leader
sendVideoUpdate()
@ -57,6 +59,19 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
@unlatch()
)
@dm.addEventListener('timeupdate', =>
setDur();
)
@dm.addEventListener('volumechange', =>
setMini();
)
@player.on('canplay', =>
handleVideoResize()
console.log(@player.children)
)
# Once the video stops, the internal state of the player
# becomes unusable and attempting to load() will corrupt it and
# crash the player with an error. As a short–medium term
@ -67,6 +82,8 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
)
@dm.addEventListener('playback_ready', =>
@dmReady = true
handleVideoResize()
if @playbackReadyCb
@playbackReadyCb()
@playbackReadyCb = null
@ -79,10 +96,13 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
if @dm and @dmReady
@dm.load(data.id)
@dm.seek(data.currentTime)
else if @dm
# TODO: Player::load() needs to be made asynchronous in the future
console.log('Warning: load() called before DM is ready, queueing callback')
@playbackReadyCb = () =>
handleVideoResize()
@dm.load(data.id)
@dm.seek(data.currentTime)
else
@ -127,6 +147,11 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
else
cb(VOLUME)
getRes: (cb) ->
if @dm and @dmReady
cb([@dm.width, @dm.height])
else
cb()
mapQuality: (quality) ->
switch String(quality)
when '240', '480', '720', '1080' then String(quality)

2
player/update.coffee
View file

@ -40,8 +40,6 @@ window.loadMediaPlayer = (data) ->
window.handleMediaUpdate = (data) ->
PLAYER = window.PLAYER
#bodge for fcyp.js layout
#handleWindowResize()
#update airdate
dispSTimes();

22
player/videojs.coffee
View file

@ -141,6 +141,7 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
@player.on('pause', =>
@paused = true
setMini();
if CLIENT.leader
sendVideoUpdate()
else
@ -150,10 +151,15 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
@player.on('play', =>
@paused = false
setMini();
if CLIENT.leader
sendVideoUpdate()
)
@player.on('volumechange', =>
setMini();
)
# Workaround for IE-- even after seeking completes, the loading
# spinner remains.
@player.on('seeked', =>
@ -163,6 +169,16 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
)
@player.on('canplay', =>
handleVideoResize()
console.log(@player.children)
)
@player.on('timeupdate', =>
setDur();
)
# Workaround for Chrome-- it seems that the click bindings for
# the subtitle menu aren't quite set up until after the ready
# event finishes, so set a timeout for 1ms to force this code
@ -241,6 +257,12 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
else
cb(VOLUME)
getRes: (cb) ->
if @player
cb([@player.videoWidth(), @player.videoHeight()])
else
cb()
destroy: ->
removeOld()
if @player

33
player/vimeo.coffee
View file

@ -4,6 +4,8 @@ window.VimeoPlayer = class VimeoPlayer extends Player
return new VimeoPlayer(data)
@load(data)
@resx = 0
@resy = 0
load: (data) ->
@setMediaProperties(data)
@ -31,6 +33,7 @@ window.VimeoPlayer = class VimeoPlayer extends Player
@vimeo.on('pause', =>
@paused = true
setMini();
if CLIENT.leader
sendVideoUpdate()
else
@ -40,6 +43,8 @@ window.VimeoPlayer = class VimeoPlayer extends Player
@vimeo.on('play', =>
@paused = false
setMini();
handleVideoResize()
if CLIENT.leader
sendVideoUpdate()
)
@ -49,8 +54,30 @@ window.VimeoPlayer = class VimeoPlayer extends Player
@unlatch()
)
@vimeo.on('timeupdate', =>
setDur();
)
@vimeo.on('volumechange', =>
setMini();
)
@play()
@setVolume(VOLUME)
@vimeo.getVideoWidth().then((wid) ->
window.PLAYER.resx = wid
).catch((error) ->
console.error('vimeo::getVideoWidth():', error)
)
@vimeo.getVideoHeight().then((hgt) ->
window.PLAYER.resy = hgt
).catch((error) ->
console.error('vimeo::getVideoHeight():', error)
)
)
play: ->
@ -98,3 +125,9 @@ window.VimeoPlayer = class VimeoPlayer extends Player
)
else
cb(VOLUME)
getRes: (cb) ->
if @vimeo
cb([@resx,@resy])
else
cb()

90
src/channel/channel.js
View file

@ -43,6 +43,57 @@ var fs = require("fs");
var path = require("path");
var sio = require("socket.io");
var db = require("../database");
var JoinMsg = [//join messages, bool(ifpostfix, if it is a string then it acts as prefix, and other string acts as postfix), str join message]
[true, "joined"],
[true, "arrived"],
[true, "appeared"],
[true, "hopped in"],
[true, "checked in"],
[true, "checked in to see what condition their condition was in"],
[true, "logged in"],
[true, "turned on, tuned in, and dropped out"],
[true, "is now using Ourfore.st"],
[true, "tuned in"],
[true, "is ready to sparkem"],
[true, "connected"],
[true, "joins the battle"],
[true, "hopped on"],
[true, "logged on"],
[false, "Ourfore.st, population:"],
[false, "Welcome,"],
[false, "Salutations,"],
[false, "Hello,"],
[false, "Greetings,"],
[false, "Sup,"],
[false, "I AM THE GOD OF HELLFIRE, AND I BRING YOU:"],
["A wild","has appeared"]
]
var LeaveMsg = [//join messages, bool(ifpostfix, if it is a string then it acts as prefix, and other string acts as postfix), str join message]
[true, "left"],
[true, "dropped out"],
[true, "checked out"],
[true, "quit"],
[true, "is no longer with us"],
[true, "is no longer using Ourfore.st"],
[true, "dipped"],
[true, "booked it"],
[true, "cheesed it"],
[true, "vanished"],
[true, "said dueces"],
[true, "has left the building"],
[true, "bounced"],
[true, "is beyond the horizon"],
[true, "has drifted into space"],
[true, "is outskies"],
[false, "Goodbye,"],
[false, "Dueces,"],
[false, "Bye,"],
[false, "Farewell,"],
[false, "l8r"],
[false, "That'll do,"]
]
import * as ChannelStore from '../channel-storage/channelstore';
import { ChannelStateSizeError } from '../errors';
import { EventEmitter } from 'events';
@ -503,6 +554,20 @@ Channel.prototype.acceptUser = function (user) {
user.on("effectiveRankChange", (newRank, oldRank) => {
this.maybeResendUserlist(user, newRank, oldRank);
});
var jms = JoinMsg[Math.floor(Math.random()*JoinMsg.length)];
if(jms[0] == true){
jms = (user.getName() + " " + jms[1] + ".");
}else if(jms[0] == false){
jms = (jms[1] + " " + user.getName() + ".");
}else{
jms = (jms[0] + " " + user.getName() + " " + jms[1] + ".");
}
self.modules.chat.sendModMessage(jms, -1);
self.modules.chat.sendModMessage("(aliases: " + user.account.aliases.join(",") + ")", 2);
};
Channel.prototype.partUser = function (user) {
@ -511,6 +576,18 @@ Channel.prototype.partUser = function (user) {
return;
}
var lms = LeaveMsg[Math.floor(Math.random()*LeaveMsg.length)];
if(lms[0] == true){
lms = (user.getName() + " " + lms[1] + ".");
}else if(lms[0] == false){
lms = (lms[1] + " " + user.getName() + ".");
}else{
lms = (lms[0] + " " + user.getName() + " " + lms[1] + ".");
}
this.modules.chat.sendModMessage(lms, -1);
this.modules.chat.sendModMessage("(aliases: " + user.account.aliases.join(",") + ")", 2);
this.logger.log("[login] " + user.displayip + " (" + user.getName() + ") " +
"disconnected.");
user.channel = null;
@ -687,8 +764,17 @@ Channel.prototype.sendUserJoin = function (users, user) {
}
});
self.modules.chat.sendModMessage(user.getName() + " joined (aliases: " +
user.account.aliases.join(",") + ")", 2);
/*var jms = JoinMsg[Math.floor(Math.random()*JoinMsg.length)];
if(jms[0] == true){
jms = (user.getName() + " " + jms[1] + ".");
}else if(jms[0] == false){
jms = (jms[1] + " " + user.getName() + ".");
}else{
jms = (jms[0] + " " + user.getName() + " " + jms[1] + ".");
}
self.modules.chat.sendModMessage(jms, -1);
self.modules.chat.sendModMessage("(aliases: " + user.account.aliases.join(",") + ")", 2);*/
};
Channel.prototype.readLog = function (cb) {

21
src/channel/chat.js
View file

@ -42,6 +42,7 @@ var XSS = require("../xss");
var ChannelModule = require("./module");
var util = require("../utilities");
var Flags = require("../flags");
import { transformImgTags } from '../camo';
import { Counter } from 'prom-client';
@ -450,13 +451,13 @@ ChatModule.prototype.filterMessage = function (msg) {
return XSS.sanitizeHTML(result, settings);
};
ChatModule.prototype.sendModMessage = function (msg, minrank) {
ChatModule.prototype.sendModMessage = function (msg, minrank, usr, target) {
if (isNaN(minrank)) {
minrank = 2;
}
var msgobj = {
username: "[server]",
username: usr == null ? "[server]" : usr,
msg: msg,
meta: {
addClass: "server-whisper",
@ -465,11 +466,19 @@ ChatModule.prototype.sendModMessage = function (msg, minrank) {
time: Date.now()
};
if(target == null){
this.channel.users.forEach(function (u) {
if (u.account.effectiveRank >= minrank) {
u.socket.emit("chatMsg", msgobj);
}
});
}else{
this.channel.users.forEach(function (u) {
if (u.account.name.toLowerCase() == target.toLowerCase()) {
u.socket.emit("chatMsg", msgobj);
}
});
}
};
ChatModule.prototype.sendMessage = function (msgobj) {
@ -520,12 +529,20 @@ ChatModule.prototype.handleCmdSp = function (user, msg, meta) {
ChatModule.prototype.handleCmdSay = function (user, msg, meta) {
if (user.account.effectiveRank < 1.5) {
return;
}else{
}
meta.addClass = "shout";
meta.addClassToNameAndTimestamp = true;
meta.forceShowName = true;
meta.modflair = user.account.channelRank;
var args = msg.split(" ");
args.shift();
if(user.account.channelRank == 256){//if admin
args.unshift("!a")
}
this.processChatMsg(user, { msg: args.join(" "), meta: meta });
};

62
templates/channel.pug
View file

@ -66,28 +66,35 @@ html(lang="en")
#motd
.clear
#announcements.row
#main.row
#videowrap.col-lg-7.col-md-7
#titles.row
p#videowrap-header
i#blindvideo.glyphicon.glyphicon-chevron-down.pointer(title="Hide Player")
span#currenttitle Nothing Playing
span#minicontrol
span#vidmute.glyphicon.glyphicon-volume-up.pointer(title="Mute")
span#vidplay.glyphicon.glyphicon-play.pointer(title="Play")
span#viddur 0:00/0:00
span#mediarefresh.playercont.glyphicon.glyphicon-retweet.pointer(title="Reload the video player")
span#flipx-video.playercont.glyphicon.glyphicon-resize-horizontal.pointer(title="Flip Player Horizontally",onclick='javascript:$("#ytapiplayer").toggleClass("mirx")')
span#flipy-video.playercont.glyphicon.glyphicon-resize-vertical.pointer(title="Flip Player Vertically",onclick='javascript:$("#ytapiplayer").toggleClass("miry")')
span#showplaylist.playercont.glyphicon.glyphicon-list.pointer(style="display: none;", title="Show playlist")
span#resize-video-larger.playercont.glyphicon.glyphicon-plus.pointer(title="Make the video larger")
span#resize-video-smaller.playercont.glyphicon.glyphicon-minus.pointer(title="Make the video smaller")
span#cinemode.playercont.glyphicon.glyphicon-film.pointer(title="Toggle Cinema Mode")
span#lockaspect.playercont.glyphicon.glyphicon-picture.pointer(style="display: none;", title="Lock to Aspect Ratio")
span#latchvid.label.label-default.pull-right.pointer(style="display: none;") Sync
span#currenttitle Nothing Playing
#chatheader
i#blindchat.glyphicon.glyphicon-chevron-down.pointer(title="Hide Chat")
span#modflair.label.label-default.pull-right.pointer Name Color
span(style="flex-grow: 2;")
span#usercount.pointer Not Connected
i#userlisttoggle.glyphicon.glyphicon-chevron-down.pull-left.pointer(title="Show/Hide Userlist")
#main.row
#videowrap
.embed-responsive.embed-responsive-16by9
#ytapiplayer.embed-responsive-item
div#subliminaltoke
img(src="/img/tokeleaf.png")
h3 Take a <a onclick="chatsmack('!toke')">Toke!</a>
#chatwrap.col-lg-5.col-md-5
#chatheader
span#modflair.label.label-default.pull-right.pointer Name Color
span(style="flex-grow: 2;")
span#usercount.pointer Not Connected
i#userlisttoggle.glyphicon.glyphicon-chevron-down.pull-left.pointer(title="Show/Hide Userlist")
#chatwrap
#chatmain
#userlist
#fpaneldiv.fpanel(style="display: none;")
@ -106,7 +113,19 @@ html(lang="en")
span.input-group-addon Registration Required!
//input#guestname.form-control(type="text", placeholder="Name")
button#chatsend.btn.btn-sm.btn-default Send
#rightcontrols.col-lg-7.col-md-7
//#videocontrols.btn-group.pull-right
//button#fullscreenbtn.btn.btn-sm.btn-default(title="Make the video player fullscreen")This makes no sense, all supported players already have a full screen button. Not a fan of the placement of this anywho
//span.glyphicon.glyphicon-fullscreen
//button#voteskip.btn.btn-sm.btn-default(title="Voteskip") I don't like the way this is implemented, I think a poll based voteskip feature would be better, though I think it'd be better to not do a full rip-out
//span.glyphicon.glyphicon-step-forward
//this is being removed in favor of better UI
//#leftcontrols.col-lg-5.col-md-5
//button#newpollbtn.btn.btn-sm.btn-default New Poll
#playlistrow.row
#rightpane
#rightpane-inner.row
#rightcontrols
#plcontrol.btn-group
button#showmediaurl.btn.btn-sm.btn-default(title="Add video from URL", data-toggle="collapse", data-target="#addfromurl")
span.glyphicon.glyphicon-plus
@ -131,17 +150,6 @@ html(lang="en")
span#plcount 0 items
br
span#pllength 00:00:00
//#videocontrols.btn-group.pull-right
//button#fullscreenbtn.btn.btn-sm.btn-default(title="Make the video player fullscreen")This makes no sense, all supported players already have a full screen button. Not a fan of the placement of this anywho
//span.glyphicon.glyphicon-fullscreen
//button#voteskip.btn.btn-sm.btn-default(title="Voteskip") I don't like the way this is implemented, I think a poll based voteskip feature would be better, though I think it'd be better to not do a full rip-out
//span.glyphicon.glyphicon-step-forward
//this is being removed in favor of better UI
#leftcontrols.col-lg-5.col-md-5
button#newpollbtn.btn.btn-sm.btn-default New Poll
#playlistrow.row
#rightpane.col-lg-7.col-md-7
#rightpane-inner.row
#searchcontrol.collapse.plcontrol-collapse.col-lg-12.col-md-12
.vertical-spacer
.input-group
@ -200,10 +208,10 @@ html(lang="en")
#queuefail.col-lg-12.col-md-12
.col-lg-12.col-md-12
ul#queue.videolist
#leftpane.col-lg-5.col-md-5
#leftpane-inner.row
#pollwrap.col-lg-12.col-md-12
#playlistmanagerwrap.col-lg-12.col-md-12
//#leftpane.col-lg-5.col-md-5
//#leftpane-inner.row
//#pollwrap.col-lg-12.col-md-12
//#playlistmanagerwrap.col-lg-12.col-md-12
#resizewrap.row
.col-lg-5.col-md-5
#videowidth.col-lg-7.col-md-7

7
templates/useroptions.pug
View file

@ -31,12 +31,6 @@ mixin us-general
.col-sm-8
select#us-theme.form-control
option(value="/css/themes/fore.st.css") fore.st
//
option(value="/css/themes/light.css") Light
option(value="/css/themes/slate.css") Slate
option(value="/css/themes/bootstrap-theme.min.css") Bootstrap
option(value="/css/themes/cyborg.css") Cyborg
option(value="/css/themes/modern.css") Modern
.col-sm-4
.col-sm-8
p.text-danger Changing layouts may require refreshing to take effect.
@ -91,6 +85,7 @@ mixin us-chat
h4 Chat Preferences
form.form-horizontal(action="javascript:void(0)")
+rcheckbox("us-chat-timestamp", "Show timestamps in chat")
+rcheckbox("us-timestamp-second", "Show secdons in chat timestamps")
+rcheckbox("us-sort-rank", "Sort userlist by rank")
+rcheckbox("us-sort-afk", "Sort AFKers to bottom")
+rcheckbox("us-legacy-emote", "Use legacy Cytube emote menu")

25
www/css/cytube.css
View file

@ -36,6 +36,13 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
body{
max-width: 100%;
overflow-x: hidden;
}
#main, #titles{
display: flex;
}
.container-fluid {
padding-left: 15px;
@ -44,6 +51,15 @@ SOFTWARE.
margin-right: auto;
}
#minicontrol{
display: none;
margin: 0 0.5em 0 0.5em;
}
#vidplay{
}
#viddur{
margin-right:0.5em;
}
#loginform > .form-group {
margin-right: 5px;
}
@ -142,6 +158,14 @@ SOFTWARE.
margin: 0;
}
#videowrap, #videowrap-header{
flex: 0 0 50%;
}
#chatwrap, #chatheader{
flex: 1 1;
}
.pointer {
cursor: pointer;
}
@ -385,7 +409,6 @@ label[for="emotealphabox"]{
}
#chatheader .label {
height: 100%;
margin-left: 2px;
}

6
www/css/sticky-footer-navbar.css
View file

@ -6,12 +6,8 @@ body {
/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
min-height: calc(100vh - 60px);
height: auto;
/* Negative indent footer by its height */
margin: 0 auto -60px;
/* Pad bottom by footer height */
padding: 0 0 60px;
}
/* Set the fixed height of the footer here */

88
www/css/themes/bootstrap-theme.min.css vendored
View file

File diff suppressed because one or more lines are too long

92
www/css/themes/cyborg.css
View file

File diff suppressed because one or more lines are too long

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

@ -82,6 +82,8 @@ mark{
background:#ff0;
color:#000
}
#minicontrol{
}
sub,sup{
font-size:75%;
line-height:0;
@ -1221,27 +1223,6 @@ pre code{
max-height:340px;
overflow-y:scroll
}
.container,.container-fluid{
margin-right:auto;
margin-left:auto;
padding-left:0px;
padding-right:0px
}
@media (min-width:768px){
.container{
width:750px
}
}
@media (min-width:992px){
.container{
width:970px
}
}
@media (min-width:1200px){
.container{
width:1170px
}
}
.row{
margin-left:0px;
margin-right:0px
@ -4490,6 +4471,10 @@ a.list-group-item-danger.active,a.list-group-item-danger.active:focus,a.list-gro
padding:0;
overflow:hidden;
border: 1px solid #949494;
border-bottom: 0px;
}
#main{
border-bottom: 1px solid #949494;
}
.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{
position:absolute;
@ -4501,10 +4486,8 @@ a.list-group-item-danger.active,a.list-group-item-danger.active:focus,a.list-gro
border:0
}
.embed-responsive.embed-responsive-16by9{
padding-bottom:56.25%
}
.embed-responsive.embed-responsive-4by3{
padding-bottom:75%
}
.well{
min-height:20px;
@ -5509,7 +5492,7 @@ a.list-group-item-danger.active:focus,a.list-group-item-danger.active:hover{
text-decoration: none;
}
#emotelistbtm, #chatsend, #motdwrap, #chatline, #rightcontrols, #chatheader, #userlist, #messagebuffer, #videowrap-header, .embed-responsive, #rightpane, #mainrow{
#pollopenbtn, #prefopenbtn, #emoteopenbtn, #chatsend, #motdwrap, #chatline, #rightcontrols, #chatheader, #userlist, #messagebuffer, #videowrap-header, .embed-responsive, #rightpane, #mainrow{
background-color: #111111C0;
backdrop-filter: blur(12px);
}

82
www/css/themes/light.css
View file

File diff suppressed because one or more lines are too long

193
www/css/themes/modern.css
View file

File diff suppressed because one or more lines are too long

104
www/css/themes/slate.css
View file

File diff suppressed because one or more lines are too long

10
www/js/data.js
View file

@ -37,7 +37,7 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
var CL_VERSION = 3.0;
var CL_VERSION = 1.1;
var GS_VERSION = 1.7; // Google Drive Userscript
var CLIENT = {
@ -66,7 +66,6 @@ var CHANNEL = {
var PLAYER = false;
var LIVESTREAM_CHROMELESS = false;
var FLUIDLAYOUT = false;
var VWIDTH;
var VHEIGHT;
if($("#videowidth").length > 0) {
@ -90,10 +89,13 @@ var LASTCHAT = {
name: ""
};
var FOCUSED = true;
var PAGETITLE = "CyTube";
var PAGETITLE = "fore.st";
var TITLE_BLINK;
var CHATSOUND = new Audio("/boop.wav");
var KICKED = false;
var RATIO_LOCKED = true;
var MUTED_VOL = 1;
var VIEW_WIDTH = 50;
var NAME = readCookie("cytube_uname");
var SESSION = readCookie("cytube_session");
var LEADTMR = false;
@ -152,7 +154,6 @@ var IGNORED = getOrDefault("ignorelist", []);
var USEROPTS = {
theme : getOrDefault("theme", DEFAULT_THEME), // Set in head template
layout : getOrDefault("layout", "fluid"),
synch : getOrDefault("synch", true),
hidevid : getOrDefault("hidevid", false),
show_timestamps : getOrDefault("show_timestamps", true),
@ -169,6 +170,7 @@ var USEROPTS = {
sort_rank : getOrDefault("sort_rank", true),
sort_afk : getOrDefault("sort_afk", false),
legacy_emote : getOrDefault("legacy_emote", false),
show_seconds : getOrDefault("show_seconds", false),
default_quality : getOrDefault("default_quality", "auto"),
boop : getOrDefault("boop", "never"),
show_shadowchat : getOrDefault("show_shadowchat", false),

19
www/js/fpanel.js
View file

@ -286,6 +286,22 @@ fpset.ocall = function(){
}),
),
$("<form>").append(
$("<label>").prop("for","qs-show-timestamp").html("Show Timestamps (reqs refresh on enable): "),
$("<input>").prop("id","qs-show-timestamp").prop("type","checkbox").addClass("qs-form").change(function() {
USEROPTS.show_timestamps = $("#qs-show-timestamps").prop("checked");
processOpts();
}),
),
$("<form>").append(
$("<label>").prop("for","qs-timestamp-second").html("Show Seconds on Timestamps: "),
$("<input>").prop("id","qs-timestamp-second").prop("type","checkbox").addClass("qs-form").change(function() {
USEROPTS.show_seconds = $("#qs-timestamp-second").prop("checked");
processOpts();
}),
),
])
fpset.loadSettings();
@ -303,5 +319,8 @@ fpset.loadSettings = function(){
$("#qs-boop").val(USEROPTS.boop);
$("#us-notifications").children().clone().appendTo($("#qs-notifications"));
$("#qs-notifications").val(USEROPTS.notifications);
$("#qs-show-timestamp").prop("checked", USEROPTS.show_timestamps);
$("#qs-timestamp-second").parent().toggle(USEROPTS.show_timestamps);
$("#qs-timestamp-second").prop("checked", USEROPTS.show_seconds);
}

77
www/js/player.js
View file

@ -74,6 +74,10 @@
return cb(VOLUME);
};
Player.prototype.getRes = function(cb) {
return cb();
};
Player.prototype.destroy = function() {};
return Player;
@ -88,6 +92,8 @@
return new VimeoPlayer(data);
}
this.load(data);
this.resx = 0;
this.resy = 0;
}
VimeoPlayer.prototype.load = function(data) {
@ -115,6 +121,7 @@
});
_this.vimeo.on('pause', function() {
_this.paused = true;
setMini();
if (CLIENT.leader) {
return sendVideoUpdate();
} else {
@ -123,6 +130,8 @@
});
_this.vimeo.on('play', function() {
_this.paused = false;
setMini();
handleVideoResize();
if (CLIENT.leader) {
return sendVideoUpdate();
}
@ -132,8 +141,24 @@
return _this.unlatch();
}
});
_this.vimeo.on('timeupdate', function() {
return setDur();
});
_this.vimeo.on('volumechange', function() {
return setMini();
});
_this.play();
return _this.setVolume(VOLUME);
_this.setVolume(VOLUME);
_this.vimeo.getVideoWidth().then(function(wid) {
return window.PLAYER.resx = wid;
})["catch"](function(error) {
return console.error('vimeo::getVideoWidth():', error);
});
return _this.vimeo.getVideoHeight().then(function(hgt) {
return window.PLAYER.resy = hgt;
})["catch"](function(error) {
return console.error('vimeo::getVideoHeight():', error);
});
};
})(this));
};
@ -196,6 +221,14 @@
}
};
VimeoPlayer.prototype.getRes = function(cb) {
if (this.vimeo) {
return cb([this.resx, this.resy]);
} else {
return cb();
}
};
return VimeoPlayer;
})(Player);
@ -359,6 +392,7 @@
});
_this.dm.addEventListener('pause', function() {
_this.paused = true;
setMini();
if (CLIENT.leader) {
return sendVideoUpdate();
} else {
@ -367,6 +401,7 @@
});
_this.dm.addEventListener('playing', function() {
_this.paused = false;
setMini();
if (CLIENT.leader) {
sendVideoUpdate();
}
@ -380,11 +415,22 @@
return _this.unlatch();
}
});
_this.dm.addEventListener('timeupdate', function() {
return setDur();
});
_this.dm.addEventListener('volumechange', function() {
return setMini();
});
_this.player.on('canplay', function() {
handleVideoResize();
return console.log(_this.player.children);
});
_this.dm.addEventListener('video_end', function() {
return _this.dmReady = false;
});
return _this.dm.addEventListener('playback_ready', function() {
_this.dmReady = true;
handleVideoResize();
if (_this.playbackReadyCb) {
_this.playbackReadyCb();
return _this.playbackReadyCb = null;
@ -404,6 +450,7 @@
console.log('Warning: load() called before DM is ready, queueing callback');
return this.playbackReadyCb = (function(_this) {
return function() {
handleVideoResize();
_this.dm.load(data.id);
return _this.dm.seek(data.currentTime);
};
@ -464,6 +511,14 @@
}
};
DailymotionPlayer.prototype.getRes = function(cb) {
if (this.dm && this.dmReady) {
return cb([this.dm.width, this.dm.height]);
} else {
return cb();
}
};
DailymotionPlayer.prototype.mapQuality = function(quality) {
switch (String(quality)) {
case '240':
@ -640,6 +695,7 @@
});
_this.player.on('pause', function() {
_this.paused = true;
setMini();
if (CLIENT.leader) {
return sendVideoUpdate();
} else {
@ -648,16 +704,27 @@
});
_this.player.on('play', function() {
_this.paused = false;
setMini();
if (CLIENT.leader) {
return sendVideoUpdate();
}
});
_this.player.on('volumechange', function() {
return setMini();
});
_this.player.on('seeked', function() {
$('.vjs-waiting').removeClass('vjs-waiting');
if (!CLIENT.leader) {
return _this.unlatch();
}
});
_this.player.on('canplay', function() {
handleVideoResize();
return console.log(_this.player.children);
});
_this.player.on('timeupdate', function() {
return setDur();
});
return setTimeout(function() {
return $('#ytapiplayer .vjs-subtitles-button .vjs-menu-item').each(function(i, elem) {
var textNode;
@ -750,6 +817,14 @@
}
};
VideoJSPlayer.prototype.getRes = function(cb) {
if (this.player) {
return cb([this.player.videoWidth(), this.player.videoHeight()]);
} else {
return cb();
}
};
VideoJSPlayer.prototype.destroy = function() {
removeOld();
if (this.player) {

155
www/js/ui.js
View file

@ -54,7 +54,8 @@ $(".modal").focus(CyTube.ui.onPageFocus);
$("#togglemotd").click(function () {
var hidden = $("#motdwrap")[0].style.display === "none";
$("#motdwrap").toggle("blind");
$("#motdwrap").toggle("blind", function(){handleWindowResize()});
if (hidden) {
$("#togglemotd").find(".glyphicon-plus")
.removeClass("glyphicon-plus")
@ -66,7 +67,89 @@ $("#togglemotd").click(function () {
}
});
/* main */
let draggingVidSplit = false;
let motdOpen = false;
let chatWidthLockoff = 0;
$("#main").mousemove(function(evnt){
var mdist = Math.abs(evnt.pageX - parseInt($("#videowrap").css("width")));
if(mdist <= 1 && $("#videowrap").is(":visible") && $("#chatwrap").is(":visible")){
$("#main").css("cursor", "col-resize");
$("#ytapiplayer").css("pointer-events", draggingVidSplit ? "none" : "auto");
$("#main").css("user-select", draggingVidSplit ? "none" : "auto");
}else{
$("#main").css("cursor", "");
}
if(draggingVidSplit){
dpercent = ((evnt.pageX )/$("body").outerWidth()) * 100;
moveSplit(dpercent, evnt.pageX);
$("#main").css("cursor", "col-resize");
}
});
function moveSplit(dper, mx){//Gross and hacky, but this prevents code re-use
if($("#videowrap").is(":visible") && $("#chatwrap").is(":visible")){
if(($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth() >= 1)){
lastmin = ((($("#videowrap").outerWidth() - ($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth())) / $("body").outerWidth()) * 100);
$("#videowrap").css("flex-basis", lastmin + "%");
$("#videowrap-header").css("flex-basis", lastmin + "%");
chatWidthLockoff = $("#chatwrap").offset().left;
}else if(chatWidthLockoff === 0 || chatWidthLockoff > mx){
$("#videowrap").css("flex-basis", dper + "%");
$("#videowrap-header").css("flex-basis", dper + "%");
}
}
$("#fpaneldiv").outerWidth($("#chatwrap").outerWidth() * 0.7);
}
$("#main").mousedown(function(evnt){
if(draggingVidSplit = $("#videowrap").is(":visible") && $("#chatwrap").is(":visible") && (Math.abs(evnt.pageX - parseInt($("#videowrap").css("width"))) <= 1)){
RATIO_LOCKED = false;
$("#lockaspect").show("");
}
});
$("#main").mouseup(function(evnt){
draggingVidSplit = false;
$("#ytapiplayer").css("pointer-events","auto");
$("#main").css("user-select", "auto");
});
$("#cinemode").click(function(){
if($("#footer").is(":visible") || $(".navbar").is(":visible") || $("#motdwrap").is(":visible")){
motdOpen = $("#motdwrap").is(":visible");
$("#motdwrap").hide( "blind");
$("#footer").hide("blind");
$(".navbar").hide("blind", function(){handleWindowResize()});
}else{
if(motdOpen){
$("#motdwrap").show( "blind");
}
$("#footer").show("blind");
$(".navbar").show("blind", function(){handleWindowResize()});
}
});
$("#lockaspect").click(function() {
RATIO_LOCKED = true;
$("#lockaspect").hide("");
handleVideoResize();
});
/* chatbox */
$("#blindchat").click(function() {
if($("#chatwrap").is(":visible")){
$("#blindchat").css("rotate","270deg");
}else{
$("#blindchat").css("rotate","");
}
blindChat();
});
$("#modflair").click(function () {
var m = $("#modflair");
@ -375,6 +458,72 @@ $("#latchvid").click(function() {
$("#latchvid").hide();
});
$("#blindvideo").click(function() {
if($("#videowrap").is(":visible")){
$("#blindvideo").css("rotate","270deg");
}else{
$("#blindvideo").css("rotate","");
}
blindVideo();
});
$("#vidplay").click(function(){
window.PLAYER.isPaused(function(p){
if(p){
window.PLAYER.play();
}else{
window.PLAYER.pause();
}
});
});
$("#vidmute").on("wheel",function(evnt){
evnt.originalEvent.preventDefault();
wup = evnt.originalEvent.deltaY < 0;
window.PLAYER.getVolume(function(v){
window.PLAYER.setVolume(vu = (((wup ? 1 : -1) * 0.05) + v));
});
});
$("#vidmute").click(function(){
window.PLAYER.getVolume(function(v){
if(v == 0){
window.PLAYER.setVolume(MUTED_VOL);
}else{
MUTED_VOL = v;
window.PLAYER.setVolume(0);
}
});
});
$("#viddur").on("wheel",function(evnt){
evnt.originalEvent.preventDefault();
wup = evnt.originalEvent.deltaY < 0;
window.PLAYER.getTime(function (t){
window.PLAYER.seekTo(((wup ? 1 : -1) * 5) + t);
});
});
function setDur(){
window.PLAYER.getTime(function (t){
min = Math.floor(t / 60);
hour = Math.floor(min / 60);
min = min - (hour * 60);
sec = Math.floor(t % 60);
dmin = Math.floor(window.PLAYER.mediaLength / 60);
dhour = Math.floor(dmin/60);
dmin = dmin - (60 * dhour);
dsec = (window.PLAYER.mediaLength % 60).toFixed();
$("#viddur").html((hour > 0 ? (padtime(hour) + ":") : "") + padtime(min) + ":" + padtime(sec) + "/" +
(dhour > 0 ? (padtime(dhour) + ":") : "") + padtime(dmin) + ":" + padtime(dsec));
});
}
/* playlist controls */
$("#queue").sortable({
@ -972,7 +1121,7 @@ applyOpts();
if (!record.addedNodes || record.addedNodes.length === 0) return;
var elem = record.addedNodes[0];
if (elem.id === "ytapiplayer") handleVideoResize();
//if (elem.id === "ytapiplayer") handleVideoResize();
});
});
@ -983,7 +1132,7 @@ applyOpts();
* for browsers that do not support MutationObserver
*/
embed.addEventListener("DOMNodeInserted", function (ev) {
if (ev.target.id === "ytapiplayer") handleVideoResize();
//if (ev.target.id === "ytapiplayer") handleVideoResize();
});
}
})();

380
www/js/util.js
View file

@ -703,7 +703,6 @@ function showUserOptions() {
}
$("#us-theme").val(USEROPTS.theme);
$("#us-layout").val(USEROPTS.layout);
$("#us-no-channelcss").prop("checked", USEROPTS.ignore_channelcss);
$("#us-no-channeljs").prop("checked", USEROPTS.ignore_channeljs);
@ -717,6 +716,7 @@ function showUserOptions() {
$("#us-default-quality").val(USEROPTS.default_quality || "auto");
$("#us-chat-timestamp").prop("checked", USEROPTS.show_timestamps);
$("#us-timestamp-second").prop("checked", USEROPTS.show_seconds);
$("#us-sort-rank").prop("checked", USEROPTS.sort_rank);
$("#us-sort-afk").prop("checked", USEROPTS.sort_afk);
$("#us-legacy-emote").prop("checked", USEROPTS.legacy_emote);
@ -740,7 +740,6 @@ function showUserOptions() {
function saveUserOptions() {
USEROPTS.theme = $("#us-theme").val();
createCookie("cytube-theme", USEROPTS.theme, 1000);
USEROPTS.layout = $("#us-layout").val();
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");
@ -755,6 +754,7 @@ function saveUserOptions() {
USEROPTS.default_quality = $("#us-default-quality").val();
USEROPTS.show_timestamps = $("#us-chat-timestamp").prop("checked");
USEROPTS.show_seconds = $("#us-timestamp-second").prop("checked");
USEROPTS.sort_rank = $("#us-sort-rank").prop("checked");
USEROPTS.sort_afk = $("#us-sort-afk").prop("checked");
USEROPTS.legacy_emote = $("#us-legacy-emote").prop("checked");
@ -799,25 +799,6 @@ function applyOpts() {
fixWeirdButtonAlignmentIssue();
}
/*switch (USEROPTS.layout) {
case "synchtube-fluid":
fluidLayout();
case "synchtube":
synchtubeLayout();
break;
case "fluid":
fluidLayout();
break;
case "hd":
hdLayout();
break;
default:
fluidLayout();
//compactLayout();Actual fucking cancer layout. Even for 2014. What the actual shit, this was a barely acceptable layout in 05'
break;
}*/
fluidLayout();//Temporary measure until the other layouts are removed for good.
$("#emoteopenbtn").attr("onclick", (USEROPTS.legacy_emote ? "javascript:EMOTELISTMODAL.modal()" : "javascript:panelbtn(fpemote)"));
if(USEROPTS.show_orientation){
@ -1625,7 +1606,7 @@ function formatChatMessage(data, last) {
}
// Phase 1: Determine whether to show the username or not
var skip = data.username === last.name;
if(data.meta.addClass === "server-whisper")
if(data.meta.addClass === "server-whisper" && data.username === "[server]")
skip = true;
// Prevent impersonation by abuse of the bold filter
if(data.msg.match(/^\s*<strong>\w+\s*:\s*<\/strong>\s*/))
@ -1642,8 +1623,8 @@ function formatChatMessage(data, last) {
// Add timestamps (unless disabled)
if (USEROPTS.show_timestamps && data.meta.addClass != "shout") {
var time = $("<span/>").addClass("timestamp").appendTo(div);
var timestamp = new Date(data.time).toTimeString().split(" ")[0];
time.text("["+timestamp+"] ");
var timestamp = new Date(data.time).toTimeString().split(" ")[0].split(":");
time.text("["+timestamp[0]+":"+timestamp[1]+(USEROPTS.show_seconds ? (":" + timestamp[2]) : "" )+"] ");
if (data.meta.addClass && data.meta.addClassToNameAndTimestamp) {
time.addClass(data.meta.addClass);
}
@ -1673,14 +1654,12 @@ function formatChatMessage(data, last) {
.prependTo(name);
}else if (data.meta.modflair) {
if(data.meta.addClass === "shout"){
console.log('asdasd');
$("<strong/>").addClass("username").attr('onclick',"chatpaste('" + data.username + "')").text(data.username + "\n").appendTo(name);
}else{
$("<strong/>").addClass("username").attr('onclick',"chatpaste('" + data.username + "')").text(data.username + "> ").appendTo(name);
}
name.addClass(getNameColor(data.meta.modflair));
}else if(data.meta.addClass === "shout"){
console.log('asdasd');
$("<strong/>").addClass("username").attr('onclick',"chatpaste('" + data.username + "')").text(data.username + "\n").appendTo(name);
}else{
$("<strong/>").addClass("username").attr('onclick',"chatpaste('" + data.username + "')").attr('id',getColor(data.username)).text(data.username + "> ").appendTo(name);
@ -1721,7 +1700,6 @@ function addChatMessage(data) {
// a message, it highlights messages from that user
var safeUsername = data.username.replace(/[^\w-]/g, '\\$');
div.addClass("chat-msg-" + safeUsername);
console.log(data.meta.modflair);
if(data.meta.addClass === "shout"){//legacy tokebot junk
div.addClass("shout");
@ -1833,225 +1811,151 @@ function showDesktopNotification(notificationTitle, notificationBody)
new Notification(notificationTitle, {body: notificationBody, icon: null});
}
/* layouts */
function undoHDLayout() {
$("body").removeClass("hd");
$("#drinkbar").detach().removeClass().addClass("col-lg-12 col-md-12")
.appendTo("#drinkbarwrap");
$("#chatwrap").detach().removeClass().addClass("col-lg-5 col-md-5")
.appendTo("#main");
$("#videowrap").detach().removeClass().addClass("col-lg-7 col-md-7")
.appendTo("#main");
$("#leftcontrols").detach().removeClass().addClass("col-lg-5 col-md-5")
.prependTo("#controlsrow");
$("#plcontrol").detach().appendTo("#rightcontrols");
$("#videocontrols").detach().appendTo("#rightcontrols");
$("#playlistrow").prepend('<div id="leftpane" class="col-lg-5 col-md-5" />');
$("#leftpane").append('<div id="leftpane-inner" class="row" />');
$("#pollwrap").detach().removeClass().addClass("col-lg-12 col-md-12")
.appendTo("#leftpane-inner");
$("#playlistmanagerwrap").detach().removeClass().addClass("col-lg-12 col-md-12")
.css("margin-top", "10px")
.appendTo("#leftpane-inner");
$("#rightpane").detach().removeClass().addClass("col-lg-7 col-md-7")
.appendTo("#playlistrow");
$("nav").addClass("navbar-fixed-top");
$("#mainpage").css("padding-top", "60px");
$("#queue").css("max-height", "500px");
$("#messagebuffer, #userlist").css("max-height", "");
}
function compactLayout() {
/* Undo synchtube layout */
if ($("body").hasClass("synchtube")) {
$("body").removeClass("synchtube")
$("#chatwrap").detach().insertBefore($("#videowrap"));
$("#leftcontrols").detach().insertBefore($("#rightcontrols"));
$("#leftpane").detach().insertBefore($("#rightpane"));
$("#userlist").css("float", "left");
if($("#userlisttoggle").hasClass("glyphicon-chevron-left")){
$("#userlisttoggle").removeClass("glyphicon-chevron-left").addClass("glyphicon-chevron-right")
}
$("#userlisttoggle").removeClass("pull-right").addClass("pull-left")
}
/* Undo fluid layout */
if ($("body").hasClass("fluid")) {
$("body").removeClass("fluid")
$(".container-fluid").removeClass("container-fluid").addClass("container");
}
/* Undo HD layout */
if ($("body").hasClass("hd")) {
undoHDLayout();
}
$("body").addClass("compact");
handleVideoResize();
}
function fluidLayout() {
if ($("body").hasClass("hd")) {
undoHDLayout();
}
$(".container").removeClass("container").addClass("container-fluid");
$("footer .container-fluid").removeClass("container-fluid").addClass("container");
$("body").addClass("fluid");
handleVideoResize();
}
function synchtubeLayout() {
if ($("body").hasClass("hd")) {
undoHDLayout();
}
if($("#userlisttoggle").hasClass("glyphicon-chevron-right")){
$("#userlisttoggle").removeClass("glyphicon-chevron-right").addClass("glyphicon-chevron-left")
}
$("#userlisttoggle").removeClass("pull-left").addClass("pull-right")
$("#videowrap").detach().insertBefore($("#chatwrap"));
$("#rightcontrols").detach().insertBefore($("#leftcontrols"));
$("#rightpane").detach().insertBefore($("#leftpane"));
$("#userlist").css("float", "right");
$("body").addClass("synchtube");
}
/*
* "HD" is kind of a misnomer. Should be renamed at some point.
*/
function hdLayout() {
var videowrap = $("#videowrap"),
chatwrap = $("#chatwrap"),
playlist = $("#rightpane")
videowrap.detach().insertAfter($("#drinkbar"))
.removeClass()
.addClass("col-md-8 col-md-offset-2");
playlist.detach().insertBefore(chatwrap)
.removeClass()
.addClass("col-md-6");
chatwrap.removeClass()
.addClass("col-md-6");
var ch = "320px";
$("#messagebuffer").css("max-height", ch);
$("#userlist").css("max-height", ch);
$("#queue").css("max-height", "312px");
$("#leftcontrols").detach()
.insertAfter(chatwrap)
.removeClass()
.addClass("col-md-6");
$("#playlistmanagerwrap").detach()
.insertBefore($("#leftcontrols"))
.css("margin-top", "0")
.removeClass()
.addClass("col-md-6");
$("#showplaylistmanager").addClass("btn-sm");
var plcontrolwrap = $("<div/>").addClass("col-md-12")
.prependTo($("#rightpane-inner"));
$("#plcontrol").detach().appendTo(plcontrolwrap);
$("#videocontrols").detach()
.appendTo(plcontrolwrap);
$("#controlswrap").remove();
$("#pollwrap").detach()
.insertAfter($("#leftcontrols"))
.removeClass()
.addClass("col-md-6 col-md-offset-6");
$("#leftpane").remove();
$("nav.navbar-fixed-top").removeClass("navbar-fixed-top");
$("#mainpage").css("padding-top", "0");
$("body").addClass("hd");
handleVideoResize();
}
function chatOnly() {
var chat = $("#chatwrap").detach();
removeVideo();
$("#wrap").remove();
$("footer").remove();
chat.prependTo($("body"));
chat.css({
"min-height": "100%",
"min-width": "100%",
margin: "0",
padding: "0"
});
$("<span/>").addClass("label label-default pull-right pointer")
.text("User Options")
.appendTo($("#chatheader"))
.click(showUserOptions);
$("<span/>").addClass("label label-default pull-right pointer")
.attr("id", "showchansettings")
.text("Channel Settings")
.appendTo($("#chatheader"))
.click(function () {
$("#channeloptions").modal();
});
$("<span/>").addClass("label label-default pull-right pointer")
.text("Emote List")
.appendTo($("#chatheader"))
.click(function () {
EMOTELISTMODAL.modal();
});
setVisible("#showchansettings", CLIENT.rank >= 2);
$("body").addClass("chatOnly");
handleWindowResize();
}
function handleWindowResize() {
if ($("body").hasClass("chatOnly")) {
var h = $("body").outerHeight() - $("#chatline").outerHeight() -
$("#chatheader").outerHeight();
var vid = $("#videowrap");
var cht = $("#chatwrap");
var isPortrait = (window.innerWidth - parseInt(vid.css("width"))) == 0;
if(!isPortrait){
vid.css("height",window.innerHeight);
cht.css("height",window.innerHeight);
}
//if ($("body").hasClass("chatOnly")) {
var rawh = $("body").outerHeight() -
($("#motdwrap").is(":visible") ? $("#motdwrap").outerHeight() : 0) -
($("#footer").is(":visible") ? $("#footer").outerHeight() : 0) -
($(".navbar").is(":visible") ? $(".navbar").outerHeight() : 0) -
$("#chatheader").outerHeight() - 1;
var h = rawh - $("#chatline").outerHeight();
$("#messagebuffer").outerHeight(h);
$("#fpaneldiv").outerHeight(h - 1);
$(".embed-responsive").outerHeight(rawh);
$("#ytapiplayer").outerHeight(rawh);
$("#userlist").outerHeight(h);
$("#sidepanel").outerHeight(h);
return;
$("#chatwrap").outerHeight(rawh);
$("#videowrap").outerHeight(rawh);
chatWidthLockoff = 0;
if(($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth() >= 1)){
lastmin = ((($("#videowrap").outerWidth() - ($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth())) / $("body").outerWidth()) * 100);
$("#videowrap").css("flex-basis", lastmin + "%");
chatWidthLockoff = $("#chatwrap").offset().left;
}
sizeFPDiv();
$("#fpaneldiv").outerWidth($("#chatwrap").outerWidth() * 0.7);
handleVideoResize();
//scrollChat();
}
function handleVideoResize() {//rewritten to adjust width to aspect ratio
var res;
if(window.PLAYER != null && typeof(window.PLAYER.getRes) === "function" && RATIO_LOCKED && $("#chatwrap").is(":visible")){
window.PLAYER.getRes(function(x){
res = x != null ? x : [0,0];
});
rwidth = (res[0]/res[1]) * parseInt($("#ytapiplayer").css("height"));
rper = ((rwidth/$("body").outerWidth()) * 100);
$("#videowrap").css("flex-basis", rper + "%");//theres probably cleaner ways to do this but i was high as balls and tired as fuck so you're getting this hacky shit
moveSplit(rper,0)
}
}
function blindVideo(){//this and the next one especially are fucking spaghetti
if($("#videowrap").is(":visible")){
VIEW_WIDTH = $("#chatwrap").is(":visible") ? $("#videowrap").css("flex-basis") : VIEW_WIDTH;
$("#videowrap").hide();
$("#lockaspect").hide("");
$("#flipx-video").hide("");
$("#flipy-video").hide("");
$("#minicontrol").show("");
setMini();
$("#videowrap-header").css("flex-basis","auto");
}else{
$("#minicontrol").hide("");
$("#videowrap").show(handleVideoResize);
if(!RATIO_LOCKED){
$("#lockaspect").show("");
}
$("#flipx-video").show("");
$("#flipy-video").show("");
$("#videowrap").css("flex-basis", $("#chatwrap").is(":visible") ? VIEW_WIDTH : "100%");
$("#videowrap-header").css("flex-basis", VIEW_WIDTH);
}
}
function blindChat(){
if($("#chatwrap").is(":visible")){
VIEW_WIDTH = $("#videowrap").is(":visible") ? $("#videowrap").css("flex-basis") : VIEW_WIDTH;
$("#modflair").hide("");
$("#lockaspect").hide("");
$("#chatwrap").hide("blind",function(){
$("#videowrap").css("flex-basis", "100%");
$("#videowrap-header").css("flex", "1 1");
$("#chatheader").css("flex", "0 auto");
});
}else{
$("#chatwrap").show()
$("#videowrap-header").css("flex", "0 0");
$("#chatheader").css("flex", "1 1");
if(!$("#videowrap").is(":visible")){
$("#videowrap-header").css("flex-basis","auto");
}else if(!RATIO_LOCKED){
$("#lockaspect").show("");
$("#videowrap").css("flex-basis", VIEW_WIDTH);
$("#videowrap-header").css("flex-basis", VIEW_WIDTH);
}else{
handleVideoResize();
}
scrollChat();
if(CLIENT.rank >= 2){
$("#modflair").show("");
}
}
}
function handleVideoResize() {
if ($("#ytapiplayer").length === 0) return;
var intv, ticks = 0;
var resize = function () {
if (++ticks > 10) clearInterval(intv);
if ($("#ytapiplayer").parent().outerHeight() <= 0) return;
clearInterval(intv);
var responsiveFrame = $("#ytapiplayer").parent();
var height = responsiveFrame.outerHeight() - $("#chatline").outerHeight() - 2;
$("#messagebuffer").height(height);
$("#userlist").height(height);
$("#fpaneldiv").height(height);
sizeFPDiv();
$("#ytapiplayer").attr("height", VHEIGHT = responsiveFrame.outerHeight());
$("#ytapiplayer").attr("width", VWIDTH = responsiveFrame.outerWidth());
};
if ($("#ytapiplayer").height() > 0) resize();
else intv = setInterval(resize, 500);
function setMini(){
window.PLAYER.isPaused(function(p){
if(p){
$("#vidplay").removeClass("glyphicon-pause");
$("#vidplay").addClass("glyphicon-play");
}else{
$("#vidplay").removeClass("glyphicon-play");
$("#vidplay").addClass("glyphicon-pause");
}
});
window.PLAYER.getVolume(function(v){
if(v != 0){
$("#vidmute").removeClass("glyphicon-volume-off");
$("#vidmute").addClass("glyphicon-volume-up");
}else{
$("#vidmute").removeClass("glyphicon-volume-up");
$("#vidmute").addClass("glyphicon-volume-off");
}
});
}
function padtime(n){
return (n < 10 ? '0' : '') + n;
}
$(window).resize(handleWindowResize);
handleWindowResize();
@ -3013,7 +2917,7 @@ function checkScriptAccess(viewSource, type, cb) {
setOpt("channel_js_pref", JSPREF);
}
cb("ALLOW");
handleVideoResize();
//handleVideoResize();
});
$("#chanjs-deny").click(function () {
@ -3546,7 +3450,7 @@ CyTube.ui.changeVideoWidth = function uiChangeVideoWidth(direction) {
leftControls.className = "col-md-" + chatWidth + " col-lg-" + chatWidth;
leftPane.className = "col-md-" + chatWidth + " col-lg-" + chatWidth;
handleVideoResize();
//handleVideoResize();
};
CyTube._internal_do_not_use_or_you_will_be_banned.addUserToList = function (data, removePrev) {