* STREAM: Add embed player of playback (selectable widget)

* GRAB: Check range of parameter width/height
* HTTPD: Some times missing footer
* EPG: display deliver channelid for stream
* Skins: remove skin.cfg / global.playbackmode
* Skins: add skin.cfg / global.preferedlocal as default button for Switch inside VDR or web cast
* Skins: format images to common size
* Skins: Add more images (mute,loud,quiet)
* Skins: Player with selectable widget (vlc/default media)

4 files changed, 188 insertions, 32 deletions

diff --git a/html/program.tmpl b/html/program.tmpl
index 195fdb8..8fe07b1 100644
--- a/html/program.tmpl
+++ b/html/program.tmpl
@@ -36,7 +36,7 @@
 </form>
     <td>
         <a href='?cmd=switch&amp;data=<?% channelpos %?>'>[<?% gettext('Switch') %?>]</a>
-        <a href='?cmd=livestream&amp;data=<?% channelpos %?>' type='audio/x-mpegurl'>[<?% gettext('Livestream') %?>]</a>
+        <a href='?cmd=livestream&amp;data=<?% channelpos %?>'>[<?% gettext('Live TV web cast') %?>]</a>
     </td>
 </tr>
 </table>
diff --git a/html/rdisplay.tmpl b/html/rdisplay.tmpl
index 112c447..e1833fa 100644
--- a/html/rdisplay.tmpl
+++ b/html/rdisplay.tmpl
@@ -84,7 +84,7 @@
     <a href="?cmd=redit&amp;data=<?% data.RecordId %?>">[<?% gettext("Edit recording") %?>]</a>&nbsp;
 <?% END %?>
 <?% IF allow('playrecord') %?>
-    <a href="?cmd=playrecord&amp;data=<?% data.RecordId %?>">[<?% gettext("Watch recording") %?>]</a>&nbsp;
+    <a href="?cmd=playrecord&amp;data=<?% data.RecordId %?>">[<?% gettext("Watch recording as web cast") %?>]</a>&nbsp;
 <?% END %?>
 <?% IF allow('rplay') %?>
     <a href="?cmd=rplay&amp;data=<?% data.RecordId %?>">[<?% gettext("Watch recording in VDR") %?>]</a>&nbsp;
diff --git a/html/topten.tmpl b/html/topten.tmpl
index b01c220..8ebe7f5 100644
--- a/html/topten.tmpl
+++ b/html/topten.tmpl
@@ -14,17 +14,6 @@
 <table>
 <tr>
 
-<!--
-<div id="navcontainer">
-<ul id="navlist">
-    <li><a href="#" onclick="suche('<?% gettext('Search string:') %?>', '?cmd=search&__channel=<?% channelpos %?>&data=', '<?% cgi.param('search') %?>')">
-        <?% gettext("Search on Channel") %?></a></li>
-    <li><a href='?cmd=switch&amp;data=<?% channelpos %?>'><?% gettext('Switch') %?></a></li>
-    <li><a href='?cmd=livestream&amp;data=<?% channelpos %?>' type='audio/x-mpegurl'><?% gettext('Livestream') %?></a></li>
-</ul>
-</div>
--->
-
 <table border="0" width="95%">
 <?% IF data.size %?>
     <?% fields = data.shift %?>
diff --git a/html/widgets/player.tmpl b/html/widgets/player.tmpl
index 0a4db13..d6354e8 100644
--- a/html/widgets/player.tmpl
+++ b/html/widgets/player.tmpl
@@ -1,20 +1,187 @@
-<br>
 <!-- player -->
