From 4725332b35d04af6b239b42785c91a9962a97535 Mon Sep 17 00:00:00 2001
From: Michael Prager <michael@pragers.de>
Date: Mon, 21 Dec 2009 01:34:34 +0100
Subject: [PATCH] * code cleanup: settings are stored as an object. This allows
 to dynamically generate settings page, reducing the overall code size. *
 increased update interval for screen rotation detection from 3 to 1 secs

---
 comingNext/index.html  | 661 ++++++++++++++++++-----------------------
 comingNextB/index.html | 661 ++++++++++++++++++-----------------------
 2 files changed, 586 insertions(+), 736 deletions(-)

diff --git a/comingNext/index.html b/comingNext/index.html
index 1c6c2e9..668867e 100644
--- a/comingNext/index.html
+++ b/comingNext/index.html
@@ -6,50 +6,198 @@
 <title>Coming Next</title>
 
 <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 */
-.tomorrow { color:#0000ff; }		/* Defines the appearance of "Tomorrow" text */
-.time { }				/* Defines the appearance of all time texts */
-.now { color:#ff00ff; }			/* Defines the appearance of "Now" text */
-.description { }			/* Defines the appearance of all event descriptions */
-.icon { width:15px; height:15px; }	/* Defines size and appearance of icons */
+/* The following classes can be modified by widget settings */
+.background { }
+.backgroundFullscreen { }
+.weekDay { }
+.date { }
+.today { }
+.tomorrow { }
+.time { }
+.now { }
+.description { }
+.icon { }
 </style>
 
 <script>
-var monthRange = 2;		// number of months to include in the event list
-var includeTodos = true;	// disable to remove ToDos from event list
-var useBackgroundImage = true;	// use background_portrait.png and background_landscape.png to fake transparency. Set to "false" to use a solid background color
-var showCombinedDateTime = false;// only show the time for events happening today, otherwise just show the date
-var showLocation = true;	// show the location for meeting events
-var showTodayAsText = true;	// if enabled, the current date will be shown as "Today" instead of "31.12"
-var todayText = 'Today';	// text to display for "Today"
-var tomorrowText = 'Tomorrow';	// text to display for "Tomorrow"
-var showNowAsText = true;	// if enabled, the appointment time will be shown as "Now" instead of "12:00"
-var nowText = 'Now';		// text to display for "Now"
-var dateSeparator = '.';	// separator for dates. e.g. "31.12" or "31/12"
-var dateFormat = 'auto'		// how dates will be displayed. 'auto' will autodetect your phone's date format setting. 'MMDD' will write month first, 'DDMM' will write day first
-var weekDayLength = 2;		// defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"
-var updateDataInterval = 5;	// how many minutes to wait before updating the displayed data. The higher the number, the less battery is used
-var calendarApp = 0x10005901;	// UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar
-var eventsPerWidget = 4;	// number of events to show per widget. Default is 4
-var showNothingText = true;	// if set to "true", show a text if no events are in the list
-var nothingText = 'No further events within ' + monthRange + ' months';		// text to show when no events are in the list
-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
-var cssStyle_tomorrow = "color:#0000ff";	// Defines the appearance of "Tomorrow" text
-var cssStyle_time = "";				// Defines the appearance of all time texts
-var cssStyle_now = "color:#ff00ff";		// Defines the appearance of "Now" text
-var cssStyle_description = "";			// Defines the appearance of all event descriptions
-var cssStyle_icon = "width:15px; height:15px";	// Defines size and appearance of icons
+// valid types for the config object are 'Int', 'Bool', 'String', 'Enum', 'UID'
+var config = {
+monthRange: {
+	Type: 'Int',
+	Default: 2,
+	Value: 2,
+	Name: 'Month Range',
+	Info: 'number of months to include in the event list',},
+includeTodos: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Include ToDos',
+	Info: 'disable to remove ToDos from event list',},
+useBackgroundImage: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Use Background Image',
+	Info: 'use background_portrait.png and background_landscape.png to fake transparency. Disable to use a solid background color',},
+showCombinedDateTime: {
+	Type: 'Bool',
+	Default: false,
+	Value: false,
+	Name: 'Show Combined Date/Time',
+	Info: 'only show the time for events happening today, otherwise just show the date',},
+showLocation: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Location',
+	Info: 'show the location for meeting events',},
+showTodayAsText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Today as Text',
+	Info: 'if enabled, the current date will be shown as "Today" instead of "31.12"',},
+todayText: {
+	Type: 'String',
+	Default: 'Today',
+	Value: 'Today',
+	Name: '"Today" Text',
+	Info: 'text to display for "Today"',},
+tomorrowText: {
+	Type: 'String',
+	Default: 'Tomorrow',
+	Value: 'Tomorrow',
+	Name: '"Tomorrow" Text',
+	Info: 'text to display for "Tomorrow"',},
+showNowAsText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Now as Text',
+	Info: 'if enabled, the appointment time will be shown as "Now" instead of "12:00"',},
+nowText: {
+	Type: 'String',
+	Default: 'Now',
+	Value: 'Now',
+	Name: '"Now" Text',
+	Info: 'text to display for "Now"',},
+dateSeparator: {
+	Type: 'String',
+	Default: '.',
+	Value: '.',
+	Name: 'Date Separator',
+	Info: 'separator for dates. e.g. "31.12" or "31/12"',},
+dateFormat: {
+	Type: 'Enum',
+	Default: 'auto',
+	Value: 'auto',
+	ValidValues: ['auto', 'DDMM', 'MMDD'],
+	Name: 'Date Format',
+	Info: 'how dates will be displayed. \'auto\' will autodetect your phone\'s date format setting. \'MMDD\' will write month first, \'DDMM\' will write day first',},
+weekDayLength: {
+	Type: 'Int',
+	Default: 2,
+	Value: 2,
+	Name: 'Weekday Length',
+	Info: 'defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"',},
+updateDataInterval: {
+	Type: 'Int',
+	Default: 5,
+	Value: 5,
+	Name: 'Update Data Interval',
+	Info: 'how many minutes to wait before updating the displayed data. The higher the number, the less battery is used',},
+calendarApp: {
+	Type: 'UID',
+	Default: 0x10005901,
+	Value: 0x10005901,
+	Name: 'Calendar Application To Run',
+	Info: 'UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar',},
+eventsPerWidget: {
+	Type: 'Int',
+	Default: 4,
+	Value: 4,
+	Name: 'Events Per Widget',
+	Info: 'number of events to show per widget. Default is 4',},
+showNothingText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show "Nothing" Text',
+	Info: 'if enabled, show a text if no events are in the list',},
+nothingText: {
+	Type: 'String',
+	Default: 'No further events within 2 months',
+	Value: 'No further events within 2 months',
+	Name: '"No further events..." Text',
+	Info: 'text to show when no events are in the list',},
+enableDaylightSaving: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Enable Daylight Saving (+1h)',
+	Info: 'enable this if you are in a timezone that has daylight saving time (+1h)',},
+cssStyle_background: {
+	Type: 'String',
+	Default: 'color:#ffffff; background-color:#000000',
+	Value: 'color:#ffffff; background-color:#000000',
+	Name: '.background',
+	Info: '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',},
+cssStyle_backgroundFullscreen: {
+	Type: 'String',
+	Default: 'color:#ffffff; background-color:#000000',
+	Value: 'color:#ffffff; background-color:#000000',
+	Name: '.backgroundFullscreen',
+	Info: 'Same as background but for the fullscreen version of the widget',},
+cssStyle_weekDay: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.weekDay',
+	Info: 'Defines the appearance of all week day texts',},
+cssStyle_date: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.date',
+	Info: 'Defines the appearance of all date texts',},
+cssStyle_today: {
+	Type: 'String',
+	Default: 'color:#ff0000',
+	Value: 'color:#ff0000',
+	Name: '.today',
+	Info: 'Defines the appearance of "Today" text',},
+cssStyle_tomorrow: {
+	Type: 'String',
+	Default: 'color:#0000ff',
+	Value: 'color:#0000ff',
+	Name: '.tomorrow',
+	Info: 'Defines the appearance of "Tomorrow" text',},
+cssStyle_time: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.time',
+	Info: 'Defines the appearance of all time texts',},
+cssStyle_now: {
+	Type: 'String',
+	Default: 'color:#ff00ff',
+	Value: 'color:#ff00ff',
+	Name: '.now',
+	Info: 'Defines the appearance of "Now" text',},
+cssStyle_description: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.description',
+	Info: 'Defines the appearance of all event descriptions',},
+cssStyle_icon: {
+	Type: 'String',
+	Default: 'width:15px; height:15px',
+	Value: 'width:15px; height:15px',
+	Name: '.icon',
+	Info: 'Defines size and appearance of icons',},
+}
 
 //-------------------------------------------------------
 // Nothing of interest from here on...
@@ -329,7 +477,7 @@ function parseDate(dateString)
 	console.info('year=' + year + ' month=' + month + ' day=' + day + ' hours=' + hours + ' minutes=' + minutes+ ' seconds=' + seconds);
 
 	// take care of daylight saving time
