Created by fritteli, inspired by QLOCKTWO.
+
+
+
+
diff --git a/uhr-object.js b/uhr-object.js
new file mode 100644
index 0000000..bccb01b
--- /dev/null
+++ b/uhr-object.js
@@ -0,0 +1,143 @@
+function Uhr(renderarea, themeElement) {
+ this.renderarea = renderarea;
+ this.themeElement = themeElement;
+ this.timer = null;
+ this.currentTheme = null;
+ this.currentLayout = null;
+ this.layouts = new Array();
+ this.currentMinute = -1;
+}
+
+Uhr.prototype.toggle = function() {
+ if (this.isOn()) {
+ this.stop();
+ } else {
+ this.start();
+ }
+}
+Uhr.prototype.start = function() {
+ if (!this.isOn()) {
+ var uhr = this;
+ this.timer = window.setInterval(function() {uhr.update();}, 1000);
+ this.update();
+ $.cookie('status', 'on');
+ }
+}
+Uhr.prototype.stop = function() {
+ if (this.isOn()) {
+ window.clearInterval(this.timer);
+ this.timer = null;
+ this.update();
+ $.cookie('status', 'off');
+ }
+}
+Uhr.prototype.isOn = function() {
+ return this.timer != null;
+}
+Uhr.prototype.register = function(key, layout) {
+ this.layouts[key] = layout;
+}
+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);
+ renderer.render(this);
+ $.cookie('layout', locale);
+ }
+}
+Uhr.prototype.setTheme = function(theme) {
+ if (theme != this.currentTheme) {
+ this.currentTheme = theme;
+ this.themeElement.attr('href', 'uhr-' + theme + '.css');
+ $.cookie('theme', theme);
+ }
+}
+Uhr.prototype.update = function() {
+ if (this.isOn()) {
+ var now = new Date();
+ var dotMinute = this.getDotMinute(now);
+ if (dotMinute == this.currentMinute) {
+ return;
+ }
+ this.currentMinute = dotMinute;
+ var hour = this.getHour(now);
+ var coarseMinute = this.getCoarseMinute(now);
+ this.clear();
+ this.highlight('on');
+ for (var i = 1; i <= dotMinute; i++) {
+ this.highlight('dot' + i);
+ }
+ this.highlight('minute' + coarseMinute);
+ hour = this.normalizeHour(hour);
+ this.highlight('hour' + hour);
+ if (coarseMinute == 0) {
+ this.highlight('sharphour');
+ }
+ } else {
+ this.clear();
+ this.currentMinute = -1;
+ }
+}
+Uhr.prototype.clear = function() {
+ this.renderarea.find('.item').removeClass('active');
+}
+Uhr.prototype.highlight = function(itemClass) {
+ this.renderarea.find('.item.' + itemClass).addClass('active');
+}
+Uhr.prototype.getHour = function(date) {
+ if (typeof this.currentLayout.getHour === 'function') {
+ return this.currentLayout.getHour(date);
+ }
+ var hour = date.getHours();
+ if (date.getMinutes() >= 25) {
+ return hour + 1;
+ }
+ return hour;
+}
+Uhr.prototype.getCoarseMinute = function(date) {
+ if (typeof this.currentLayout.getCoarseMinute === 'function') {
+ return this.currentLayout.getCoarseMinute(date);
+ }
+ var minutes = date.getMinutes();
+ return minutes - this.getDotMinute(date);
+}
+Uhr.prototype.getDotMinute = function(date) {
+ if (typeof this.currentLayout.getDotMinute === 'function') {
+ return this.currentLayout.getDotMinute(date);
+ }
+ var minutes = date.getMinutes();
+ return minutes % 5;
+}
+Uhr.prototype.normalizeHour = function(hour) {
+ if (hour > 12) {
+ hour %= 12;
+ }
+ if (hour == 0) {
+ return 12;
+ }
+ return hour;
+}
+
+function UhrRenderer(layout, renderarea) {
+ this.layout = layout;
+ this.renderarea = renderarea;
+}
+UhrRenderer.prototype.render = function(uhr) {
+ var renderer = this;
+ this.renderarea.fadeOut('fast', function() {
+ renderer.renderarea.empty();
+ for (var y = 0; y < renderer.layout.values.length; y++) {
+ for (var x = 0; x < renderer.layout.values[y].length; x++) {
+ var letter = renderer.layout.values[y][x];
+ renderer.renderarea.append(letter.toString());
+ }
+ if (y < renderer.layout.values.length - 1) {
+ renderer.renderarea.append('
');
+ }
+ }
+ uhr.update();
+ renderer.renderarea.fadeIn('fast');
+ });
+}
+
diff --git a/uhr.js b/uhr.js
index 4f74a1c..3a5a2d3 100644
--- a/uhr.js
+++ b/uhr.js
@@ -1,91 +1,8 @@
-var clock = null;
-var currentMinute = -1;
var layout = new Array();
layout['default'] = {
language: 'Undefined',
values: []
};
-var currentLayout = layout['default'];
-
-function highlightCurrentTime() {
- var now = new Date();
- var dotMinute = getDotMinute(now);
- if (dotMinute == currentMinute) {
- return;
- }
- currentMinute = dotMinute;
- var hour = getHour(now);
- var coarseMinute = getCoarseMinute(now);
- resetItems();
- for (var i = 1; i <= dotMinute; i++) {
- highlight('dot' + i);
- }
- highlight('minute' + coarseMinute);
- hour = normalizeHour(hour);
- highlight('hour' + hour);
- if (coarseMinute == 0) {
- highlight('sharphour');
- }
-}
-function getHour(date) {
- if (typeof currentLayout.getHour === 'function') {
- return currentLayout.getHour(date);
- }
- var hour = date.getHours();
- if (date.getMinutes() >= 25) {
- return hour + 1;
- }
- return hour;
-}
-function getCoarseMinute(date) {
- if (typeof currentLayout.getCoarseMinute === 'function') {
- return currentLayout.getCoarseMinute(date);
- }
- var minutes = date.getMinutes();
- return minutes - getDotMinute(date);
-}
-function getDotMinute(date) {
- if (typeof currentLayout.getDotMinute === 'function') {
- return currentLayout.getDotMinute(date);
- }
- var minutes = date.getMinutes();
- return minutes % 5;
-}
-function clearDisplay() {
- $('.item').removeClass('active');
-}
-function resetItems() {
- clearDisplay()
- highlight('on');
-}
-function highlight(itemClass) {
- $('.item.' + itemClass).addClass('active');
-}
-function normalizeHour(hour) {
- if (hour > 12) {
- hour %= 12;
- }
- if (hour == 0) {
- return 12;
- }
- return hour;
-}
-function startClock() {
- if (clock == null) {
- highlightCurrentTime();
- clock = window.setInterval(highlightCurrentTime, 1000);
- }
- $.cookie('status', 'on');
-}
-function stopClock() {
- if (clock != null) {
- window.clearInterval(clock);
- clock = null;
- currentMinute = -1;
- clearDisplay();
- }
- $.cookie('status', 'off');
-}
function updateClockState() {
if (isOn()) {
startClock();
@@ -96,35 +13,6 @@ function updateClockState() {
function isOn() {
return $('#onoffswitch').is(':checked');
}
-function switchTheme(theme) {
- $('#theme').attr('href', 'uhr-' + theme + '.css');
- $.cookie('theme', theme);
-}
-function switchLayout(locale) {
- stopClock();
- currentLayout = layout[locale];
- if (currentLayout == undefined) {
- currentLayout = layout['default'];
- }
- renderLayout();
- if (isOn()) {
- startClock();
- }
- $.cookie('layout', locale);
-}
-function renderLayout() {
- var container = $('#renderarea');
- container.empty();
- for (var y = 0; y < currentLayout.values.length; y++) {
- for (var x = 0; x < currentLayout.values[y].length; x++) {
- var letter = currentLayout.values[y][x];
- container.append(letter.toString());
- }
- if (y < currentLayout.values.length - 1) {
- container.append('
');
- }
- }
-}
function Letter(value, style) {
this.value = value;
this.style = style || '';