- Introducing explicit pageenhance javascript class. See Changelog and

  the files itself for more info.

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.
 
diff --git a/i18n.cpp b/i18n.cpp
index b6a374e..1545298 100644
--- a/i18n.cpp
+++ b/i18n.cpp
@@ -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"><!--