-	if (enableDaylightSaving) {
+	if (config['enableDaylightSaving'].Value) {
 		var date = new Date(year, month - 1, day, hours, minutes, seconds);
 		if (summertime && date > daylightsavingWinter && date < daylightsavingSummer)
 			hours -= 1;
@@ -348,27 +496,27 @@ function formatDate(date, format)
 	while (day.length < 2) { day = '0' + day; }
 	while (month.length < 2) { month = '0' + month; }
 
-	if (showTodayAsText && isToday(date))
-		return '<span class="today">' + todayText + '</span>';
-	if (showTodayAsText && isTomorrow(date))
-		return '<span class="tomorrow">' + tomorrowText + '</span>';
+	if (config['showTodayAsText'].Value && isToday(date))
+		return '<span class="today">' + config['todayText'].Value + '</span>';
+	if (config['showTodayAsText'].Value && isTomorrow(date))
+		return '<span class="tomorrow">' + config['tomorrowText'].Value + '</span>';
 
 	var dateArr = format.replace(/,/g,'').replace(/\./g,':').replace(/  /g,' ').split(' ');
 	if (dateArr.length != 5 && dateArr.length != 6) {
 		// we don't know how to format this
-		if (dateFormat == 'auto' || dateFormat == 'DDMM')
-			return day + dateSeparator + month;
+		if (config['dateFormat'].Value == 'auto' || config['dateFormat'].Value == 'DDMM')
+			return day + config['dateSeparator'].Value + month;
 		else
-			return month + dateSeparator + day;
+			return month + config['dateSeparator'].Value + day;
 	}
 
 	var dayFirst = true;
-	if (dateFormat == 'MMDD')
+	if (config['dateFormat'].Value == 'MMDD')
 		dayFirst = false;
-	else if (dateFormat == 'DDMM')
+	else if (config['dateFormat'].Value == 'DDMM')
 		dayFirst = true;
 	else {
-		// dateFormat == 'auto', try to detect system setting
+		// config['dateFormat'].Value == 'auto', try to detect system setting
 		// parse date
 		var day_ = dateArr[1];
 		var month_ = dateArr[2];
@@ -391,9 +539,9 @@ function formatDate(date, format)
 	}
 
 	if (dayFirst)
-		return day + dateSeparator + month;
+		return day + config['dateSeparator'].Value + month;
 	else
-		return month + dateSeparator + day;
+		return month + config['dateSeparator'].Value + day;
 }
 
 function formatTime(date)
@@ -403,8 +551,8 @@ function formatTime(date)
 	var time = date.toLocaleTimeString().replace(/[\.:]00/, ''); // remove seconds from string
 	if (time.replace(/\./, ':').split(':')[0].length < 2)
 		time = '0' + time;
-	if (showNowAsText && date.getTime() == now.getTime())
-		time = '<span class="now">' + nowText + '</span>';
+	if (config['showNowAsText'].Value && date.getTime() == now.getTime())
+		time = '<span class="now">' + config['nowText'].Value + '</span>';
 	return time;
 }
 
@@ -419,7 +567,7 @@ function updateData()
 			Type:'CalendarEntry',
 			Filter:{
 				StartRange: (new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0)),
-				EndRange: (new Date(now.getFullYear(), now.getMonth() + monthRange, now.getDate(), 0, 0, 0))
+				EndRange: (new Date(now.getFullYear(), now.getMonth() + config['monthRange'].Value, now.getDate(), 0, 0, 0))
 			}
 		}
 		var meetingResult = calendarService.IDataSource.GetList(meetingListFiltering);
@@ -427,7 +575,7 @@ function updateData()
 
 		// todos don't, they start on 00:00 hrs., but should be visible anyway
 		// this will generate a list of passed todos. We have to check if they have been marked as "done" yet
