Skip to content

V
vlc
Commit 4348289a authored by Antoine Cellerier's avatar Antoine Cellerier
Browse files
Options

main, functions.js, slider_*.png : add position slider 

status.xml : add "seek" command
vlm, refresh.png : add refresh buttons (page doesn't autorefresh)
parent f201f3c5
Hide whitespace changes
Inline Side-by-side
Showing with 101 additions and 12 deletions
share/http/dialogs/main
View file @ 4348289a
......@@ -36,52 +36,52 @@ sout and playlist .
</button>
</div>
<div class="controls">
<button id="btn_open" onclick="toggle_show('input');" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_open" onclick="toggle_show('input');" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Open" >
<img src="images/eject.png" alt="Open" />
<span class="btn_text">Open</span>
</button>
&nbsp;
<button id="btn_stop" onclick="pl_stop();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_stop" onclick="pl_stop();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Stop" >
<img src="images/stop.png" alt="Stop" />
<span class="btn_text">Stop</span>
</button>
<!--<button id="btn_play" onclick="alert('FIXME');" onmouseover="button_over(this);" onmouseout="button_out(this);">
<!--<button id="btn_play" onclick="alert('FIXME');" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Play" >
<img src="images/play.png" alt="Play" />
<span class="btn_text">Play</span>
</button>-->
<button id="btn_pause" onclick="pl_pause();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_pause" onclick="pl_pause();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Pause" >
<img src="images/pause.png" alt="Pause" id="btn_pause_img" />
<span class="btn_text">Pause</span>
</button>
&nbsp;
<button id="btn_previous" onclick="pl_previous();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_previous" onclick="pl_previous();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Previous" >
<img src="images/prev.png" alt="Previous" />
<span class="btn_text">Previous</span>
</button>
<button id="btn_next" onclick="pl_next();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_next" onclick="pl_next();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Next" >
<img src="images/next.png" alt="Next" />
<span class="btn_text">Next</span>
</button>
&nbsp;
<button id="btn_sout" onclick="toggle_show('sout');" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_sout" onclick="toggle_show('sout');" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Stream Output" >
<img src="images/sout.png" alt="Stream Output" />
<span class="btn_text">Stream Output</span>
</button>
<button id="btn_playlist" onclick="toggle_show('playlist');" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_playlist" onclick="toggle_show('playlist');" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Playlist" >
<img src="images/playlist.png" alt="Playlist" />
<span class="btn_text">Playlist</span>
</button>
&nbsp;
<button id="btn_fullscreen" onclick="fullscreen();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_fullscreen" onclick="fullscreen();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Fullscreen" >
<img src="images/fullscreen.png" alt="Fullscreen" />
<span class="btn_text">Fullscreen</span>
</button>
&nbsp;
<button id="btn_volume_down" onclick="volume_down();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_volume_down" onclick="volume_down();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Decrease Volume" >
<img src="images/volume_down.png" alt="Decrease Volume" />
<span class="btn_text">Decrease Volume</span>
</button>
<button id="btn_volume_up" onclick="volume_up();" onmouseover="button_over(this);" onmouseout="button_out(this);">
<button id="btn_volume_up" onclick="volume_up();" onmouseover="button_over(this);" onmouseout="button_out(this);" title="Increase Volume" >
<img src="images/volume_up.png" alt="Increase Volume" />
<span class="btn_text">Increase Volume</span>
</button>
......@@ -93,6 +93,9 @@ sout and playlist .
-
Volume : <span id="volume">(?)</span>
<br/>
<!-- progress bar -->
<img src="images/slider_left.png" alt="slider left" /><span id="progressbar" style="background-image: url( 'images/slider_bar.png' ); width: 408px; height:16px; position:absolute;" onclick="slider_seek( event, this );" onmousemove="slider_move( event, this );"><img src="images/slider_point.png" alt="slider point" style="position:relative; left:0px;" id="main_slider_point" onmousedown="slider_down( event, this );" onmouseup="slider_up( event, this.parentNode );" onmouseout="slider_up( event, this.parentNode );"/></span><img src="images/slider_right.png" alt="slider right" style="position:relative;left:408px;" />
<br/>
<span id="nowplaying">(?)</span>
</div>
</div>
share/http/dialogs/vlm
View file @ 4348289a
......@@ -30,10 +30,12 @@ sout and vlmelements .
<div id="vlm" class="dialog" >
<div class="title">
VLC media player - VLM interface
<!--
<button id="btn_toggle_text" onclick="toggle_btn_text();">
<img src="images/help.png" alt="Help" />
Help
</button>
-->
</div>
<div class="controls">
<label for="vlm_command">VLM command:</label>
......@@ -149,6 +151,9 @@ sout and vlmelements .
<div id="vlm_broadcast" class="dialog" >
<div class="title">
Broadcast Elements
<button id="btn_refresh_broadcast" onclick="vlm_get_elements();" title="Refresh" >
<img src="images/refresh.png" alt="Refresh" />
</button>
</div>
<div id="vlm_broadcast_list" class="list"></div>
</div>
......@@ -156,6 +161,9 @@ sout and vlmelements .
<div id="vlm_vod" class="dialog" >
<div class="title">
Video on Demand Elements
<button id="btn_refresh_vod" onclick="vlm_get_elements();" title="Refresh" >
<img src="images/refresh.png" alt="Refresh" />
</button>
</div>
<div id="vlm_vod_list" class="list"></div>
</div>
......@@ -163,6 +171,9 @@ sout and vlmelements .
<div id="vlm_schedule" class="dialog" >
<div class="title">
Schedule Elements
<button id="btn_refresh_schedule" onclick="vlm_get_elements();" title="Refresh" >
<img src="images/refresh.png" alt="Refresh" />
</button>
</div>
<div id="vlm_schedule_list" class="list"></div>
</div>
share/http/js/functions.js
View file @ 4348289a
......@@ -25,6 +25,54 @@
var old_time = 0;
/**********************************************************************
* Slider functions
*********************************************************************/
var slider_mouse_down = 0;
var slider_dx = 0;
/* findPosX() from http://www.quirksmode.rg/js/indpos.html */
function findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function slider_seek( e, bar )
{
seek(Math.floor(( e.clientX + document.body.scrollLeft - findPosX( bar )) / 4)+"%25");
}
function slider_down( e, point )
{
slider_mouse_down = 1;
slider_dx = e.clientX - findPosX( point );
}
function slider_up( e, bar )
{
slider_mouse_down = 0;
/* slider_seek( e, bar ); */
}
function slider_move( e, bar )
{
if( slider_mouse_down == 1 )
{
var slider_position = Math.floor( e.clientX - slider_dx + document.body.scrollLeft - findPosX( bar ));
document.getElementById( 'main_slider_point' ).style.left = slider_position+"px";
slider_seek( e, bar );
}
}
/**********************************************************************
* Misc utils
*********************************************************************/
......@@ -277,6 +325,10 @@ function volume_up()
{
loadXMLDoc( 'requests/status.xml?command=volume&val=%2B20', parse_status );
}
function seek( pos )
{
loadXMLDoc( 'requests/status.xml?command=seek&val='+pos, parse_status );
}
function fullscreen()
{
loadXMLDoc( 'requests/status.xml?command=fullscreen', parse_status );
......@@ -302,21 +354,41 @@ function parse_status()
{
var status = req.responseXML.documentElement;
var new_time = status.getElementsByTagName( 'time' )[0].firstChild.data;
var length = status.getElementsByTagName( 'length' )[0].firstChild.data;
var slider_position;
if( length < 100 )
{
slider_position = ( status.getElementsByTagName( 'position' )[0]
.firstChild.data * 4 ) + "px";
}
else
{
/* this is more precise if length > 100 */
slider_position = Math.floor( ( new_time * 400 ) / length ) + "px";
}
if( old_time > new_time )
setTimeout('update_playlist()',50);
old_time = new_time;
set_text( 'time', format_time( new_time ) );
set_text( 'length', format_time( status.getElementsByTagName( 'length' )[0].firstChild.data ) );
set_text( 'length', format_time( length ) );
if( status.getElementsByTagName( 'volume' ).length != 0 )
set_text( 'volume', Math.floor(status.getElementsByTagName( 'volume' )[0].firstChild.data/5.12)+'%' );
set_text( 'state', status.getElementsByTagName( 'state' )[0].firstChild.data );
if( slider_mouse_down == 0 )
{
document.getElementById( 'main_slider_point' ).style.left = slider_position;
}
if( status.getElementsByTagName( 'state' )[0].firstChild.data == "playing" )
{
document.getElementById( 'btn_pause_img' ).setAttribute( 'src', 'images/pause.png' );
document.getElementById( 'btn_pause_img' ).setAttribute( 'alt', 'Pause' );
document.getElementById( 'btn_pause' ).setAttribute( 'title', 'Pause' );
}
else
{
document.getElementById( 'btn_pause_img' ).setAttribute( 'src', 'images/play.png' );
document.getElementById( 'btn_pause_img' ).setAttribute( 'alt', 'Play' );
document.getElementById( 'btn_pause' ).setAttribute( 'title', 'Play' );
}
}
else
......
share/http/requests/status.xml
View file @ 4348289a
......@@ -83,6 +83,9 @@
<vlc id="if" param1="command value 'volume' strcmp 0 =" />
<vlc id="rpn" param1="val value vlc_volume_set" />
<vlc id="end"/>
<vlc id="if" param1="command value 'seek' strcmp 0 =" />
<vlc id="rpn" param1="val value vlc_seek" />
<vlc id="end"/>
<vlc id="end" />
<root>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment