]> git.sesse.net Git - vlc/blob - share/http/js/functions.js
Reimplement [14768] with a CSS. Patch by Laurent Mutricy.
[vlc] / share / http / js / functions.js
1 /*****************************************************************************
2  * functions.js: VLC media player web interface
3  *****************************************************************************
4  * Copyright (C) 2005-2006 the VideoLAN team
5  * $Id$
6  *
7  * Authors: Antoine Cellerier <dionoea -at- videolan -dot- org>
8  *
9  * This program is free software; you can redistribute it and/or modify
10  * it under the terms of the GNU General Public License as published by
11  * the Free Software Foundation; either version 2 of the License, or
12  * (at your option) any later version.
13  *
14  * This program is distributed in the hope that it will be useful,
15  * but WITHOUT ANY WARRANTY; without even the implied warranty of
16  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
17  * GNU General Public License for more details.
18  *
19  * You should have received a copy of the GNU General Public License
20  * along with this program; if not, write to the Free Software
21  * Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111, USA.
22  *****************************************************************************/
23
24 /**********************************************************************
25  * Global variables
26  *********************************************************************/
27
28 var old_time = 0;
29 var pl_cur_id;
30
31 /**********************************************************************
32  * Slider functions
33  *********************************************************************/
34  
35 var slider_mouse_down = 0;
36 var slider_dx = 0;
37
38 /* findPosX() from http://www.quirksmode.rg/js/indpos.html */
39 function findPosX(obj)
40 {
41     var curleft = 0;
42     if (obj.offsetParent)
43     {
44         while (obj.offsetParent)
45         {
46             curleft += obj.offsetLeft
47             obj = obj.offsetParent;
48         }
49     }
50     else if (obj.x)
51         curleft += obj.x;
52     return curleft;
53 }
54
55 function slider_seek( e, bar )
56 {
57     seek(Math.floor(( e.clientX + document.body.scrollLeft - findPosX( bar )) / 4)+"%25");
58 }
59 function slider_down( e, point )
60 {
61     slider_mouse_down = 1;
62     slider_dx = e.clientX - findPosX( point );
63 }
64 function slider_up( e, bar )
65 {
66     slider_mouse_down = 0;
67     /* slider_seek( e, bar ); */
68 }
69 function slider_move( e, bar )
70 {
71     if( slider_mouse_down == 1 )
72     {
73         var slider_position  = Math.floor( e.clientX - slider_dx + document.body.scrollLeft - findPosX( bar ));
74         document.getElementById( 'main_slider_point' ).style.left = slider_position+"px";
75         slider_seek( e, bar );
76     }
77 }
78
79 /**********************************************************************
80  * Misc utils
81  *********************************************************************/
82
83 /* XMLHttpRequest wrapper */
84 function loadXMLDoc( url, callback )
85 {
86   // branch for native XMLHttpRequest object
87   if ( window.XMLHttpRequest )
88   {
89     req = new XMLHttpRequest();
90     req.onreadystatechange = callback;
91     req.open( "GET", url, true );
92     req.send( null );
93   // branch for IE/Windows ActiveX version
94   }
95   else if ( window.ActiveXObject )
96   {
97     req = new ActiveXObject( "Microsoft.XMLHTTP" );
98     if ( req )
99     {
100       req.onreadystatechange = callback;
101       req.open( "GET", url, true );
102       req.send();
103     }
104   }
105 }
106
107 /* fomat time in second as hh:mm:ss */
108 function format_time( s )
109 {
110     var hours = Math.floor(s/3600);
111     var minutes = Math.floor((s/60)%60);
112     var seconds = Math.floor(s%60);
113     if( hours < 10 ) hours = "0"+hours;
114     if( minutes < 10 ) minutes = "0"+minutes;
115     if( seconds < 10 ) seconds = "0"+seconds;
116     return hours+":"+minutes+":"+seconds;
117 }
118
119 /* delete all a tag's children and add a text child node */
120 function set_text( id, val )
121 {
122     var elt = document.getElementById( id );
123     while( elt.hasChildNodes() )
124         elt.removeChild( elt.firstChild );
125     elt.appendChild( document.createTextNode( val ) );
126 }
127
128 /* set item's 'element' attribute to value */
129 function set_css( item, element, value )
130 {
131     for( var j = 0; j < document.styleSheets.length; j++ )
132     {
133         cssRules = document.styleSheets[j].cssRules;
134         for( var i = 0; i < cssRules.length; i++)
135         {
136             if( cssRules[i].selectorText == item )
137             {
138                 cssRules[i].style.setProperty( element, value, null );
139                 return;
140             }
141         }
142     }
143 }
144
145 /* get item's 'element' attribute */
146 function get_css( item, element )
147 {
148     for( var j = 0; j < document.styleSheets.length; j++ )
149     {
150         cssRules = document.styleSheets[j].cssRules;
151         for( var i = 0; i < cssRules.length; i++)
152         {
153             if( cssRules[i].selectorText == item )
154             {
155                 return cssRules[i].style.getPropertyValue( element );
156             }
157         }
158     }
159 }
160
161 function toggle_show( id )
162 {
163     var element = document.getElementById( id );
164     if( element.style.display == 'block' || element.style.display == '' )
165     {
166         element.style.display = 'none';
167     }
168     else
169     {
170         element.style.display = 'block';
171     }
172 }
173 function toggle_show_node( id )
174 {
175     var element = document.getElementById( 'pl_'+id );
176     var img = document.getElementById( 'pl_img_'+id );
177     if( element.style.display == 'block' || element.style.display == '' )
178     {
179         element.style.display = 'none';
180         img.setAttribute( 'src', 'images/plus.png' );
181         img.setAttribute( 'alt', '[+]' );
182     }
183     else
184     {
185         element.style.display = 'block';
186         img.setAttribute( 'src', 'images/minus.png' );
187         img.setAttribute( 'alt', '[-]' );
188     }
189 }
190
191 function show( id ){ document.getElementById( id ).style.display = 'block'; }
192
193 function hide( id ){ document.getElementById( id ).style.display = 'none'; }
194
195 function checked( id ){ return document.getElementById( id ).checked; }
196
197 function value( id ){ return document.getElementById( id ).value; }
198
199 function radio_value( name )
200 {
201     var radio = document.getElementsByName( name );
202     for( var i = 0; i < radio.length; i++ )
203     {
204         if( radio[i].checked )
205         {
206             return radio[i].value;
207         }
208     }
209     return "";
210 }
211
212 function check_and_replace_int( id, val )
213 {
214     var objRegExp = /^\d\d*$/;
215     if( value( id ) != ''
216         && ( !objRegExp.test( value( id ) )
217              || parseInt( value( id ) ) < 1 ) )
218         document.getElementById( id ).value = val;
219 }
220
221 function addslashes( str ){ return str.replace(/\'/g, '\\\''); }
222 function escapebackslashes( str ){ return str.replace(/\\[^']/g, '\\\\'); }
223
224 function disable( id ){ document.getElementById( id ).disabled = true; }
225
226 function enable( id ){ document.getElementById( id ).disabled = false; }
227
228 function button_over( element ){ element.style.border = "1px solid #000"; }
229
230 function button_out( element ){ element.style.border = "1px solid #fff"; }
231
232 /* toggle show help under the buttons */
233 function toggle_btn_text()
234 {
235     if( get_css( '.btn_text', 'display' ) == 'none' )
236     {
237         set_css( '.btn_text', 'display', 'block' );
238     }
239     else
240     {
241         set_css( '.btn_text', 'display', 'none' );
242     }
243 }
244
245 function clear_children( elt )
246 {   
247     if( elt )
248         while( elt.hasChildNodes() )
249             elt.removeChild( elt.firstChild );
250 }
251
252 /**********************************************************************
253  * Interface actions
254  *********************************************************************/
255 /* input actions */
256 function in_play()
257 {
258     var input = value('input_mrl');
259     if( value('sout_mrl') != '' )
260         input += ' '+value('sout_mrl');
261     var url = 'requests/status.xml?command=in_play&input='+escape( input );
262     loadXMLDoc( url, parse_status );
263     setTimeout( 'update_playlist()', 1000 );
264 }
265 function in_enqueue()
266 {
267     var input = value('input_mrl');
268     if( value('sout_mrl') != '' )
269         input += ' '+value('sout_mrl');
270     var url = 'requests/status.xml?command=in_enqueue&input='+escape( input );
271     loadXMLDoc( url, parse_status );
272     setTimeout( 'update_playlist()', 1000 );
273 }
274
275 /* playlist actions */
276 function pl_play( id )
277 {
278     loadXMLDoc( 'requests/status.xml?command=pl_play&id='+id, parse_status );
279     pl_cur_id = id;
280     setTimeout( 'update_playlist()', 1000 );
281 }
282 function pl_pause()
283 {
284     loadXMLDoc( 'requests/status.xml?command=pl_pause&id='+pl_cur_id, parse_status );
285 }
286 function pl_stop()
287 {
288     loadXMLDoc( 'requests/status.xml?command=pl_stop', parse_status );
289     setTimeout( 'update_playlist()', 1000 );
290 }
291 function pl_next()
292 {
293     loadXMLDoc( 'requests/status.xml?command=pl_next', parse_status );
294     setTimeout( 'update_playlist()', 1000 );
295 }
296 function pl_previous()
297 {
298     loadXMLDoc( 'requests/status.xml?command=pl_previous', parse_status );
299     setTimeout( 'update_playlist()', 1000 );
300 }
301 function pl_delete( id )
302 {
303     loadXMLDoc( 'requests/status.xml?command=pl_delete&id='+id, parse_status );
304     setTimeout( 'update_playlist()', 1000 );
305 }
306 function pl_empty()
307 {
308     loadXMLDoc( 'requests/status.xml?command=pl_empty', parse_status );
309     setTimeout( 'update_playlist()', 1000 );
310 }
311 function pl_sort()
312 {
313     /* FIXME */
314     loadXMLDoc( 'requests/status.xml?command=pl_sort', parse_status );
315     setTimeout( 'update_playlist()', 1000 );
316 }
317 function pl_shuffle()
318 {
319     loadXMLDoc( 'requests/status.xml?command=pl_random', parse_status );
320     setTimeout( 'update_playlist()', 1000 );
321 }
322 function pl_loop()
323 {
324     loadXMLDoc( 'requests/status.xml?command=pl_loop', parse_status );
325 }
326 function pl_repeat()
327 {
328     loadXMLDoc( 'requests/status.xml?command=pl_repeat', parse_status );
329 }
330
331 /* misc actions */
332 function volume_down()
333 {
334     loadXMLDoc( 'requests/status.xml?command=volume&val=-20', parse_status );
335 }
336 function volume_up()
337 {
338     loadXMLDoc( 'requests/status.xml?command=volume&val=%2B20', parse_status );
339 }
340 function seek( pos )
341 {
342     loadXMLDoc( 'requests/status.xml?command=seek&val='+pos, parse_status );
343 }
344 function fullscreen()
345 {
346     loadXMLDoc( 'requests/status.xml?command=fullscreen', parse_status );
347 }
348 function update_status()
349 {
350     loadXMLDoc( 'requests/status.xml', parse_status );
351 }
352 function update_playlist()
353 {
354     loadXMLDoc( 'requests/playlist.xml', parse_playlist );
355 }
356
357 /**********************************************************************
358  * Parse xml replies to XMLHttpRequests
359  *********************************************************************/
360 /* parse request/status.xml */
361 function parse_status()
362 {
363     if( req.readyState == 4 )
364     {
365         if( req.status == 200 )
366         {
367             var status = req.responseXML.documentElement;
368             var timetag = status.getElementsByTagName( 'time' );
369             if( timetag.length > 0 )
370             {
371                 var new_time = timetag[0].firstChild.data;
372             }
373             else
374             {
375                 new_time = old_time;
376             }
377             var lengthtag = status.getElementsByTagName( 'length' );
378             var length;
379             if( lengthtag.length > 0 )
380             {
381                 length = lengthtag[0].firstChild.data;
382             }
383             else
384             {
385                 length = 0;
386             }
387             var slider_position;
388             positiontag = status.getElementsByTagName( 'position' );
389             if( length < 100 && positiontag.length > 0 )
390             {
391                 slider_position = ( positiontag[0].firstChild.data * 4 ) + "px";
392             }
393             else if( length > 0 )
394             {
395                 /* this is more precise if length > 100 */
396                 slider_position = Math.floor( ( new_time * 400 ) / length ) + "px";
397             }
398             else
399             {
400                 slider_position = 0;
401             }
402             if( old_time > new_time )
403                 setTimeout('update_playlist()',50);
404             old_time = new_time;
405             set_text( 'time', format_time( new_time ) );
406             set_text( 'length', format_time( length ) );
407             if( status.getElementsByTagName( 'volume' ).length != 0 )
408                 set_text( 'volume', Math.floor(status.getElementsByTagName( 'volume' )[0].firstChild.data/5.12)+'%' );
409             var statetag = status.getElementsByTagName( 'state' );
410             if( statetag.length > 0 )
411             {
412                 set_text( 'state', statetag[0].firstChild.data );
413             }
414             else
415             {
416                 set_text( 'state', '(?)' );
417             }
418             if( slider_mouse_down == 0 )
419             {
420                 document.getElementById( 'main_slider_point' ).style.left = slider_position;
421             }
422             var statustag = status.getElementsByTagName( 'state' );
423             if( statustag.length > 0 ? statustag[0].firstChild.data == "playing" : 0 )
424             {
425                 document.getElementById( 'btn_pause_img' ).setAttribute( 'src', 'images/pause.png' );
426                 document.getElementById( 'btn_pause_img' ).setAttribute( 'alt', 'Pause' );
427                 document.getElementById( 'btn_pause' ).setAttribute( 'title', 'Pause' );
428             }
429             else
430             {
431                 document.getElementById( 'btn_pause_img' ).setAttribute( 'src', 'images/play.png' );
432                 document.getElementById( 'btn_pause_img' ).setAttribute( 'alt', 'Play' );
433                 document.getElementById( 'btn_pause' ).setAttribute( 'title', 'Play' );
434             }
435
436             if( status.getElementsByTagName( 'random' )[0].firstChild.data == "1" )
437                 document.getElementById( 'btn_shuffle').setAttribute( 'class', 'on' );
438             else
439                 document.getElementById( 'btn_shuffle').setAttribute( 'class', 'off' );
440             if( status.getElementsByTagName( 'loop' )[0].firstChild.data == "1" )
441                 document.getElementById( 'btn_loop').setAttribute( 'class', 'on' );
442             else
443                 document.getElementById( 'btn_loop').setAttribute( 'class', 'off' );
444             if( status.getElementsByTagName( 'repeat' )[0].firstChild.data == "1" )
445                 document.getElementById( 'btn_repeat').setAttribute( 'class', 'on' );
446             else
447                 document.getElementById( 'btn_repeat').setAttribute( 'class', 'off' );
448
449             var tree = document.createElement( "ul" );
450             var categories = status.getElementsByTagName( 'category' );
451             var i;
452             for( i = 0; i < categories.length; i++ )
453             {
454                 var item = document.createElement( "li" );
455                 item.appendChild( document.createTextNode( categories[i].getAttribute( 'name' ) ) );
456                 var subtree = document.createElement( "dl" );
457                 var infos = categories[i].getElementsByTagName( 'info' );
458                 var j;
459                 for( j = 0; j < infos.length; j++ )
460                 {
461                     var subitem = document.createElement( "dt" );
462                     subitem.appendChild( document.createTextNode( infos[j].getAttribute( 'name' ) ) );
463                     subtree.appendChild( subitem );
464                     if( infos[j].hasChildNodes() )
465                     {
466                         var subitem = document.createElement( "dd" );
467                         subitem.appendChild( document.createTextNode( infos[j].firstChild.data ) );
468                         subtree.appendChild( subitem );
469                     }
470                 }
471                 item.appendChild( subtree );
472                 tree.appendChild( item );
473             }
474             var infotree = document.getElementById('infotree' );
475             clear_children( infotree );
476             infotree.appendChild( tree );
477             
478         }
479         else
480         {
481             /*alert( 'Error! HTTP server replied: ' + req.status );*/
482         }
483     }
484 }
485
486 /* parse playlist.xml */
487 function parse_playlist()
488 {
489     if( req.readyState == 4 )
490     {
491         if( req.status == 200 )
492         {
493             var answer = req.responseXML.documentElement;
494             var playtree = document.getElementById( 'playtree' );
495             var pos = document.createElement( "div" );
496             var pos_top = pos;
497             var elt = answer.firstChild;
498             
499             pl_cur_id = 0;  /* changed to the current id is there actually
500                              * is a current id */
501             while( elt )
502             {
503                 if( elt.nodeName == "node" )
504                 {
505                     if( pos.hasChildNodes() )
506                         pos.appendChild( document.createElement( "br" ) );
507                     var nda = document.createElement( 'a' );
508                     nda.setAttribute( 'href', 'javascript:toggle_show_node(\''+elt.getAttribute( 'id' )+'\');' );
509                     var ndai = document.createElement( 'img' );
510                     ndai.setAttribute( 'src', 'images/minus.png' );
511                     ndai.setAttribute( 'alt', '[-]' );
512                     ndai.setAttribute( 'id', 'pl_img_'+elt.getAttribute( 'id' ) );
513                     nda.appendChild( ndai );
514                     pos.appendChild( nda );
515                     pos.appendChild( document.createTextNode( ' ' + elt.getAttribute( 'name' ) ) );
516                     var nd = document.createElement( "div" );
517                     nd.setAttribute( 'class', 'pl_node' );
518                     nd.setAttribute( 'id', 'pl_'+elt.getAttribute( 'id' ) );
519                     pos.appendChild( nd );
520                 }
521                 else if( elt.nodeName == "leaf" )
522                 {
523                     if( pos.hasChildNodes() )
524                     pos.appendChild( document.createElement( "br" ) );
525                     var pl = document.createElement( "a" );
526                     pl.setAttribute( 'class', 'pl_leaf' );
527                     pl.setAttribute( 'href', 'javascript:pl_play('+elt.getAttribute( 'id' )+');' );
528                     pl.setAttribute( 'id', 'pl_'+elt.getAttribute( 'id' ) );
529                     if( elt.getAttribute( 'current' ) == 'current' )
530                     {
531                         pl.setAttribute( 'style', 'font-weight: bold;' );
532                         var nowplaying = document.getElementById( 'nowplaying' );
533                         clear_children( nowplaying );
534                         nowplaying.appendChild( document.createTextNode( elt.getAttribute( 'name' ) ) );
535                         pl.appendChild( document.createTextNode( '* '));
536                         pl_cur_id = elt.getAttribute( 'id' );
537                     }
538                     pl.setAttribute( 'title', elt.getAttribute( 'uri' ));
539                     pl.appendChild( document.createTextNode( elt.getAttribute( 'name' ) ) );
540                     pos.appendChild( pl );
541                     pos.appendChild( document.createTextNode( ' ' ) );
542
543                     var del = document.createElement( "a" );
544                     del.setAttribute( 'href', 'javascript:pl_delete('+elt.getAttribute( 'id' )+')' );
545                       var delimg = document.createElement( "img" );
546                       delimg.setAttribute( 'src', 'images/delete_small.png' );
547                       delimg.setAttribute( 'alt', '(delete)' );
548                     del.appendChild( delimg );
549                     pos.appendChild( del );
550                 }
551                 if( elt.firstChild )
552                 {
553                     elt = elt.firstChild;
554                     pos = pos.lastChild;
555                 }
556                 else if( elt.nextSibling )
557                 {
558                     elt = elt.nextSibling;
559                     pos = pos;
560                 }
561                 else
562                 {
563                     while( ! elt.parentNode.nextSibling )
564                     {
565                         elt = elt.parentNode;
566                         if( ! elt.parentNode ) break;
567                     }
568                     if( ! elt.parentNode ) break;
569                     elt = elt.parentNode.nextSibling;
570                     pos = pos.parentNode;
571                 }
572             }
573             clear_children( playtree );
574             playtree.appendChild( pos_top );
575         }
576         else
577         {
578             /*alert( 'Error! HTTP server replied: ' + req.status );*/
579         }
580     }
581 }
582
583 /* parse browse.xml */
584 function parse_browse_dir( )
585 {
586     if( req.readyState == 4 )
587     {
588         if( req.status == 200 )
589         {
590             var answer = req.responseXML.documentElement;
591             if( !answer ) return;
592             var browser = document.getElementById( 'browser' );
593             var pos = document.createElement( "div" );
594             var elt = answer.firstChild;
595             while( elt )
596             {
597                 if( elt.nodeName == "element" )
598                 {
599                     var item = document.createElement( "a" );
600                     item.setAttribute( 'class', 'browser' );
601                     if( elt.getAttribute( 'type' ) == 'directory' )
602                     {
603                         item.setAttribute( 'href', 'javascript:browse_dir(\''+escapebackslashes(addslashes(elt.getAttribute( 'path' )))+'\');');
604                     }
605                     else
606                     {
607                         item.setAttribute( 'href', 'javascript:browse_path(\''+escapebackslashes(addslashes(elt.getAttribute( 'path' )))+'\');' );
608                     }
609                     item.appendChild( document.createTextNode( elt.getAttribute( 'name' ) ) );
610                     pos.appendChild( item );
611                     if( elt.getAttribute( 'type' ) == 'directory' )
612                     {
613                         pos.appendChild( document.createTextNode( ' ' ) );
614                         var item = document.createElement( "a" );
615                         item.setAttribute( 'class', 'browser' );
616                         item.setAttribute( 'href', 'javascript:browse_path(\''+escapebackslashes(addslashes(elt.getAttribute( 'path' )))+'\');');
617                         item.appendChild( document.createTextNode( '(select)' ) );
618                         pos.appendChild( item );
619                     }
620                     pos.appendChild( document.createElement( "br" ) );
621                 }
622                 elt = elt.nextSibling;
623             }
624             clear_children( browser );
625             browser.appendChild( pos );
626         }
627         else
628         {
629             /*alert( 'Error! HTTP server replied: ' + req.status );*/
630         }
631     }
632 }
633
634 /**********************************************************************
635  * Input dialog functions
636  *********************************************************************/
637 function hide_input( )
638 {
639     document.getElementById( 'input_file' ).style.display = 'none';
640     document.getElementById( 'input_disc' ).style.display = 'none';
641     document.getElementById( 'input_network' ).style.display = 'none';
642 }
643
644 /* update the input MRL using data from the input file helper */
645 /* FIXME ... subs support */
646 function update_input_file()
647 {
648     var mrl = document.getElementById( 'input_mrl' );
649
650     mrl.value = value( 'input_file_filename' );
651 }
652
653 /* update the input MRL using data from the input disc helper */
654 function update_input_disc()
655 {
656     var mrl = document.getElementById( 'input_mrl' );
657     var type = radio_value( "input_disc_type" );
658     var device = value( "input_disc_dev" );
659
660     check_and_replace_int( 'input_disc_title', 0 );
661     check_and_replace_int( 'input_disc_chapter', 0 );
662     check_and_replace_int( 'input_disc_subtrack', '' );
663     check_and_replace_int( 'input_disc_audiotrack', 0 );
664
665     var title = value( 'input_disc_title' );
666     var chapter = value( 'input_disc_chapter' );
667     var subs = value( 'input_disc_subtrack' );
668     var audio = value( 'input_disc_audiotrack' );
669
670     mrl.value = "";
671
672     if( type == "dvd" )
673     {
674         mrl.value += "dvd://";
675     }
676     else if( type == "dvdsimple" )
677     {
678         mrl.value += "dvdsimple://";
679     }
680     else if( type == "vcd" )
681     {
682         mrl.value += "vcd://";
683     }
684     else if( type == "cdda" )
685     {
686         mrl.value += "cdda://";
687     }
688
689     mrl.value += device;
690
691     if( title )
692     {
693         mrl.value += "@"+title;
694         if( chapter && type != "cdda" )
695             mrl.value += ":"+chapter;
696     }
697
698     if( type != "cdda" )
699     {
700         if( subs != '' )
701             mrl.value += " :sub-track="+subs;
702         if( audio != '' )
703             mrl.value += " :audio-track="+audio;
704     }
705
706 }
707
708 /* update the input MRL using data from the input network helper */
709 function update_input_net()
710 {
711     var mrl = document.getElementById( 'input_mrl' );
712     var type = radio_value( "input_net_type" );
713     
714     check_and_replace_int( 'input_net_udp_port', 1234 );
715     check_and_replace_int( 'input_net_udpmcast_port', 1234 );
716
717     mrl.value = "";
718
719     if( type == "udp" )
720     {
721         mrl.value += "udp://";
722         if( checked( 'input_net_udp_forceipv6' ) )
723             mrl.value += "[::]";
724         if( value( 'input_net_udp_port' ) )
725             mrl.value += ":"+value( 'input_net_udp_port' );
726     }
727     else if( type == "udpmcast" )
728     {
729         mrl.value += "udp://@"+value( 'input_net_udpmcast_address');
730         if( value( 'input_net_udpmcast_port' ) )
731             mrl.value += ":"+value( 'input_net_udpmcast_port' );
732     }
733     else if( type == "http" )
734     {
735         var url = value( 'input_net_http_url' );
736         if( url.substring(0,7) != "http://"
737             && url.substring(0,8) != "https://"
738             && url.substring(0,6) != "ftp://"
739             && url.substring(0,6) != "mms://"
740             && url.substring(0,7) != "mmsh://" )
741             mrl.value += "http://";
742         mrl.value += url;
743     }
744     else if( type == "rtsp" )
745     {
746         var url = value( 'input_net_rtsp_url' );
747         if( url.substring(0,7) != "rtsp://" )
748             mrl.value += "rtsp://";
749         mrl.value += url;
750     }
751
752     if( checked( "input_net_timeshift" ) )
753         mrl.value += " :access-filter=timeshift";
754 }
755
756 /**********************************************************************
757  * Sout dialog functions
758  *********************************************************************/
759 /* toggle show the full sout interface */
760 function toggle_show_sout_helper()
761 {
762     var element = document.getElementById( "sout_helper" );
763     if( element.style.display == 'block' )
764     {
765         element.style.display = 'none';
766         document.getElementById( "sout_helper_toggle" ).value = 'Full sout interface';
767     }
768     else
769     {
770         element.style.display = 'block';
771         document.getElementById( "sout_helper_toggle" ).value = 'Hide sout interface';
772     }
773 }
774
775 /* update the sout MRL using data from the sout_helper */
776 function update_sout()
777 {
778     var mrl = document.getElementById( 'sout_mrl' );
779     mrl.value = "";
780
781     check_and_replace_int( 'sout_http_port', 8080 );
782     check_and_replace_int( 'sout_mmsh_port', 8080 );
783     check_and_replace_int( 'sout_rtp_port', 1234 );
784     check_and_replace_int( 'sout_udp_port', 1234 );
785     check_and_replace_int( 'sout_ttl', 1 );
786
787     if( checked( 'sout_soverlay' ) )
788     {
789         disable( 'sout_scodec' );
790         disable( 'sout_sub' );
791     }
792     else
793     {
794         enable( 'sout_scodec' );
795         enable( 'sout_sub' );
796     }
797
798     var transcode =  checked( 'sout_vcodec_s' ) || checked( 'sout_acodec_s' )
799                   || checked( 'sout_sub' )      || checked( 'sout_soverlay' );
800
801     if( transcode )
802     {
803         mrl.value += ":sout=#transcode{";
804         var alot = false; /* alot == at least one transcode */
805         if( checked( 'sout_vcodec_s' ) )
806         {
807             mrl.value += "vcodec="+value( 'sout_vcodec' )+",vb="+value( 'sout_vb' )+",scale="+value( 'sout_scale' );
808             alot = true;
809         }
810         if( checked( 'sout_acodec_s' ) )
811         {
812             if( alot ) mrl.value += ",";
813             mrl.value += "acodec="+value( 'sout_acodec' )+",ab="+value( 'sout_ab' );
814             if( value( 'sout_channels' ) )
815                 mrl.value += ",channels="+value( 'sout_channels' );
816             alot = true;
817         }
818         if( checked( 'sout_soverlay' ) )
819         {
820             if( alot ) mrl.value += ",";
821             mrl.value += "soverlay";
822             alot = true;
823         }
824         else if( checked( 'sout_sub' ) )
825         {
826             if( alot ) mrl.value += ",";
827             mrl.value += "scodec="+value( 'sout_scodec' );
828             alot = true;
829         }
830         mrl.value += "}";
831     }
832
833     var output = checked( 'sout_display' ) + checked( 'sout_file' )
834                + checked( 'sout_http' )    + checked( 'sout_mmsh' )
835                + checked( 'sout_rtp' )     + checked( 'sout_udp' );
836
837     if( output )
838     {
839         if( transcode )
840             mrl.value += ":";
841         else
842             mrl.value += ":sout=#";
843         var aloo = false; /* aloo == at least one output */
844         var mux = radio_value( 'sout_mux' );
845         var ttl = parseInt( value( 'sout_ttl' ) );
846         if( output > 1 ) mrl.value += "duplicate{";
847         if( checked( 'sout_display' ) )
848         {
849             if( output > 1 ) mrl.value += "dst="
850             mrl.value += "display";
851             aloo = true;
852         }
853         if( checked( 'sout_file' ) )
854         {
855             if( aloo ) mrl.value += ",";
856             if( output > 1 ) mrl.value += "dst="
857             mrl.value += "std{access=file,mux="+mux+",dst="+value( 'sout_file_filename' )+"}";
858             aloo = true;
859         }
860         if( checked( 'sout_http' ) )
861         {
862             if( aloo ) mrl.value += ",";
863             if( output > 1 ) mrl.value += "dst="
864             mrl.value += "std{access=http,mux="+mux+",dst="+value( 'sout_http_addr' );
865             if( value( 'sout_http_port' ) )
866                 mrl.value += ":"+value( 'sout_http_port' );
867             mrl.value += "}";
868             aloo = true;
869         }
870         if( checked( 'sout_mmsh' ) )
871         {
872             if( aloo ) mrl.value += ",";
873             if( output > 1 ) mrl.value += "dst="
874             mrl.value += "std{access=mmsh,mux="+mux+",dst="+value( 'sout_mmsh_addr' );
875             if( value( 'sout_mmsh_port' ) )
876                 mrl.value += ":"+value( 'sout_mmsh_port' );
877             mrl.value += "}";
878             aloo = true;
879         }
880         if( checked( 'sout_rtp' ) )
881         {
882             if( aloo ) mrl.value += ",";
883             if( output > 1 ) mrl.value += "dst="
884             mrl.value += "std{access=rtp";
885             if( ttl ) mrl.value += "{ttl="+ttl+"}";
886             mrl.value += ",mux="+mux+",dst="+value( 'sout_rtp_addr' );
887             if( value( 'sout_rtp_port' ) )
888                 mrl.value += ":"+value( 'sout_rtp_port' );
889             if( checked( 'sout_sap' ) )
890             {
891                 mrl.value += ",sap";
892                 if( value( 'sout_sap_group' ) != '' )
893                 {
894                     mrl.value += ",group=\""+value( 'sout_sap_group' )+"\"";
895                 }
896                 mrl.value += ",name=\""+value( 'sout_sap_name' )+"\"";
897             }
898             mrl.value += "}";
899             aloo = true;
900         }
901         if( checked( 'sout_udp' ) )
902         {
903             if( aloo ) mrl.value += ",";
904             if( output > 1 ) mrl.value += "dst="
905             mrl.value += "std{access=udp";
906             if( ttl ) mrl.value += "{ttl="+ttl+"}";
907             mrl.value += ",mux="+mux+",dst="+value( 'sout_udp_addr' );
908             if( value('sout_udp_port' ) )
909                 mrl.value += ":"+value( 'sout_udp_port' );
910             if( checked( 'sout_sap' ) )
911             {
912                 mrl.value += ",sap";
913                 if( value( 'sout_sap_group' ) != '' )
914                 {
915                     mrl.value += ",group=\""+value( 'sout_sap_group' )+"\"";
916                 }
917                 mrl.value += ",name=\""+value( 'sout_sap_name' )+"\"";
918             }
919             mrl.value += "}";
920             aloo = true;
921         }
922         if( output > 1 ) mrl.value += "}";
923     }
924
925     if( ( transcode || output ) && checked( 'sout_all' ) )
926         mrl.value += " :sout-all";
927 }
928
929 /* reset sout mrl value */
930 function reset_sout()
931 {
932     document.getElementById('sout_mrl').value = value('sout_old_mrl');
933 }
934
935 /* save sout mrl value */
936 function save_sout()
937 {
938     document.getElementById('sout_old_mrl').value = value('sout_mrl');
939 }
940
941 /**********************************************************************
942  * Browser dialog functions
943  *********************************************************************/
944 /* only browse() should be called directly */
945 function browse( dest )
946 {
947     document.getElementById( 'browse_dest' ).value = dest;
948     document.getElementById( 'browse_lastdir' ).value;
949     browse_dir( document.getElementById( 'browse_lastdir' ).value );
950     show( 'browse' );
951 }
952 function browse_dir( dir )
953 {
954     document.getElementById( 'browse_lastdir' ).value = dir;
955     loadXMLDoc( 'requests/browse.xml?dir='+escape(dir), parse_browse_dir );
956 }
957 function browse_path( p )
958 {
959     document.getElementById( value( 'browse_dest' ) ).value = p;
960     hide( 'browse' );
961     document.getElementById( value( 'browse_dest' ) ).focus();
962 }
963
964 /**********************************************************************
965  * Periodically update stuff in the interface
966  *********************************************************************/
967 function loop_refresh_status()
968 {
969     setTimeout( 'loop_refresh_status()', 1000 );
970     update_status();
971 }
972 function loop_refresh_playlist()
973 {
974     /* setTimeout( 'loop_refresh_playlist()', 10000 ); */
975     update_playlist();
976 }
977 function loop_refresh()
978 {
979     setTimeout( 'loop_refresh_status()', 1 );
980     setTimeout( 'loop_refresh_playlist()', 1 );
981 }
982