-		if (includeTodos) {
+		if (config['includeTodos'].Value) {
 			var todayTodoListFiltering = {
 				Type:'CalendarEntry',
 				Filter:{
@@ -456,7 +604,7 @@ function updateData()
 		var eventIds = [];
 		var max;
 		if (mode == 0)
-			max = ((panelNum == 0) ? eventsPerWidget : 2 * eventsPerWidget);
+			max = ((panelNum == 0) ? config['eventsPerWidget'].Value : 2 * config['eventsPerWidget'].Value);
 		else
 			max = 30; // we can display a lot more events in fullscreen mode
 
@@ -479,7 +627,7 @@ function updateData()
 				);
 
 				// we don't want ToDos when includeTodos == false or when they are completed
-				if (entry.Type == 'ToDo' && (entry.Status == "TodoCompleted" || !includeTodos)) {
+				if (entry.Type == 'ToDo' && (entry.Status == "TodoCompleted" || !config['includeTodos'].Value)) {
 					console.info('skipping ' + entry.id );
 					counter--;
 					continue;
@@ -495,7 +643,7 @@ function updateData()
 
 				// summary can be undefined!
 				var Summary = ((entry.Summary == null) ? '' : entry.Summary);
-				if (entry.Type == 'Meeting' && entry.Location != '' && showLocation)
+				if (entry.Type == 'Meeting' && entry.Location != '' && config['showLocation'].Value)
 					Summary += ', ' + entry.Location;
 				
 				// fix by yves: determine start and end dates/times
@@ -558,7 +706,7 @@ function updateData()
 				}
 
 				// skip events for the first panel in case this is the second one and we're not in fullscreen mode
-				if (mode == 0 && panelNum == 1 && counter < eventsPerWidget + 1) {
+				if (mode == 0 && panelNum == 1 && counter < config['eventsPerWidget'].Value + 1) {
 					console.info('skipping (already in first widget) ' + entry.id);
 					continue;
 				}
@@ -569,16 +717,16 @@ function updateData()
 					// some languages have very strange locale date formats, can't parse all those. Also some todos don't have dates at all.
 					entriesHtml += '<td colspan="4"><span class="date">' + entryDate + '</span> ';
 				} else {
-					var weekDay = date.toLocaleDateString().substr(0,weekDayLength);
+					var weekDay = date.toLocaleDateString().substr(0,config['weekDayLength'].Value);
 					var time = formatTime(date);
 					var dateStr = formatDate(date, entryDate);
 					if (entry.Type == 'ToDo' || entry.Type == 'Anniversary' || entry.Type == 'DayEvent' || entry.Type == 'Reminder') {
-						if ((isToday(date) || isTomorrow(date)) && showTodayAsText) // show weekday if the date string is not text. looks odd otherwise
+						if ((isToday(date) || isTomorrow(date)) && config['showTodayAsText'].Value) // show weekday if the date string is not text. looks odd otherwise
 							entriesHtml += '<td colspan="4" width="1px"><span class="date">' + dateStr + '</span> ';
 						else
 							entriesHtml += '<td class="weekDay" width="1px">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td colspan="2">';
 					} else if (entry.Type == 'Meeting') {
-						if (showCombinedDateTime) {
+						if (config['showCombinedDateTime'].Value) {
 							if (isToday(date))
 								entriesHtml += '<td width="1px" colspan="4"><span class="today">' + time + '</span> ';
 							else if (isTomorrow(date))
@@ -586,7 +734,7 @@ function updateData()
 							else
 								entriesHtml += '<td width="1px" class="weekDay">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td colspan="2">';
 						} else {
-							if ((isToday(date) || isTomorrow(date)) && showTodayAsText)
+							if ((isToday(date) || isTomorrow(date)) && config['showTodayAsText'].Value)
 								entriesHtml += '<td colspan="4" width="1px"><span class="today">' + dateStr + '</span> <span class="time">' + time + '</span> ';
 							else
 								entriesHtml += '<td width="1px" class="weekDay">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td width="1px" class="time">' + time + '</td><td>';
@@ -597,8 +745,8 @@ function updateData()
 			}
 		}
 		entriesHtml += '</table>';
-		if (showNothingText && entriesHtml == '<table></table>')
-			entriesHtml = '<div style="width:295px; height:75px; text-align:center; line-height:75px; overflow:visible;">' + nothingText + '</div>';
+		if (config['showNothingText'].Value && entriesHtml == '<table></table>')
+			entriesHtml = '<div style="width:295px; height:75px; text-align:center; line-height:75px; overflow:visible;">' + config['nothingText'].Value + '</div>';
 		if (cacheEntriesHtml != entriesHtml) {
 			if (mode == 0)
 				document.getElementById('calendarList').innerHTML = entriesHtml;
@@ -636,7 +784,7 @@ function updateScreen()
 function launchCalendar()
 {
 	try {
-		widget.openApplication(calendarApp, "");
+		widget.openApplication(config['calendarApp'].Value, "");
 		//window.close();
 	} catch(e) {
 		error('starting Calendar App');
@@ -659,14 +807,14 @@ function init()
 	collectLocales();
 	//updateData();
 	requestNotification();
-	window.setInterval('updateData()', 1000 * 60 * updateDataInterval);
+	window.setInterval('updateData()', 1000 * 60 * config['updateDataInterval'].Value);
 
 	mode = 0;
 	showHomescreen();
 	updateScreen();
-	if (useBackgroundImage)
-		// check for screen rotation every 3 secs
-		window.setInterval('updateScreen()', 1000 * 3);
+	if (config['useBackgroundImage'].Value)
+		// check for screen rotation every 1 secs
+		window.setInterval('updateScreen()', 1000 * 1);
 }
 
 function createMenu()
@@ -697,47 +845,24 @@ function showSettings()
 	
 	window.menu.setLeftSoftkeyLabel("Save", function()
 	{
-		//document.forms[0].elements["settings.monthRange"].value = monthRange;
-		monthRange = parseInt(document.forms[0].elements["settings.monthRange"].value);
-		if (monthRange < 0 || monthRange > 100)
-			monthRange = 2;
-		includeTodos = document.forms[0].elements["settings.includeTodos"].checked;
-		useBackgroundImage = document.forms[0].elements["settings.useBackgroundImage"].checked;
-		showCombinedDateTime = document.forms[0].elements["settings.showCombinedDateTime"].checked;
-		showLocation = document.forms[0].elements["settings.showLocation"].checked;
-		showTodayAsText = document.forms[0].elements["settings.showTodayAsText"].checked;
-		todayText = document.forms[0].elements["settings.todayText"].value;
-		tomorrowText = document.forms[0].elements["settings.tomorrowText"].value;
-		showNowAsText = document.forms[0].elements["settings.showNowAsText"].checked;
-		nowText = document.forms[0].elements["settings.nowText"].value;
-		dateSeparator = document.forms[0].elements["settings.dateSeparator"].value;
-		dateFormat = document.forms[0].elements["settings.dateFormat"].value;
-		if (dateFormat != 'auto' && dateFormat != 'DDMM' && dateFormat != 'MMDD')
-			dateFormat = 'auto';
-		weekDayLength = Number(parseInt(document.forms[0].elements["settings.weekDayLength"].value));
-		if (weekDayLength < 0 || weekDayLength > 20)
-			weekDayLength = 2;
-		updateDataInterval = parseInt(document.forms[0].elements["settings.updateDataInterval"].value);
-		if (updateDataInterval < 1 || updateDataInterval > 1000)
-			updateDataInterval = 5;
-		calendarApp = parseInt(document.forms[0].elements["settings.calendarApp"].value);
-		eventsPerWidget = parseInt(document.forms[0].elements["settings.eventsPerWidget"].value);
-		if (eventsPerWidget < 1 || eventsPerWidget > 10)
-			eventsPerWidget = 4;
-		showNothingText = document.forms[0].elements["settings.showNothingText"].checked;
-		nothingText = document.forms[0].elements["settings.nothingText"].value;
-		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;
-		cssStyle_tomorrow = document.forms[0].elements["settings.cssStyle_tomorrow"].value;
-		cssStyle_time = document.forms[0].elements["settings.cssStyle_time"].value;
-		cssStyle_now = document.forms[0].elements["settings.cssStyle_now"].value;
-		cssStyle_description = document.forms[0].elements["settings.cssStyle_description"].value;
-		cssStyle_icon = document.forms[0].elements["settings.cssStyle_icon"].value;
+		for (var key in config) {
+			if (config[key].Type == 'String')
+				config[key].Value = document.forms[0].elements["settings." + key].value;
+			else if (config[key].Type == 'Int') {
+				config[key].Value = parseInt(document.forms[0].elements["settings." + key].value);
+				if (config[key].Value < 0)
+					config[key].Value = config[key].Default;
+			}
+			else if (config[key].Type == 'Bool')
+				config[key].Value = document.forms[0].elements["settings." + key].checked;
+			else if (config[key].Type == 'UID')
+				config[key].Value = parseInt(document.forms[0].elements["settings." + key].value);
+			else if (config[key].Type == 'Enum') {
+				config[key].Value = document.forms[0].elements["settings." + key].value;
+				if (config[key].ValidValues.indexOf(config[key].Value) == -1)
+					config[key].Value = config[key].Default;
+			}
+		}
 				
 		updateCssClasses();
 		
@@ -752,44 +877,26 @@ function showSettings()
 		showFullscreen();
 	});
 	
-	document.getElementById("settingsList").innerHTML = 
-	'<form>' +
-	'<table><tr><td>Month Range:<br><input class="textInput" name="settings.monthRange" type="text" value="' + monthRange + '" /></td>' + printHintBox('number of months to include in the event list') +
-	'<hr><table><tr><td>Include ToDos:<br><input name="settings.includeTodos" type="checkbox" value="true" ' + (includeTodos ? 'checked="checked"' : '') + '/></td>' + printHintBox('disable to remove ToDos from event list') +
-	'<hr><table><tr><td>Use Background Image:<br><input name="settings.useBackgroundImage" type="checkbox" value="true" ' + (useBackgroundImage ? 'checked="checked"' : '') + '/></td>' + printHintBox('use background_portrait.png and background_landscape.png to fake transparency. Disable to use a solid background color') +
-	'<hr><table><tr><td>Show Combined Date & Time:<br><input name="settings.showCombinedDateTime" type="checkbox" value="true" ' + (showCombinedDateTime ? 'checked="checked"' : '') + '/></td>' + printHintBox('only show the time for events happening today, otherwise just show the date') +
-	'<hr><table><tr><td>Show Location:<br><input name="settings.showLocation" type="checkbox" value="true" ' + (showLocation ? 'checked="checked"' : '') + '/></td>' + printHintBox('show the location for meeting events') +
-	'<hr><table><tr><td>Show Today As Text:<br><input name="settings.showTodayAsText" type="checkbox" value="true" ' + (showTodayAsText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, the current date will be shown as "Today" instead of "31.12"') +
-	'<hr><table><tr><td>"Today" Text:<br><input class="textInput" name="settings.todayText" type="text" value="' + todayText + '" /></td>' + printHintBox('text to display for "Today"') + '</tr>' +
-	'<hr><table><tr><td>"Tomorrow" Text:<br><input class="textInput" name="settings.tomorrowText" type="text" value="' + tomorrowText + '" /></td>' + printHintBox('text to display for "Tomorrow"') +
-	'<hr><table><tr><td>Show "Now" As Text:<br><input name="settings.showNowAsText" type="checkbox" value="true" ' + (showNowAsText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, the appointment time will be shown as "Now" instead of "12:00"') +
-	'<hr><table><tr><td>"Now" Text:<br><input class="textInput" name="settings.nowText" type="text" value="' + nowText + '" /></td>' + printHintBox('text to display for "Now"') +
-	'<hr><table><tr><td>Date Separator:<br><input class="textInput" name="settings.dateSeparator" type="text" value="' + dateSeparator + '" /></td>' + printHintBox('separator for dates. e.g. "31.12" or "31/12"') +
-	'<hr><table><tr><td>Date Format:<br><select name="settings.dateFormat" size="1">' + 
-		'<option label="auto detect"' + (dateFormat == 'auto' ? ' selected="selected"' : '') + '>auto</option>' +
-		'<option label="MMDD"' + (dateFormat == 'MMDD' ? ' selected="selected"' : '') + '>MMDD</option>' +
-		'<option label="DDMM"' + (dateFormat == 'DDMM' ? ' selected="selected"' : '') + '>DDMM</option>' +
-		'</select></div>' + printHintBox('how dates will be displayed. \'auto\' will autodetect your phone\'s date format setting. \'MMDD\' will write month first, \'DDMM\' will write day first') + '</tr>' +
-	'<hr><table><tr><td>Weekday Length:<br><input class="textInput" name="settings.weekDayLength" type="text" value="' + weekDayLength + '" /></td>' + printHintBox('defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"') +
-	'<hr><table><tr><td>Update Data Interval:<br><input class="textInput" name="settings.updateDataInterval" type="text" value="' + updateDataInterval + '" /></td>' + printHintBox('how many minutes to wait before updating the displayed data. The higher the number, the less battery is used') +
-	'<hr><table><tr><td>Calendar Application UID:<br><input class="textInput" name="settings.calendarApp" type="text" value="0x' + calendarApp.toString(16) + '" /></td>' + printHintBox('UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar') +
-	'<hr><table><tr><td>Events Per Widget:<br><input class="textInput" name="settings.eventsPerWidget" type="text" value="' + eventsPerWidget + '" /></td>' + printHintBox('number of events to show per widget. Default is 4') +
-	'<hr><table><tr><td>Show Nothing Text:<br><input name="settings.showNothingText" type="checkbox" value="true" ' + (showNothingText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, show a text if no events are in the list') +
-	'<hr><table><tr><td>"nothing" Text:<br><input class="textInput" name="settings.nothingText" type="text" value="' + nothingText + '" /></td>' + printHintBox('text to show when no events are in the list') +
-	'<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') +
-	'<hr><table><tr><td>.tomorrow:<br><input class="textInput" name="settings.cssStyle_tomorrow" type="text" value="' + cssStyle_tomorrow + '" /></td>' + printHintBox('Defines the appearance of "Tomorrow" text') +
-	'<hr><table><tr><td>.time:<br><input class="textInput" name="settings.cssStyle_time" type="text" value="' + cssStyle_time + '" /></td>' + printHintBox('Defines the appearance of all time texts') +
-	'<hr><table><tr><td>.now:<br><input class="textInput" name="settings.cssStyle_now" type="text" value="' + cssStyle_now + '" /></td>' + printHintBox('Defines the appearance of "Now" text') +
-	'<hr><table><tr><td>.description:<br><input class="textInput" name="settings.cssStyle_description" type="text" value="' + cssStyle_description + '" /></td>' + printHintBox('Defines the appearance of all event descriptions') +
-	'<hr><table><tr><td>.icon:<br><input class="textInput" name="settings.cssStyle_icon" type="text" value="' + cssStyle_icon + '" /></td>' + printHintBox('Defines size and appearance of icons') +
-	'<hr style="margin-bottom:60px;"><input name="reset" type="button" value="Restore Defaults" onclick="javascript:restoreDefaultSettings();showSettings();" />' +
-	'</form>';
+	var settingsHtml = '<form>';
+	for (var key in config) {
+		if (config[key].Type == 'String')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="' + config[key].Value + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Int')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="' + config[key].Value + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Bool')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input name="settings.' + key + '" type="checkbox" value="true" ' + (config[key].Value ? 'checked="checked"' : '') + '/></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'UID')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="0x' + config[key].Value.toString(16) + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Enum') {
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><select name="settings.' + key + '" size="1">';
+			for(var i = 0; i < config[key].ValidValues.length; i++)
+				settingsHtml += '<option label="' + config[key].ValidValues[i] + '"' + (config[key].Value == config[key].ValidValues[i] ? ' selected="selected"' : '') + '>' + config[key].ValidValues[i] + '</option>';
+			settingsHtml += '</select></div></td>' + printHintBox(config[key].Info) + '<hr />';
+		}
+	}
+	settingsHtml += '<input name="reset" type="button" value="Restore Defaults" onclick="javascript:restoreDefaultSettings();showSettings();" />';
+	settingsHtml += '</form>';
+	document.getElementById("settingsList").innerHTML = settingsHtml;
 }
 
 function changeCssClass(classname, properties)
@@ -806,234 +913,52 @@ 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);
-	changeCssClass(".tomorrow", cssStyle_tomorrow);
-	changeCssClass(".time", cssStyle_time);
-	changeCssClass(".now", cssStyle_now);
-	changeCssClass(".description", cssStyle_description);
-	changeCssClass(".icon", cssStyle_icon);
+	for(var key in config) {
+		changeCssClass(config[key].Name, config[key].Value);
+	}
 }
 
 function restoreDefaultSettings()
 {
-	monthRange = 2;
-	includeTodos = true;
-	useBackgroundImage = true;
-	showCombinedDateTime = false;
-	showLocation = true;
-	showTodayAsText = true;
-	todayText = 'Today';
-	tomorrowText = 'Tomorrow';
-	showNowAsText = true;
-	nowText = 'Now';
-	dateSeparator = '.';
-	dateFormat = 'auto'
-	weekDayLength = 2;
-	updateDataInterval = 5;
-	calendarApp = 0x10005901;
-	eventsPerWidget = 4;
-	showNothingText = true;
-	nothingText = 'No further events within ' + monthRange + ' months';
-	enableDaylightSaving = true;
-
-	cssStyle_background = "color:#ffffff; background-color:#000000";
-	cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
-	cssStyle_weekDay = "";
-	cssStyle_date = "";
-	cssStyle_today = "color:#ff0000";
-	cssStyle_tomorrow = "color:#0000ff";
-	cssStyle_time = "";
-	cssStyle_now = "color:#ff00ff";
-	cssStyle_description = "";
-	cssStyle_icon = "width:15px; height:15px";
+	for (var key in config)
+		config[key].Value = config[key].Default;
 }
 
 function loadSettings()
 {
-	if (widget.preferenceForKey('monthRange'))
-		monthRange = Number(widget.preferenceForKey('monthRange'));
-	else
-		monthRange = 2;
-	
-	if (widget.preferenceForKey('includeTodos'))
-		includeTodos = (widget.preferenceForKey('includeTodos') == 'true');
-	else
-		includeTodos = true;
-	
-	if (widget.preferenceForKey('useBackgroundImage'))
-		useBackgroundImage = (widget.preferenceForKey('useBackgroundImage') == 'true');
-	else
-		useBackgroundImage = true;
-	
-	if (widget.preferenceForKey('showCombinedDateTime'))
-		showCombinedDateTime = (widget.preferenceForKey('showCombinedDateTime') == 'true');
-	else
-		showCombinedDateTime = false;
-	
-	if (widget.preferenceForKey('showLocation'))
-		showLocation = (widget.preferenceForKey('showLocation') == 'true');
-	else
-		showLocation = true;
-	
-	if (widget.preferenceForKey('showTodayAsText'))
-		showTodayAsText = (widget.preferenceForKey('showTodayAsText') == 'true');
-	else
-		showTodayAsText = true;
-	
-	if (widget.preferenceForKey('todayText'))
-		todayText = widget.preferenceForKey('todayText');
-	else
-		todayText = 'Today';
-	
-	if (widget.preferenceForKey('tomorrowText'))
-		tomorrowText = widget.preferenceForKey('tomorrowText');
-	else
-		tomorrowText = 'Tomorrow';
-	
-	if (widget.preferenceForKey('showNowAsText'))
-		showNowAsText = (widget.preferenceForKey('showNowAsText') == 'true');
-	else
-		showNowAsText = true;
-	
-	if (widget.preferenceForKey('nowText'))
-		nowText = widget.preferenceForKey('nowText');
-	else
-		nowText = 'Now';
-	
-	if (widget.preferenceForKey('dateSeparator'))
-		dateSeparator = widget.preferenceForKey('dateSeparator');
-	else
-		dateSeparator = '.';
-	
-	if (widget.preferenceForKey('dateFormat'))
-		dateFormat = widget.preferenceForKey('dateFormat');
-	else
-		dateFormat = 'auto';
-	
-	if (widget.preferenceForKey('weekDayLength'))
-		weekDayLength = Number(widget.preferenceForKey('weekDayLength'));
-	else
-		weekDayLength = 2;
-	
-	if (widget.preferenceForKey('updateDataInterval'))
-		updateDataInterval = Number(widget.preferenceForKey('updateDataInterval'));
-	else
-		updateDataInterval = 5;
-	
-	if (widget.preferenceForKey('calendarApp'))
-		calendarApp = Number(widget.preferenceForKey('calendarApp'));
-	else
-		calendarApp = 0x10005901;
-	
-	if (widget.preferenceForKey('eventsPerWidget'))
-		eventsPerWidget = Number(widget.preferenceForKey('eventsPerWidget'));
-	else
-		eventsPerWidget = 4;
-	
-	if (widget.preferenceForKey('showNothingText'))
-		showNothingText = (widget.preferenceForKey('showNothingText') == 'true');
-	else
-		showNothingText = true;
-	
-	if (widget.preferenceForKey('nothingText'))
-		nothingText = widget.preferenceForKey('nothingText');
-	else
-		nothingText = 'No further events within ' + monthRange + ' months';
-	
-	if (widget.preferenceForKey('enableDaylightSaving'))
-		enableDaylightSaving = (widget.preferenceForKey('enableDaylightSaving') == 'true');
-	else
-		enableDaylightSaving = true;
-	
-	// CSS styles
-		
-	if (widget.preferenceForKey('cssStyle_background'))
-		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');
-	else
-		cssStyle_weekDay = "";
-		
-	if (widget.preferenceForKey('cssStyle_date'))
-		cssStyle_date = widget.preferenceForKey('cssStyle_date');
-	else
-		cssStyle_date = "";
+	for (var key in config) {
+		if (widget.preferenceForKey(key)) {
+			if (config[key].Type == 'Int')
+				config[key].Value = Number(widget.preferenceForKey(key));
+			else if (config[key].Type == 'String')
+				config[key].Value = widget.preferenceForKey(key);
+			else if (config[key].Type == 'Bool')
+				config[key].Value = (widget.preferenceForKey(key) == 'true')
+			else if (config[key].Type == 'Enum')
+				config[key].Value = widget.preferenceForKey(key);
+			else if (config[key].Type == 'UID')
+				config[key].Value = Number(widget.preferenceForKey(key));
+		}
+		else
+			config[key].Value = config[key].Default;
 		
-	if (widget.preferenceForKey('cssStyle_today'))
-		cssStyle_today = widget.preferenceForKey('cssStyle_today');
-	else
-		cssStyle_today = "color:#ff0000";
-	
-	if (widget.preferenceForKey('cssStyle_tomorrow'))
-		cssStyle_tomorrow = widget.preferenceForKey('cssStyle_tomorrow');
-	else
-		cssStyle_tomorrow = "color:#0000ff";
-	
-	if (widget.preferenceForKey('cssStyle_time'))
-		cssStyle_time = widget.preferenceForKey('cssStyle_time');
-	else
-		cssStyle_time = "";
-	
-	if (widget.preferenceForKey('cssStyle_now'))
-		cssStyle_now = widget.preferenceForKey('cssStyle_now');
-	else
-		cssStyle_now = "color:#ff00ff";
-	
-	if (widget.preferenceForKey('cssStyle_description'))
-		cssStyle_description = widget.preferenceForKey('cssStyle_description');
-	else
-		cssStyle_description = "";
-	
-	if (widget.preferenceForKey('cssStyle_icon'))
-		cssStyle_icon = widget.preferenceForKey('cssStyle_icon');
-	else
-		cssStyle_icon = "width:15px; height:15px";
+	}
 }
 
 function saveSettings()
 {
-	widget.setPreferenceForKey(monthRange.toString(), 'monthRange');
-	widget.setPreferenceForKey(includeTodos ? 'true' : 'false', 'includeTodos');
-	widget.setPreferenceForKey(useBackgroundImage ? 'true' : 'false', 'useBackgroundImage');
-	widget.setPreferenceForKey(showCombinedDateTime ? 'true' : 'false', 'showCombinedDateTime');
-	widget.setPreferenceForKey(showLocation ? 'true' : 'false', 'showLocation');
-	widget.setPreferenceForKey(showTodayAsText ? 'true' : 'false', 'showTodayAsText');
-	widget.setPreferenceForKey(todayText, 'todayText');
-	widget.setPreferenceForKey(tomorrowText, 'tomorrowText');
-	widget.setPreferenceForKey(showNowAsText ? 'true' : 'false', 'showNowAsText');
-	widget.setPreferenceForKey(nowText, 'nowText');
-	widget.setPreferenceForKey(dateSeparator, 'dateSeparator');
-	widget.setPreferenceForKey(dateFormat, 'dateFormat');
-	widget.setPreferenceForKey(weekDayLength.toString(), 'weekDayLength');
-	widget.setPreferenceForKey(updateDataInterval.toString(), 'updateDataInterval');
-	widget.setPreferenceForKey(calendarApp.toString(), 'calendarApp');
-	widget.setPreferenceForKey(eventsPerWidget.toString(), 'eventsPerWidget');
-	widget.setPreferenceForKey(showNothingText ? 'true' : 'false', 'showNothingText');
-	widget.setPreferenceForKey(nothingText, 'nothingText');
-	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');
-	widget.setPreferenceForKey(cssStyle_tomorrow, 'cssStyle_tomorrow');
-	widget.setPreferenceForKey(cssStyle_time, 'cssStyle_time');
-	widget.setPreferenceForKey(cssStyle_now, 'cssStyle_now');
-	widget.setPreferenceForKey(cssStyle_description, 'cssStyle_description');
-	widget.setPreferenceForKey(cssStyle_icon, 'cssStyle_icon');
+	for (var key in config) {
+		if (config[key].Type == 'Int')
+			widget.setPreferenceForKey(config[key].Value.toString(), key);
+		else if (config[key].Type == 'String')
+			widget.setPreferenceForKey(config[key].Value, key);
+		else if (config[key].Type == 'Bool')
+			widget.setPreferenceForKey(config[key].Value ? 'true' : 'false', key);
+		else if (config[key].Type == 'Enum')
+			widget.setPreferenceForKey(config[key].Value, key);
+		else if (config[key].Type == 'UID')
+			widget.setPreferenceForKey(config[key].Value.toString(), key);
+	}
 }
 
 function toggleVisibility(elementId)
@@ -1090,7 +1015,7 @@ function showFullscreen()
 
 function updateHomescreen()
 {
-	if (useBackgroundImage) {
+	if (config['useBackgroundImage'].Value) {
 		// check for screen rotation
 		if (orientation != 'portrait' && screen.width == 360 && screen.height == 640) {
 			window.widget.prepareForTransition("fade");
diff --git a/comingNextB/index.html b/comingNextB/index.html
index 65d3c5e..5f693a0 100644
--- a/comingNextB/index.html
+++ b/comingNextB/index.html
@@ -6,50 +6,198 @@
 <title>Coming Next</title>
 
 <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 */
-.tomorrow { color:#0000ff; }		/* Defines the appearance of "Tomorrow" text */
-.time { }				/* Defines the appearance of all time texts */
-.now { color:#ff00ff; }			/* Defines the appearance of "Now" text */
-.description { }			/* Defines the appearance of all event descriptions */
-.icon { width:15px; height:15px; }	/* Defines size and appearance of icons */
+/* The following classes can be modified by widget settings */
+.background { }
+.backgroundFullscreen { }
+.weekDay { }
+.date { }
+.today { }
+.tomorrow { }
+.time { }
+.now { }
+.description { }
+.icon { }
 </style>
 
 <script>
-var monthRange = 2;		// number of months to include in the event list
-var includeTodos = true;	// disable to remove ToDos from event list
-var useBackgroundImage = true;	// use background_portrait.png and background_landscape.png to fake transparency. Set to "false" to use a solid background color
-var showCombinedDateTime = false;// only show the time for events happening today, otherwise just show the date
-var showLocation = true;	// show the location for meeting events
-var showTodayAsText = true;	// if enabled, the current date will be shown as "Today" instead of "31.12"
-var todayText = 'Today';	// text to display for "Today"
-var tomorrowText = 'Tomorrow';	// text to display for "Tomorrow"
-var showNowAsText = true;	// if enabled, the appointment time will be shown as "Now" instead of "12:00"
-var nowText = 'Now';		// text to display for "Now"
-var dateSeparator = '.';	// separator for dates. e.g. "31.12" or "31/12"
-var dateFormat = 'auto'		// how dates will be displayed. 'auto' will autodetect your phone's date format setting. 'MMDD' will write month first, 'DDMM' will write day first
-var weekDayLength = 2;		// defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"
-var updateDataInterval = 5;	// how many minutes to wait before updating the displayed data. The higher the number, the less battery is used
-var calendarApp = 0x10005901;	// UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar
-var eventsPerWidget = 4;	// number of events to show per widget. Default is 4
-var showNothingText = true;	// if set to "true", show a text if no events are in the list
-var nothingText = 'No further events within ' + monthRange + ' months';		// text to show when no events are in the list
-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
-var cssStyle_tomorrow = "color:#0000ff";	// Defines the appearance of "Tomorrow" text
-var cssStyle_time = "";				// Defines the appearance of all time texts
-var cssStyle_now = "color:#ff00ff";		// Defines the appearance of "Now" text
-var cssStyle_description = "";			// Defines the appearance of all event descriptions
-var cssStyle_icon = "width:15px; height:15px";	// Defines size and appearance of icons
+// valid types for the config object are 'Int', 'Bool', 'String', 'Enum', 'UID'
+var config = {
+monthRange: {
+	Type: 'Int',
+	Default: 2,
+	Value: 2,
+	Name: 'Month Range',
+	Info: 'number of months to include in the event list',},
+includeTodos: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Include ToDos',
+	Info: 'disable to remove ToDos from event list',},
+useBackgroundImage: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Use Background Image',
+	Info: 'use background_portrait.png and background_landscape.png to fake transparency. Disable to use a solid background color',},
+showCombinedDateTime: {
+	Type: 'Bool',
+	Default: false,
+	Value: false,
+	Name: 'Show Combined Date/Time',
+	Info: 'only show the time for events happening today, otherwise just show the date',},
+showLocation: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Location',
+	Info: 'show the location for meeting events',},
+showTodayAsText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Today as Text',
+	Info: 'if enabled, the current date will be shown as "Today" instead of "31.12"',},
+todayText: {
+	Type: 'String',
+	Default: 'Today',
+	Value: 'Today',
+	Name: '"Today" Text',
+	Info: 'text to display for "Today"',},
+tomorrowText: {
+	Type: 'String',
+	Default: 'Tomorrow',
+	Value: 'Tomorrow',
+	Name: '"Tomorrow" Text',
+	Info: 'text to display for "Tomorrow"',},
+showNowAsText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show Now as Text',
+	Info: 'if enabled, the appointment time will be shown as "Now" instead of "12:00"',},
+nowText: {
+	Type: 'String',
+	Default: 'Now',
+	Value: 'Now',
+	Name: '"Now" Text',
+	Info: 'text to display for "Now"',},
+dateSeparator: {
+	Type: 'String',
+	Default: '.',
+	Value: '.',
+	Name: 'Date Separator',
+	Info: 'separator for dates. e.g. "31.12" or "31/12"',},
+dateFormat: {
+	Type: 'Enum',
+	Default: 'auto',
+	Value: 'auto',
+	ValidValues: ['auto', 'DDMM', 'MMDD'],
+	Name: 'Date Format',
+	Info: 'how dates will be displayed. \'auto\' will autodetect your phone\'s date format setting. \'MMDD\' will write month first, \'DDMM\' will write day first',},
+weekDayLength: {
+	Type: 'Int',
+	Default: 2,
+	Value: 2,
+	Name: 'Weekday Length',
+	Info: 'defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"',},
+updateDataInterval: {
+	Type: 'Int',
+	Default: 5,
+	Value: 5,
+	Name: 'Update Data Interval',
+	Info: 'how many minutes to wait before updating the displayed data. The higher the number, the less battery is used',},
+calendarApp: {
+	Type: 'UID',
+	Default: 0x10005901,
+	Value: 0x10005901,
+	Name: 'Calendar Application To Run',
+	Info: 'UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar',},
+eventsPerWidget: {
+	Type: 'Int',
+	Default: 4,
+	Value: 4,
+	Name: 'Events Per Widget',
+	Info: 'number of events to show per widget. Default is 4',},
+showNothingText: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Show "Nothing" Text',
+	Info: 'if enabled, show a text if no events are in the list',},
+nothingText: {
+	Type: 'String',
+	Default: 'No further events within 2 months',
+	Value: 'No further events within 2 months',
+	Name: '"No further events..." Text',
+	Info: 'text to show when no events are in the list',},
+enableDaylightSaving: {
+	Type: 'Bool',
+	Default: true,
+	Value: true,
+	Name: 'Enable Daylight Saving (+1h)',
+	Info: 'enable this if you are in a timezone that has daylight saving time (+1h)',},
+cssStyle_background: {
+	Type: 'String',
+	Default: 'color:#ffffff; background-color:#000000',
+	Value: 'color:#ffffff; background-color:#000000',
+	Name: '.background',
+	Info: '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',},
+cssStyle_backgroundFullscreen: {
+	Type: 'String',
+	Default: 'color:#ffffff; background-color:#000000',
+	Value: 'color:#ffffff; background-color:#000000',
+	Name: '.backgroundFullscreen',
+	Info: 'Same as background but for the fullscreen version of the widget',},
+cssStyle_weekDay: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.weekDay',
+	Info: 'Defines the appearance of all week day texts',},
+cssStyle_date: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.date',
+	Info: 'Defines the appearance of all date texts',},
+cssStyle_today: {
+	Type: 'String',
+	Default: 'color:#ff0000',
+	Value: 'color:#ff0000',
+	Name: '.today',
+	Info: 'Defines the appearance of "Today" text',},
+cssStyle_tomorrow: {
+	Type: 'String',
+	Default: 'color:#0000ff',
+	Value: 'color:#0000ff',
+	Name: '.tomorrow',
+	Info: 'Defines the appearance of "Tomorrow" text',},
+cssStyle_time: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.time',
+	Info: 'Defines the appearance of all time texts',},
+cssStyle_now: {
+	Type: 'String',
+	Default: 'color:#ff00ff',
+	Value: 'color:#ff00ff',
+	Name: '.now',
+	Info: 'Defines the appearance of "Now" text',},
+cssStyle_description: {
+	Type: 'String',
+	Default: '',
+	Value: '',
+	Name: '.description',
+	Info: 'Defines the appearance of all event descriptions',},
+cssStyle_icon: {
+	Type: 'String',
+	Default: 'width:15px; height:15px',
+	Value: 'width:15px; height:15px',
+	Name: '.icon',
+	Info: 'Defines size and appearance of icons',},
+}
 
 //-------------------------------------------------------
 // Nothing of interest from here on...
@@ -329,7 +477,7 @@ function parseDate(dateString)
 	console.info('year=' + year + ' month=' + month + ' day=' + day + ' hours=' + hours + ' minutes=' + minutes+ ' seconds=' + seconds);
 
 	// take care of daylight saving time
-	if (enableDaylightSaving) {
+	if (config['enableDaylightSaving'].Value) {
 		var date = new Date(year, month - 1, day, hours, minutes, seconds);
 		if (summertime && date > daylightsavingWinter && date < daylightsavingSummer)
 			hours -= 1;
@@ -348,27 +496,27 @@ function formatDate(date, format)
 	while (day.length < 2) { day = '0' + day; }
 	while (month.length < 2) { month = '0' + month; }
 
-	if (showTodayAsText && isToday(date))
-		return '<span class="today">' + todayText + '</span>';
-	if (showTodayAsText && isTomorrow(date))
-		return '<span class="tomorrow">' + tomorrowText + '</span>';
+	if (config['showTodayAsText'].Value && isToday(date))
+		return '<span class="today">' + config['todayText'].Value + '</span>';
+	if (config['showTodayAsText'].Value && isTomorrow(date))
+		return '<span class="tomorrow">' + config['tomorrowText'].Value + '</span>';
 
 	var dateArr = format.replace(/,/g,'').replace(/\./g,':').replace(/  /g,' ').split(' ');
 	if (dateArr.length != 5 && dateArr.length != 6) {
 		// we don't know how to format this
-		if (dateFormat == 'auto' || dateFormat == 'DDMM')
-			return day + dateSeparator + month;
+		if (config['dateFormat'].Value == 'auto' || config['dateFormat'].Value == 'DDMM')
+			return day + config['dateSeparator'].Value + month;
 		else
-			return month + dateSeparator + day;
+			return month + config['dateSeparator'].Value + day;
 	}
 
 	var dayFirst = true;
-	if (dateFormat == 'MMDD')
+	if (config['dateFormat'].Value == 'MMDD')
 		dayFirst = false;
-	else if (dateFormat == 'DDMM')
+	else if (config['dateFormat'].Value == 'DDMM')
 		dayFirst = true;
 	else {
-		// dateFormat == 'auto', try to detect system setting
+		// config['dateFormat'].Value == 'auto', try to detect system setting
 		// parse date
 		var day_ = dateArr[1];
 		var month_ = dateArr[2];
@@ -391,9 +539,9 @@ function formatDate(date, format)
 	}
 
 	if (dayFirst)
-		return day + dateSeparator + month;
+		return day + config['dateSeparator'].Value + month;
 	else
-		return month + dateSeparator + day;
+		return month + config['dateSeparator'].Value + day;
 }
 
 function formatTime(date)
@@ -403,8 +551,8 @@ function formatTime(date)
 	var time = date.toLocaleTimeString().replace(/[\.:]00/, ''); // remove seconds from string
 	if (time.replace(/\./, ':').split(':')[0].length < 2)
 		time = '0' + time;
-	if (showNowAsText && date.getTime() == now.getTime())
-		time = '<span class="now">' + nowText + '</span>';
+	if (config['showNowAsText'].Value && date.getTime() == now.getTime())
+		time = '<span class="now">' + config['nowText'].Value + '</span>';
 	return time;
 }
 
@@ -419,7 +567,7 @@ function updateData()
 			Type:'CalendarEntry',
 			Filter:{
 				StartRange: (new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0)),
-				EndRange: (new Date(now.getFullYear(), now.getMonth() + monthRange, now.getDate(), 0, 0, 0))
+				EndRange: (new Date(now.getFullYear(), now.getMonth() + config['monthRange'].Value, now.getDate(), 0, 0, 0))
 			}
 		}
 		var meetingResult = calendarService.IDataSource.GetList(meetingListFiltering);