-       <OBJECT id='mediaPlayer' width="320" height="285"
-      classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95'
-      codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
-      standby='Loading Microsoft Windows Media Player components...' type='application/x-oleobject'>
-      <param name='fileName' value="<?% data %?>">
-      <param name='animationatStart' value='true'>
-      <param name='transparentatStart' value='true'>
-      <param name='autoStart' value="true">
-      <param name='showControls' value="true">
-      <param name='loop' value="true">
-      <EMBED type='application/x-mplayer2'
-        pluginspage='http://microsoft.com/windows/mediaplayer/en/download/'
-        id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='-1'
-        bgcolor='darkblue' showcontrols="true" showtracker='-1'
-        showdisplay='0' showstatusbar='-1' videoborder3d='-1' width="320" height="285"
-        src="<?% data %?>" autostart="true" designtimesp='5311' loop="true">
-      </EMBED>
-      </OBJECT>
+<?% width = param.width %?>
+<?% height = param.height %?>
+<?% widget = param.widget %?>
+
+<?% IF info.http_useragent.match('.*MSIE.*') && !info.http_useragent.match('.*Opera.*');
+    msie = 1;
+ELSE;
+    msie = 0;
+END %?>
+
+
+
+<h1><?% param.title %?></h1>
+
+<?% IF widget == 'vlc' && !msie %?>
+
+<!-- vlc with mozilla -->
+<script language="javascript">
+<!--
+   function volume_up()
+   {
+    var previous =  document.vlc.get_volume();
+        var newvolume = previous + 10;
+    if( newvolume > 200 )  newvolume = 200;
+    document.vlc.set_volume( newvolume );
+    var volume = document.getElementById("volume_status");
+    var current =  document.vlc.get_volume();
+    volume.innerHTML = current + " %";
+   }
+
+   function volume_down()
+   {
+    var previous =  document.vlc.get_volume();
+        var newvolume = previous - 10;
+    if( newvolume < 0 )  newvolume = 0;
+    document.vlc.set_volume( newvolume );
+    var current =  document.vlc.get_volume();
+    volume.innerHTML = current + " %";
+   }
+   function status()
+   {
+        var play_status = document.getElementById("play_status");
+        play_status.innerHTML = document.vlc.isplaying() 
+          ? "<?% gettext("Playing") %?>" 
+          : "<?% gettext("Not playing") %?>";
+        setTimeout("status()", 1000 );
+   }
+//-->
+</script>
+<p align='center'>
+          <embed type="application/x-vlc-plugin"
+            pluginspage="http://www.videolan.org/vlc"
+            name="vlc"
+            autoplay="yes" loop="no" height="<?% height %?>" width="<?% width %?>"
+            target="<?% data %?>" />
+<br />
+  <input type="button" id="play" value="<?% gettext("Playback") %?>" onClick='document.vlc.play()' />
+  <input type="button" id="pause" value="<?% gettext("Pause") %?>" onClick='document.vlc.pause()' />
+  <input type="button" id="stop" value="<?% gettext("Stop") %?>" onClick='document.vlc.stop()' />
+  &nbsp;
+  <input type="button" id="quiet" value="<?% gettext("Decrease volume") %?>" onClick='volume_down()' />
+  <input type="button" id="loud" value="<?% gettext("Increase volume") %?>" onClick='volume_up()' />
+  <input type="button" id="mute" value="<?% gettext("Mute") %?>" onClick='document.vlc.mute()' />
+  &nbsp;
+  <input type="button" id="fullscreen" value="<?% gettext("Full screen") %?>" onClick='document.vlc.fullscreen()' />
+<br />
+        <table summary="">
+            <tr><td><?% gettext("Status") %?> : </td>
+                <td><span id="play_status"><?% gettext("Unknown") %?></span></td></tr>
+            <tr><td><?% gettext("Volume") %?> : </td><td><span id="volume_status"></span></td></tr>
+        </table>
+</p>
+
+<script language="javascript">
+<!--
+  var volume = document.getElementById("volume_status");
+  var current =  document.vlc.get_volume();
+  volume.innerHTML = current + " %";
+  setTimeout("status()", 1 );
+//-->
+</script>
+
+
+<?% ELSIF widget == 'vlc' %?>
+
+<!-- vlc with activeX -->
+<p align='center'>
+        <object classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8" 
+          codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
+          height="<?% height %?>" width="<?% width %?>" id="vlc" events="True">
+          <param name="Src" value="<?% data %?>" />
+          <param name="ShowDisplay" value="True" />
+          <param name="Loop" value="False" />
+          <param name="AutoPlay" value="True" />
+        </object>
+<br />
+          <input type="button" id="play" value="<?% gettext("Playback") %?>" onClick='doPlayOrPause()' />
+          <input type="button" id="pause" value="<?% gettext("Pause") %?>" onClick='doPlayOrPause()' />
+          <input type="button" id="stop" value="<?% gettext("Stop") %?>" onClick='document.vlc.stop()' />
+          &nbsp;
+          <input type="button" id="mute" value="<?% gettext("Mute") %?>" onClick='document.vlc.toggleMute()' />
+<br />
+          <table summary="">
+            <tr><td><?% gettext("Status") %?> : </td>
+                <td><span id="play_status"><?% gettext("Unknown") %?></span></td></tr>
+          </table>
+</p>
+
+<script LANGUAGE="JScript">
+<!--
+var sliderTimerId = 0;
+
+function onPlay() {
+    document.getElementById("play_status").value = "<?% gettext("Playing") %?>";
+};
+function onPause() {
+    document.getElementById("play_status").value = "<?% gettext("Paused") %?>";
+};
+function onStop() {
+    document.getElementById("play_status").value = "<?% gettext("Not playing") %?>";
+};
+
+function doUpdate() {
+    if( vlc.Playing ) {
+        sliderTimerId = setTimeout("doUpdate()", 1000);
+    }
+    else {
+        onStop();
+        sliderTimerId = 0;
+    }
+};
+
+function doPlayOrPause() {
+    if( document.vlc.playing ) {
+        document.vlc.pause();
+    }
+    else {
+        document.vlc.play();
+    }
+};
+function vlc::play() {
+    if( ! sliderTimerId ) {
+        sliderTimerId = setTimeout("doUpdate()", 1000);
+    }
+    onPlay();
+};
+function vlc::pause() {
+    if( sliderTimerId ) {
+        clearTimeout(sliderTimerId)
+        sliderTimerId = 0;
+    }
+    onPause();
+};
+function vlc::stop() {
+    if( sliderTimerId ) {
+        clearTimeout(sliderTimerId)
+        sliderTimerId = 0;
+    }
+    onStop();
+};
+//-->
+</script>
+<?% ELSE %?>
+<!-- media player with activeX -->
+<p align='center'>
+    <object id="mediaPlayer" width="<?% width %?>" height="<?% height %?>"
+        classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
+        codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701"
+        standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">
+        <param name="fileName" value="<?% data %?>" />
+        <param name="animationatStart" value="true" />
+        <param name="transparentatStart" value="true" />
+        <param name="autoStart" value="true" />
+        <param name="showControls" value="true" />
+        <param name="loop" value="true" />
+        <embed type="application/x-mplayer2"
+            pluginspage="http://microsoft.com/windows/mediaplayer/en/download/"
+            id="mediaPlayer" name="mediaPlayer" displaysize="4" autosize="-1"
+            bgcolor='darkblue' showcontrols="true" showtracker="-1"
+            showdisplay="0" showstatusbar="-1" videoborder3d="-1" width="<?% width %?>" height="<?% height %?>"
+            src="<?% data %?>" autostart="true" designtimesp="5311" loop="true">
+        </embed>
+    </object>
+</p>
+<?% END %?>
+