git.sesse.net Git - vlc/blob - share/lua/http/index.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
   2 <!--  - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - >
   3 <  index.html: VLC media player web interface - VLM
   4 < - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - >
   5 <  Copyright (C) 2005-2006 the VideoLAN team
   6 <  $Id$
   7 <
   8 <  Authors: Brandon Brooks <bwbrooks -at- archmageinc -dot- com>
   9 <
  10 <  This program is free software; you can redistribute it and/or modify
  11 <  it under the terms of the GNU General Public License as published by
  12 <  the Free Software Foundation; either version 2 of the License, or
  13 <  (at your option) any later version.
  14 <
  15 <  This program is distributed in the hope that it will be useful,
  16 <  but WITHOUT ANY WARRANTY; without even the implied warranty of
  17 <  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  18 <  GNU General Public License for more details.
  19 <
  20 <  You should have received a copy of the GNU General Public License
  21 <  along with this program; if not, write to the Free Software
  22 <  Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111, USA.
  23 < - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
  24 <html>
  25         <head>
  26                 <title><?vlc gettext("VLC media player - Web Interface") ?></title>
  27                 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  28                 <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
  29                 <script type="text/javascript" src="js/common.js"></script>
  30                 <script type="text/javascript">
  31                 //<![CDATA[
  32                         if(isMobile()){
  33                                 window.location='mobile.html';
  34                         }
  35                 //]]>
  36                 </script>
  37                 <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
  38                 <link type="text/css" href="css/main.css" rel="stylesheet" />
  39                 <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
  40                 <script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>
  41                 <script type="text/javascript" src="js/jquery.jstree.js"></script>
  42                 <script type="text/javascript" src="js/ui.js"></script>
  43                 <script type="text/javascript" src="js/controlers.js"></script>
  44                 <script type="text/javascript">
  45                 //<![CDATA[
  46                         var pollStatus  =       true;
  47                         $(function(){
  48                                 $('.button').hover(function(){$(this).addClass('ui-state-hover')},function(){$(this).removeClass('ui-state-hover')});
  49                                 $('#buttonPlayList').click(function(){
  50                                         $('#libraryContainer').animate({
  51                                                 height: 'toggle'
  52                                         });
  53                                         $('#buttonzone').animate({
  54                                                 width: 'toggle'
  55                                         });
  56                                         return false;
  57                                 });
  58                                 $('#buttonViewer').click(function(){
  59                                         $('#viewContainer').animate({
  60                                                 height: 'toggle'
  61                                         })
  62                                         return false;
  63                                 });
  64                                 $('#buttonEqualizer').click(function(){
  65                                         updateEQ();
  66                                         $('#window_equalizer').dialog('open');
  67                                         return false;
  68                                 })
  69                                 $('#buttonOffsets').click(function(){
  70                                         $('#window_offset').dialog('open');
  71                                         return false;
  72                                 });
  73                                 $('#buttonBatch').click(function(){
  74                                         $('#window_batch').dialog('open');
  75                                         return false;
  76                                 });
  77                                 $('#buttonOpen').click(function(){
  78                                         browse_target   =       'default';
  79                                         browse();
  80                                         $('#window_browse').dialog('open');
  81                                         return false;
  82                                 });
  83                                 $('#buttonPrev').mousedown(function(){
  84                                         intv    =       1;
  85                                         ccmd    =       'prev';
  86                                         setIntv();
  87                                         return false;
  88                                 });
  89                                 $('#buttonPrev').mouseup(function(){
  90                                         if(intv<=5){
  91                                                 sendCommand({'command':'pl_previous'});
  92                                         }
  93                                         intv    =       0;
  94                                         return false;
  95                                 });
  96                                 $('#buttonNext').mousedown(function(){
  97                                         intv    =       1;
  98                                         ccmd    =       'next';
  99                                         setIntv();
 100                                         return false;
 101                                 });
 102                                 $('#buttonNext').mouseup(function(){
 103                                         if(intv<=5){
 104                                                 sendCommand({'command':'pl_next'});
 105                                         }
 106                                         intv    =       0;
 107                                         return false;
 108                                 });
 109                                 $('#buttonPlEmpty').click(function(){
 110                                         sendCommand({'command':'pl_empty'})
 111                                         return false;
 112                                 });
 113                                 $('#buttonLoop').click(function(){
 114                                         sendCommand({'command':'pl_loop'});
 115                                         return false;
 116                                 });
 117                                 $('#buttonRepeat').click(function(){
 118                                         sendCommand({'command':'pl_repeat'});
 119                                         return false;
 120                                 });
 121                                 $('#buttonShuffle').click(function(){
 122                                         sendCommand({'command':'pl_random'});
 123                                         return false;
 124                                 })
 125                                 $('#buttonRefresh').click(updatePlayList);
 126                                 $('#buttonPlPlay').click(function(){
 127                                         sendCommand({
 128                                                 'command': 'pl_play',
 129                                                 'id':$('.jstree-clicked','#libraryTree').first().parents().first().attr('id').substr(5)
 130                                         })
 131                                         return false;
 132                                 });
 133                                 $('#buttonPlAdd').click(function(){
 134                                         $('.jstree-clicked','#libraryTree').each(function(){
 135                                                 if($(this).parents().first().attr('uri')){
 136                                                         sendCommand({
 137                                                                 'command':'in_enqueue',
 138                                                                 'input' : $(this).parents().first().attr('uri')
 139                                                         });
 140                                                 };
 141                                         });
 142                                         $('#libraryTree').jstree('deselect_all');
 143                                         setTimeout(updatePlayList,1000);
 144                                         return false;
 145                                 });
 146                                 $('#buttonStreams, #buttonStreams2').click(function(){
 147                                         updateStreams();
 148                                         $('#window_streams').dialog('open');
 149                                 });
 150                                 $('#buttonSout').click(function(){
 151                                         if(current_que=='main'){
 152                                                 $('#windowStreamConfirm').dialog('open');
 153                                         }else{
 154                                                 $('#player').empty();
 155                                                 current_que             =       'main';
 156                                                 sendVLMCmd('del Current');
 157                                                 updateStatus();
 158                                         }
 159                                         return false;
 160                                 });
 161                                 $('#windowStreamConfirm').dialog({
 162                                         autoOpen: false,
 163                                         width:600,
 164                                         modal: true,
 165                                         buttons:{
 166                                                 "<?vlc gettext("Yes") ?>":function(){
 167                                                         var file                        =       $('[current="current"]','#libraryTree').length>0 ? decodeURIComponent($('[current="current"]','#libraryTree').first().attr('uri').substr(7)) : ($('.jstree-clicked','#libraryTree').length>0 ? decodeURIComponent($('.jstree-clicked','#libraryTree').first().parents().first().attr('uri').substr(7)) : ($('#plid_'+current_id).attr('uri') ? decodeURIComponent($('#plid_'+current_id).attr('uri').substr(7)) : false));
 168                                                         if(file){
 169                                                                 if($('#viewContainer').css('display')=='none'){
 170                                                                         $('#buttonViewer').click();
 171                                                                 }
 172                                                                 var defaultStream       =       'new Current broadcast enabled input "'+file+'" output #transcode{vcodec=FLV1,vb=4096,fps=25,scale=1,acodec=mp3,ab=512,samplerate=44100,channels=2}:std{access='+$('#stream_protocol').val()+',mux=ffmpeg{{mux=flv}},dst=0.0.0.0:'+$('#stream_port').val()+'/'+$('#stream_file').val()+'}';
 173                                                                 sendVLMCmd('del Current;'+defaultStream+';control Current play');
 174                                                                 $('#player').attr('href',$('#stream_protocol').val()+'://'+$('#stream_host').val()+':'+$('#stream_port').val()+'/'+$('#stream_file').val());
 175                                                                 current_que                     =       'stream';
 176                                                                 updateStreams();
 177                                                         }
 178                                                         $(this).dialog('close');
 179                                                 },
 180                                                 "<?vlc gettext("No") ?>":function(){
 181                                                         $(this).dialog('close');
 182                                                 }
 183                                         }
 184                                 });
 185                                 $('#viewContainer').animate({height: 'toggle'});
 186                         });
 187                         /* delay script loading so we won't block if we have no net access */
 188                         $.getScript('http://static.flowplayer.org/js/flowplayer-3.2.6.min.js', function(data, textStatus){
 189                                 $('#player').empty();
 190                                 flowplayer("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.7.swf");
 191                                 /* .getScript only handles success() */
 192                          });
 193                 //]]>
 194                 </script>
 195         </head>
 196         <body id="regular_layout">
 197                         <div class="centered">
 198                         <div id="mainContainer" class="centered">
 199                         <div id="controlContainer" class="ui-widget">
 200                                 <div id="controlTable" class="ui-widget-content">
 201                                         <ul id="controlButtons">
 202                                                 <li id="buttonPrev" class="button48  ui-corner-all" title="<?vlc gettext("Previous") ?>"></li>
 203                                                 <li id="buttonPlay" class="button48  ui-corner-all paused" title="<?vlc gettext("Play") ?>"></li>
 204                                                 <li id="buttonNext" class="button48  ui-corner-all" title="<?vlc gettext("Next") ?>"></li>
 205                                                 <li id="buttonOpen" class="button48  ui-corner-all" title="<?vlc gettext("Open Media") ?>"></li>
 206                                                 <li id="buttonStop" class="button48  ui-corner-all" title="<?vlc gettext("Stop") ?>"></li>
 207                                                 <li id="buttonFull" class="button48  ui-corner-all" title="<?vlc gettext("Full Screen") ?>"></li>
 208                                                 <li id="buttonSout" class="button48  ui-corner-all" title="<?vlc gettext("Easy Stream") ?>"></li>
 209                                         </ul>
 210                                         <ul id="buttonszone">
 211                                                 <li id="buttonPlayList" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Hide / Show Library") ?>"><span class="ui-icon ui-icon-note"></span></li>
 212                                                 <li id="buttonViewer" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Hide / Show Viewer") ?>"><span class="ui-icon ui-icon-video"></span></li>
 213                                                 <li id="buttonStreams" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Manage Streams") ?>"><span class="ui-icon ui-icon-script"></span></li>
 214                                                 <li id="buttonOffsets" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Track Synchronisation") ?>"><span class="ui-icon ui-icon-transfer-e-w"></span></li>
 215                                                 <li id="buttonEqualizer" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Equalizer") ?>"><span class="ui-icon ui-icon-signal"></span></li>
 216                                                 <li id="buttonBatch" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("VLM Batch Commands") ?>"><span class="ui-icon ui-icon-suitcase"></span></li>
 217                                         </ul>
 218                                         <div id="volumesliderzone">
 219                                                 <div id="volumeSlider" title="Volume"><img src="images/speaker-32.png" class="ui-slider-handle" alt="volume"/></div>
 220                                                 <div id="currentVolume" class="dynamic">50%</div>
 221                                         </div>
 222                                         <div id="artszone">
 223                                                 <img id="albumArt" src="/art" width="141px" height="130px" alt="Album Art"/>
 224                                         </div>
 225                                         <div id="mediaTitle" class="dynamic"></div>
 226                                         <div id="seekContainer">
 227                                                 <div id="seekSlider" title="<?vlc gettext("Seek Time") ?>"></div>
 228                                                 <div id="currentTime" class="dynamic">00:00:00</div>
 229                                                 <div id="totalTime" class="dynamic">00:00:00</div>
 230                                         </div>
 231                                 </div>
 232                         </div>
 233                         <div id="libraryContainer" class="ui-widget">
 234                                 <ul id="buttonzone" align="left" class="ui-widget-content" style="overflow:hidden; white-space: nowrap;">
 235                                         <li id="buttonShuffle" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Shuffle") ?>"><span class="ui-icon ui-icon-shuffle"></span></li>
 236                                         <li id="buttonLoop" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Loop") ?>"><span class="ui-icon ui-icon-refresh"></span></li>
 237                                         <li id="buttonRepeat" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Repeat") ?>"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
 238                                         <li id="buttonPlEmpty" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Empty Playlist") ?>"><span class="ui-icon ui-icon-trash"></span></li>
 239                                         <li id="buttonPlAdd" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Queue Selected") ?>"><span class="ui-icon ui-icon-plus"></span></li>
 240                                         <li id="buttonPlPlay" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Play Selected") ?>"><span class="ui-icon ui-icon-play"></span></li>
 241                                         <li id="buttonRefresh" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Refresh List") ?>"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li>
 242                                 </ul>
 243                                 <div id="libraryTree" class="ui-widget-content"></div>
 244                         </div>
 245                         <div id="viewContainer" class="ui-widget">
 246                                 <div id="mediaViewer" class="ui-widget-content">
 247                                         <div href="http://localhost:8081/stream.flv" style="display:block; width:100%" id="player">
 248                                                 <p><?vlc gettext("Loading flowplayer...") ?><br/><?vlc gettext("If nothing appears, check your internet connection.") ?></p>
 249                                         </div>
 250                                 </div>
 251                         </div>
 252                         <div class="footer">
 253                                 VLC <?vlc print(vlc.misc.version() .. ' - Lua Web Interface - <a id="mobileintflink" href="/mobile.html">Mobile Interface</a> - ' .. vlc.misc.copyright()) ?>
 254                         </div>
 255                 </div>
 256                 </div>
 257                 <div id="windowStreamConfirm" title="Confirm Stream Settings">
 258                         <p>
 259                                 <?vlc gettext("By creating a stream, the <i>Main Controls</i> will operate the stream instead of the main interface.") ?>
 260                                 <?vlc gettext("The stream will be created using default settings, for more advanced configuration, or to modify the default settings, select the button to the right: <i>Manage Streams</i>") ?>
 261                                 <span id="buttonStreams2" class="button ui-widget ui-state-default ui-corner-all" title="<?vlc gettext("Manage Streams") ?>"><span class="ui-icon ui-icon-script"></span></span>
 262                         </p>
 263                         <p>
 264                                 <?vlc gettext("Once the stream is created, the <i>Media Viewer</i> window will display the stream.") ?>
 265                                 <?vlc gettext("Volume will be controlled by the player, and not the <i>Main Controls</i>.") ?>
 266                         </p>
 267                         <p>
 268                                 <?vlc gettext("The current playing item will be streamed. If there is no currently playing item, the first selected item from the <i>Library</i> will be the subject of the stream.") ?>
 269                         </p>
 270                         <p>
 271                                 <?vlc gettext("To stop the stream and resume normal controls, click the <i>Open Stream</i> button again.") ?>
 272                         </p>
 273                         <p>
 274                                 <?vlc gettext("Are you sure you wish to create the stream ?") ?>
 275                         </p>
 276                 </div>
 277                 <?vlc
 278                 current_page = "index"
 279
 280                 dialogs("browse_window.html","stream_window.html","create_stream.html","offset_window.html","mosaic_window.html","equalizer_window.html","batch_window.html","error_window.html");
 281                 ?>
 282         </body>
 283 </html>