From: Michael Prager <michael@pragers.de>
Date: Fri, 18 Dec 2009 03:02:10 +0000 (+0100)
Subject: fixed background image beeing used in fullscreen mode (now there is an extra CSS... 
X-Git-Url: https://code.delx.au/comingnext/commitdiff_plain/115ae575415729b32a75a5303c696e0efb0cde45

fixed background image beeing used in fullscreen mode (now there is an extra CSS class for the fullscreen background)
---

diff --git a/comingNext/index.html b/comingNext/index.html
index be1dd24..7ba8bf6 100644
--- a/comingNext/index.html
+++ b/comingNext/index.html
@@ -8,6 +8,7 @@
 <style type="text/css">
 .background { color:#ffffff; background-color:#000000 } /* Defines the background of the widget. If you want to use a background image, set useBackgroundImage = true below */
 					/* for the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef */
+.backgroundFullscreen { color:#ffffff; background-color:#000000 } /* Same as background but for the fullscreen version of the widget */
 .weekDay { }				/* Defines the appearance of all week day texts */
 .date { }				/* Defines the appearance of all date texts */
 .today { color:#ff0000; }		/* Defines the appearance of "Today" text */
@@ -40,6 +41,7 @@ var nothingText = 'No further events within ' + monthRange + ' months';		// text
 var enableDaylightSaving = true;// enable this if you are in a timezone that has daylight saving time (+1h)
 
 var cssStyle_background = "color:#ffffff; background-color:#000000"; // Defines the background of the widget. If you want to use a background image, set useBackgroundImage = true below. For the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef
+var cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000"; // Same as background but for the fullscreen version of the widget
 var cssStyle_weekDay = "";			// Defines the appearance of all week day texts
 var cssStyle_date = "";				// Defines the appearance of all date texts
 var cssStyle_today = "color:#ff0000";		// Defines the appearance of "Today" text
@@ -616,6 +618,7 @@ function updateScreen()
 	if( window.innerHeight > 91 && mode == 0) {
 		mode = 1;
 		cacheEntriesHtml = '';
+		document.getElementById('body').style.backgroundImage = "";
 		showFullscreen();
 	}
 	else if (window.innerHeight <= 91 && mode != 0) {
@@ -725,6 +728,7 @@ function showSettings()
 		enableDaylightSaving = document.forms[0].elements["settings.enableDaylightSaving"].checked;
 		
 		cssStyle_background = document.forms[0].elements["settings.cssStyle_background"].value;
+		cssStyle_backgroundFullscreen = document.forms[0].elements["settings.cssStyle_backgroundFullscreen"].value;
 		cssStyle_weekDay = document.forms[0].elements["settings.cssStyle_weekDay"].value;
 		cssStyle_date = document.forms[0].elements["settings.cssStyle_date"].value;
 		cssStyle_today = document.forms[0].elements["settings.cssStyle_today"].value;
@@ -774,6 +778,7 @@ function showSettings()
 	'<hr><table><tr><td>Enable Daylight Saving:<br><input name="settings.enableDaylightSaving" type="checkbox" value="true" ' + (enableDaylightSaving ? 'checked="checked"' : '') + '/></td>' + printHintBox('enable this if you are in a timezone that has daylight saving time (+1h)') +
 	'<hr style="margin-bottom:60px;"><h1 class="title">CSS Styles</h1>' +
 	'<hr><table><tr><td>.background:<br><input class="textInput" name="settings.cssStyle_background" type="text" value="' + cssStyle_background + '" /></td>' + printHintBox('Defines the background of the widget. If you want to use a background image, enable "useBackgroundImage" instead. For the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef') +
+	'<hr><table><tr><td>.backgroundFullscreen:<br><input class="textInput" name="settings.cssStyle_backgroundFullscreen" type="text" value="' + cssStyle_backgroundFullscreen + '" /></td>' + printHintBox('Same as background but for the fullscreen version of the widget') +
 	'<hr><table><tr><td>.weekDay:<br><input class="textInput" name="settings.cssStyle_weekDay" type="text" value="' + cssStyle_weekDay + '" /></td>' + printHintBox('Defines the appearance of all week day texts') +
 	'<hr><table><tr><td>.date:<br><input class="textInput" name="settings.cssStyle_date" type="text" value="' + cssStyle_date + '" /></td>' + printHintBox('Defines the appearance of all date texts') +
 	'<hr><table><tr><td>.today:<br><input class="textInput" name="settings.cssStyle_today" type="text" value="' + cssStyle_today + '" /></td>' + printHintBox('Defines the appearance of "Today" text') +
@@ -791,14 +796,8 @@ function changeCssClass(classname, properties)
 	for(var i = 0; i < document.styleSheets[0]['cssRules'].length; i++)
 	{
 		if (document.styleSheets[0]['cssRules'][i].selectorText == classname) {
-			//alert(document.styleSheets[0]['cssRules'][i].cssText);
-			//document.styleSheets[0]['cssRules'][i].cssText = classname + ' { ' + properties + ' }';
 			document.styleSheets[0].deleteRule(i);
-			//document.styleSheets[0].insertRule(classname + ' { ' + properties + ' }', 0);
 			document.styleSheets[0].insertRule(classname + ' { ' + properties + ' }', document.styleSheets[0]['cssRules'].length);
-			//document.styleSheets[0]['cssRules'][i].style.cssText = classname + ' { ' + properties + ' }';
-			//alert(document.styleSheets[0]['cssRules'][i].cssText);
-			//alert(document.styleSheets[0]['cssRules'][i].cssText + '\n'+ classname + ' { ' + properties + ' }');
 			break;
 		}
 	}
@@ -807,6 +806,7 @@ function changeCssClass(classname, properties)
 function updateCssClasses()
 {
 	changeCssClass(".background", cssStyle_background);
+	changeCssClass(".backgroundFullscreen", cssStyle_backgroundFullscreen);
 	changeCssClass(".weekDay", cssStyle_weekDay);
 	changeCssClass(".date", cssStyle_date);
 	changeCssClass(".today", cssStyle_today);
@@ -840,6 +840,7 @@ function restoreDefaultSettings()
 	enableDaylightSaving = true;
 
 	cssStyle_background = "color:#ffffff; background-color:#000000";
+	cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
 	cssStyle_weekDay = "";
 	cssStyle_date = "";
 	cssStyle_today = "color:#ff0000";
@@ -953,6 +954,11 @@ function loadSettings()
 		cssStyle_background = widget.preferenceForKey('cssStyle_background');
 	else
 		cssStyle_background = "color:#ffffff; background-color:#000000";
+
+	if (widget.preferenceForKey('cssStyle_backgroundFullscreen'))
+		cssStyle_backgroundFullscreen = widget.preferenceForKey('cssStyle_backgroundFullscreen');
+	else
+		cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
 		
 	if (widget.preferenceForKey('cssStyle_weekDay'))
 		cssStyle_weekDay = widget.preferenceForKey('cssStyle_weekDay');
@@ -1018,6 +1024,7 @@ function saveSettings()
 	widget.setPreferenceForKey(enableDaylightSaving ? 'true' : 'false', 'enableDaylightSaving');
 	
 	widget.setPreferenceForKey(cssStyle_background, 'cssStyle_background');
+	widget.setPreferenceForKey(cssStyle_backgroundFullscreen, 'cssStyle_backgroundFullscreen');
 	widget.setPreferenceForKey(cssStyle_weekDay, 'cssStyle_weekDay');
 	widget.setPreferenceForKey(cssStyle_date, 'cssStyle_date');
 	widget.setPreferenceForKey(cssStyle_today, 'cssStyle_today');
@@ -1073,6 +1080,7 @@ function showFullscreen()
 	document.getElementById("fullscreenView").style.display = "block";
 	document.getElementById("aboutView").style.display = "none";
 	document.getElementById("settingsView").style.display = "none";
+	document.getElementById('body').className = "backgroundFullscreen";
 	createMenu();
 	updateData();
 }
@@ -1094,6 +1102,10 @@ function updateHomescreen()
 			document.getElementById('body').style.backgroundColor = 'none';
 			window.widget.performTransition();
 		}
+		else if (document.getElementById('body').style.backgroundImage == "")
+		{
+			document.getElementById('body').style.backgroundImage = 'url(background_' + orientation + '.png)';
+		}
 	}
 }
 
@@ -1103,6 +1115,7 @@ function showHomescreen()
 	document.getElementById("fullscreenView").style.display = "none";
 	document.getElementById("aboutView").style.display = "none";
 	document.getElementById("settingsView").style.display = "none";
+	document.getElementById('body').className = "background";
 	updateData();
 }
 
@@ -1111,7 +1124,7 @@ function showHomescreen()
 <style type="text/css">
 table { margin:0px; padding:0px; border-spacing:0px; }
 td { padding:0px 5px 0px 0px; white-space:nowrap; overflow:hidden; }
-hr { w_idth:100%; color:#ffffff; background-color:#ffffff; height:1px; text-align:left; border-style:none; }
+hr { color:#ffffff; background-color:#ffffff; height:1px; text-align:left; border-style:none; }
 .settingsInfo { display:none; font-style:italic; }
 .title { font-weight:bold; font-size:14pt; }
 .textInput { width:90%; }
diff --git a/comingNextB/index.html b/comingNextB/index.html
index ef67e19..a0e6f0d 100644
--- a/comingNextB/index.html
+++ b/comingNextB/index.html
@@ -8,6 +8,7 @@
 <style type="text/css">
 .background { color:#ffffff; background-color:#000000 } /* Defines the background of the widget. If you want to use a background image, set useBackgroundImage = true below */
 					/* for the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef */
+.backgroundFullscreen { color:#ffffff; background-color:#000000 } /* Same as background but for the fullscreen version of the widget */
 .weekDay { }				/* Defines the appearance of all week day texts */
 .date { }				/* Defines the appearance of all date texts */
 .today { color:#ff0000; }		/* Defines the appearance of "Today" text */
@@ -40,6 +41,7 @@ var nothingText = 'No further events within ' + monthRange + ' months';		// text
 var enableDaylightSaving = true;// enable this if you are in a timezone that has daylight saving time (+1h)
 
 var cssStyle_background = "color:#ffffff; background-color:#000000"; // Defines the background of the widget. If you want to use a background image, set useBackgroundImage = true below. For the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef
+var cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000"; // Same as background but for the fullscreen version of the widget
 var cssStyle_weekDay = "";			// Defines the appearance of all week day texts
 var cssStyle_date = "";				// Defines the appearance of all date texts
 var cssStyle_today = "color:#ff0000";		// Defines the appearance of "Today" text
@@ -616,6 +618,7 @@ function updateScreen()
 	if( window.innerHeight > 91 && mode == 0) {
 		mode = 1;
 		cacheEntriesHtml = '';
+		document.getElementById('body').style.backgroundImage = "";
 		showFullscreen();
 	}
 	else if (window.innerHeight <= 91 && mode != 0) {
@@ -725,6 +728,7 @@ function showSettings()
 		enableDaylightSaving = document.forms[0].elements["settings.enableDaylightSaving"].checked;
 		
 		cssStyle_background = document.forms[0].elements["settings.cssStyle_background"].value;
+		cssStyle_backgroundFullscreen = document.forms[0].elements["settings.cssStyle_backgroundFullscreen"].value;
 		cssStyle_weekDay = document.forms[0].elements["settings.cssStyle_weekDay"].value;
 		cssStyle_date = document.forms[0].elements["settings.cssStyle_date"].value;
 		cssStyle_today = document.forms[0].elements["settings.cssStyle_today"].value;
@@ -774,6 +778,7 @@ function showSettings()
 	'<hr><table><tr><td>Enable Daylight Saving:<br><input name="settings.enableDaylightSaving" type="checkbox" value="true" ' + (enableDaylightSaving ? 'checked="checked"' : '') + '/></td>' + printHintBox('enable this if you are in a timezone that has daylight saving time (+1h)') +
 	'<hr style="margin-bottom:60px;"><h1 class="title">CSS Styles</h1>' +
 	'<hr><table><tr><td>.background:<br><input class="textInput" name="settings.cssStyle_background" type="text" value="' + cssStyle_background + '" /></td>' + printHintBox('Defines the background of the widget. If you want to use a background image, enable "useBackgroundImage" instead. For the default themes, black, gray, and light blue, codes are #292029, #e7dfe7, #009aef') +
+	'<hr><table><tr><td>.backgroundFullscreen:<br><input class="textInput" name="settings.cssStyle_backgroundFullscreen" type="text" value="' + cssStyle_backgroundFullscreen + '" /></td>' + printHintBox('Same as background but for the fullscreen version of the widget') +
 	'<hr><table><tr><td>.weekDay:<br><input class="textInput" name="settings.cssStyle_weekDay" type="text" value="' + cssStyle_weekDay + '" /></td>' + printHintBox('Defines the appearance of all week day texts') +
 	'<hr><table><tr><td>.date:<br><input class="textInput" name="settings.cssStyle_date" type="text" value="' + cssStyle_date + '" /></td>' + printHintBox('Defines the appearance of all date texts') +
 	'<hr><table><tr><td>.today:<br><input class="textInput" name="settings.cssStyle_today" type="text" value="' + cssStyle_today + '" /></td>' + printHintBox('Defines the appearance of "Today" text') +
@@ -791,14 +796,8 @@ function changeCssClass(classname, properties)
 	for(var i = 0; i < document.styleSheets[0]['cssRules'].length; i++)
 	{
 		if (document.styleSheets[0]['cssRules'][i].selectorText == classname) {
-			//alert(document.styleSheets[0]['cssRules'][i].cssText);
-			//document.styleSheets[0]['cssRules'][i].cssText = classname + ' { ' + properties + ' }';
 			document.styleSheets[0].deleteRule(i);
-			//document.styleSheets[0].insertRule(classname + ' { ' + properties + ' }', 0);
 			document.styleSheets[0].insertRule(classname + ' { ' + properties + ' }', document.styleSheets[0]['cssRules'].length);
-			//document.styleSheets[0]['cssRules'][i].style.cssText = classname + ' { ' + properties + ' }';
-			//alert(document.styleSheets[0]['cssRules'][i].cssText);
-			//alert(document.styleSheets[0]['cssRules'][i].cssText + '\n'+ classname + ' { ' + properties + ' }');
 			break;
 		}
 	}
@@ -807,6 +806,7 @@ function changeCssClass(classname, properties)
 function updateCssClasses()
 {
 	changeCssClass(".background", cssStyle_background);
+	changeCssClass(".backgroundFullscreen", cssStyle_backgroundFullscreen);
 	changeCssClass(".weekDay", cssStyle_weekDay);
 	changeCssClass(".date", cssStyle_date);
 	changeCssClass(".today", cssStyle_today);
@@ -840,6 +840,7 @@ function restoreDefaultSettings()
 	enableDaylightSaving = true;
 
 	cssStyle_background = "color:#ffffff; background-color:#000000";
+	cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
 	cssStyle_weekDay = "";
 	cssStyle_date = "";
 	cssStyle_today = "color:#ff0000";
@@ -953,6 +954,11 @@ function loadSettings()
 		cssStyle_background = widget.preferenceForKey('cssStyle_background');
 	else
 		cssStyle_background = "color:#ffffff; background-color:#000000";
+
+	if (widget.preferenceForKey('cssStyle_backgroundFullscreen'))
+		cssStyle_backgroundFullscreen = widget.preferenceForKey('cssStyle_backgroundFullscreen');
+	else
+		cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
 		
 	if (widget.preferenceForKey('cssStyle_weekDay'))
 		cssStyle_weekDay = widget.preferenceForKey('cssStyle_weekDay');
@@ -1018,6 +1024,7 @@ function saveSettings()
 	widget.setPreferenceForKey(enableDaylightSaving ? 'true' : 'false', 'enableDaylightSaving');
 	
 	widget.setPreferenceForKey(cssStyle_background, 'cssStyle_background');
+	widget.setPreferenceForKey(cssStyle_backgroundFullscreen, 'cssStyle_backgroundFullscreen');
 	widget.setPreferenceForKey(cssStyle_weekDay, 'cssStyle_weekDay');
 	widget.setPreferenceForKey(cssStyle_date, 'cssStyle_date');
 	widget.setPreferenceForKey(cssStyle_today, 'cssStyle_today');
@@ -1073,6 +1080,7 @@ function showFullscreen()
 	document.getElementById("fullscreenView").style.display = "block";
 	document.getElementById("aboutView").style.display = "none";
 	document.getElementById("settingsView").style.display = "none";
+	document.getElementById('body').className = "backgroundFullscreen";
 	createMenu();
 	updateData();
 }
@@ -1094,6 +1102,10 @@ function updateHomescreen()
 			document.getElementById('body').style.backgroundColor = 'none';
 			window.widget.performTransition();
 		}
+		else if (document.getElementById('body').style.backgroundImage == "")
+		{
+			document.getElementById('body').style.backgroundImage = 'url(background_' + orientation + '.png)';
+		}
 	}
 }
 
@@ -1103,6 +1115,7 @@ function showHomescreen()
 	document.getElementById("fullscreenView").style.display = "none";
 	document.getElementById("aboutView").style.display = "none";
 	document.getElementById("settingsView").style.display = "none";
+	document.getElementById('body').className = "background";
 	updateData();
 }
 
@@ -1111,7 +1124,7 @@ function showHomescreen()
 <style type="text/css">
 table { margin:0px; padding:0px; border-spacing:0px; }
 td { padding:0px 5px 0px 0px; white-space:nowrap; overflow:hidden; }
-hr { w_idth:100%; color:#ffffff; background-color:#ffffff; height:1px; text-align:left; border-style:none; }
+hr { color:#ffffff; background-color:#ffffff; height:1px; text-align:left; border-style:none; }
 .settingsInfo { display:none; font-style:italic; }
 .title { font-weight:bold; font-size:14pt; }
 .textInput { width:90%; }