commit, weil ich wissen muss, obs an den cookies liegt, dass es nicht geht

index.html

@@ -32,11 +32,6 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 		<option value="green">Grün</option>
 		<option value="white">Weiss</option>
 	</select>
-	<select id="layoutswitcher">
-		<option value="de_CH">Bärndütsch</option>
-		<option value="de">Hochdeutsch</option>
-		<option value="en">English</option>
-	</select>
 	<p id="disclaimer">Created by fritteli, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.
 	<script type="text/javascript" src="uhr-de_CH.js"></script>
 	<script type="text/javascript" src="uhr-de.js"></script>
@@ -47,34 +42,12 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 			$('#themeswitcher').on('change', function() {
 				uhr.setTheme(this.value);
 			});
-			$('#layoutswitcher').on('change', function() {
-				uhr.setLayout(this.value);
-			});
-			$.cookie.defaults.expires = 365;
-			$.cookie.defaults.path = '/';
 			var theme = $.cookie('theme');
-			var layout = $.cookie('layout');
-			var status = $.cookie('status');
 			if (theme === undefined || theme == 'undefined') {
 				theme = 'black';
 			}
-			if(layout === undefined || layout == 'undefined') {
-				layout = 'de_CH';
-			}
-			if (status === undefined || status == 'undefined') {
-				status = 'on';
-			}
 			$('#themeswitcher').val(theme);
 			uhr.setTheme(theme);
-			$('#layoutswitcher').val(layout);
-			uhr.setLayout(layout);
-			if (status == 'on') {
-				uhr.start();
-				$('#onoffswitch').prop('checked', true);
-			} else {
-				uhr.stop();
-				$('#onoffswitch').prop('checked', false);
-			}
 		});
 	</script>
 </body>

uhr.js

@@ -19,15 +19,12 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 function Uhr(clockarea, themeElement) {
 	this.id = Uhr.id++;
-	this.clockarea = this.initClockarea(clockarea);
-	this.toggleSwitch = this.initToggleSwitch();
-	this.layoutSwitch = this.initLayoutSwitch();
-	this.letterarea = clockarea.find('.letterarea');
 	this.themeElement = themeElement;
 	this.timer = null;
 	this.currentTheme = null;
 	this.currentLayout = Uhr.layouts['undefined'];
 	this.currentMinute = -1;
+	this.initHTMLElements(clockarea, themeElement);
 }
 Uhr.id = 0;
 Uhr.layouts = new Array();
@@ -46,7 +43,7 @@ Uhr.prototype.start = function() {
 		var uhr = this;
 		this.timer = window.setInterval(function() {uhr.update();}, 1000);
 		this.update();
-		$.cookie('status', 'on', {expires: 365, path: '/'});
+		$.cookie('status' + this.id, 'on', {expires: 365, path: '/'});
 	}
 }
 Uhr.prototype.stop = function() {
@@ -54,7 +51,7 @@ Uhr.prototype.stop = function() {
 		window.clearInterval(this.timer);
 		this.timer = null;
 		this.update();
-		$.cookie('status', 'off', {expires: 365, path: '/'});
+		$.cookie('status' + this.id, 'off', {expires: 365, path: '/'});
 	}
 }
 Uhr.prototype.isOn = function() {
@@ -66,14 +63,14 @@ Uhr.prototype.setLayout = function(locale) {
 		this.currentLayout = newLayout;
 		var renderer = new UhrRenderer(this.currentLayout, this.letterarea);
 		renderer.render(this);
-		$.cookie('layout', locale, {expires: 365, path: '/'});
+		$.cookie('layout' + this.id, locale, {expires: 365, path: '/'});
 	}
 }
 Uhr.prototype.setTheme = function(theme) {
 	if (theme != this.currentTheme) {
 		this.currentTheme = theme;
 		this.themeElement.attr('href', 'uhr-' + theme + '.css');
-		$.cookie('theme', theme, {expires: 365, path: '/'});
+		$.cookie('theme' + this.id, theme, {expires: 365, path: '/'});
 	}
 }
 Uhr.prototype.update = function() {
@@ -141,6 +138,12 @@ Uhr.prototype.normalizeHour = function(hour) {
 	}
 	return hour;
 }
+Uhr.prototype.initHTMLElements = function(clockarea, themeElement) {
+	this.clockarea = this.initClockarea(clockarea);
+	this.letterarea = this.clockarea.find('.letterarea');
+	this.layoutSwitch = this.initLayoutSwitch();
+	this.toggleSwitch = this.initToggleSwitch();
+}
 Uhr.prototype.initClockarea = function(clockarea) {
 	clockarea.empty();
 	clockarea.append('<span class="item dot dot1"></span>');
@@ -164,24 +167,43 @@ Uhr.prototype.initToggleSwitch = function() {
 		+ '<div class="onoffswitch-switch"></div>'
 		+ '</label>');
 	this.clockarea.after(toggleSwitch);
+
+	var status = $.cookie('status' + this.id);
+	if (status == 'on') {
+		this.start();
+		toggleSwitch.prop('checked', true);
+	} else {
+		this.stop();
+		toggleSwitch.prop('checked', false);
+	}
 	return toggleSwitch;
 }
 Uhr.prototype.initLayoutSwitch = function() {
 	var layoutSwitch = $('<select id="layoutswitcher' + this.id + '"></select>')
+
 	for (var code in Uhr.layouts) {
 		if (Uhr.layouts.hasOwnProperty(code)) {
-			console.log(code);
 			var layout = Uhr.layouts[code];
-			console.log(layout);
+			var option = $('<option value="' + code + '">' + layout.language + '</option>')
-			console.log(layout.language);
+			layoutSwitch.append(option);
-			// TODO fill select with options
 		}
 	}
+	var uhr = this;
+	layoutSwitch.on('change', function() {
+		uhr.setLayout(this.value);
+	});
+	this.clockarea.after(layoutSwitch);
+
+	var selectedLayout = $.cookie('layout' + this.id);
+	if (selectedLayout != undefined && selectedLayout != 'undefinded') {
+		layoutSwitch.val(selectedLayout);
+		this.setLayout(selectedLayout);
+	}
 	return layoutSwitch;
 }
 
 Uhr.register('undefined', {
-	language: 'Undefined',
+	language: 'Please choose your language',
 	values: []
 });