@@ -427,7 +575,7 @@ function updateData()
 
 		// todos don't, they start on 00:00 hrs., but should be visible anyway
 		// this will generate a list of passed todos. We have to check if they have been marked as "done" yet
-		if (includeTodos) {
+		if (config['includeTodos'].Value) {
 			var todayTodoListFiltering = {
 				Type:'CalendarEntry',
 				Filter:{
@@ -456,7 +604,7 @@ function updateData()
 		var eventIds = [];
 		var max;
 		if (mode == 0)
-			max = ((panelNum == 0) ? eventsPerWidget : 2 * eventsPerWidget);
+			max = ((panelNum == 0) ? config['eventsPerWidget'].Value : 2 * config['eventsPerWidget'].Value);
 		else
 			max = 30; // we can display a lot more events in fullscreen mode
 
@@ -479,7 +627,7 @@ function updateData()
 				);
 
 				// we don't want ToDos when includeTodos == false or when they are completed
-				if (entry.Type == 'ToDo' && (entry.Status == "TodoCompleted" || !includeTodos)) {
+				if (entry.Type == 'ToDo' && (entry.Status == "TodoCompleted" || !config['includeTodos'].Value)) {
 					console.info('skipping ' + entry.id );
 					counter--;
 					continue;
@@ -495,7 +643,7 @@ function updateData()
 
 				// summary can be undefined!
 				var Summary = ((entry.Summary == null) ? '' : entry.Summary);
-				if (entry.Type == 'Meeting' && entry.Location != '' && showLocation)
+				if (entry.Type == 'Meeting' && entry.Location != '' && config['showLocation'].Value)
 					Summary += ', ' + entry.Location;
 				
 				// fix by yves: determine start and end dates/times
@@ -558,7 +706,7 @@ function updateData()
 				}
 
 				// skip events for the first panel in case this is the second one and we're not in fullscreen mode
-				if (mode == 0 && panelNum == 1 && counter < eventsPerWidget + 1) {
+				if (mode == 0 && panelNum == 1 && counter < config['eventsPerWidget'].Value + 1) {
 					console.info('skipping (already in first widget) ' + entry.id);
 					continue;
 				}
@@ -569,16 +717,16 @@ function updateData()
 					// some languages have very strange locale date formats, can't parse all those. Also some todos don't have dates at all.
 					entriesHtml += '<td colspan="4"><span class="date">' + entryDate + '</span> ';
 				} else {
-					var weekDay = date.toLocaleDateString().substr(0,weekDayLength);
+					var weekDay = date.toLocaleDateString().substr(0,config['weekDayLength'].Value);
 					var time = formatTime(date);
 					var dateStr = formatDate(date, entryDate);
 					if (entry.Type == 'ToDo' || entry.Type == 'Anniversary' || entry.Type == 'DayEvent' || entry.Type == 'Reminder') {
-						if ((isToday(date) || isTomorrow(date)) && showTodayAsText) // show weekday if the date string is not text. looks odd otherwise
+						if ((isToday(date) || isTomorrow(date)) && config['showTodayAsText'].Value) // show weekday if the date string is not text. looks odd otherwise
 							entriesHtml += '<td colspan="4" width="1px"><span class="date">' + dateStr + '</span> ';
 						else
 							entriesHtml += '<td class="weekDay" width="1px">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td colspan="2">';
 					} else if (entry.Type == 'Meeting') {
-						if (showCombinedDateTime) {
+						if (config['showCombinedDateTime'].Value) {
 							if (isToday(date))
 								entriesHtml += '<td width="1px" colspan="4"><span class="today">' + time + '</span> ';
 							else if (isTomorrow(date))
@@ -586,7 +734,7 @@ function updateData()
 							else
 								entriesHtml += '<td width="1px" class="weekDay">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td colspan="2">';
 						} else {
-							if ((isToday(date) || isTomorrow(date)) && showTodayAsText)
+							if ((isToday(date) || isTomorrow(date)) && config['showTodayAsText'].Value)
 								entriesHtml += '<td colspan="4" width="1px"><span class="today">' + dateStr + '</span> <span class="time">' + time + '</span> ';
 							else
 								entriesHtml += '<td width="1px" class="weekDay">' + weekDay + '</td><td width="1px" class="date">' + dateStr + '</td><td width="1px" class="time">' + time + '</td><td>';
@@ -597,8 +745,8 @@ function updateData()
 			}
 		}
 		entriesHtml += '</table>';
-		if (showNothingText && entriesHtml == '<table></table>')
-			entriesHtml = '<div style="width:295px; height:75px; text-align:center; line-height:75px; overflow:visible;">' + nothingText + '</div>';
+		if (config['showNothingText'].Value && entriesHtml == '<table></table>')
+			entriesHtml = '<div style="width:295px; height:75px; text-align:center; line-height:75px; overflow:visible;">' + config['nothingText'].Value + '</div>';
 		if (cacheEntriesHtml != entriesHtml) {
 			if (mode == 0)
 				document.getElementById('calendarList').innerHTML = entriesHtml;
@@ -636,7 +784,7 @@ function updateScreen()
 function launchCalendar()
 {
 	try {
-		widget.openApplication(calendarApp, "");
+		widget.openApplication(config['calendarApp'].Value, "");
 		//window.close();
 	} catch(e) {
 		error('starting Calendar App');
@@ -659,14 +807,14 @@ function init()
 	collectLocales();
 	//updateData();
 	requestNotification();
-	window.setInterval('updateData()', 1000 * 60 * updateDataInterval);
+	window.setInterval('updateData()', 1000 * 60 * config['updateDataInterval'].Value);
 
 	mode = 0;
 	showHomescreen();
 	updateScreen();
-	if (useBackgroundImage)
-		// check for screen rotation every 3 secs
-		window.setInterval('updateScreen()', 1000 * 3);
+	if (config['useBackgroundImage'].Value)
+		// check for screen rotation every 1 secs
+		window.setInterval('updateScreen()', 1000 * 1);
 }
 
 function createMenu()
@@ -697,47 +845,24 @@ function showSettings()
 	
 	window.menu.setLeftSoftkeyLabel("Save", function()
 	{
-		//document.forms[0].elements["settings.monthRange"].value = monthRange;
-		monthRange = parseInt(document.forms[0].elements["settings.monthRange"].value);
-		if (monthRange < 0 || monthRange > 100)
-			monthRange = 2;
-		includeTodos = document.forms[0].elements["settings.includeTodos"].checked;
-		useBackgroundImage = document.forms[0].elements["settings.useBackgroundImage"].checked;
-		showCombinedDateTime = document.forms[0].elements["settings.showCombinedDateTime"].checked;
-		showLocation = document.forms[0].elements["settings.showLocation"].checked;
-		showTodayAsText = document.forms[0].elements["settings.showTodayAsText"].checked;
-		todayText = document.forms[0].elements["settings.todayText"].value;
-		tomorrowText = document.forms[0].elements["settings.tomorrowText"].value;
-		showNowAsText = document.forms[0].elements["settings.showNowAsText"].checked;
-		nowText = document.forms[0].elements["settings.nowText"].value;
-		dateSeparator = document.forms[0].elements["settings.dateSeparator"].value;
-		dateFormat = document.forms[0].elements["settings.dateFormat"].value;
-		if (dateFormat != 'auto' && dateFormat != 'DDMM' && dateFormat != 'MMDD')
-			dateFormat = 'auto';
-		weekDayLength = Number(parseInt(document.forms[0].elements["settings.weekDayLength"].value));
-		if (weekDayLength < 0 || weekDayLength > 20)
-			weekDayLength = 2;
-		updateDataInterval = parseInt(document.forms[0].elements["settings.updateDataInterval"].value);
-		if (updateDataInterval < 1 || updateDataInterval > 1000)
-			updateDataInterval = 5;
-		calendarApp = parseInt(document.forms[0].elements["settings.calendarApp"].value);
-		eventsPerWidget = parseInt(document.forms[0].elements["settings.eventsPerWidget"].value);
-		if (eventsPerWidget < 1 || eventsPerWidget > 10)
-			eventsPerWidget = 4;
-		showNothingText = document.forms[0].elements["settings.showNothingText"].checked;
-		nothingText = document.forms[0].elements["settings.nothingText"].value;
-		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;
-		cssStyle_tomorrow = document.forms[0].elements["settings.cssStyle_tomorrow"].value;
-		cssStyle_time = document.forms[0].elements["settings.cssStyle_time"].value;
-		cssStyle_now = document.forms[0].elements["settings.cssStyle_now"].value;
-		cssStyle_description = document.forms[0].elements["settings.cssStyle_description"].value;
-		cssStyle_icon = document.forms[0].elements["settings.cssStyle_icon"].value;
+		for (var key in config) {
+			if (config[key].Type == 'String')
+				config[key].Value = document.forms[0].elements["settings." + key].value;
+			else if (config[key].Type == 'Int') {
+				config[key].Value = parseInt(document.forms[0].elements["settings." + key].value);
+				if (config[key].Value < 0)
+					config[key].Value = config[key].Default;
+			}
+			else if (config[key].Type == 'Bool')
+				config[key].Value = document.forms[0].elements["settings." + key].checked;
+			else if (config[key].Type == 'UID')
+				config[key].Value = parseInt(document.forms[0].elements["settings." + key].value);
+			else if (config[key].Type == 'Enum') {
+				config[key].Value = document.forms[0].elements["settings." + key].value;
+				if (config[key].ValidValues.indexOf(config[key].Value) == -1)
+					config[key].Value = config[key].Default;
+			}
+		}
 				
 		updateCssClasses();
 		
@@ -752,44 +877,26 @@ function showSettings()
 		showFullscreen();
 	});
 	
-	document.getElementById("settingsList").innerHTML = 
-	'<form>' +
-	'<table><tr><td>Month Range:<br><input class="textInput" name="settings.monthRange" type="text" value="' + monthRange + '" /></td>' + printHintBox('number of months to include in the event list') +
-	'<hr><table><tr><td>Include ToDos:<br><input name="settings.includeTodos" type="checkbox" value="true" ' + (includeTodos ? 'checked="checked"' : '') + '/></td>' + printHintBox('disable to remove ToDos from event list') +
-	'<hr><table><tr><td>Use Background Image:<br><input name="settings.useBackgroundImage" type="checkbox" value="true" ' + (useBackgroundImage ? 'checked="checked"' : '') + '/></td>' + printHintBox('use background_portrait.png and background_landscape.png to fake transparency. Disable to use a solid background color') +
-	'<hr><table><tr><td>Show Combined Date & Time:<br><input name="settings.showCombinedDateTime" type="checkbox" value="true" ' + (showCombinedDateTime ? 'checked="checked"' : '') + '/></td>' + printHintBox('only show the time for events happening today, otherwise just show the date') +
-	'<hr><table><tr><td>Show Location:<br><input name="settings.showLocation" type="checkbox" value="true" ' + (showLocation ? 'checked="checked"' : '') + '/></td>' + printHintBox('show the location for meeting events') +
-	'<hr><table><tr><td>Show Today As Text:<br><input name="settings.showTodayAsText" type="checkbox" value="true" ' + (showTodayAsText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, the current date will be shown as "Today" instead of "31.12"') +
-	'<hr><table><tr><td>"Today" Text:<br><input class="textInput" name="settings.todayText" type="text" value="' + todayText + '" /></td>' + printHintBox('text to display for "Today"') + '</tr>' +
-	'<hr><table><tr><td>"Tomorrow" Text:<br><input class="textInput" name="settings.tomorrowText" type="text" value="' + tomorrowText + '" /></td>' + printHintBox('text to display for "Tomorrow"') +
-	'<hr><table><tr><td>Show "Now" As Text:<br><input name="settings.showNowAsText" type="checkbox" value="true" ' + (showNowAsText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, the appointment time will be shown as "Now" instead of "12:00"') +
-	'<hr><table><tr><td>"Now" Text:<br><input class="textInput" name="settings.nowText" type="text" value="' + nowText + '" /></td>' + printHintBox('text to display for "Now"') +
-	'<hr><table><tr><td>Date Separator:<br><input class="textInput" name="settings.dateSeparator" type="text" value="' + dateSeparator + '" /></td>' + printHintBox('separator for dates. e.g. "31.12" or "31/12"') +
-	'<hr><table><tr><td>Date Format:<br><select name="settings.dateFormat" size="1">' + 
-		'<option label="auto detect"' + (dateFormat == 'auto' ? ' selected="selected"' : '') + '>auto</option>' +
-		'<option label="MMDD"' + (dateFormat == 'MMDD' ? ' selected="selected"' : '') + '>MMDD</option>' +
-		'<option label="DDMM"' + (dateFormat == 'DDMM' ? ' selected="selected"' : '') + '>DDMM</option>' +
-		'</select></div>' + printHintBox('how dates will be displayed. \'auto\' will autodetect your phone\'s date format setting. \'MMDD\' will write month first, \'DDMM\' will write day first') + '</tr>' +
-	'<hr><table><tr><td>Weekday Length:<br><input class="textInput" name="settings.weekDayLength" type="text" value="' + weekDayLength + '" /></td>' + printHintBox('defines how many characters of the weekday will be shown. E.g. 2 will cut "Friday" to "Fr"') +
-	'<hr><table><tr><td>Update Data Interval:<br><input class="textInput" name="settings.updateDataInterval" type="text" value="' + updateDataInterval + '" /></td>' + printHintBox('how many minutes to wait before updating the displayed data. The higher the number, the less battery is used') +
-	'<hr><table><tr><td>Calendar Application UID:<br><input class="textInput" name="settings.calendarApp" type="text" value="0x' + calendarApp.toString(16) + '" /></td>' + printHintBox('UID of the calendar app to run when clicking the widget. 0x10005901 = buildin calendar, 0x20004ec1 = Epocware Handy Calendar') +
-	'<hr><table><tr><td>Events Per Widget:<br><input class="textInput" name="settings.eventsPerWidget" type="text" value="' + eventsPerWidget + '" /></td>' + printHintBox('number of events to show per widget. Default is 4') +
-	'<hr><table><tr><td>Show Nothing Text:<br><input name="settings.showNothingText" type="checkbox" value="true" ' + (showNothingText ? 'checked="checked"' : '') + '/></td>' + printHintBox('if enabled, show a text if no events are in the list') +
-	'<hr><table><tr><td>"nothing" Text:<br><input class="textInput" name="settings.nothingText" type="text" value="' + nothingText + '" /></td>' + printHintBox('text to show when no events are in the list') +
-	'<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') +
-	'<hr><table><tr><td>.tomorrow:<br><input class="textInput" name="settings.cssStyle_tomorrow" type="text" value="' + cssStyle_tomorrow + '" /></td>' + printHintBox('Defines the appearance of "Tomorrow" text') +
-	'<hr><table><tr><td>.time:<br><input class="textInput" name="settings.cssStyle_time" type="text" value="' + cssStyle_time + '" /></td>' + printHintBox('Defines the appearance of all time texts') +
-	'<hr><table><tr><td>.now:<br><input class="textInput" name="settings.cssStyle_now" type="text" value="' + cssStyle_now + '" /></td>' + printHintBox('Defines the appearance of "Now" text') +
-	'<hr><table><tr><td>.description:<br><input class="textInput" name="settings.cssStyle_description" type="text" value="' + cssStyle_description + '" /></td>' + printHintBox('Defines the appearance of all event descriptions') +
-	'<hr><table><tr><td>.icon:<br><input class="textInput" name="settings.cssStyle_icon" type="text" value="' + cssStyle_icon + '" /></td>' + printHintBox('Defines size and appearance of icons') +
-	'<hr style="margin-bottom:60px;"><input name="reset" type="button" value="Restore Defaults" onclick="javascript:restoreDefaultSettings();showSettings();" />' +
-	'</form>';
+	var settingsHtml = '<form>';
+	for (var key in config) {
+		if (config[key].Type == 'String')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="' + config[key].Value + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Int')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="' + config[key].Value + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Bool')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input name="settings.' + key + '" type="checkbox" value="true" ' + (config[key].Value ? 'checked="checked"' : '') + '/></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'UID')
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><input class="textInput" name="settings.' + key + '" type="text" value="0x' + config[key].Value.toString(16) + '" /></td>' + printHintBox(config[key].Info) + '<hr />';
+		else if (config[key].Type == 'Enum') {
+			settingsHtml += '<table><tr><td>' + config[key].Name + '<br /><select name="settings.' + key + '" size="1">';
+			for(var i = 0; i < config[key].ValidValues.length; i++)
+				settingsHtml += '<option label="' + config[key].ValidValues[i] + '"' + (config[key].Value == config[key].ValidValues[i] ? ' selected="selected"' : '') + '>' + config[key].ValidValues[i] + '</option>';
+			settingsHtml += '</select></div></td>' + printHintBox(config[key].Info) + '<hr />';
+		}
+	}
+	settingsHtml += '<input name="reset" type="button" value="Restore Defaults" onclick="javascript:restoreDefaultSettings();showSettings();" />';
+	settingsHtml += '</form>';
+	document.getElementById("settingsList").innerHTML = settingsHtml;
 }
 
 function changeCssClass(classname, properties)
@@ -806,234 +913,52 @@ 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);
-	changeCssClass(".tomorrow", cssStyle_tomorrow);
-	changeCssClass(".time", cssStyle_time);
-	changeCssClass(".now", cssStyle_now);
-	changeCssClass(".description", cssStyle_description);
-	changeCssClass(".icon", cssStyle_icon);
+	for(var key in config) {
+		changeCssClass(config[key].Name, config[key].Value);
+	}
 }
 
 function restoreDefaultSettings()
 {
-	monthRange = 2;
-	includeTodos = true;
-	useBackgroundImage = true;
-	showCombinedDateTime = false;
-	showLocation = true;
-	showTodayAsText = true;
-	todayText = 'Today';
-	tomorrowText = 'Tomorrow';
-	showNowAsText = true;
-	nowText = 'Now';
-	dateSeparator = '.';
-	dateFormat = 'auto'
-	weekDayLength = 2;
-	updateDataInterval = 5;
-	calendarApp = 0x10005901;
-	eventsPerWidget = 4;
-	showNothingText = true;
-	nothingText = 'No further events within ' + monthRange + ' months';
-	enableDaylightSaving = true;
-
-	cssStyle_background = "color:#ffffff; background-color:#000000";
-	cssStyle_backgroundFullscreen = "color:#ffffff; background-color:#000000";
-	cssStyle_weekDay = "";
-	cssStyle_date = "";
-	cssStyle_today = "color:#ff0000";
-	cssStyle_tomorrow = "color:#0000ff";
-	cssStyle_time = "";
-	cssStyle_now = "color:#ff00ff";
-	cssStyle_description = "";
-	cssStyle_icon = "width:15px; height:15px";
+	for (var key in config)
+		config[key].Value = config[key].Default;
 }
 
 function loadSettings()
 {
-	if (widget.preferenceForKey('monthRange'))
-		monthRange = Number(widget.preferenceForKey('monthRange'));
-	else
-		monthRange = 2;
-	
-	if (widget.preferenceForKey('includeTodos'))
-		includeTodos = (widget.preferenceForKey('includeTodos') == 'true');
-	else
-		includeTodos = true;
-	
-	if (widget.preferenceForKey('useBackgroundImage'))
-		useBackgroundImage = (widget.preferenceForKey('useBackgroundImage') == 'true');
-	else
-		useBackgroundImage = true;
-	
-	if (widget.preferenceForKey('showCombinedDateTime'))
-		showCombinedDateTime = (widget.preferenceForKey('showCombinedDateTime') == 'true');
-	else
-		showCombinedDateTime = false;
-	
-	if (widget.preferenceForKey('showLocation'))
-		showLocation = (widget.preferenceForKey('showLocation') == 'true');
-	else
-		showLocation = true;
-	
-	if (widget.preferenceForKey('showTodayAsText'))
-		showTodayAsText = (widget.preferenceForKey('showTodayAsText') == 'true');
-	else
-		showTodayAsText = true;
-	
-	if (widget.preferenceForKey('todayText'))
-		todayText = widget.preferenceForKey('todayText');
-	else
-		todayText = 'Today';
-	
-	if (widget.preferenceForKey('tomorrowText'))
-		tomorrowText = widget.preferenceForKey('tomorrowText');
-	else
-		tomorrowText = 'Tomorrow';
-	
-	if (widget.preferenceForKey('showNowAsText'))
-		showNowAsText = (widget.preferenceForKey('showNowAsText') == 'true');
-	else
-		showNowAsText = true;
-	
-	if (widget.preferenceForKey('nowText'))
-		nowText = widget.preferenceForKey('nowText');
-	else
-		nowText = 'Now';
-	
-	if (widget.preferenceForKey('dateSeparator'))
-		dateSeparator = widget.preferenceForKey('dateSeparator');
-	else
-		dateSeparator = '.';
-	
-	if (widget.preferenceForKey('dateFormat'))
-		dateFormat = widget.preferenceForKey('dateFormat');
-	else
-		dateFormat = 'auto';
-	
-	if (widget.preferenceForKey('weekDayLength'))
-		weekDayLength = Number(widget.preferenceForKey('weekDayLength'));
-	else
-		weekDayLength = 2;
-	
-	if (widget.preferenceForKey('updateDataInterval'))
-		updateDataInterval = Number(widget.preferenceForKey('updateDataInterval'));
-	else
-		updateDataInterval = 5;
-	
-	if (widget.preferenceForKey('calendarApp'))
-		calendarApp = Number(widget.preferenceForKey('calendarApp'));
-	else
-		calendarApp = 0x10005901;
-	
-	if (widget.preferenceForKey('eventsPerWidget'))
-		eventsPerWidget = Number(widget.preferenceForKey('eventsPerWidget'));
-	else
-		eventsPerWidget = 4;
-	
-	if (widget.preferenceForKey('showNothingText'))
-		showNothingText = (widget.preferenceForKey('showNothingText') == 'true');
-	else
-		showNothingText = true;
-	
-	if (widget.preferenceForKey('nothingText'))
-		nothingText = widget.preferenceForKey('nothingText');
-	else
-		nothingText = 'No further events within ' + monthRange + ' months';
-	
-	if (widget.preferenceForKey('enableDaylightSaving'))
-		enableDaylightSaving = (widget.preferenceForKey('enableDaylightSaving') == 'true');
-	else
-		enableDaylightSaving = true;
-	
-	// CSS styles
-		
-	if (widget.preferenceForKey('cssStyle_background'))
-		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');
-	else
-		cssStyle_weekDay = "";
-		
-	if (widget.preferenceForKey('cssStyle_date'))
-		cssStyle_date = widget.preferenceForKey('cssStyle_date');
-	else
-		cssStyle_date = "";
+	for (var key in config) {
+		if (widget.preferenceForKey(key)) {
+			if (config[key].Type == 'Int')
+				config[key].Value = Number(widget.preferenceForKey(key));
+			else if (config[key].Type == 'String')
+				config[key].Value = widget.preferenceForKey(key);
+			else if (config[key].Type == 'Bool')
+				config[key].Value = (widget.preferenceForKey(key) == 'true')
+			else if (config[key].Type == 'Enum')
+				config[key].Value = widget.preferenceForKey(key);
+			else if (config[key].Type == 'UID')
+				config[key].Value = Number(widget.preferenceForKey(key));
+		}
+		else
+			config[key].Value = config[key].Default;
 		
-	if (widget.preferenceForKey('cssStyle_today'))
-		cssStyle_today = widget.preferenceForKey('cssStyle_today');
-	else
-		cssStyle_today = "color:#ff0000";
-	
-	if (widget.preferenceForKey('cssStyle_tomorrow'))
-		cssStyle_tomorrow = widget.preferenceForKey('cssStyle_tomorrow');
-	else
-		cssStyle_tomorrow = "color:#0000ff";
-	
-	if (widget.preferenceForKey('cssStyle_time'))
-		cssStyle_time = widget.preferenceForKey('cssStyle_time');
-	else
-		cssStyle_time = "";
-	
-	if (widget.preferenceForKey('cssStyle_now'))
-		cssStyle_now = widget.preferenceForKey('cssStyle_now');
-	else
-		cssStyle_now = "color:#ff00ff";
-	
-	if (widget.preferenceForKey('cssStyle_description'))
-		cssStyle_description = widget.preferenceForKey('cssStyle_description');
-	else
-		cssStyle_description = "";
-	
-	if (widget.preferenceForKey('cssStyle_icon'))
-		cssStyle_icon = widget.preferenceForKey('cssStyle_icon');
-	else
-		cssStyle_icon = "width:15px; height:15px";
+	}
 }
 
 function saveSettings()
 {
-	widget.setPreferenceForKey(monthRange.toString(), 'monthRange');
-	widget.setPreferenceForKey(includeTodos ? 'true' : 'false', 'includeTodos');
-	widget.setPreferenceForKey(useBackgroundImage ? 'true' : 'false', 'useBackgroundImage');
-	widget.setPreferenceForKey(showCombinedDateTime ? 'true' : 'false', 'showCombinedDateTime');
-	widget.setPreferenceForKey(showLocation ? 'true' : 'false', 'showLocation');
-	widget.setPreferenceForKey(showTodayAsText ? 'true' : 'false', 'showTodayAsText');
-	widget.setPreferenceForKey(todayText, 'todayText');
-	widget.setPreferenceForKey(tomorrowText, 'tomorrowText');
-	widget.setPreferenceForKey(showNowAsText ? 'true' : 'false', 'showNowAsText');
-	widget.setPreferenceForKey(nowText, 'nowText');
-	widget.setPreferenceForKey(dateSeparator, 'dateSeparator');
-	widget.setPreferenceForKey(dateFormat, 'dateFormat');
-	widget.setPreferenceForKey(weekDayLength.toString(), 'weekDayLength');
-	widget.setPreferenceForKey(updateDataInterval.toString(), 'updateDataInterval');
-	widget.setPreferenceForKey(calendarApp.toString(), 'calendarApp');
-	widget.setPreferenceForKey(eventsPerWidget.toString(), 'eventsPerWidget');
-	widget.setPreferenceForKey(showNothingText ? 'true' : 'false', 'showNothingText');
-	widget.setPreferenceForKey(nothingText, 'nothingText');
-	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');
-	widget.setPreferenceForKey(cssStyle_tomorrow, 'cssStyle_tomorrow');
-	widget.setPreferenceForKey(cssStyle_time, 'cssStyle_time');
-	widget.setPreferenceForKey(cssStyle_now, 'cssStyle_now');
-	widget.setPreferenceForKey(cssStyle_description, 'cssStyle_description');
-	widget.setPreferenceForKey(cssStyle_icon, 'cssStyle_icon');
+	for (var key in config) {
+		if (config[key].Type == 'Int')
+			widget.setPreferenceForKey(config[key].Value.toString(), key);
+		else if (config[key].Type == 'String')
+			widget.setPreferenceForKey(config[key].Value, key);
+		else if (config[key].Type == 'Bool')
+			widget.setPreferenceForKey(config[key].Value ? 'true' : 'false', key);
+		else if (config[key].Type == 'Enum')
+			widget.setPreferenceForKey(config[key].Value, key);
+		else if (config[key].Type == 'UID')
+			widget.setPreferenceForKey(config[key].Value.toString(), key);
+	}
 }
 
 function toggleVisibility(elementId)
@@ -1090,7 +1015,7 @@ function showFullscreen()
 
 function updateHomescreen()
 {
-	if (useBackgroundImage) {
+	if (config['useBackgroundImage'].Value) {
 		// check for screen rotation
 		if (orientation != 'portrait' && screen.width == 360 && screen.height == 640) {
 			window.widget.prepareForTransition("fade");
-- 
2.39.2