diff options
-rw-r--r-- | index.svg | 89 | ||||
-rw-r--r-- | main.js | 101 | ||||
-rw-r--r-- | settings.js | 8 |
3 files changed, 136 insertions, 62 deletions
@@ -31,7 +31,7 @@ </foreignObject> <g id="video_window"> - <video id='videoplane' x="0" y="0" width="1920" height="1080" preserveAspectRatio="xMidYMid"> + <video id='videoplane' x="0" y="0" width="1920" height="1080" preserveAspectRatio="xMidYMid" > </video> </g> @@ -62,38 +62,73 @@ </g> -<g id="EPGnow" visibility="invisible" > - <rect height="800" width="1300" y="100" x="300" fill="#0000ff" rx="50" /> - <text id="epgchannel" y="275" x="350" style="fill:white;font-size:56px;" /> - <text id="epgtime" y="350" x="350" style="fill:white;font-size:56px;" /> - <text id="epgduration" y="350" x="550" style="fill:white;font-size:56px;" /> - <text id="epginfo" y="425" x="350" style="fill:white;font-size:56px;" /> - <textArea id="epgextinfo" text-align="justify" width="1200" y="500" x="350" style="fill:white;font-size:56px;" /> +<g id="MENU" visibility="invisible" > + <rect height="900" width="1300" y="75" x="300" fill="#0000ff" rx="50" opacity="0.6" /> + <rect height="75" width="250" y="875" x="450" fill="red" rx="50" /> + <rect height="75" width="250" y="875" x="700" fill="green" rx="50" /> + <rect height="75" width="250" y="875" x="950" fill="yellow" rx="50" /> + <rect height="75" width="250" y="875" x="1200" fill="blue" rx="50" /> + <text id="menuheader" y="175" x="600" style="fill:white;font-size:88px;" /> + <text id="menu0" y="275" x="350" style="fill:white;font-size:56px;" /> + <text id="menu1" y="350" x="350" style="fill:white;font-size:56px;" /> + <text id="menu2" y="425" x="350" style="fill:white;font-size:56px;" /> + <text id="menu3" y="500" x="350" style="fill:white;font-size:56px;" /> + <text id="menu4" y="575" x="350" style="fill:white;font-size:56px;" /> + <text id="menu5" y="650" x="350" style="fill:white;font-size:56px;" /> + <text id="menu6" y="725" x="350" style="fill:white;font-size:56px;" /> + <text id="menu_red" y="930" x="500" style="fill:white;font-size:56px;"/> + <text id="menu_green" y="930" x="750" style="fill:black;font-size:56px;"/> + <text id="menu_yellow" y="930" x="1000" style="fill:black;font-size:56px;"/> + <text id="menu_blue" y="930" x="1250" style="fill:white;font-size:56px;"/> </g> -<g id="EPGnext" visibility="invisible" > - <rect height="800" width="1300" y="100" x="300" fill="#0000ff" rx="50" /> - <text id="epgchanneln" y="275" x="350" style="fill:white;font-size:56px;" /> - <text id="epgtimen" y="350" x="350" style="fill:white;font-size:56px;" /> - <text id="epgdurationn" y="350" x="550" style="fill:white;font-size:56px;" /> - <text id="epginfon" y="425" x="350" style="fill:white;font-size:56px;" /> - <textArea id="epgextinfon" text-align="justify" width="1200" y="500" x="350" style="fill:white;font-size:56px;" /> - - +<g id="GUIDE" visibility="invisible" > + <rect height="900" width="1500" y="75" x="200" fill="#0000ff" rx="50" opacity="0.6" /> + <rect id="guidebar" height="50" width="1400" y="275" x="250" fill="#0066FF" rx="50" /> + <rect height="75" width="300" y="875" x="275" fill="red" rx="50" /> + <rect height="75" width="300" y="875" x="625" fill="green" rx="50" /> + <rect height="75" width="300" y="875" x="975" fill="yellow" rx="50" /> + <rect height="75" width="300" y="875" x="1325" fill="blue" rx="50" /> + <text id="guidename" y="175" x="600" style="fill:white;font-size:88px;" /> + <text id="guidetime" y="175" x="600" style="fill:white;font-size:88px;" /> + <text id="guide0" y="150" x="300" style="fill:white;font-size:38px;" /> + <text id="guide1" y="200" x="300" style="fill:white;font-size:38px;" /> + <text id="guide2" y="250" x="300" style="fill:white;font-size:38px;" /> + <text id="guide3" y="300" x="300" style="fill:white;font-size:38px;" /> + <text id="guide4" y="350" x="300" style="fill:white;font-size:38px;" /> + <text id="guide5" y="400" x="300" style="fill:white;font-size:38px;" /> + <text id="guide6" y="450" x="300" style="fill:white;font-size:38px;" /> + <text id="guide7" y="500" x="300" style="fill:white;font-size:38px;" /> + <text id="guide8" y="550" x="300" style="fill:white;font-size:38px;" /> + <text id="guide9" y="600" x="300" style="fill:white;font-size:38px;" /> + <text id="guide10" y="650" x="300" style="fill:white;font-size:38px;" /> + <text id="guide11" y="700" x="300" style="fill:white;font-size:38px;" /> + <text id="guide12" y="750" x="300" style="fill:white;font-size:38px;" /> + <text id="guide13" y="800" x="300" style="fill:white;font-size:38px;" /> + <text id="guide14" y="850" x="300" style="fill:white;font-size:38px;" /> + + <text id="guide_red" y="930" x="325" style="fill:white;font-size:48px;"/> + <text id="guide_green" y="930" x="675" style="fill:black;font-size:48px;"/> + <text id="guide_yellow" y="930" x="1025" style="fill:black;font-size:48px;"/> + <text id="guide_blue" y="930" x="1375" style="fill:white;font-size:48px;"/> +</g> +<g id="EPGnow" visibility="invisible" overlay="top"> + <rect height="800" width="1300" y="100" x="300" fill="#0000ff" rx="50" /> + <text id="epgchannel" y="175" x="350" style="fill:white;font-size:64px;" /> + <text id="epgtime" y="250" x="350" style="fill:white;font-size:40px;" /> + <text id="epgduration" y="250" x="550" style="fill:white;font-size:40px;" /> + <text id="epginfo" y="310" x="350" style="fill:yellow;font-size:48px;" /> + <textArea id="epgextinfo" text-align="justify" width="1200" y="375" x="350" style="fill:white;font-size:40px;" /> </g> -<g id="MENU" visibility="invisible" > +<g id="EPGnext" visibility="invisible" overlay="top"> <rect height="800" width="1300" y="100" x="300" fill="#0000ff" rx="50" /> - <text id="menuheader" y="275" x="600" style="fill:white;font-size:88px;" /> - <text id="menu0" y="375" x="350" style="fill:white;font-size:56px;" /> - <text id="menu1" y="450" x="350" style="fill:white;font-size:56px;" /> - <text id="menu2" y="525" x="350" style="fill:white;font-size:56px;" /> - <text id="menu3" y="600" x="350" style="fill:white;font-size:56px;" /> - <text id="menu4" y="675" x="350" style="fill:white;font-size:56px;" /> - <text id="menu5" y="750" x="350" style="fill:white;font-size:56px;" /> - <text id="menu6" y="825" x="350" style="fill:white;font-size:56px;" /> - <text id="menu7" y="900" x="350" style="fill:white;font-size:56px;" /> + <text id="epgchanneln" y="175" x="350" style="fill:white;font-size:64px;" /> + <text id="epgtimen" y="250" x="350" style="fill:white;font-size:40px;" /> + <text id="epgdurationn" y="250" x="550" style="fill:white;font-size:40px;" /> + <text id="epginfon" y="310" x="350" style="fill:yellow;font-size:48px;" /> + <textArea id="epgextinfon" text-align="justify" width="1200" y="375" x="350" style="fill:white;font-size:40px;" /> </g> @@ -25,6 +25,7 @@ var nrMedia = recording.length - 1; function onLoad() { document.addEventListener("keydown", onKeyDown, false); video = document.getElementById("videoplane"); + guide = document.getElementById("GUIDE"); createPlayer(); getBoxSize(); embedTeletextElement(); @@ -126,13 +127,12 @@ function preview(urip) { function FullScreen() { - - video.setAttribute("overlay","500"); +// video.setAttribute("overlay", "500"); video.setAttribute("x", "0"); video.setAttribute("y", "0"); video.setAttribute("width", videoWidth); video.setAttribute("heigth", videoHeight); - alert ("Display :" + videoWidth + "x" + videoHeight); +// alert ("Display :" + videoWidth + "x" + videoHeight); } @@ -251,17 +251,17 @@ function onKeyDown(event) { if(audio == 1) { is.setObject("cfg.media.audio.languagepriority","dut,eng",is.STORAGE_VOLATILE); document.getElementById("osdlang").setAttribute("visibility","visible"); - document.getElementById("osdlangtxt").textContent = "Nederlands" + document.getElementById("osdlangtxt").textContent = "Nederlands"; setTimeout("document.getElementById('osdlang').setAttribute('visibility','invisible');", 3000); } else if(audio == 2) { is.setObject("cfg.media.audio.languagepriority","ger,deu,eng",is.STORAGE_VOLATILE); document.getElementById("osdlang").setAttribute("visibility","visible"); - document.getElementById("osdlangtxt").textContent = "Deutsch" + document.getElementById("osdlangtxt").textContent = "Deutsch"; setTimeout("document.getElementById('osdlang').setAttribute('visibility','invisible');", 3000); } else if(audio == 3) { is.setObject("cfg.media.audio.languagepriority","eng",is.STORAGE_VOLATILE); document.getElementById("osdlang").setAttribute("visibility","visible"); - document.getElementById("osdlangtxt").textContent = "English" + document.getElementById("osdlangtxt").textContent = "English"; setTimeout("document.getElementById('osdlang').setAttribute('visibility','invisible');", 3000); audio = 0; } @@ -275,7 +275,6 @@ function onKeyDown(event) { } } } else { - colorkeys.innerHTML = "<font color=red size=3>" + NN[3 + NowNext] + "</font><font color=green size=3>" + NN[NowNext] + "</font><font color=yellow size=3> Schedule </font><font color=blue size=3> INFO </font>"; NowNext = 1 - NowNext; showChannelList(); } @@ -368,6 +367,7 @@ function onKeyDown(event) { } } else { isFullscreen = 1; + guide.setAttribute("visibility","invisible"); FullScreen(); play(channels[currChan]); } @@ -384,16 +384,14 @@ function onKeyDown(event) { case "Scroll": if(isFullscreen) { NowNext = 0; - video.width = "320px"; - video.height = "240px"; - video.left = "380px"; - video.top = "300px"; + guide.setAttribute("visibility","visible"); showChannelList(); isFullscreen = 0; if(!SwitchGuide) { preChan = currChan; } } else { + guide.setAttribute("visibility","invisible"); isFullscreen = 1; FullScreen(); if(!SwitchGuide) { @@ -609,7 +607,9 @@ document.getElementById("epgchanneln").textContent = Left(channelsnames[currChan tijd = new Date(tijd); dateCurrent = new Date(); var EPGminutes = Math.floor((dateCurrent.getTime() - date.getTime()) /1000/60); - + if (EPGminutes > 999) { + EPGminutes = 0; + } var tm = tijd.getMinutes(); var th = tijd.getHours(); if(th<10) @@ -747,6 +747,7 @@ function GetEPG(epgchan) EPGShortnext = ""; EPGExtnext = ""; cds = 0; + try { // streaminfo // SI[x] 0-sat,1-NID,2-TID,3-SID @@ -900,17 +901,21 @@ function GetSchedule(schchan,tablelength){ // Channelslist / EPG Guide // -// show currchan - 5 +// show currchan - 7 // highlite currchan -// show currchan + 5 +// show currchan + 7 // // check if chan is OK // + function showChannelList() { - var liststyle = ""; - var htmlstring = "<table border='0'><tr>"; - listChan = currChan-5; - for(var i=currChan-5; i<=currChan+5; i++) { + document.getElementById("guide_green").textContent = NN[1 - NowNext]; + document.getElementById("guide_red").textContent = NN[3 + NowNext]; + document.getElementById("guide_yellow").textContent = "Schedule"; + document.getElementById("guide_blue").textContent = "INFO"; + var yy = 0; + listChan = currChan-7; + for(var i=currChan-7; i<=currChan+7; i++) { if (listChan<1) { listChan=nrChannels-2; } @@ -924,20 +929,48 @@ function showChannelList() { while (!channels[listChan] && (listChan<nrChannels)); GetEPG(listChan); if ( listChan == currChan) { - liststyle = " style='background:#fc5;'"; - } else { - liststyle = ""; + var y = 110 + (50 * yy); + document.getElementById("guidebar").setAttribute("y",y); } - EpgInfo[0] = EPG[0][7][listChan]; - EpgInfo[1] = EPG[1][7][listChan]; - htmlstring = htmlstring + "<td" + liststyle + ">" + listChan + "</td><td" +liststyle + ">" + Left(channelsnames[listChan],15) + "</td><td" +liststyle + ">" + Left(EpgInfo[NowNext],64) + "</td></tr>"; + tijd = EPG[0][2][currChan]; + date = new Date(tijd*1000); + tijd = date.toUTCString(); + tijd = new Date(tijd); + dateCurrent = new Date(); + var EPGminutes = Math.floor((dateCurrent.getTime() - date.getTime()) /1000/60); + if (EPGminutes > 999) { + EPGminutes = 0; } - htmlstring = htmlstring + "</table>"; - channelList.innerHTML = htmlstring; - chanlistepg.innerHTML = "<center><font color=black size=4><p>" + EPG[NowNext][1][currChan] + "</p></font><font color=black size=3><p>" + Left(EPG[NowNext][4][currChan],250) + "</p></font></center>" ; + var tm = tijd.getMinutes(); + var th = tijd.getHours(); + if(th<10) + { + th = "0"+th; + } + if(tm<10) + { + tm = "0"+tm; + } + + EpgInfo[0] = th + ":" + tm + "\uE003(" + EPGminutes + "\uE003/\uE003" + (EPG[0][3][listChan] - EPGminutes).toFixed(0) + ")" + "\uE003" + EPG[0][1][listChan] + "\uE003" + EPG[0][6][listChan]; + EpgInfo[1] = th + ":" + tm + "\uE003(" + (EPG[1][3][listChan]) + ")" + "\uE003" + EPG[1][1][listChan] + "\uE003" + EPG[1][6][listChan]; + + try { + document.getElementById(("guide"+yy)).textContent = listChan + "\uE003" + Left(channelsnames[listChan],15) + "\uE003" + Left(EpgInfo[NowNext],64); + } catch (e) { + alert("Error file guide list: " + e); + } + yy = yy + 1; + } + + +// htmlstring = htmlstring + "</table>"; +// channelList.innerHTML = htmlstring; +// chanlistepg.innerHTML = "<center><font color=black size=4><p>" + EPG[NowNext][1][currChan] + "</p></font><font color=black size=3><p>" + Left(EPG[NowNext][4][currChan],250) + "</p></font></center>" ; } + // END of Channelslist / EPG Guide @@ -981,7 +1014,7 @@ function onKeyMenu(keyCode) { clearTimeout(switchtimerID); switchtimerID = 0; InitMenu(); - osdtimer.innerHTML = ""; + switchtimericon = "\uE003" SetLed(0,0,0); break; case "Blue": @@ -1027,10 +1060,14 @@ function onKeyMenu(keyCode) { function InitMenu() { document.getElementById("menuheader").textContent = "SETTINGS"; - document.getElementById("menu0").textContent = "<RED> Frontdisplay Clock : " + showClock; - document.getElementById("menu1").textContent = "<GREEN> Prio audio track : " + (toi.informationService.getObject("cfg.media.audio.languagepriority")); - document.getElementById("menu2").textContent = "<YELLOW> Switch timer : " + Boolean(switchtimerID); - document.getElementById("menu3").textContent = "<BLUE> Preview guide : " + SwitchGuide + " "; + document.getElementById("menu0").textContent = "Frontdisplay Clock : " + showClock; + document.getElementById("menu1").textContent = "Prio audio track : " + (toi.informationService.getObject("cfg.media.audio.languagepriority")); + document.getElementById("menu2").textContent = "Switch timer : " + Boolean(switchtimerID); + document.getElementById("menu3").textContent = "Preview guide : " + SwitchGuide + " "; + document.getElementById("menu_red").textContent = " Clock "; + document.getElementById("menu_green").textContent = " Lang. "; + document.getElementById("menu_yellow").textContent = " Timer "; + document.getElementById("menu_blue").textContent = " Prev. "; } // END Menu diff --git a/settings.js b/settings.js index 1f5afa8..be702a3 100644 --- a/settings.js +++ b/settings.js @@ -58,7 +58,10 @@ var videoWidth = "544"; // fallbacksize var videoHeight = "576"; var switchtimericon = "\uE003"; + +var guide = null; var video = null; + var teletext = null; var eitCache = null; var events = null; @@ -75,9 +78,8 @@ var NN = new Array(); NN[0] = "Now"; NN[1] = "Next"; NN[2] = "Schedule"; -NN[3] = "TIMER"; -NN[4] = "-----"; - +NN[3] = "-----"; +NN[4] = "TIMER"; // //NowNext, 1 = programma naam event.name ,currchan |