/*! uhr - v7.0-next - 2015-01-13
* http://bärneruhr.ch/
* Copyright (c) 2015 Manuel Friedli; Licensed GPLv3 */
(function($) {
'use strict';
var uhrGlobals = {
"id": 0,
"languages": [],
"themes": [],
registerLanguage: function registerLanguage(code, language) {
var alreadyExists = uhrGlobals.languages.some(function(element) {
if (code === element.code) {
console.error("Error: Language code '" + code + "' cannot be registered for language '" + language.language +
"' because it is already registered for language '" + element.language + "'!");
return true;
}
return false;
});
if (!alreadyExists) {
language.code = code;
uhrGlobals.languages.push(language);
}
}
};
// auto-detect themes
$('link[rel=stylesheet]').each(function(index, item) {
var styleSheet = $(item);
var styleClass = styleSheet.attr('data-class');
if (styleClass !== undefined) {
var name = styleSheet.attr('data-name');
if (name === undefined) {
name = styleClass;
}
uhrGlobals.themes.push({'styleClass': styleClass, 'name': name});
}
});
// fall-back if no theme was included
if (uhrGlobals.themes.length === 0) {
uhrGlobals.themes.push({});
}
// public interface methods (exported later)
var start = function start() {
if (!isOn.bind(this)()) {
this.timer = window.setInterval(function() {
this.options.time = new Date();
update.bind(this)();
}.bind(this), 1000);
update.bind(this)();
setCookie.bind(this)('uhr-status', 'on');
}
};
var stop = function stop() {
if (isOn.bind(this)()) {
window.clearInterval(this.timer);
this.timer = null;
update.bind(this)();
setCookie.bind(this)('uhr-status', 'off');
}
};
var toggle = function toggle() {
if (isOn.bind(this)()) {
this.stop();
} else {
this.start();
}
};
var setLanguage = function setLanguage(languageKey) {
if (languageKey !== this.options.language) {
this.options.language = languageKey;
var renderer = new UhrRenderer(language.bind(this)(), this.element.find('.letterarea'));
renderer.render.bind(this)(function() {
this.currentMinute = -1;
update.bind(this)();
}.bind(this));
setCookie.bind(this)('uhr-language', languageKey);
update.bind(this)();
}
};
var setTheme = function setTheme(theme) {
if (theme !== this.options.theme) {
this.element.removeClass(this.options.theme).addClass(theme);
$('#uhr-onoffswitch' + this.id).removeClass(this.options.theme).addClass(theme);
this.options.theme = theme;
setCookie.bind(this)('uhr-theme', theme);
}
};
var setTime = function setTime(time) {
this.currentMinute = -1;
if (time === null) {
this.options.time = new Date();
} else {
if (this.timer !== null) {
window.clearInterval(this.timer);
}
this.options.time = time;
}
update.bind(this)();
};
var setMode = function(mode) {
this.options.mode = mode;
this.currentMinute = -1;
update.bind(this)();
setCookie.bind(this)('uhr-mode', mode);
};
var setWidth = function setWidth(width) {
var e = this.element;
e.css('width', width);
var realWidth = e.width();
e.width(realWidth);
e.height(realWidth);
e.css('font-size', (realWidth / 40) + 'px');
};
// private interface methods
var create = function create() {
this.id = uhrGlobals.id++;
this.timer = null;
this.currentMinute = -1;
var userTime = this.options.time;
var hash, params;
if (this.options.time === undefined) {
this.options.time = new Date();
}
// parse the URL params
hash = window.location.hash;
if (hash !== undefined && typeof hash === 'string' && hash.charAt(0) === '#') {
hash = hash.substring(1);
hash = decodeURIComponent(hash);
params = hash.split('&');
params.forEach(function (element) {
var pair = element.split('=');
var key = pair[0];
var value = pair[1];
switch (key) {
case 'l':
case 'language':
this.options.language = value;
this.options.force = true;
break;
case 't':
case 'theme':
this.options.theme = value;
this.options.force = true;
break;
case 'm':
case 'mode':
this.options.mode = value;
this.options.force = true;
break;
case 's':
case 'status':
this.options.status = value;
this.options.force = true;
break;
}
}.bind(this));
}
// end parse the URL params
setupHTML.bind(this)();
wireFunctionality.bind(this)();
if (userTime !== undefined) {
this.time(userTime);
}
};
// private helper methods (not exported)
var toggleConfigScreen = function toggleConfigScreen() {
$('#uhr-controlpanel' + this.id).toggle('fast');
};
// set up
var setupHTML = function setupHTML() {
var e = this.element;
// Base clock area
e.addClass('uhr');
e.empty();
e.append('');
e.append('');
e.append('');
e.append('');
e.append('
');
e.append('');
setWidth.bind(this)(this.options.width);
if (this.options.controls) {
var controlpanel = $('');
var content = $('');
controlpanel.append(content);
// on/off switch
var toggleSwitch = $('');
toggleSwitch.append('');
toggleSwitch.append('');
content.append(toggleSwitch);
// time mode switch
var modeSwitch = $('');
modeSwitch.append('');
modeSwitch.append('');
content.append(modeSwitch);
// language chooser
if (uhrGlobals.languages.length > 1) {
var languageChooser = $('');
uhrGlobals.languages.forEach(function(item) {
languageChooser.append('');
});
content.append(languageChooser);
}
// theme chooser
if (uhrGlobals.themes.length > 1) {
var themeChooser = $('');
uhrGlobals.themes.forEach(function(item) {
themeChooser.append('');
});
content.append(themeChooser);
}
var closebutton = $('');
closebutton.on('click', function() {
$('#uhr-controlpanel' + this.id).hide('fast');
}.bind(this));
content.append(closebutton);
e.after(controlpanel);
controlpanel.hide();
var configlink = $('');
configlink.on('click', function() {
toggleConfigScreen.bind(this)();
}.bind(this));
e.after(configlink);
}
};
var wireFunctionality = function wireFunctionality() {
// on/off switch
var toggleSwitch = $('#uhr-onoffswitch-checkbox' + this.id);
toggleSwitch.on('click', function() {
this.toggle();
}.bind(this));
var status = $.cookie('uhr-status' + this.id);
if (status === undefined || this.options.force) {
status = this.options.status;
}
toggleSwitch.prop('checked', status === 'on');
if (status === 'on') {
this.start();
} else {
this.stop();
}
// time mode switch
var modeSwitch = $('#uhr-modeswitch-checkbox' + this.id);
modeSwitch.on('click', function() {
if (this.options.mode === 'seconds') {
setMode.bind(this)('normal');
} else {
setMode.bind(this)('seconds');
}
}.bind(this));
var mode = $.cookie('uhr-mode' + this.id);
if (mode === undefined || this.options.force) {
mode = this.options.mode;
}
modeSwitch.prop('checked', mode !== 'seconds');
if (mode === 'seconds') {
setMode.bind(this)('seconds');
} else {
setMode.bind(this)('normal');
}
// language chooser
var languageChooser = $('#uhr-languagechooser' + this.id);
languageChooser.on('change', function() {
var languageKey = $('#uhr-languagechooser' + this.id).val();
this.language(languageKey);
}.bind(this));
var selectedLanguage = $.cookie('uhr-language' + this.id);
if (selectedLanguage === undefined || this.options.force) {
selectedLanguage = this.options.language;
}
var found = uhrGlobals.languages.some(function(item) {
return selectedLanguage === item.code;
});
if (!found) {
var fallbackLanguage;
if (uhrGlobals.languages.length > 0) {
fallbackLanguage = uhrGlobals.languages[0].code;
} else {
fallbackLanguage = '';
}
console.warn("Language '" + selectedLanguage + "' not found! Using fallback '" + fallbackLanguage + "'");
selectedLanguage = fallbackLanguage;
}
languageChooser.val(selectedLanguage);
this.options.language = "";
this.language(selectedLanguage);
// theme chooser
var themeChooser = $('#uhr-themechooser' + this.id);
themeChooser.on('change', function() {
var themeKey = $('#uhr-themechooser' + this.id).val();
this.theme(themeKey);
}.bind(this));
var selectedTheme = $.cookie('uhr-theme' + this.id);
if (selectedTheme === undefined || this.options.force) {
selectedTheme = this.options.theme;
}
found = uhrGlobals.themes.some(function(item) {
return selectedTheme === item.styleClass;
});
if (!found) {
var fallbackTheme = uhrGlobals.themes[0].styleClass;
console.warn("Theme '" + selectedTheme + "' not found! Using fallback '" + fallbackTheme + "'");
selectedTheme = fallbackTheme;
}
themeChooser.val(selectedTheme);
this.options.theme = "";
this.theme(selectedTheme);
if (this.options.autoresize) {
$(window).on('resize', function() {
var $e = this.element;
var $parent = $e.parent();
var $window = $(window);
var parentWidth = $parent.width();
var parentHeight = $parent.height();
var windowWidth = $window.width();
var windowHeight = $window.height();
var size = Math.min(parentWidth, parentHeight, windowWidth, windowHeight) + 'px';
setWidth.bind(this)(size);
}.bind(this));
}
};
var setCookie = function setCookie(cookieName, cookieValue) {
var options = {};
if (this.options.cookiePath !== undefined) {
options = {expires: 365, path: this.options.cookiePath};
} else {
options = {expires: 365};
}
$.cookie(cookieName + this.id, cookieValue, options);
};
// business logic
var isOn = function isOn() {
return this.timer !== null;
};
var update = function update() {
if (isOn.bind(this)()) {
var time = this.options.time;
if (!language.bind(this)().hasOwnProperty('seconds') && this.options.mode !== 'seconds') {
if (time.getMinutes() === this.currentMinute) {
return;
}
this.currentMinute = time.getMinutes();
}
show.bind(this)(time);
} else {
clear.bind(this)();
this.currentMinute = -1;
}
};
var show = function show(time) {
var second = getSecond.bind(this)(time);
var dotMinute = getDotMinute.bind(this)(time);
var hour = getHour.bind(this)(time);
var coarseMinute = getCoarseMinute.bind(this)(time);
clear.bind(this)();
if (this.options.mode === 'seconds') {
highlight.bind(this)('second' + second);
} else {
highlight.bind(this)('on');
for (var i = 1; i <= dotMinute; i++) {
highlight.bind(this)('dot' + i);
}
highlight.bind(this)('minute' + coarseMinute);
highlight.bind(this)('hour' + hour);
}
};
var highlight = function highlight(itemClass) {
this.element.find('.item.' + itemClass).addClass('active');
};
var clear = function clear() {
this.element.find('.item').removeClass('active');
};
var getSecond = function getSecond(date) {
if (typeof language.bind(this)().getSeconds === 'function') {
return language.bind(this)().getSeconds(date);
}
return date.getSeconds();
};
var getDotMinute = function getDotMinute(date) {
if (typeof language.bind(this)().getDotMinute === 'function') {
return language.bind(this)().getDotMinute(date);
}
var minutes = date.getMinutes();
return minutes % 5;
};
var getCoarseMinute = function getCoarseMinute(date) {
if (typeof language.bind(this)().getCoarseMinute === 'function') {
return language.bind(this)().getCoarseMinute(date);
}
return date.getMinutes();
};
var getHour = function getHour(date) {
if (typeof language.bind(this)().getHour === 'function') {
return language.bind(this)().getHour(date);
}
var hour = date.getHours();
if (date.getMinutes() >= 25) {
return (hour + 1) % 24;
}
return hour;
};
var language = function language() {
var matchingLanguages = uhrGlobals.languages.filter(function(element) {
return (element.code === this.options.language);
}, this);
if (matchingLanguages.length > 0) {
return matchingLanguages[0];
}
// fallback: return empty object
return {};
};
$.widget("fritteli.uhr", {
"options": {
width: '100%',
status: 'on',
language: 'de_CH',
theme: uhrGlobals.themes[0].styleClass,
force: false,
controls: true,
cookiePath: undefined,
autoresize: true,
mode: 'normal'
},
"start": start,
"stop": stop,
"toggle": toggle,
"language": setLanguage,
"theme": setTheme,
"time": setTime,
"mode": setMode,
"width": setWidth,
// constructor method
"_create": create
});
$.fritteli.uhr.register = uhrGlobals.registerLanguage;
/**
* Hilfsklasse zum Rendern der Uhr.
* @param layout Layout-Objekt, das gerendert werden soll.
* @param renderarea Das jQuery-gewrappte HTML-Element, auf dem gerendert werden soll.
*/
function UhrRenderer(layout, renderarea) {
this.render = function render(beforeshow) {
if (layout.parsed === undefined) {
switch (layout.version) {
case 2:
var delegate = new UhrRendererV2Delegate(layout);
var parsedLayout = delegate.parse();
Object.defineProperty(layout, "parsed", {"value": parsedLayout, "writable": false, "configurable": false});
break;
default:
console.warn("Unknown layout version: '" + layout.version + "'");
return;
}
}
var letters = layout.parsed;
renderarea.fadeOut('fast', function() {
renderarea.empty();
letters.forEach(function(line, index, array) {
line.forEach(function(letter) {
renderarea.append(letter.toString());
});
if (index < array.length - 1) {
renderarea.append('
');
}
});
if (typeof beforeshow === 'function') {
beforeshow();
}
renderarea.fadeIn('fast');
});
};
}
function UhrRendererV2Delegate(layout) {
var vorne0 = {
3: [2, 3, 4],
4: [1, 5],
5: [1, 4, 5],
6: [1, 3, 5],
7: [1, 2, 5],
8: [1, 5],
9: [2, 3, 4]
};
var hinten0 = {
3: [8, 9, 10],
4: [7, 11],
5: [7, 10, 11],
6: [7, 9, 11],
7: [7, 8, 11],
8: [7, 11],
9: [8, 9, 10]
};
var vorne1 = {
3: [3],
4: [2, 3],
5: [3],
6: [3],
7: [3],
8: [3],
9: [2, 3, 4]
};
var hinten1 = {
3: [9],
4: [8, 9],
5: [9],
6: [9],
7: [9],
8: [9],
9: [8, 9, 10]
};
var vorne2 = {
3: [2, 3, 4],
4: [1, 5],
5: [5],
6: [4],
7: [3],
8: [2],
9: [1, 2, 3, 4, 5]
};
var hinten2 = {
3: [8, 9, 10],
4: [7, 11],
5: [11],
6: [10],
7: [9],
8: [8],
9: [7, 8, 9, 10, 11]
};
var vorne3 = {
3: [1, 2, 3, 4, 5],
4: [4],
5: [3],
6: [4],
7: [5],
8: [1, 5],
9: [2, 3, 4]
};
var hinten3 = {
3: [7, 8, 9, 10, 11],
4: [10],
5: [9],
6: [10],
7: [11],
8: [7, 11],
9: [8, 9, 10]
};
var vorne4 = {
3: [4],
4: [3, 4],
5: [2, 4],
6: [1, 4],
7: [1, 2, 3, 4, 5],
8: [4],
9: [4]
};
var hinten4 = {
3: [10],
4: [9, 10],
5: [8, 10],
6: [7, 10],
7: [7, 8, 9, 10, 11],
8: [10],
9: [10]
};
var vorne5 = {
3: [1, 2, 3, 4, 5],
4: [1],
5: [1, 2, 3, 4],
6: [5],
7: [5],
8: [1, 5],
9: [2, 3, 4]
};
var hinten5 = {
3: [7, 8, 9, 10, 11],
4: [7],
5: [7, 8, 9, 10],
6: [11],
7: [11],
8: [7, 11],
9: [8, 9, 10]
};
var hinten6 = {
3: [9, 10],
4: [8],
5: [7],
6: [7, 8, 9, 10],
7: [7, 11],
8: [7, 11],
9: [8, 9, 10]
};
var hinten7 = {
3: [7, 8, 9, 10, 11],
4: [11],
5: [10],
6: [9],
7: [8],
8: [8],
9: [8]
};
var hinten8 = {
3: [8, 9, 10],
4: [7, 11],
5: [7, 11],
6: [8, 9, 10],
7: [7, 11],
8: [7, 11],
9: [8, 9, 10]
};
var hinten9 = {
3: [8, 9, 10],
4: [7, 11],
5: [7, 11],
6: [8, 9, 10, 11],
7: [11],
8: [10],
9: [8, 9]
};
var seconds= {
"0": [vorne0, hinten0],
"1": [vorne0, hinten1],
"2": [vorne0, hinten2],
"3": [vorne0, hinten3],
"4": [vorne0, hinten4],
"5": [vorne0, hinten5],
"6": [vorne0, hinten6],
"7": [vorne0, hinten7],
"8": [vorne0, hinten8],
"9": [vorne0, hinten9],
"10": [vorne1, hinten0],
"11": [vorne1, hinten1],
"12": [vorne1, hinten2],
"13": [vorne1, hinten3],
"14": [vorne1, hinten4],
"15": [vorne1, hinten5],
"16": [vorne1, hinten6],
"17": [vorne1, hinten7],
"18": [vorne1, hinten8],
"19": [vorne1, hinten9],
"20": [vorne2, hinten0],
"21": [vorne2, hinten1],
"22": [vorne2, hinten2],
"23": [vorne2, hinten3],
"24": [vorne2, hinten4],
"25": [vorne2, hinten5],
"26": [vorne2, hinten6],
"27": [vorne2, hinten7],
"28": [vorne2, hinten8],
"29": [vorne2, hinten9],
"30": [vorne3, hinten0],
"31": [vorne3, hinten1],
"32": [vorne3, hinten2],
"33": [vorne3, hinten3],
"34": [vorne3, hinten4],
"35": [vorne3, hinten5],
"36": [vorne3, hinten6],
"37": [vorne3, hinten7],
"38": [vorne3, hinten8],
"39": [vorne3, hinten9],
"40": [vorne4, hinten0],
"41": [vorne4, hinten1],
"42": [vorne4, hinten2],
"43": [vorne4, hinten3],
"44": [vorne4, hinten4],
"45": [vorne4, hinten5],
"46": [vorne4, hinten6],
"47": [vorne4, hinten7],
"48": [vorne4, hinten8],
"49": [vorne4, hinten9],
"50": [vorne5, hinten0],
"51": [vorne5, hinten1],
"52": [vorne5, hinten2],
"53": [vorne5, hinten3],
"54": [vorne5, hinten4],
"55": [vorne5, hinten5],
"56": [vorne5, hinten6],
"57": [vorne5, hinten7],
"58": [vorne5, hinten8],
"59": [vorne5, hinten9]
};
function parseArrayOrObject(letters, styleClass, input) {
if (typeof input !== 'undefined' && input !== null) {
if (Array.isArray(input)) {
input.forEach(function(item) {
parseObject(letters, styleClass, item);
});
} else {
parseObject(letters, styleClass, input);
}
}
}
function parseObject(letters, styleClass, object) {
if (typeof object !== 'undefined' && object !== null) {
Object.keys(object).forEach(function(y) {
var highlightLetters = object[y];
highlightLetters.forEach(function(x) {
letters[y - 1][x - 1].addStyle(styleClass);
});
});
}
}
function parseTimeDefinition(letters, styleClass, definition) {
if (typeof definition !== 'undefined' && definition !== null) {
Object.keys(definition).forEach(function(listString) {
var array = listString.split(',');
var highlightLetters = definition[listString];
array.forEach(function(item) {
parseArrayOrObject(letters, styleClass + item, highlightLetters);
});
});
}
}
this.parse = function parse() {
var letters = [];
layout.letters.forEach(function(string) {
var line = [];
for (var c = 0; c < string.length; c++) {
var character = new Letter(string[c]);
line.push(character);
}
letters.push(line);
});
parseArrayOrObject(letters, 'on', layout.permanent);
if (typeof layout.seconds !== 'undefined' && layout.seconds !== null) {
parseTimeDefinition(letters, 'second', layout.seconds);
} else {
parseTimeDefinition(letters, 'second', seconds);
}
parseTimeDefinition(letters, 'minute', layout.minutes);
parseTimeDefinition(letters, 'hour', layout.hours);
return letters;
};
}
/**
* Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
* @param value Der Buchstabe, der Dargestellt werden soll.
* @param style Die CSS-Styleklassen des Buchstabens.
*/
function Letter(value, style) {
var myValue = value;
var myStyle = style || '';
this.addStyle = function(style) {
if (myStyle === '') {
myStyle = style;
} else {
myStyle += ' ' + style;
}
};
this.toString = function() {
return '' + myValue + '';
};
}
})(jQuery);
(function($) {
'use strict';
var es_ist = {1: [1, 2, 4, 5, 6]};
var uhr = {10: [9, 10, 11]};
var nach = {4: [8, 9, 10, 11]};
var vor = {4: [1, 2, 3]};
var halb = {5: [1, 2, 3, 4]};
var fuenf = {1: [8, 9, 10, 11]};
var zehn = {2: [1, 2, 3, 4]};
var viertel = {3: [5, 6, 7, 8, 9, 10, 11]};
var zwanzig = {2: [5, 6, 7, 8, 9, 10, 11]};
var dreiviertel = {3: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]};
var layout = {
"version": 2,
"language": 'Deutsch',
"letters": [
'ESKISTAFÜNF',
'ZEHNZWANZIG',
'DREIVIERTEL',
'VORFUNKNACH',
'HALBAELFÜNF',
'EINSXAMZWEI',
'DREIPMJVIER',
'SECHSNLACHT',
'SIEBENZWÖLF',
'ZEHNEUNKUHR'
],
"permanent": es_ist,
"minutes": {
"0,1,2,3,4": uhr,
"5,6,7,8,9": [fuenf, nach],
"10,11,12,13,14": [zehn, nach],
"15,16,17,18,19": [viertel, nach],
"20,21,22,23,24": [zwanzig, nach],
"25,26,27,28,29": [fuenf, vor, halb],
"30,31,32,33,34": halb,
"35,36,37,38,39": [fuenf, nach, halb],
"40,41,42,43,44": [zwanzig, vor],
"45,46,47,48,49": dreiviertel,
"50,51,52,53,54": [zehn, vor],
"55,56,57,58,59": [fuenf, vor]
},
"hours": {
"0,12": {9: [7, 8, 9, 10, 11]},
"1,13": {6: [1, 2, 3, 4]},
"2,14": {6: [8, 9, 10, 11]},
"3,15": {7: [1, 2, 3, 4]},
"4,16": {7: [8, 9, 10, 11]},
"5,17": {5: [8, 9, 10, 11]},
"6,18": {8: [1, 2, 3, 4, 5]},
"7,19": {9: [1, 2, 3, 4, 5, 6]},
"8,20": {8: [8, 9, 10, 11]},
"9,21": {10: [4, 5, 6, 7]},
"10,22": {10: [1, 2, 3, 4]},
"11,23": {5: [6, 7, 8]}
}
};
$.fritteli.uhr.register('de', layout);
}(jQuery));
(function($) {
'use strict';
// hilfsvariablen
var es_isch = {1: [1, 2, 4, 5, 6, 7]};
var ab = {4: [1, 2]};
var vor = {3: [9, 10, 11]};
var haubi = {4: [4, 5, 6, 7, 8]};
var fuef = {1: [9, 10, 11]};
var zae = {2: [9, 10, 11]};
var viertu = {2: [1, 2, 3, 4, 5, 6]};
var zwaenzg = {3: [1, 2, 3, 4, 5, 6]};
var layout = {
// version: zur Zeit immer 2 (Pflichtattribut)
"version": 2,
// Sprechender Name der Sprache
"language": 'Bärndütsch',
// Buchstabenfeld als Array von Strings.
"letters": [
'ESKISCHAFÜF',
'VIERTUBFZÄÄ',
'ZWÄNZGSIVOR',
'ABOHAUBIEGE',
'EISZWÖISDRÜ',
'VIERIFÜFIQT',
'SÄCHSISIBNI',
'ACHTINÜNIEL',
'ZÄNIERBEUFI',
'ZWÖUFINAUHR'
],
// Permanent aktive Buchstaben. , vgl. ausführliche Beschreibung bei "minutes".
"permanent": es_isch,
/*
* Minuten: Objekt im folgenden Format:
* {
* : ,
* ...
* }
* : String von Komma-separierten Minutenwerten, zu welchem die in angegebenen Buchstaben aktiv sein sollen
* : [