templates/channel.pug

   1 doctype html
   2 html(lang="en")
   3   head
   4     include head
   5     +head()
   6     link(href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css", rel="stylesheet")
   7     link(rel="stylesheet", href="/css/video-js.css")
   8     link(rel="stylesheet", href="/css/videojs-resolution-switcher.css")
   9   body
  10     #wrap
  11       nav.navbar.navbar-inverse.navbar-fixed-top(role="navigation")
  12         include nav
  13         +navheader()
  14         #nav-collapsible.collapse.navbar-collapse
  15           ul.nav.navbar-nav
  16             +navdefaultlinks()
  17             li: a(href="javascript:void(0)", onclick="javascript:showUserOptions()") Options
  18             li: a#showchansettings(href="javascript:void(0)", onclick="javascript:showChannelSettings()") Channel Settings
  19             li.dropdown
  20               a.dropdown-toggle(href="#", data-toggle="dropdown") Layout
  21                 b.caret
  22               ul.dropdown-menu
  23                 li: a(href="#" onclick="javascript:chatOnly()") Chat Only
  24                 li: a(href="#" onclick="javascript:removeVideo(event)") Remove Video
  25             +navsuperadmin(true)
  26           +navloginlogout()
  27       section#mainpage
  28         .container
  29           #motdrow.row
  30             .col-lg-12.col-md-12
  31               #motdwrap.well
  32                 button#togglemotd.close.pull-right(type="button")
  33                   span.glyphicon.glyphicon-minus
  34                 #motd
  35                 .clear
  36           #announcements.row
  37           #drinkbarwrap.row
  38             #drinkbar.col-lg-12.col-md-12
  39               h1#drinkcount
  40           #main.row
  41             #chatwrap.col-lg-5.col-md-5
  42               #chatheader
  43                 i#userlisttoggle.glyphicon.glyphicon-chevron-down.pull-left.pointer(title="Show/Hide Userlist")
  44                 span#usercount.pointer Not Connected
  45                 span#modflair.label.label-default.pull-right.pointer Name Color
  46               #userlist
  47               #messagebuffer.linewrap
  48               form(action="javascript:void(0)")
  49                 input#chatline.form-control(type="text", maxlength="320", style="display: none")
  50                 #guestlogin.input-group
  51                   span.input-group-addon Guest login
  52                   input#guestname.form-control(type="text", placeholder="Name")
  53             #videowrap.col-lg-7.col-md-7
  54               p#videowrap-header
  55                 span#resize-video-smaller.glyphicon.glyphicon-minus.pointer(title="Make the video smaller")
  56                 span#resize-video-larger.glyphicon.glyphicon-plus.pointer(title="Make the video larger")
  57                 span#currenttitle Nothing Playing
  58               .embed-responsive.embed-responsive-16by9
  59                 #ytapiplayer.embed-responsive-item
  60           #controlsrow.row
  61             #leftcontrols.col-lg-5.col-md-5
  62               button#newpollbtn.btn.btn-sm.btn-default New Poll
  63               button#emotelistbtn.btn.btn-sm.btn-default Emote List
  64             #rightcontrols.col-lg-7.col-md-7
  65               #plcontrol.btn-group
  66                 button#showsearch.btn.btn-sm.btn-default(title="Search for a video", data-toggle="collapse", data-target="#searchcontrol")
  67                   span.glyphicon.glyphicon-search
  68                 button#showmediaurl.btn.btn-sm.btn-default(title="Add video from URL", data-toggle="collapse", data-target="#addfromurl")
  69                   span.glyphicon.glyphicon-plus
  70                 button#showcustomembed.btn.btn-sm.btn-default(title="Embed a custom frame", data-toggle="collapse", data-target="#customembed")
  71                   span.glyphicon.glyphicon-th-large
  72                 button#showplaylistmanager.btn.btn-sm.btn-default(title="Manage playlists", data-toggle="collapse", data-target="#playlistmanager")
  73                   span.glyphicon.glyphicon-list
  74                 button#clearplaylist.btn.btn-sm.btn-default(title="Clear the playlist")
  75                   span.glyphicon.glyphicon-trash
  76                 button#shuffleplaylist.btn.btn-sm.btn-default(title="Shuffle the playlist")
  77                   span.glyphicon.glyphicon-sort
  78                 button#qlockbtn.btn.btn-sm.btn-danger(title="Playlist locked")
  79                   span.glyphicon.glyphicon-lock
  80               #videocontrols.btn-group.pull-right
  81                 button#mediarefresh.btn.btn-sm.btn-default(title="Reload the video player")
  82                   span.glyphicon.glyphicon-retweet
  83                 button#fullscreenbtn.btn.btn-sm.btn-default(title="Make the video player fullscreen")
  84                   span.glyphicon.glyphicon-fullscreen
  85                 button#getplaylist.btn.btn-sm.btn-default(title="Retrieve playlist links")
  86                   span.glyphicon.glyphicon-link
  87                 button#voteskip.btn.btn-sm.btn-default(title="Voteskip")
  88                   span.glyphicon.glyphicon-step-forward
  89
  90           #playlistrow.row
  91             #leftpane.col-lg-5.col-md-5
  92               #leftpane-inner.row
  93                 #pollwrap.col-lg-12.col-md-12
  94                 #playlistmanagerwrap.col-lg-12.col-md-12
  95             #rightpane.col-lg-7.col-md-7
  96               #rightpane-inner.row
  97                 #searchcontrol.collapse.plcontrol-collapse.col-lg-12.col-md-12
  98                   .vertical-spacer
  99                   .input-group
 100                     input#library_query.form-control(type="text", placeholder="Search query")
 101                     span.input-group-btn
 102                       button#library_search.btn.btn-default Library
 103                     span.input-group-btn
 104                       button#youtube_search.btn.btn-default YouTube
 105                   .checkbox
 106                     label
 107                       input.add-temp(type="checkbox")
 108                       | Add as temporary
 109                   ul#library.videolist.col-lg-12.col-md-12
 110                 #addfromurl.collapse.plcontrol-collapse.col-lg-12.col-md-12
 111                   .vertical-spacer
 112                   .input-group
 113                     input#mediaurl.form-control(type="text", placeholder="Media URL")
 114                     span.input-group-btn
 115                       button#queue_next.btn.btn-default Queue next
 116                     span.input-group-btn
 117                       button#queue_end.btn.btn-default Queue last
 118                   .checkbox
 119                     label
 120                       input.add-temp(type="checkbox")
 121                       | Add as temporary
 122                   div#addfromurl-queue
 123                 #customembed.collapse.plcontrol-collapse.col-lg-12.col-md-12
 124                   .vertical-spacer
 125                   .input-group
 126                     input#customembed-title.form-control(type="text", placeholder="Title (optional)")
 127                     span.input-group-btn
 128                       button#ce_queue_next.btn.btn-default Queue next
 129                     span.input-group-btn
 130                       button#ce_queue_end.btn.btn-default Queue last
 131                   .checkbox
 132                     label
 133                       input.add-temp(type="checkbox")
 134                       | Add as temporary
 135                   | Paste the embed code below and click Next or At End.
 136                   | Acceptable embed codes are <code>&lt;iframe&gt;</code> and <code>&lt;object&gt;</code> tags.  <strong>CUSTOM EMBEDS CANNOT BE SYNCHRONIZED.</strong>
 137                   textarea#customembed-content.input-block-level.form-control(rows="3")
 138                 #playlistmanager.collapse.plcontrol-collapse.col-lg-12.col-md-12
 139                   .vertical-spacer
 140                   .input-group
 141                     input#userpl_name.form-control(type="text", placeholder="Playlist Name")
 142                     span.input-group-btn
 143                       button#userpl_save.btn.btn-default Save
 144                   .checkbox
 145                     label
 146                       input.add-temp(type="checkbox")
 147                       | Add as temporary
 148                   ul#userpl_list.videolist
 149                 #queuefail.col-lg-12.col-md-12
 150                   .vertical-spacer
 151                 .col-lg-12.col-md-12
 152                   ul#queue.videolist
 153                   #plmeta
 154                     span#plcount 0 items
 155                     span#pllength 00:00:00
 156           #resizewrap.row
 157             .col-lg-5.col-md-5
 158             #videowidth.col-lg-7.col-md-7
 159           #sitefooter
 160             include pagefooter
 161     #useroptions.modal.fade(tabindex="-1", role="dialog", aria-hidden="true")
 162       .modal-dialog
 163         .modal-content
 164           .modal-header
 165             button.close(data-dismiss="modal", aria-hidden="true") &times;
 166             h4 User Preferences
 167             ul.nav.nav-tabs
 168               li: a(href="#us-general", data-toggle="tab") General
 169               li: a(href="#us-playback", data-toggle="tab") Playback
 170               li: a(href="#us-chat", data-toggle="tab") Chat
 171               li: a(href="#us-scriptcontrol", data-toggle="tab") Script Access
 172               li: a(href="#us-mod", data-toggle="tab", style="") Moderator
 173           .modal-body
 174             .tab-content
 175               include useroptions
 176               +us-general()
 177               +us-playback()
 178               +us-chat()
 179               +us-scripts()
 180               +us-mod()
 181           .modal-footer
 182             button.btn.btn-primary(type="button", data-dismiss="modal", onclick="javascript:saveUserOptions()") Save
 183             button.btn.btn-default(type="button", data-dismiss="modal") Close
 184     #emotelist.modal.fade(tabindex="-1", role="dialog", aria-hidden="true")
 185       .modal-dialog.modal-dialog-nonfluid
 186         .modal-content
 187           .modal-header
 188             button.close(data-dismiss="modal", aria-hidden="true") &times;
 189             h4 Emote List
 190           .modal-body
 191             .pull-left
 192               input.emotelist-search.form-control(type="text", placeholder="Search")
 193             .pull-right
 194               .checkbox
 195                 label
 196                   input.emotelist-alphabetical(type="checkbox")
 197                   | Sort alphabetically
 198             .emotelist-paginator-container
 199             table.emotelist-table
 200               tbody
 201           .modal-footer
 202     #channeloptions.modal.fade(tabindex="-1", role="dialog", aria-hidden="true")
 203       .modal-dialog
 204         .modal-content
 205           .modal-header
 206             button.close(data-dismiss="modal", aria-hidden="true") &times;
 207             h4 Channel Settings
 208             ul.nav.nav-tabs
 209               li.active: a(href="#cs-miscoptions", data-toggle="tab") General Settings
 210               li: a(href="#cs-adminoptions", data-toggle="tab") Admin Settings
 211               li.dropdown
 212                 a#cs-edit-dd-toggle(href="#", data-toggle="dropdown") Edit
 213                   span.caret
 214                 ul.dropdown-menu
 215                   li: a(href="#cs-chatfilters", data-toggle="tab", onclick="javascript:socket.emit('requestChatFilters')") Chat Filters
 216                   li: a(href="#cs-emotes", data-toggle="tab") Emotes
 217                   li: a(href="#cs-motdeditor", data-toggle="tab", tabindex="-1") MOTD
 218                   li: a(href="#cs-csseditor", data-toggle="tab", tabindex="-1") CSS
 219                   li: a(href="#cs-jseditor", data-toggle="tab", tabindex="-1") Javascript
 220                   li: a(href="#cs-permedit", data-toggle="tab", tabindex="-1") Permissions
 221                   li: a(href="#cs-chanranks", data-toggle="tab", tabindex="-1", onclick="javascript:socket.emit('requestChannelRanks')") Moderators
 222               li: a(href="#cs-banlist", data-toggle="tab", tabindex="-1", onclick="javascript:socket.emit('requestBanlist')") Ban list
 223               li: a(href="#cs-chanlog", data-toggle="tab", onclick="javascript:socket.emit('readChanLog')") Log
 224           .modal-body
 225             .tab-content
 226               include channeloptions
 227               +miscoptions()
 228               +adminoptions()
 229               +motdeditor()
 230               +csseditor()
 231               +jseditor()
 232               +banlist()
 233               +recentjoins()
 234               +chanranks()
 235               +chatfilters()
 236               +emotes()
 237               +chanlog()
 238               +permeditor()
 239           .modal-footer
 240             button.btn.btn-default(type="button", data-dismiss="modal") Close
 241     #pmbar
 242     include footer
 243     +footer()
 244     script(id="socketio-js", src=sioSource)
 245     script(src="/js/data.js")
 246     script(src="/js/util.js")
 247     script(src="/js/tabcomplete.js")
 248     script(src="/js/player.js")
 249     script(src="/js/paginator.js")
 250     script(src="/js/ui.js")
 251     script(src="/js/callbacks.js")
 252     script(defer, src="https://www.youtube.com/iframe_api")
 253     script(defer, src="https://api.dmcdn.net/all.js")
 254     script(defer, src="https://player.vimeo.com/api/player.js")
 255     script(defer, src="/js/sc.js")
 256     script(defer, src="/js/video.js")
 257     script(defer, src="/js/videojs-contrib-hls.min.js")
 258     script(defer, src="/js/videojs-resolution-switcher.js")
 259     script(defer, src="/js/playerjs-0.0.12.js")
 260     script(defer, src="/js/dash.all.min.js")
 261     script(defer, src="/js/videojs-dash.js")
 262     script(defer, src="https://player.twitch.tv/js/embed/v1.js")