Fix timerstuff in EPG
[enigma2-plugins.git] / webinterface / src / web-data / tpl / default / index.html
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2        "http://www.w3.org/TR/html4/loose.dtd">
3 <html>
4
5 <head>
6         <meta content="text/html; charset=UTF-8" http-equiv="content-type">
7         <title>Dreambox WebControl</title>
8         
9         <script type="text/javascript" src="/web-data/packed.js" ></script>
10         
11         <link href="/web-data/tpl/default/style.css" type="text/css" rel="stylesheet">
12         <link rel="shortcut icon" type="/web-data/image/x-icon" href="/web-data/img/favicon.ico">
13
14         <!-- Live RSS Feeds //-->
15         <link rel="alternate" type="application/rss+xml" title="Movie List" href="/web/movielist.rss?tag" >
16
17
18         <script language="javascript" type="text/javascript">
19                 
20                 if (!window.$) {
21                         window.$ = function(id) { return document.getElementById(id); }
22                 }
23                 
24                 function getWinSize(win) 
25                 { 
26                         if(!win) win = window; 
27                         var s = {}; 
28                         if(typeof win.innerWidth != 'undefined') 
29                         { 
30                                 s.width = win.innerWidth; 
31                                 s.height = win.innerHeight; 
32                         } 
33                         else 
34                         { 
35                                  var obj = getBody(win); 
36                                  s.width = parseInt(obj.clientWidth); 
37                                  s.height = parseInt(obj.clientHeight); 
38                         } 
39                         return s; 
40                 } 
41
42                 function getBody(w) 
43                 { 
44                         return (w.document.compatMode && w.document.compatMode == "CSS1Compat") ? w.document.documentElement : w.document.body || null; 
45                 } 
46                 
47                 function setMaxHeight(element){
48                         try{                    
49                                 var slc = $(element);
50                                 size = getWinSize();
51                                 slc.style.maxHeight = size.height - 200+"px";
52                         } catch (e) {}
53                 }
54
55         </script>
56 </head>
57 <body onresize="setMaxHeight('contentMain')">
58         <div id="container">
59                 <div id="banner">
60                         <div id="bannerLeft">
61                                 <div id="bannerText" style="font-size: 24px;"><img src="/web-data/img/dreamboxweb.png" alt="Dreambox Web"></div>
62                                 <ul id="mainMenu">
63                                         <li><a href="#" onClick="switchMode('TV')">TeleVision</a></li>
64                                         <li><a href="#" onClick="switchMode('Radio')">Radio</a></li>
65                                         <li><a href="#" onClick="switchMode('Movies')">Movies</a></li>
66                                         <li><a href="#" onClick="switchMode('Timer')">Timer</a></li>
67                                         <!-- <li><a href="#" onClick="switchMode('MediaPlayer')">MediaPlayer</a></li>  -->
68                                         <li><a href="#" onClick="switchMode('BoxControl')">BoxControl</a></li>
69                                         <li><a href="#" onClick="switchMode('About')">About</a></li>
70                                 </ul>
71                         </div>
72                         <div id="bannerRight">
73                                 <div>
74                                         <a href="#" onClick="openSignalPanel()">
75                                                 <img border="0" src="/web-data/img/signal.png" alt="Signal" title="Show Signal Panel">
76                                         </a>
77                                 </div>                  
78                         </div>
79                 </div>
80                 <div id="current">
81                         <div id="currentContent">
82                                 <table id="currentTable">
83                                         <tr>
84                                                 <td id="currentName">N/A</td>
85                                         </tr>   
86                                 </table>
87                         </div>
88                 </div>
89                 <div id="main">
90                         <div id="navContainer">
91                                 <div id="nav">
92                                         <div id="navHd" class="header"><div>SubNav</div></div>
93                                         <div id="navContent">loading...</div>
94                                 </div>
95                                 <div id="navVolume">
96                                         <div id="volHd" class="header"><div>Volume</div></div>
97                                         <span class="boxContent center" style="width: 94%; display:block;">
98                                                 <!-- Volume "Slider" -->
99                                                 <a href="#" onClick="volumeSet(10)">
100                                                         <img id='volume1' src='/web-data/img/led_off.png' title="Volume to 10%" alt="10%">
101                                                 </a>
102                                                 <a href="#" onClick="volumeSet(20)">
103                                                         <img id='volume2' src='/web-data/img/led_off.png' title="Volume to 20%" alt="20%">
104                                                 </a>
105                                                 <a href="#" onClick="volumeSet(30)">
106                                                         <img id='volume3' src='/web-data/img/led_off.png' title="Volume to 30%" alt="30%">
107                                                 </a>
108                                                 <a href="#" onClick="volumeSet(40)">
109                                                         <img id='volume4' src='/web-data/img/led_off.png' title="Volume to 40%" alt="40%">
110                                                 </a>
111                                                 <a href="#" onClick="volumeSet(50)">
112                                                         <img id='volume5' src='/web-data/img/led_off.png' title="Volume to 50%" alt="50%">
113                                                 </a>
114                                                 <a href="#" onClick="volumeSet(60)">
115                                                         <img id='volume6' src='/web-data/img/led_off.png' title="Volume to 60%" alt="60%">
116                                                 </a>
117                                                 <a href="#" onClick="volumeSet(70)">
118                                                         <img id='volume7' src='/web-data/img/led_off.png' title="Volume to 70%" alt="70%">
119                                                 </a>
120                                                 <a href="#" onClick="volumeSet(80)">
121                                                         <img id='volume8' src='/web-data/img/led_off.png' title="Volume to 80%" alt="80%">
122                                                 </a>
123                                                 <a href="#" onClick="volumeSet(90)">
124                                                         <img id='volume9' src='/web-data/img/led_off.png' title="Volume to 90%" alt="90%">
125                                                 </a>
126                                                 <a href="#" onClick="volumeSet(100)">
127                                                         <img id='volume10' src='/web-data/img/led_off.png' title="Volume to 100%" alt="100%">
128                                                 </a>
129                                                 <br>
130                                                 <!-- Volume Control -->
131                                                 <a href="#" onClick="volumeUp()">
132                                                         <img src='/web-data/img/arrow_up.png'  title="Volume Up" alt="Up">
133                                                 </a>
134                                                 <a href="#" onClick="volumeDown()">
135                                                         <img src='/web-data/img/arrow_down.png'  title="Volume Down" alt="Down">
136                                                 </a>
137                                                 <a href="#" onClick="volumeMute()">
138                                                         <img id='speaker' src='/web-data/img/speak_on.png'  title="Mute" alt="Mute">
139                                                 </a>                                            
140                                         </span>
141                                 </div>
142                                 <div id="navSearch">
143                                         <div id="searchHd" class="header"><div>EPG-Search</div></div>
144                                         <div class="boxContent">
145                                                 <form action="" onSubmit="loadEPGBySearchString(document.getElementById('epgSearch').value); return false;">
146                                                         <input type="text" id="epgSearch" onfocus="this.value=''" value="Search EPG"/>
147                                                         <input style="vertical-align:middle" type="image" src="/web-data/img/search.png" alt="search..." title="Search EPG for term">
148                                                 </form>                                         
149                                         </div>
150                                 </div>
151                         </div>
152                         <div id="content">
153                                 <div id="contentHd" class="header"><div>Content</div></div>
154                                 <div id="contentMain">loading...</div>
155                         </div>  
156                 </div>
157         </div>
158         <script language="javascript" type="text/javascript">                   
159                 /****************
160                 Rounded Corners 
161                 *****************/
162                 var menuBorder = RUZEE.ShadedBorder.create({ corner:5, border: 1 });
163
164                 var buttons = $('mainMenu').getElementsByTagName("li");
165
166                 for (var i=0; i < buttons.length; ++i) {                        
167                         menuBorder.render(buttons[i]);
168                 }
169
170                 var bannerBorder = RUZEE.ShadedBorder.create({corner:5, shadow:10});
171                 bannerBorder.render('banner');
172                 bannerBorder.render('current');
173
174                 var contentBorder = RUZEE.ShadedBorder.create({corner:5, border: 2, shadow:10});
175                 contentBorder.render('nav');
176                 contentBorder.render('navSearch');
177                 contentBorder.render('navVolume');
178                 contentBorder.render('content');
179
180                 var hdBorder = RUZEE.ShadedBorder.create({corner:5, edges:"tlr"});
181                 hdBorder.render('navHd');
182                 hdBorder.render('searchHd');
183                 hdBorder.render('volHd');
184                 hdBorder.render('contentHd');
185                 
186                 function setNavHd(content){
187                         set("navHd", "<div>"+content+"</div>");
188                         hdBorder.render('navHd');
189                 }
190                 
191                 function setContentHd(content){
192                         set("contentHd", "<div>"+content+"</div>");
193                         hdBorder.render('contentHd');
194                 }
195                 
196                 function getAjaxLoad(){
197                         return ('<center><img style="padding-top: 50px;" src="/web-data/gfx/ajaxload.gif" alt="loading..."></center>');
198                 }
199                 
200                 setMaxHeight('contentMain');            
201                 
202                 init();
203         </script>
204
205 </body>
206 </html>