webinterface: use font-awesome for icons. Disable all styles but "modern" for now
[enigma2-plugins.git] / webinterface / src / web-data / tpl / default / streaminterface / index.html
1 <?xml version="1.0" encoding="UTF-8"?>
2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
3         "http://www.w3.org/TR/html4/loose.dtd">
4 <html>
5 <head>
6 <meta content="text/html; charset=UTF-8" http-equiv="content-type">
7 <title>Dreambox WebTV</title>
8
9 <script type="text/javascript" src="/web-data/lib/libs_minified.js"></script>
10
11 <!-- userprefs Object -->
12 <script type="text/javascript" src="/web-data/userprefs.js"></script>
13
14 <!-- our stuff //-->
15 <script type="text/javascript" src="/web/strings.js"></script>
16 <script type="text/javascript" src="/web-data/statics.js"></script>
17 <script type="text/javascript" src="/web-data/helpers.js"></script>
18 <script type="text/javascript" src="/web-data/provider.js"></script>
19 <script type="text/javascript" src="/web-data/handler.js"></script>
20 <script type="text/javascript" src="/web-data/core.js"></script>
21 <script type="text/javascript" src="/web-data/vlcplayer.js"></script>
22
23 <link rel="stylesheet" type="text/css" href="/web-data/css/font-awesome.min.css">
24 <link href="/web-data/tpl/default/streaminterface/style.css"
25         type="text/css" rel="stylesheet">
26 <link rel="shortcut icon" type="/web-data/image/x-icon"
27         href="/web-data/img/favicon.ico">
28 </head>
29 <body>
30         <div id="container">
31                 <div id="banner">
32                         <span id="notification" style="display: none;"><div></div></span>
33                         <div id="bannerLeft">
34                                 <div id="bannerText" style="font-size: 24px;">
35                                         <img src="/web-data/img/dreamboxwebtv.png" alt="Dreambox WebTV">
36                                 </div>
37                                 <div id="current"></div>
38                         </div>
39                         <div id="bannerRight">
40                                 <table id="volumeTable">
41                                         <tr>
42                                                 <td>Volume:</td>
43                                                 <td id="vlcVolume"></td>
44                                         </tr>
45                                 </table>
46                         </div>
47                 </div>
48                 <div id="content">
49                         <div id="contentMain">
50                                 <div id="vlcPlayer" class="fullwidth center">
51                                         <embed type="application/x-vlc-plugin"
52                                                 pluginspage="http://www.videolan.org"
53                                                 version="VideoLAN.VLCPlugin.2" width="1280px" height="720px"
54                                                 id="vlc">
55                                         </embed>
56                                 </div>
57                                 <div class="fullwidth center">
58                                         <div id="vlcButtons">
59                                                 <button class="vlcPrev" title="Previous Service">
60                                                         <i class="fa fa-fw fa-step-backward" alt="&lt;&lt;"></i>
61                                                 </button>
62                                                 <button class="vlcPlay" title="Play">
63                                                         <i class="fa fa-fw fa-play" alt="&gt;"></i>
64                                                 </button>
65                                                 <button class="vlcNext" title="Next Service">
66                                                         <i class="fa fa-fw fa-step-forward" alt="&lt;&lt;"></i>
67                                                 </button>
68                                                 <button class="vlcStop" title="Stop">
69                                                         <i class="fa fa-fw fa-stop" alt="Stop"></i>
70                                                 </button>
71                                                 <button class="vlcFullscreen" title="Fullscren">
72                                                         <i class="fa fa-fw fa-tv" alt="Fullscreen"></i>
73                                                 </button>
74                                                 <button class="vlcVolumeDown" title="Volume Down">
75                                                         <i class="fa fa-fw fa-volume-down" alt="Vol-"></i>
76                                                 </button>
77                                                 <button class="vlcToggleMute" title="Mute Audio">
78                                                         <i class="fa fa-fw fa-volume-off" alt="Mute"></i>
79                                                 </button>
80                                                 <button class="vlcVolumeUp" title="Volume Up">
81                                                         <i class="fa fa-fw fa-volume-up" alt="Vol+"></i>
82                                                 </button>
83                                                 <div class="inline-block-top">
84                                                         Zap
85                                                         <input type="checkbox" id="vlcZap" title="Also zap on TV (for Subservices)"></input>
86                                                         Deinterlace
87                                                         <select id="deinterlace">
88                                                                 <option value="off">Off</option>
89                                                                 <option value="blend">Blend</option>
90                                                                 <option value="bob">Bob</option>
91                                                                 <option value="discard">Discard</option>
92                                                                 <option value="linear">Linear</option>
93                                                                 <option value="mean">Mean</option>
94                                                                 <option value="x">X</option>
95                                                                 <option value="yadif">Yadif</option>
96                                                                 <option value="yadif2x">Yadif2x</option>
97                                                         </select>
98                                                 </div>
99                                                 <div class="serviceSelection">
100                                                         <span id="bouquetList"></span> <span id="serviceList"></span>
101                                                 </div>
102                                         </div>
103                                 </div>
104                         </div>
105                 </div>
106         </div>
107
108         <script language="JavaScript" type="Text/Javascript">
109                 function addtoFavorites() {
110                         var url = location.href.replace("#", "");
111                         var title = "Dreambox WebTV";
112
113                         if (window.sidebar) {
114                                 // firefox
115                                 window.sidebar.addPanel(title, url, "");
116                         } else if (window.opera && window.print) {
117                                 // opera
118                                 var elem = document.createElement('a');
119                                 elem.setAttribute('href', url);
120                                 elem.setAttribute('title', title);
121                                 elem.setAttribute('rel', 'sidebar');
122                                 elem.click();
123                         } else if (document.all) {
124                                 // ie
125                                 window.external.AddFavorite(url, title);
126                         }
127                 }
128
129                 var resize = function(event) {
130                         var video = $('vlc');
131                         var top = video.cumulativeOffset().top;
132                         var height = document.viewport.getHeight() - top - 70; //for controls and "Add to Favorites
133                         var width = height * (16 / 9);
134                         var controls = $('vlcButtons');
135                         if (width > controls.getWidth())
136                                 width = controls.getWidth();
137                         video.height = height + "px";
138                         video.width = parseInt(width) + "px";
139                 };
140                 document.observe("dom:loaded", function(event){
141                         window.onresize = resize;
142                         resize();
143                 });
144
145                 core.run();
146         </script>
147         <div>
148                 <a style="color: #FFF; font-size: 12px; font-weight: normal;" href="#"
149                         onClick="addtoFavorites(); return false;">Add to Favorites</a>
150         </div>
151 </body>
152 </html>