<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml10/DTD/xhtml10transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
+
<head>
<title>VLC media player</title>
- <link href="/style.css" title="Default" rel="stylesheet" />
-
- <vlc id="if" param1="url_param"/>
- <meta http-equiv="refresh" content="0;URL=/" />
- <vlc id="end" />
-
+ <link href="/style.css" title="Default" rel="stylesheet" type="text/css" />
+ <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<vlc id="control" param1="stop,pause,previous,next,add,sout,play,delete,empty,seek,fullscreen,keep,volume,sort,move" />
<vlc id="set" param1="sout" param2="string" />
- </head>
+<script type="text/javascript">
+
+function changeMe(item)
+{
+ if (item.parentNode.parentNode.lastChild.style.display=="none")
+ {
+ item.parentNode.parentNode.lastChild.style.display="block";
+ item.alt="[-]";
+ item.src="cone_minus.png";
+ }
+ else
+ {
+ item.parentNode.parentNode.lastChild.style.display="none";
+ item.alt="[+]";
+ item.src="cone_plus.png";
+ }
+}
+</script>
+
+</head>
+
+
<body>
- <h2>
- <a href="http://www.videolan.org/">VLC media player<vlc id="value" param1="version" /></a> (http interface)</h2>
- <div class="sectitle">Control VLC</div>
- <div class="section">
- <table class="add">
- <tr>
- <td nowrap="nowrap">Current state: <vlc id="value" param1="stream_state" /></td>
- <td align="right"><a href="info.html">Information</a> <a href="admin/">Administration</a></td>
- </tr>
- <tr>
- <td nowrap="nowrap">
- <form method="get" action="">
+ <!-- left menu -->
+ <div class="left">
+ <div class="sectitle">Playback control</div>
+ <div class="section-controls">
+ <form method="get" action="">
+ <p>
<input type="submit" name="control" value="stop" />
<input type="submit" name="control" value="pause" />
+ <br />
<input type="submit" name="control" value="previous" />
<input type="submit" name="control" value="next" />
- <input type="submit" name="control" value="fullscreen" />
- </form>
- </td>
- </tr>
- <tr>
- <td colspan="2">
- <table>
- <tr>
- <td>
- <form method="get" action="">
- <input type="submit" name="seek_value" value="-1min"/><input type="hidden" name="control" value="seek"/>
- </form>
- </td>
- <td>
- <form method="get" action="">
- <input type="text" name="seek_value" size="14"/><input type="hidden" name="control" value="seek"/>
- </form>
- </td>
- <td>
- <form method="get" action="">
- <input type="submit" name="seek_value" value="+1min"/><input type="hidden" name="control" value="seek"/>
- </form>
- </td>
- <td>
- ( Seek Textbox: for example "+12min 42sec", "01:13:43", "-12%" etc... )
- </td>
- </tr>
- </table>
- </td>
- </tr>
- <tr>
- <td>
- <form method="get" action="">
- Current volume level: <vlc id="value" param1="volume" /> <input type="text" name="value" size="5"/><button name="control" value="volume">Set</button>
+ </p>
+ <input type="submit" name="seek_value" value="-1min"/><input type="hidden" name="control" value="seek"/>
+ <input type="submit" name="seek_value" value="+1min"/><input type="hidden" name="control" value="seek"/>
+ <br />
+ <input type="text" name="seek_value" size="14"/><input type="hidden" name="control" value="seek"/>
</form>
- </td>
- </tr>
- </table>
- </div>
- <div class="sectitle">Add</div>
- <div class="section">
- <form method="get" action="" enctype="text/plain" >
- <table class="add">
- <tr>
- <td>Add a MRL (Media Resource Locator) to the playlist</td>
- <td><input type="text" name="mrl" size="40" /><input type="submit" name="control" value="add" /></td>
- </tr>
- <tr>
- <td>Stream Output:</td>
- <td><input type="text" name="sout" size="40" value="<vlc id="get" param1="sout" param2="string" />" /><input type="submit" name="control" value="sout" /></td>
- </tr>
- </table>
- </form>
- </div>
+ <br />
+ <span class="small">( Seek Textbox: for example "+12min 42sec", "01:13:43", "-12%" etc... )</span>
+ </div> <!-- End section -->
+
+ <div class="sectitle">Misc controls</div>
+ <div class="section-controls">
+ <form method="get" action="">
+ <input type="hidden" name="control" value="volume" />
+ Vol: <input type="text" name="value" size="5"/>
+ <input type="submit" value="Set" /><br /> (0 - 1024)<br /><span class="small">(for exemple: "536", "-12", "+42", "36%")</span>
+ </form>
+ <br />
+ <form method="get" action="">
+ <input type="submit" name="control" value="fullscreen" />
+ </form>
+ </div>
+
+ <div class="sectitle">Status</div>
+ <div class="section">
+ State: <vlc id="value" param1="stream_state" /><br />
+ Length: <span id="length"><vlc id="value" param1="stream_length" /> s
+ </span><br />
+ Time: <span id="time"><vlc id="value" param1="stream_time" /> s</span><br />
+ Volume: <span id="volume"><vlc id="value" param1="volume" /></span>
+ <br /><a href="info.html">Information</a>
+ </div>
+
+ <div class="section"><a href="/admin/">Administration Page</a></div>
- <div class="sectitle">Move Item</div>
- <div class="section">
- <form method="get" action="">
- Move the item number <input type="text" name="psz_pos" size="5" /> to <input type="text" name="psz_newpos" size="5" /> <input type="submit" name="control" value="move" />
- </form>
- </div>
</div>
+ <!-- end left -->
+
+ <!-- main content -->
+ <div class ="right">
+ <h2 class="title"><a href="http://www.videolan.org/">VLC media player
+ <vlc id="value" param1="version" /></a> (http interface)
+ </h2>
+
+ <div class="sectitle">Add</div>
+ <div class="section">
+ <form method="get" action="" enctype="text/plain" >
+ <table class="add">
+ <tr>
+ <td>Add a MRL (Media Resource Locator) to the playlist</td>
+ <td><input type="text" name="mrl" size="40" /><input type="submit" name="control" value="add" /></td>
+ </tr>
+ <tr>
+ <td>Stream Output:</td>
+ <td><input type="text" name="sout" size="40" value="<vlc id="get" param1="sout" param2="string" />" /><input type="submit" name="control" value="sout" /></td>
+ </tr>
+ </table>
+ </form>
+ </div>
+
+ <div class="section">
+ <form method="get" action="">
+ <ul id="playlist">
+ <vlc id="rpn" param1="first_item 0 store" />
+ <vlc id="rpn" param1="last_depth 0 store" />
+ <vlc id="foreach" param1="pl" param2="playlist" />
+ <vlc id="if" param1="pl.depth value last_depth value <" />
+ <vlc id="rpn" param1="pl.depth value ':' last_depth value 1 - ':' 1 strcat strcat strcat strcat" />
+ <vlc id="foreach" param1="the_final_countdown" param2="integer" />
+ </ul></li>
+ <vlc id="end" />
+ <vlc id="end" />
+
+ <vlc id="if" param1="pl.type value 'Node' strcmp" />
+ <vlc id="rpn" param1="1 +" />
+ <li>
+ <input type="checkbox" name="item" value="<vlc id="value" param1="pl.index" />"/>
+ <vlc id="if" param1="pl.current" />
+ <strong>
+ <vlc id="end" />
+ <a href="?control=play&item=<vlc id="value" param1="pl.index" />">
+ <vlc id="value" param1="pl.name" /><vlc id="if" param1="pl.uri value pl.name value strcmp"/> (<vlc id="value" param1="pl.uri" />)<vlc id="end"/></a>
+ <vlc id="if" param1="pl.current" />
+ </strong>
+ <vlc id="end" />
+ </li>
+ <vlc id="else" />
+ <li>
+ <form method="get" action="">
+ <vlc id="if" param1="first_item value 0 ="/>
+ <img alt="Cone" src="cone_plus.png" />
+ Playlist
+ <vlc id="rpn" param1="first_item 1 store" />
+ <vlc id="else"/>
+ <img alt="[-]" src="cone_minus.png" onclick='changeMe(this)'/>
+ <vlc id="value" param1="pl.name" /> (<vlc id="value" param1="pl.i_children" /> item<vlc id="if" param1="pl.i_children 1 >" />s<vlc id="end" />)
+ <vlc id="end"/>
+ <input type="hidden" name="item" value="<vlc id="value" param1="pl.index" />" />
+ <input type="submit" name="control" value="sort" /> by
+ <select name="type">
+ <option value="title">title</option>
+ <option value="shuffle">shuffle</option>
+ </select> with
+ <select name="order">
+ <option value="0">normal order</option>
+ <option value="1">reverse order</option>
+ </select>
+ </form>
- <div class="sectitle">VLC Playlist</div>
- <div class="section">
- <form method="get" action="">
- <table>
- <tr>
- <td>
- <input type="submit" name="control" value="sort" /> by
- <select name="type">
- <option value="title">title</option>
- <option value="group">group</option>
- <option value="author">author</option>
- <option value="shuffle">shuffle</option>
- </select> with
- <select name="order">
- <option value="0">normal order</option>
- <option value="1">reverse order</option>
- </select>
- </td>
- </tr>
- <tr>
- <td>
- <table>
- <vlc id="foreach" param1="pl" param2="playlist" />
- <tr class="<vlc id="if" param1="pl.index 2 % 0 =" />ligne1<vlc id="else" />ligne2<vlc id="end" />">
- <td>
- <input type="checkbox" name="item" value="<vlc id="value" param1="pl.index" />"/>
- <vlc id="if" param1="pl.current" />
- <b>
- <vlc id="end" />
- <a href="?control=play&item=<vlc id="value" param1="pl.index" />">
- <vlc id="value" param1="pl.index" /> - <vlc id="value" param1="pl.uri" /><vlc id="if" param1="pl.uri value pl.name value strcmp"/> (<vlc id="value" param1="pl.name" />)<vlc id="end"/></a>
- <vlc id="if" param1="pl.current" />
- </b>
- <vlc id="end" />
- </td>
- </tr>
- <vlc id="end" />
- </table>
- </td>
- </tr>
- <tr>
- <td>
- <input type="submit" name="control" value="delete" />
- <input type="submit" name="control" value="keep" />
- </td>
- </tr>
- </table>
- </form>
+ <vlc id="if" param1="pl.i_children 0 !=" />
+ <ul>
+ <vlc id="else" />
+ </li>
+ <vlc id="end" />
+
+ <vlc id="end" />
+
+ <vlc id="rpn" param1="last_depth pl.depth value store" />
+
+ <vlc id="end" />
+ <vlc id="rpn" param1="0 ':' last_depth value 1 - ':' 1 strcat strcat strcat strcat" />
+ <vlc id="foreach" param1="the_final_countdown" param2="integer" />
+ </ul></li>
+ <vlc id="end" />
+
+ </ul>
+ <input type="submit" name="control" value="delete" />
+ <input type="submit" name="control" value="empty" />
+ <input type="submit" name="control" value="keep" />
+ </form>
+ </div>
</div>
- <hr/>
- <p> <vlc id="value" param1="copyright" /> </p>
+ <!-- end main content -->
+
+ <p style="text-align:center;font-size:1.2em;"> <vlc id="value" param1="copyright" /> </p>
+
+ <script type="text/javascript">
+ got_time = <vlc id="value" param1="stream_time" />;
+ hours = Math.floor(got_time/ 3600);
+ minutes = Math.floor((got_time/60) % 60);
+ seconds = got_time % 60;
+ if ( hours < 10 ) hours = "0" + hours;
+ if ( minutes < 10 ) minutes = "0" + minutes;
+ if ( seconds < 10 ) seconds = "0" + seconds;
+ document.getElementById('time').innerHTML = hours+":"+minutes+":"+seconds;
+ got_length = <vlc id="value" param1="stream_length" />;
+ hours = Math.floor(got_length/ 3600);
+ minutes = Math.floor((got_length/60) % 60);
+ seconds = got_length % 60;
+ if ( hours < 10 ) hours = "0" + hours;
+ if ( minutes < 10 ) minutes = "0" + minutes;
+ if ( seconds < 10 ) seconds = "0" + seconds;
+ document.getElementById('length').innerHTML = hours+":"+minutes+":"+seconds;
+ got_volume = <vlc id="value" param1="volume" />;
+ document.getElementById( 'volume').innerHTML = Math.ceil(got_volume * 100/1024) + " %";
+ </script>
</body>
</html>