From f37b0138a6a10adbf793844407ab6e88c153a359 Mon Sep 17 00:00:00 2001 From: "M. Voerman" Date: Thu, 13 Nov 2014 01:28:42 +0100 Subject: Original styling is now blue.css --- blue.css | 215 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 9 +-- main.js | 6 +- settings.js | 2 +- style_1.css | 167 +++++++++++++++++++++++---------------------- style_old.css | 203 ------------------------------------------------------ 6 files changed, 312 insertions(+), 290 deletions(-) create mode 100644 blue.css delete mode 100644 style_old.css diff --git a/blue.css b/blue.css new file mode 100644 index 0000000..e2c30a1 --- /dev/null +++ b/blue.css @@ -0,0 +1,215 @@ + videoplane#videoplane { + position:absolute; + left:0px; + top:0px; + height:100%; + width:100%; + z-index:500; + } + + div#osdmain { + position : absolute; + z-index : 505; + width : 80%; + top : 60%; + bottom : 9%; + left : 10%; + -webkit-border-radius : 50px; + background : #3366ff; + } + + div#osdnr { + position : absolute; + z-index : 505; + width : 13%; + height : 30%; + left : 3%; + top : -15%; + -webkit-border-radius : 25px; + background : red; + color : black; + } + + div#osdname { + z-index : 505; + position : absolute; + width : 69%; + height : 4%; + left : 3%; + top : 18%; + color : black; + } + + + div#osdtimer { + z-index : 505; + position : absolute; + width : 7%; + left : 5%; + top : 30%; + } + + div#osdtime { + z-index : 505; + position : absolute; + width : 42%; + left : 58%; + top : 7%; + color : white; + } + + + div#osdepg { + z-index : 505; + position : absolute; + width : 63%; + left : 17%; + top : 30%; + color : white; + } + + div#osdca { + z-index : 505; + position : absolute; + width : 5%; + left : 75%; + top : 20%; + color : black; + } + + + div#channellist { + z-index : 400; + position : absolute; + width : 100%; + height : 48%; + left : 7%; + top : 4%; + background : #bbb; + } + + div#colorkeys { + z-index : 401; + position : absolute; + width : 100%; + left : 10%; + top : 84%; + } + + div#chanlistepg { + z-index : 402; + position : absolute; + width : 42%; + left : 7%; + top : 50%; + } + + div#osdvolume { + z-index : 501; + position : absolute; + width : 63%; + left : 10%; + top : 80%; + opacity : 0; + color : green; + } + + div#osdmedia { + width :80%; + position :absolute; + left :10%; + top :60%; + z-index :505; + opacity :0; + -webkit-border-radius:50px; + background : #3366ff; + } + + div#schedule { + width :50%; + height :75%; + position :absolute; + left :25%; + top :10%; + opacity :0; + z-index :510; + -webkit-border-radius:50px; + background : #3366ff; + } + + div#osdmute { + width :7%; + position :absolute; + left :76%; + top :9%; + z-index :515; + opacity :0; + } + + div#osdlang { + width :7%; + position :absolute; + left :76%; + top :9%; + z-index :515; + opacity :0; + color :white; + } + + div#mainmenu { + width :80%; + position :absolute; + left :10%; + top :10%; + bottom :10%; + z-index :520; + opacity :0; + -webkit-border-radius:50px; + background : #3366ff; + } + + div#medialist { + width :80%; + position :absolute; + left :10%; + top :10%; + bottom :10%; + z-index :520; + opacity :0; + -webkit-border-radius:50px; + background : #3366ff; + } + + div#switchtimer { + width :45%; + position :absolute; + left :21%; + top :26%; + z-index :530; + opacity :0; + -webkit-border-radius:25px; + color :white; + } + + div#osdepginfo { + width :80%; + position :absolute; + left :10%; + top :10%; + z-index :525; + opacity :0; + -webkit-border-radius:50px; + background : #3366ff; + } + + div#osdepginfonext { + width :80%; + position :absolute; + left :10%; + top :10%; + z-index :525; + opacity :0; + -webkit-border-radius:50px; + background : #3366ff; + } + diff --git a/index.html b/index.html index b64a961..300f3cc 100644 --- a/index.html +++ b/index.html @@ -16,7 +16,7 @@ /***********************************************************/ - + @@ -26,20 +26,21 @@
- +
Volume :
-
+
+
- +
diff --git a/main.js b/main.js index 690e90d..08cdbe1 100644 --- a/main.js +++ b/main.js @@ -1406,6 +1406,9 @@ function updateOSDtime(timchan) { tijd = new Date(tijd); dateCurrent = new Date(); var EPGminutes = Math.floor((dateCurrent.getTime() - date.getTime()) /1000/60); + if (EPGminutes > 1440) { + EPGminutes = 0; // Duration is >24h, maybe current time isn't right. + } var tm = tijd.getMinutes(); var th = tijd.getHours(); th=addzero(th); @@ -2324,6 +2327,7 @@ function onKeyMenu(keyCode) { break; case "Red": + if (menu == 1) { if (subs_dyn < (subs_prio_dyn.length -1)) { subs_dyn += 1} else { subs_dyn = 0 } if (subs_prio_dyn.length > 0) { @@ -2827,7 +2831,7 @@ if(menu == 1) { // settings menu htmltext += "\n\n \u25CF -" + Lang[20]; htmltext += "\u25CF - " + VideoOutputModes_txt[VideoOutputModes[Set_Res]] + " "; htmltext += "\u25CF -" + Lang[35]; - htmltext += "\u25CF - " + Left(cssfile[css_nr],8) +""; + htmltext += "\u25CF - " + Left(cssfile[css_nr].split("."),8) +""; // htmltext += "\n 0 -" + Lang[9] +""; mainmenu.innerHTML = htmltext; } diff --git a/settings.js b/settings.js index 99ee228..63936f7 100644 --- a/settings.js +++ b/settings.js @@ -14,7 +14,7 @@ OSDLang = new Array ("English", "Nederlands", "Deutsch"); langfile = new Array ("lang_eng.js", "lang_dut.js","lang_ger.js"); lang_prio = new Array("dut,eng,und","ger,deu,eng","eng,und","fre,fra,eng"); -cssfile = new Array ("style_old.css","style_1.css"); +cssfile = new Array ("blue.css","style_1.css"); var css_nr; var subs_prio = "dut,eng"; //Subtitle prio diff --git a/style_1.css b/style_1.css index f93c858..11bd43f 100644 --- a/style_1.css +++ b/style_1.css @@ -1,99 +1,104 @@ - div#osdmain { - font-family : 'Ubuntu', sans-serif; - font-weight : 400; - position : relative; - z-index : 505; - background : url(osd-bg.png) top center repeat-x rgba(0,0,0,0.8); - width : 100%; - height : 25%; - top : 75%; - bottom : 0%; - left : 0%; - color : #FFF; - border-radius : 0 30px 0 30px; - overflow : hidden; - } +body { + +} +div#osdmain { + font-family : 'Ubuntu', sans-serif !important; + font-weight : 400 !important; + position : absolute !important; + z-index : 505 !important; + background : url(osd-bg.png) top center repeat-x rgba(0,0,0,0.8) !important; + width : 100% !important; + height : 25% !important; + bottom : 0 !important; + left : 0 !important; + color : #FFF !important; + border-radius : 0 30px 0 30px !important; + overflow : hidden !important; +} div#osdnr { - font-size : 40px; - padding : 40px 0; - font-weight : 700; - color : #feb900; - position : absolute; - width : 8%; - height : 100%; - left : 0%; - top : 0%; - text-align : center; - border-right: 1px solid #111; - background : rgba(0,0,0,0.3); - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + font-size : 40px !important; + display : table !important; + font-weight : 700 !important; + color : #feb900 !important; + position : absolute !important; + width : 8% !important; + height : 100% !important; + left : 0% !important; + top : 0% !important; + text-align : center !important; + border-right : 1px solid #444 !important; + background : rgba(0,0,0,0.4) !important; } + div#osdnr span { + display : table-cell !important; + vertical-align : middle !important; + } + div#osdname { - font-size : 22px; - font-weight : 700; - position : absolute; - width : 60%; - height : 25%; - left : 10%; - top : 15%; - border-bottom: 1px solid #111; + font-size : 22px !important; + font-weight : 700 !important; + position : absolute !important; + width : 60% !important; + height : 25% !important; + left : 10% !important; + top : 15% !important; + border-bottom : 1px solid #444 !important; + white-space : nowrap !important; + overflow : hidden !important; + text-overflow : ellipsis !important; } div#osdtimer { - color : #feb900; - position : absolute; - width : auto; - text-align : center; - left : 10%; - top : 45%; - border-radius : 10px; - -webkit-border-radius: 10px; - background : rgba(0,0,0,0.2); - padding : 10px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + color : #feb900 !important; + position : absolute !important; + width : auto !important; + text-align : center !important; + left : 10% !important; + top : 45% !important; + border-radius : 10px !important; + -webkit-border-radius: 10px !important; + background : rgba(0,0,0,0.3) !important; + padding : 10px !important; } div#osdepg { - position : absolute; - width : 50%; - height : 55%; - left : 20%; - top : 45%; - line-height : 28px; + position : absolute !important; + width : 50% !important; + height : 55% !important; + left : 20% !important; + top : 45% !important; + line-height : 28px !important; + white-space : nowrap !important; + overflow : hidden !important; + text-overflow : ellipsis !important; } div#osdtime { - font-size : 18px; - color : #FFF; - position : absolute; - width : 27%; - height : 25%; - right : 3%; - top : 15%; - text-align : right; - border-bottom: 1px solid #111; + font-size : 18px !important; + color : #FFF !important; + position : absolute !important; + width : 30% !important; + height : 25% !important; + right : 3% !important; + top : 15% !important; + text-align : right !important; + border-bottom : 1px solid #444 !important; + white-space : nowrap !important; + overflow : hidden !important; + text-overflow : ellipsis !important; } div#osdca { - color : #999; - position : absolute; - width : auto; - right : 3%; - top : 45%; - text-align : right; - border-radius : 10px; - -webkit-border-radius: 10px; - background : rgba(0,0,0,0.2); - padding : 10px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - + color : #999 !important; + position : absolute !important; + width : auto !important; + right : 3% !important; + top : 45% !important; + text-align : right !important; + border-radius : 10px !important; + -webkit-border-radius: 10px !important; + background : rgba(0,0,0,0.3) !important; + padding : 10px !important; } - diff --git a/style_old.css b/style_old.css deleted file mode 100644 index 599f131..0000000 --- a/style_old.css +++ /dev/null @@ -1,203 +0,0 @@ - div#osdmain { - position : absolute; - z-index : 505; - width : 80%; - top : 60%; - bottom : 9%; - left : 10%; - -webkit-border-radius : 50px; - background : #3366ff; - } - - div#osdnr { - position : absolute; - z-index : 505; - width : 10%; - height : 9%; - left : 12%; - top : 56%; - -webkit-border-radius : 25px; - background : red; - color : black; - } - - div#osdname { - z-index : 505; - position : absolute; - width : 69%; - height : 4%; - left : 12%; - top : 66%; - color : black; - } - - - div#osdtimer { - z-index : 505; - position : absolute; - width : 7%; - left : 12%; - top : 69%; - } - - div#osdepg { - z-index : 505; - position : absolute; - width : 63%; - left : 21%; - top : 69%; - color : white; - } - - div#osdtime { - z-index : 505; - position : absolute; - width : 42%; - left : 58%; - top : 63%; - color : white; - } - - div#osdca { - z-index : 505; - position : absolute; - width : 5%; - left : 75%; - top : 67%; - color : black; - } - div#channellist { - z-index : 400; - position : absolute; - width : 100%; - height : 48%; - left : 7%; - top : 4%; - background : #bbb; - } - - div#colorkeys { - z-index : 401; - position : absolute; - width : 100%; - left : 10%; - top : 84%; - } - - div#chanlistepg { - z-index : 402; - position : absolute; - width : 42%; - left : 7%; - top : 50%; - } - - div#osdvolume { - z-index : 501; - position : absolute; - width : 63%; - left : 10%; - top : 80%; - opacity : 0; - color : green; - } - - div#osdmedia { - width :80%; - position :absolute; - left :10%; - top :60%; - z-index :505; - opacity :0; - -webkit-border-radius:50px; - background : #3366ff; - } - - div#schedule { - width :50%; - height :75%; - position :absolute; - left :25%; - top :10%; - opacity :0; - z-index :510; - -webkit-border-radius:50px; - background : #3366ff; - } - - div#osdmute { - width :7%; - position :absolute; - left :76%; - top :9%; - z-index :515; - opacity :0; - } - - div#osdlang { - width :7%; - position :absolute; - left :76%; - top :9%; - z-index :515; - opacity :0; - color :white; - } - - div#mainmenu { - width :80%; - position :absolute; - left :10%; - top :10%; - bottom :10%; - z-index :520; - opacity :0; - -webkit-border-radius:50px; - background : #3366ff; - } - - div#medialist { - width :80%; - position :absolute; - left :10%; - top :10%; - bottom :10%; - z-index :520; - opacity :0; - -webkit-border-radius:50px; - background : #3366ff; - } - - div#switchtimer { - width :45%; - position :absolute; - left :21%; - top :26%; - z-index :530; - opacity :0; - -webkit-border-radius:25px; - color :white; - } - - div#osdepginfo { - width :80%; - position :absolute; - left :10%; - top :10%; - z-index :525; - opacity :0; - -webkit-border-radius:50px; - background : #3366ff; - } - - div#osdepginfonext { - width :80%; - position :absolute; - left :10%; - top :10%; - z-index :525; - opacity :0; - -webkit-border-radius:50px; - background : #3366ff; - } - -- cgit v1.2.3