var clock = null;
var currentMinute = -1;

function highlightCurrentTime() {
	var now = new Date();
	var hour = now.getHours();
	var minute = now.getMinutes();
	if (minute == currentMinute) {
		return;
	}
	currentMinute = minute;
	resetItems();
	var dotMinute = minute % 5;
	var coarseMinute = minute - dotMinute;
	for (var i = 1; i <= dotMinute; i++) {
		highlight('dot' + i);
	}
	highlight('minute' + coarseMinute);
	if (coarseMinute >= 25) {
		hour++;
	}
	hour = normalizeHour(hour);
	highlight('hour'+hour);
}

function clearDisplay() {
	$('.item').removeClass('active');
}
function resetItems() {
	clearDisplay()
	highlight('es');
	highlight('isch');
}

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) {
		clock = window.setInterval(highlightCurrentTime, 1000);
	}
}

function stopClock() {
	if (clock != null) {
		window.clearInterval(clock);
		clock = null;
		currentMinute = -1;
		clearDisplay();
	}
}

function updateClockState() {
	if ($('#onoffswitch').is(':checked')) {
		startClock();
	} else {
		stopClock();
	}
}
function switchTheme(element) {
	var theme = $(element).val()
	$('#theme').attr('href', 'uhr-' + theme + '.css');
}