From fe243507ec7a65f5be7b3658c3f371c2cd557e70 Mon Sep 17 00:00:00 2001
From: Manuel Friedli <manuel@fritteli.ch>
Date: Wed, 27 Nov 2013 15:40:56 +0100
Subject: [PATCH] mehr classes statt ids

---
 index.html |  4 ++--
 uhr.css    |  2 +-
 uhr.js     | 13 +++++++------
 3 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/index.html b/index.html
index c288927..a804417 100644
--- a/index.html
+++ b/index.html
@@ -29,7 +29,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 		<span class="item dot dot2"></span>
 		<span class="item dot dot3"></span>
 		<span class="item dot dot4"></span>
-		<div id="renderarea" class="renderarea"></div>
+		<div class="letterarea"></div>
 		<!-- glossy reflection -->
 		<span class="reflection"></span>
 	</div>
@@ -54,7 +54,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 	</div>
 	<p id="disclaimer">Created by fritteli, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.
 	<script type="text/javascript">
-		var uhr = new Uhr($('#renderarea'), $('#theme'));
+		var uhr = new Uhr($('#uhr'), $('#theme'));
 		$(document).ready(function() {
 			$('#themeswitcher').on('change', function() {
 				uhr.setTheme(this.value);
diff --git a/uhr.css b/uhr.css
index c62fe68..67a8e27 100644
--- a/uhr.css
+++ b/uhr.css
@@ -39,7 +39,7 @@ body {
 }
 #themeswitcher {
 }
-.uhr .renderarea {
+.uhr .letterarea {
 	display: block;
 	position: absolute;
 	top: 5em;
diff --git a/uhr.js b/uhr.js
index 2a2decc..dcb9feb 100644
--- a/uhr.js
+++ b/uhr.js
@@ -14,11 +14,12 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 /**
  * Die Uhr.
- * @param renderarea   Das jQuery-gewrappte HTML-Element, auf dem die Uhr angezeigt werden soll.
+ * @param clockarea   Das jQuery-gewrappte HTML-Element, auf dem die Uhr angezeigt werden soll.
  * @param themeElement Das HTML-Stylesheet-Tag, das das Theme-CSS referenziert.
  */
-function Uhr(renderarea, themeElement) {
-	this.renderarea = renderarea;
+function Uhr(clockarea, themeElement) {
+	this.clockarea = clockarea;
+	this.letterarea = clockarea.find('.letterarea');
 	this.themeElement = themeElement;
 	this.timer = null;
 	this.currentTheme = null;
@@ -64,7 +65,7 @@ Uhr.prototype.setLayout = function(locale) {
 	var newLayout = this.layouts[locale];
 	if (newLayout !== undefined && newLayout != this.currentLayout) {
 		this.currentLayout = newLayout;
-		var renderer = new UhrRenderer(this.currentLayout, this.renderarea);
+		var renderer = new UhrRenderer(this.currentLayout, this.letterarea);
 		renderer.render(this);
 		$.cookie('layout', locale);
 	}
@@ -103,10 +104,10 @@ Uhr.prototype.update = function() {
 	}
 }
 Uhr.prototype.clear = function() {
-	this.renderarea.parent().find('.item').removeClass('active');
+	this.clockarea.find('.item').removeClass('active');
 }
 Uhr.prototype.highlight = function(itemClass) {
-	this.renderarea.parent().find('.item.' + itemClass).addClass('active');
+	this.clockarea.find('.item.' + itemClass).addClass('active');
 }
 Uhr.prototype.getHour = function(date) {
 	if (typeof this.currentLayout.getHour === 'function') {