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