manuel/uhr
1
0
Fork 0
Code Issues 5 Pull requests Releases Wiki Activity

tried to convert it, now it's a mess

Browse source
This commit is contained in:
Manuel Friedli 2014-01-11 03:26:53 +01:00
parent 34369f3f89
commit 9db6473085
5 changed files with 222 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
index.html
View file

@ -29,6 +29,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
</head> </head>
<body style="padding:0;margin:0;"> <body style="padding:0;margin:0;">
<div id="uhr"></div> <div id="uhr"></div>
<div id="test"></div>
<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" src="uhr-de_CH.js"></script> <script type="text/javascript" src="uhr-de_CH.js"></script>
<script type="text/javascript" src="uhr-de.js"></script> <script type="text/javascript" src="uhr-de.js"></script>
@ -37,12 +38,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
var height = jQuery(window).height(); var height = jQuery(window).height();
var width = jQuery(window).width(); var width = jQuery(window).width();
var size = height < width ? height : width; var size = height < width ? height : width;
/*
new Uhr(jQuery('#uhr'), { new Uhr(jQuery('#uhr'), {
layout: 'de_CH', layout: 'de_CH',
theme: 'black', theme: 'black',
status: 'on', status: 'on',
width: size + 'px' width: size + 'px'
}); });
*/
$('#test').uhr({width:'10em'});
</script> </script>
</body> </body>
</html> </html>

2
uhr-de.js
View file

@ -27,4 +27,4 @@ var layout = {
[h('Z', 10), h('E', 10),h('H', 10),h('N', 9, 10),h('E', 9),h('U', 9),h('N', 9),l('K'),l('U'),l('H'),l('R')] [h('Z', 10), h('E', 10),h('H', 10),h('N', 9, 10),h('E', 9),h('U', 9),h('N', 9),l('K'),l('U'),l('H'),l('R')]
] ]
}; };
Uhr.register('de', layout); //Uhr.register('de', layout);

2
uhr-de_CH.js
View file

@ -27,4 +27,4 @@ var layout = {
[h('Z', 12), h('W', 12),h('Ö', 12),h('U', 12),h('F', 12),h('I', 12),l('N'),l('A'),l('U'),l('H'),l('R')] [h('Z', 12), h('W', 12),h('Ö', 12),h('U', 12),h('F', 12),h('I', 12),l('N'),l('A'),l('U'),l('H'),l('R')]
] ]
}; };
Uhr.register('de_CH', layout); //Uhr.register('de_CH', layout);

2
uhr-en.js
View file

@ -34,4 +34,4 @@ var layout = {
return hour; return hour;
} }
}; };
Uhr.register('en', layout); //Uhr.register('en', layout);

216
uhr.js
View file

@ -12,6 +12,219 @@ GNU General Public License for more details.
You should have received a copy of the GNU General Public License You should have received a copy of the GNU General Public License
along with this program. If not, see <http://www.gnu.org/licenses/>. along with this program. If not, see <http://www.gnu.org/licenses/>.
*/ */
(function($) {
"use strict";
if (window.Uhr !== undefined) {
return;
}
window.Uhr = {
id: 0,
start: function(e) {
if (!Uhr.isOn(e)) {
e.data('timer', window.setInterval(function() {Uhr.update(e);}, 1000));
Uhr.update(e);
jQuery.cookie('status' + e.data('id'), 'on', {expires: 365, path: '/'});
}
},
stop: function(e) {
if (Uhr.isOn(e)) {
window.clearInterval(e.data('timer'));
e.data('timer', null);
Uhr.update(e);
jQuery.cookie('status' + e.data('id'), 'off', {expires: 365, path: '/'});
}
},
update: function(e) {
if (Uhr.isOn(e)) {
var now = new Date();
if (now.getMinutes() == e.data('currentMinute')) {
return;
}
e.data('currentMinute', now.getMinutes());
//FIXME
var dotMinute = Uhr.getDotMinute(e, now);
var hour = Uhr.getHour(e, now);
var coarseMinute = this.getCoarseMinute(e, now);
Uhr.clear(e);
Uhr.highlight(e, 'on');
for (var i = 1; i <= dotMinute; i++) {
Uhr.highlight(e, 'dot' + i);
}
Uhr.highlight(e, 'minute' + coarseMinute);
hour = this.normalizeHour(hour);
Uhr.highlight(e, 'hour' + hour);
if (coarseMinute == 0) {
Uhr.highlight(e, 'sharphour');
}
} else {
Uhr.clear(e);
e.data('currentMinute', -1);
}
},
toggle: function(e) {
if (Uhr.isOn(e)) {
Uhr.stop(e);
} else {
Uhr.start(e);
}
},
clear: function(e) {
e.find('.item').removeClass('active');
},
setLanguage: function(e, language) {
},
setTheme: function(e, theme) {
var currentTheme = e.data('currentTheme');
if (theme != currentTheme) {
e.removeClass(currentTheme).addClass(theme);
e.data('toggleSwitch').removeClass(currentTheme).addClass(theme);
e.data('currentTheme', theme);
jQuery.cookie('theme' + e.data('id'), theme, {expires: 365, path: '/'});
}
},
isOn: function(e) {
return e.data('timer') != null;
},
highlight: function(e, itemClass) {
e.find('.item.' + itemClass).addClass('active');
},
getHour: function(e, date) {
if (typeof e.data('currentLayout').getHour === 'function') {
return e.data('currentLayout').getHour(date);
}
var hour = date.getHours();
if (date.getMinutes() >= 25) {
return hour + 1;
}
return hour;
},
getCoarseMinute: function(e, date) {
if (typeof e.data('currentLayout').getCoarseMinute === 'function') {
return e.data('currentLayout').getCoarseMinute(date);
}
var minutes = date.getMinutes();
return minutes - Uhr.getDotMinute(e, date);
},
getDotMinute: function(e, date) {
if (typeof e.data('currentLayout').getDotMinute === 'function') {
return e.data('currentLayout').getDotMinute(date);
}
var minutes = date.getMinutes();
return minutes % 5;
},
normalizeHour: function(hour) {
if (hour > 12) {
hour %= 12;
}
if (hour == 0) {
return 12;
}
return hour;
}
}
$.fn.uhr = function(options) {
var settings = $.extend({
width: '100%',
force: false,
status: 'on',
language: 'de_CH',
theme: 'black'
}, options);
return this.each(function() {
var e = $(this);
var id = window.Uhr.id++;
e.data('id', id);
e.data('timer', null);
e.addClass('uhr');
e.empty();
e.append('<span class="item dot dot1"></span>');
e.append('<span class="item dot dot2"></span>');
e.append('<span class="item dot dot3"></span>');
e.append('<span class="item dot dot4"></span>');
e.append('<div class="letterarea"></div>');
e.append('<div class="reflection"></div>');
e.css('width', settings.width);
var realWidth = e.width()
e.width(realWidth);
e.height(realWidth);
e.css('font-size', (realWidth / 40) + 'px');
var toggleSwitch = jQuery('<div class="onoffswitch"></div>');
toggleSwitch.append('<input type="checkbox" name="onoffswitch' + id + '" class="onoffswitch-checkbox" id="onoffswitch' + id + '" checked="checked" />');
toggleSwitch.append('<label class="onoffswitch-label" for="onoffswitch' + id + '">'
+ '<div class="onoffswitch-inner"></div>'
+ '<div class="onoffswitch-switch"></div>'
+ '</label>');
e.after(toggleSwitch);
e.data('toggleSwitch', toggleSwitch);
var languageSwitch = jQuery('<select></select>')
// FIXME handle layouts correctly
for (var code in Uhr.layouts) {
if (Uhr.layouts.hasOwnProperty(code)) {
var language = Uhr.layouts[code];
var option = '<option value="' + code + '">' + language.language + '</option>';
languageSwitch.append(option);
}
}
e.after(languageSwitch);
e.data('languageSwitch', languageSwitch);
var themeSwitch = jQuery('<select></select>');
themeSwitch.append('<option value="black">Schwarz</option>');
themeSwitch.append('<option value="red">Rot</option>');
themeSwitch.append('<option value="blue">Blau</option>');
themeSwitch.append('<option value="green">Grün</option>');
themeSwitch.append('<option value="white">Weiss</option>');
e.after(themeSwitch);
e.data('themeSwitch', themeSwitch);
var input = jQuery('#onoffswitch' + id);
input.on('click', function() {
window.Uhr.toggle(e);
});
var status = jQuery.cookie('status' + id);
if (status == undefined || settings.force) {
status = settings.status;
}
if (status == 'on') {
window.Uhr.start(e);
input.prop('checked', true);
} else {
window.Uhr.stop(e);
input.prop('checked', false);
}
e.data('languageSwitch').on('change', function() {
window.Uhr.setLanguage(e, this.value);
});
var selectedLanguage = jQuery.cookie('language' + id);
if (selectedLanguage == undefined || settings.force) {
selectedLanguage = settings.language;
}
e.data('languageSwitch').val(selectedLanguage);
window.Uhr.setLanguage(e, selectedLanguage);
e.data('themeSwitch').on('change', function() {
window.Uhr.setTheme(e, this.value);
});
var selectedTheme = jQuery.cookie('theme' + id);
if (selectedTheme == undefined || settings.force) {
selectedTheme = settings.theme;
}
e.data('themeSwitch').val(selectedTheme);
window.Uhr.setTheme(e, selectedTheme);
});
};
})(jQuery);
(function($){
return this;
/** /**
* Die Uhr. * Die Uhr.
* @param clockarea 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.
@ -285,6 +498,8 @@ UhrRenderer.prototype.render = function(uhr) {
}); });
} }
//}
})(jQuery);
/** /**
* Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays. * Ein Buchstabe. Hilfsklasse für den Renderer und Inhalt der Layout-Arrays.
* @param value Der Buchstabe, der Dargestellt werden soll. * @param value Der Buchstabe, der Dargestellt werden soll.
@ -340,4 +555,3 @@ function m(letter) {
} }
return l(letter, style); return l(letter, style);
} }
//}