diff options
author | Dieter Hametner <dh (plus) vdr (at) gekrumbel (dot) de> | 2007-07-21 17:52:41 +0000 |
---|---|---|
committer | Dieter Hametner <dh (plus) vdr (at) gekrumbel (dot) de> | 2007-07-21 17:52:41 +0000 |
commit | adc7c9d1a40957c1ee377887b7654174730d665b (patch) | |
tree | b73a38ada38b9fee545f39c45ba4c1e8b5dfdf4c | |
parent | ff170db465b8b91b9732cb49bccb47a3110e2388 (diff) | |
download | vdr-plugin-live-adc7c9d1a40957c1ee377887b7654174730d665b.tar.gz vdr-plugin-live-adc7c9d1a40957c1ee377887b7654174730d665b.tar.bz2 |
- Introducing explicit pageenhance javascript class. See Changelog and
the files itself for more info.
-rw-r--r-- | css/styles.css | 22 | ||||
-rw-r--r-- | doc/ChangeLog | 7 | ||||
-rw-r--r-- | i18n.cpp | 141 | ||||
-rw-r--r-- | live/js/live/hinttips.js | 19 | ||||
-rw-r--r-- | live/js/live/infowin.js | 57 | ||||
-rw-r--r-- | live/js/live/pageenhance.js | 87 | ||||
-rw-r--r-- | pages/pageelems.ecpp | 9 |
7 files changed, 245 insertions, 97 deletions
diff --git a/css/styles.css b/css/styles.css index 8d41458..d197816 100644 --- a/css/styles.css +++ b/css/styles.css @@ -153,6 +153,20 @@ a:active { } +/* ###################### + # General styles for epg info + ###################### +*/ + +div.epg_content { + border: 1px solid black; +} + +span.epg_images { + float: right; + margin-left: 5px; +} + /* ############################## # Infowin styles for epg infos ############################## @@ -495,7 +509,7 @@ table td.padded { } /* ################ - # Event + # Event (page: whats_on.html) ################ */ @@ -909,6 +923,7 @@ table.login tr td { padding: 0px 0px 7px 0px; margin: 0; background: transparent url(bg_tools.png) top left repeat-y; + border: 0px; } .info-win div.epg_content div.epg_tools { @@ -933,11 +948,6 @@ table.login tr td { margin-top: 5px; } -.info-win span.epg_images { - float: right; - margin-left: 5px; -} - .info-win span.epg_images img.epg_image { width: 100%; } diff --git a/doc/ChangeLog b/doc/ChangeLog index f5dda08..289e7a1 100644 --- a/doc/ChangeLog +++ b/doc/ChangeLog @@ -1,5 +1,12 @@ 2007-07-21 Dieter Hametner <dh+vdr at gekrumbel dot de> + * live/js/live/pageenhance.js: Enhance a normal web page with + nifty web 2.0 features. + * live/js/live/infowin.js: stand alone class. Used by pageenhance.js + * live/js/live/hinttips.js: stand alone class. Used by pageenhance.js + +2007-07-21 Dieter Hametner <dh+vdr at gekrumbel dot de> + Made epgimages better styleable. Displaying them as floats right of the epg description text. @@ -4,7 +4,7 @@ extended version of i18n.cpp. (If you would like to submit a patch add more context like described below) - $Id: i18n.cpp,v 1.97 2007/07/19 21:19:44 lordjaxom Exp $ + $Id: i18n.cpp,v 1.98 2007/07/21 17:52:41 tadi Exp $ Note to developers: How to safely integrate translations from third parties: @@ -1335,6 +1335,50 @@ const tI18nPhrase Phrases[] = { "", // Dansk "", // Czech }, + { "loading data", // English + "Daten nachladen", // Deutsch + "", // Slovenski + "", // Italiano + "", // Nederlands + "", // Português + "", // Français + "", // Norsk + "", // Finnish + "", // Polski + "", // Español + "", // Greek + "", // Svenska + "", // Românã + "", // Magyar + "", // Català + "", // Russian + "", // Hrvatski + "", // Eesti + "", // Dansk + "", // Czech + }, + { "an error occured!", // English + "Es ist ein Fehler aufgetreten!", // Deutsch + "", // Slovenski + "", // Italiano + "", // Nederlands + "", // Português + "", // Français + "", // Norsk + "", // Finnish + "", // Polski + "", // Español + "", // Greek + "", // Svenska + "", // Românã + "", // Magyar + "", // Català + "", // Russian + "", // Hrvatski + "", // Eesti + "", // Dansk + "", // Czech + }, { "Show live logo image", // English "Zeige das Live Logo", // Deutsch "", // Slovenski @@ -3180,13 +3224,12 @@ const tI18nPhrase Phrases[] = { "",// TODO "",// TODO "",// TODO - "",// TODO + "",// TODO "",// TODO "",// TODO "",// TODO Eesti "",// TODO Dansk "",// TODO Èesky (Czech) - }, { "User", // English "Benutzer", // Deutsch @@ -3496,7 +3539,7 @@ const tI18nPhrase Phrases[] = { "", // Dansk "", // Czech }, - { "Starts between", // English + { "Starts between", // English "Beginnt zwischen", // Deutsch "", // Slovenski "", // Italiano @@ -3517,8 +3560,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Wrong username or password", // English + }, + { "Wrong username or password", // English "Falscher Benutzername oder Passwort", // Deutsch "", // Slovenski "", // Italiano @@ -3539,8 +3582,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Required minimum version of epgsearch: ", // English + }, + { "Required minimum version of epgsearch: ", // English "Benötigte Mindestversion von epgsearch: ", // Deutsch "", // Slovenski "", // Italiano @@ -3561,8 +3604,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "EPGSearch version outdated! Please update.", // English + }, + { "EPGSearch version outdated! Please update.", // English "EPGSearch-Version zu alt, bitte updaten!", // Deutsch "", // Slovenski "", // Italiano @@ -3583,8 +3626,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Search for repeats.", // English + }, + { "Search for repeats.", // English "Nach Wiederholungen suchen.", // Deutsch "", // Slovenski "", // Italiano @@ -3605,7 +3648,7 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, + }, { "What's on", "Was läuft", "", // Slovenski @@ -3980,7 +4023,7 @@ const tI18nPhrase Phrases[] = { "", // Dansk "", // Czech }, - { "Couldn't find timer. Maybe you mistyped your request?", // English + { "Couldn't find timer. Maybe you mistyped your request?", // English "Konnte Timer nicht finden. Evtl. fehlerhafte Anforderung?", // Deutsch "", // Slovenski "", // Italiano @@ -4001,8 +4044,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Couldn't find channel or no channels available. Maybe you mistyped your request?", // English + }, + { "Couldn't find channel or no channels available. Maybe you mistyped your request?", // English "Konnte Kanal nicht finden oder keine Kanäle verfügbar. Ist die Anfrage korrekt?", // Deutsch "", // Slovenski "", // Italiano @@ -4023,8 +4066,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Page error", // English + }, + { "Page error", // English "Seitenfehler", // Deutsch "", // Slovenski "", // Italiano @@ -4045,8 +4088,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "If you encounter any bugs or would like to suggest new features, please use our bugtracker", // English + }, + { "If you encounter any bugs or would like to suggest new features, please use our bugtracker", // English "Für Fehler oder Verbesserungsvorschläge steht unser Bugtracker bereit", // Deutsch "", // Slovenski "", // Italiano @@ -4067,8 +4110,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Bugs and suggestions", // English + }, + { "Bugs and suggestions", // English "Fehlerberichte und Vorschläge", // Deutsch "", // Slovenski "", // Italiano @@ -4089,8 +4132,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Find more at the Internet Movie Database.", // English + }, + { "Find more at the Internet Movie Database.", // English "Weitere Informationen in der Internet Movie Database.", // Deutsch "", // Slovenski "", // Italiano @@ -4111,8 +4154,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Details view", // English + }, + { "Details view", // English "Ausführliche Ansicht", // Deutsch "", // Slovenski "", // Italiano @@ -4133,8 +4176,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "List view", // English + }, + { "List view", // English "Listenansicht", // Deutsch "", // Slovenski "", // Italiano @@ -4155,8 +4198,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "No timer defined", // English + }, + { "No timer defined", // English "Keine Timer vorhanden", // Deutsch "", // Slovenski "", // Italiano @@ -4177,8 +4220,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Start page", // English + }, + { "Start page", // English "Startseite", // Deutsch "", // Slovenski "", // Italiano @@ -4199,8 +4242,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "active", // English + }, + { "active", // English "aktiv", // Deutsch "", // Slovenski "", // Italiano @@ -4221,8 +4264,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "required", // English + }, + { "required", // English "erforderlich", // Deutsch "", // Slovenski "", // Italiano @@ -4243,8 +4286,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Local net (no login required)", // English + }, + { "Local net (no login required)", // English "Lokales Netz (keine Anmeldung notwendig)", // Deutsch "", // Slovenski "", // Italiano @@ -4265,8 +4308,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Theme", // English + }, + { "Theme", // English "Thema", // Deutsch "", // Slovenski "", // Italiano @@ -4287,8 +4330,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Please set login and password!", // English + }, + { "Please set login and password!", // English "Bitte Login und Passwort angeben!", // Deutsch "", // Slovenski "", // Italiano @@ -4309,8 +4352,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Please set a title for the timer!", // English + }, + { "Please set a title for the timer!", // English "Bitte einen Titel für den Timer angeben!", // Deutsch "", // Slovenski "", // Italiano @@ -4331,8 +4374,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Setup saved.", // English + }, + { "Setup saved.", // English "Einstellungen gespeichert.", // Deutsch "", // Slovenski "", // Italiano @@ -4353,8 +4396,8 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, - { "Trigger search timer update", // English + }, + { "Trigger search timer update", // English "Suchtimer-Update starten", // Deutsch "", // Slovenski "", // Italiano @@ -4375,7 +4418,7 @@ const tI18nPhrase Phrases[] = { "", // Eesti "", // Dansk "", // Czech - }, + }, /* { "", // English "", // Deutsch diff --git a/live/js/live/hinttips.js b/live/js/live/hinttips.js index 5cf899a..a750988 100644 --- a/live/js/live/hinttips.js +++ b/live/js/live/hinttips.js @@ -1,6 +1,10 @@ /* - * Extension of mootools Tips class for rounded corner - * tooltips of variable size up to some maximum. + * This is part of the live vdr plugin. See COPYING for license information. + * + * HintTips class. + * + * Extension of mootools Tips class for rounded corner tooltips of + * variable size up to some maximum. */ var HintTips = Tips.extend({ @@ -21,14 +25,3 @@ var HintTips = Tips.extend({ bt = new Element('div', {'class': this.options.className + '-tip-c'}).inject(bt); } }); - -window.addEvent('domready', function(){ - var tips = new HintTips($$('*[title]'), { - maxTitleChars: 100, - className: 'hint' - }); - }); - -window.addEvent('mousedown', function(){ - $$('.hint-tip').setStyle('visibility', 'hidden'); - });
\ No newline at end of file diff --git a/live/js/live/infowin.js b/live/js/live/infowin.js index 8787899..393cd87 100644 --- a/live/js/live/infowin.js +++ b/live/js/live/infowin.js @@ -1,6 +1,12 @@ /* - * Extension of mootools to display a popup window with - * some html code. + * This is part of the live vdr plugin. See COPYING for license information. + * + * InfoWin.js + * + * InfoWin class, InfoWin.Manager class, InfoWin.Ajax class. + * + * Extension of mootools to display a popup window with some html + * code. */ /* @@ -28,20 +34,22 @@ var InfoWin = new Class({ timeout: 0, onShow: Class.empty, onHide: Class.empty, + onDomExtend: Class.empty, className: 'info', wm: false, // overide default window manager. draggable: true, resizable: true, buttonimg: 'transparent.png', - bodyselect: 'div.epg_content', + bodyselect: 'div.content', titleselect: 'div.caption', + idSuffix: '-win-id', offsets: {'x': -16, 'y': -16} }, initialize: function(id, options){ this.setOptions(options); this.wm = this.options.wm || InfoWin.$wm; - this.winFrame = $(id + '-win-id'); + this.winFrame = $(id + this.options.idSuffix); if (!$defined(this.winFrame)){ this.build(id); this.wm.register(this); @@ -56,7 +64,7 @@ var InfoWin = new Class({ // with the user data, false otherwise. build: function(id){ this.winFrame = new Element('div', { - 'id': id + '-win-id', + 'id': id + this.options.idSuffix, 'class': this.options.className + '-win', 'styles': { 'position': 'absolute', @@ -144,7 +152,9 @@ var InfoWin = new Class({ fillBody: function(id){ var bodyElems = $$('#'+ id + ' ' + this.options.bodyselect); if ($defined(bodyElems) && bodyElems.length > 0) { - this.winBody.empty().adopt(bodyElems); + this.winBody.empty(); + this.fireEvent('onDomExtend', [id, bodyElems]); + this.winBody.adopt(bodyElems); return true; } return false; @@ -170,6 +180,12 @@ var InfoWin = new Class({ InfoWin.implement(new Events, new Options); +/* +Class: InfoWin.Manager + Provide an container and events for the created info win + instances. Closed info-wins are preserved in a hidden dom element + and used again if a window with a closed id is openend again. +*/ InfoWin.Manager = new Class({ options: { zIndex: 100, @@ -228,12 +244,17 @@ window.addEvent('domready', function(){ InfoWin.$wm = new InfoWin.Manager(); }); +/* +Class: InfoWin.Ajax + Use an instance of mootools Ajax class to asynchronously request + the content of an info win. +*/ InfoWin.Ajax = InfoWin.extend({ options: { loadingMsg: 'loading', errorMsg: 'an error occured!', - onError: Class.empty + onError: Class.empty, }, initialize: function(id, url, options){ @@ -273,25 +294,3 @@ InfoWin.Ajax = InfoWin.extend({ }); InfoWin.Ajax.implement(new Events, new Options); - - -window.addEvent('domready', function(){ - $$('a[href^="epginfo.html?epgid"]').each(function(el){ - var href = el.href; - var epgid = $pick(href, ""); - if (epgid != "") { - var extractId = /epgid=(\w+)/; - var found = extractId.exec(epgid); - if ($defined(found) && found.length > 1) { - epgid = found[1]; - el.addEvent('click', function(event){ - var event = new Event(event); - new InfoWin.Ajax(epgid, href).show(event); - event.stop(); - return false; - }); - } - } - }); - }); - diff --git a/live/js/live/pageenhance.js b/live/js/live/pageenhance.js new file mode 100644 index 0000000..6d1ff10 --- /dev/null +++ b/live/js/live/pageenhance.js @@ -0,0 +1,87 @@ +/* + * This is part of the live vdr plugin. See COPYING for license information. + * + * PageEnhance class. + * + * This class applies several functions to the page based on + * selectors. This class is quite project dependent and not a general + * purpose class. + */ + +var PageEnhance = new Class({ + options: { + epgLinkSelector: 'a[href^="epginfo.html?epgid"]', + hintTipSelector: '*[title]', + hintClassName: 'hint', + infoWinStrings: { + loadingMsg: 'loading', + errorMsg: 'an error occured!' + } + }, + + initialize: function(options){ + this.setOptions(options); + window.addEvent('domready', this.domReadySetup.bind(this)); + window.addEvent('mousedown', this.mouseDownSetup.bind(this)); + }, + + // actions applied on domready to the page. + domReadySetup: function(){ + $$(this.options.epgLinkSelector).each(this.epgPopup.bind(this)); + this.addHintTips($$(this.options.hintTipSelector)); + }, + + // actions applied on mouse down. + mouseDownSetup: function(){ + $$('.' + this.options.hintClassName + '-tip').setStyle('visibility', 'hidden'); + }, + + // Epg Popup function. Apply to all elements that should + // pop up an Epg InfoWin window. + epgPopup: function(el){ + var href = el.href; + var epgid = $pick(href, ""); + if (epgid != "") { + var extractId = /epgid=(\w+)/; + var found = extractId.exec(epgid); + if ($defined(found) && found.length > 1) { + epgid = found[1]; + el.addEvent('click', function(event){ + var event = new Event(event); + new InfoWin.Ajax(epgid, href, { + bodyselect: 'div.epg_content', + onDomExtend: this.domExtend.bind(this), + loadingMsg: this.options.infoWinStrings.loadingMsg, + errorMsg: this.options.infoWinStrings.errorMsg + }).show(event); + event.stop(); + return false; + }.bind(this)); + } + } + }, + + // registered as 'onDomExtend' event for InfoWin. Takes care to + // enhance the new dom elements too. + domExtend: function(id, elems){ + var sel = '#' + id + ' ' + this.options.hintTipSelector; + elems = $$(sel); + this.addHintTips(elems); + }, + + // change normal 'title'-Attributes into enhanced hinttips + // usesd by domExtend and domReadySetup functions. + addHintTips: function(elems){ + if (!$defined(this.tips)) { + this.tips = new HintTips(elems, { + maxTitleChars: 100, + className: this.options.hintClassName + }); + } + else { + $$(elems).each(this.tips.build, this.tips); + } + } + }); + +PageEnhance.implement(new Events, new Options); diff --git a/pages/pageelems.ecpp b/pages/pageelems.ecpp index e2fdb8d..c99d173 100644 --- a/pages/pageelems.ecpp +++ b/pages/pageelems.ecpp @@ -128,6 +128,15 @@ int update_status(1); <script type="text/javascript" src="js/live/liveajax.js"></script> <script type="text/javascript" src="js/live/infowin.js"></script> <script type="text/javascript" src="js/live/hinttips.js"></script> + <script type="text/javascript" src="js/live/pageenhance.js"></script> + <script type="text/javascript"><!-- + var liveEnhanced = new PageEnhance({ + infoWinStrings: { + loadingMsg: '<$ tr("loading data") $>', + errorMsg: '<$ tr("an error occured!") $>' + } + }); + --></script> <%cpp>if (LiveSetup().GetShowInfoBox()) { </%cpp> <script type="text/javascript" src="js/live/vdr_status.js"></script> <script type="text/javascript"><!-- |