funktionen in die haupt-JS-datei verschoben, neue helperfunktion für minuten, rendern IMMER auf #renderarea
This commit is contained in:
parent
d9c07aaa2c
commit
6c08386c82
3 changed files with 35 additions and 29 deletions
|
@ -3,8 +3,8 @@
|
||||||
<head>
|
<head>
|
||||||
<title>Die Zeit als Wort - in HTML, CSS und JS</title>
|
<title>Die Zeit als Wort - in HTML, CSS und JS</title>
|
||||||
<script type="text/javascript" src="jquery-2.0.3.min.js"></script>
|
<script type="text/javascript" src="jquery-2.0.3.min.js"></script>
|
||||||
<script type="text/javascript" src="uhr-de_CH.js"></script>
|
|
||||||
<script type="text/javascript" src="uhr.js"></script>
|
<script type="text/javascript" src="uhr.js"></script>
|
||||||
|
<script type="text/javascript" src="uhr-de_CH.js"></script>
|
||||||
<link rel="stylesheet" type="text/css" href="uhr.css" />
|
<link rel="stylesheet" type="text/css" href="uhr.css" />
|
||||||
<link rel="stylesheet" type="text/css" href="uhr-black.css" id="theme" />
|
<link rel="stylesheet" type="text/css" href="uhr-black.css" id="theme" />
|
||||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||||
|
@ -36,7 +36,7 @@
|
||||||
<p id="disclaimer">Created by fritteli, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.
|
<p id="disclaimer">Created by fritteli, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
$(document).ready(function() {
|
$(document).ready(function() {
|
||||||
render(layout, '#renderarea');
|
render(layout);
|
||||||
$('input[name=theme]').on('click', function() {
|
$('input[name=theme]').on('click', function() {
|
||||||
switchTheme(this);
|
switchTheme(this);
|
||||||
});
|
});
|
||||||
|
|
29
uhr-de_CH.js
29
uhr-de_CH.js
|
@ -1,32 +1,11 @@
|
||||||
/*
|
|
||||||
*/
|
|
||||||
function Letter(value, style = '') {
|
|
||||||
this.value = value;
|
|
||||||
this.style = style;
|
|
||||||
this.getStyle = function() {
|
|
||||||
return "item letter " + style;
|
|
||||||
}
|
|
||||||
this.getValue = function() {
|
|
||||||
return value;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Letter.prototype.toString = function letterToString() {
|
|
||||||
return "<span class=\"" + this.getStyle() + "\">" + this.getValue() + "</span>";
|
|
||||||
}
|
|
||||||
function l(letter, style) {
|
|
||||||
return new Letter(letter, style);
|
|
||||||
}
|
|
||||||
function h(letter, hour) {
|
|
||||||
return l(letter, 'hour' + hour);
|
|
||||||
}
|
|
||||||
var layout = {
|
var layout = {
|
||||||
language: "Bärndütsch",
|
language: "Bärndütsch",
|
||||||
locale: "de_CH",
|
locale: "de_CH",
|
||||||
values: [
|
values: [
|
||||||
[l('E', 'es'), l('S', 'es'),l('K'),l('I', 'isch'),l('S', 'isch'),l('C', 'isch'),l('H', 'isch'),l('A'),l('F', 'minute5 minute25 minute35 minute55'),l('Ü', 'minute5 minute25 minute35 minute55'),l('F', 'minute5 minute25 minute35 minute55')],
|
[l('E', 'es'), l('S', 'es'),l('K'),l('I', 'isch'),l('S', 'isch'),l('C', 'isch'),l('H', 'isch'),l('A'),m('F', 5, 25, 35, 55),m('Ü', 5, 25, 35, 55),m('F', 5, 25, 35, 55)],
|
||||||
[l('V', 'minute15 minute45'), l('I', 'minute15 minute45'),l('E', 'minute15 minute45'),l('R', 'minute15 minute45'),l('T', 'minute15 minute45'),l('U', 'minute15 minute45'),l('B'),l('F'),l('Z', 'minute10 minute50'),l('Ä', 'minute10 minute50'),l('Ä', 'minute10 minute50')],
|
[m('V', 15, 45), m('I', 15, 45),m('E', 15, 45),m('R', 15, 45),m('T', 15, 45),m('U', 15, 45),l('B'),l('F'),m('Z', 10, 50),m('Ä', 10, 50),m('Ä', 10, 50)],
|
||||||
[l('Z', 'minute20 minute40'), l('W', 'minute20 minute40'),l('Ä', 'minute20 minute40'),l('N', 'minute20 minute40'),l('Z', 'minute20 minute40'),l('G', 'minute20 minute40'),l('S'),l('I'),l('V', 'minute25 minute40 minute45 minute50 minute55'),l('O', 'minute25 minute40 minute45 minute50 minute55'),l('R', 'minute25 minute40 minute45 minute50 minute55')],
|
[m('Z', 20, 40), m('W', 20, 40),m('Ä', 20, 40),m('N', 20, 40),m('Z', 20, 40),m('G', 20, 40),l('S'),l('I'),m('V', 25, 40, 45, 50, 55),m('O', 25, 40, 45, 50, 55),m('R', 25, 40, 45, 50, 55)],
|
||||||
[l('A', 'minute5 minute10 minute15 minute20 minute35'), l('B', 'minute5 minute10 minute15 minute20 minute35'),l('O'),l('H', 'minute25 minute30 minute35'),l('A', 'minute25 minute30 minute35'),l('U', 'minute25 minute30 minute35'),l('B', 'minute25 minute30 minute35'),l('I', 'minute25 minute30 minute35'),l('E'),l('G'),l('E')],
|
[m('A', 5, 10, 15, 20, 35), m('B', 5, 10, 15, 20, 35),l('O'),m('H', 25, 30, 35),m('A', 25, 30, 35),m('U', 25, 30, 35),m('B', 25, 30, 35),m('I', 25, 30, 35),l('E'),l('G'),l('E')],
|
||||||
[h('E', 1), h('I', 1),h('S', 1),h('Z', 2),h('W', 2),h('Ö', 2),h('I', 2),l('S'),h('D', 3),h('R', 3),h('Ü', 3)],
|
[h('E', 1), h('I', 1),h('S', 1),h('Z', 2),h('W', 2),h('Ö', 2),h('I', 2),l('S'),h('D', 3),h('R', 3),h('Ü', 3)],
|
||||||
[h('V', 4), h('I', 4),h('E', 4),h('R', 4),h('I', 4),h('F', 5),h('Ü', 5),h('F', 5),h('I', 5),l('Q'),l('T')],
|
[h('V', 4), h('I', 4),h('E', 4),h('R', 4),h('I', 4),h('F', 5),h('Ü', 5),h('F', 5),h('I', 5),l('Q'),l('T')],
|
||||||
[h('S', 6), h('Ä', 6),h('C', 6),h('H', 6),h('S', 6),h('I', 6),h('S', 7),h('I', 7),h('B', 7),h('N', 7),h('I', 7)],
|
[h('S', 6), h('Ä', 6),h('C', 6),h('H', 6),h('S', 6),h('I', 6),h('S', 7),h('I', 7),h('B', 7),h('N', 7),h('I', 7)],
|
||||||
|
|
31
uhr.js
31
uhr.js
|
@ -73,8 +73,8 @@ function switchTheme(element) {
|
||||||
$('#theme').attr('href', 'uhr-' + theme + '.css');
|
$('#theme').attr('href', 'uhr-' + theme + '.css');
|
||||||
}
|
}
|
||||||
|
|
||||||
function render(layout, containerelement) {
|
function render(layout) {
|
||||||
var container = $(containerelement);
|
var container = $('#renderarea');
|
||||||
for (var y = 0; y < layout.values.length; y++) {
|
for (var y = 0; y < layout.values.length; y++) {
|
||||||
for (var x = 0; x < layout.values[y].length; x++) {
|
for (var x = 0; x < layout.values[y].length; x++) {
|
||||||
var letter = layout.values[y][x];
|
var letter = layout.values[y][x];
|
||||||
|
@ -86,3 +86,30 @@ function render(layout, containerelement) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function Letter(value, style = '') {
|
||||||
|
this.value = value;
|
||||||
|
this.style = style;
|
||||||
|
this.getStyle = function() {
|
||||||
|
return "item letter " + style;
|
||||||
|
}
|
||||||
|
this.getValue = function() {
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Letter.prototype.toString = function letterToString() {
|
||||||
|
return "<span class=\"" + this.getStyle() + "\">" + this.getValue() + "</span>";
|
||||||
|
}
|
||||||
|
function l(letter, style) {
|
||||||
|
return new Letter(letter, style);
|
||||||
|
}
|
||||||
|
function h(letter, hour) {
|
||||||
|
return l(letter, 'hour' + hour);
|
||||||
|
}
|
||||||
|
function m(letter) {
|
||||||
|
var style = '';
|
||||||
|
for (var i = 1; i < arguments.length; i++) {
|
||||||
|
style += ' minute' + arguments[i];
|
||||||
|
}
|
||||||
|
return l(letter, style);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue