Init

2023-03-28 10:34:44 +02:00
parent f803effbbd
commit f7e0f37528
428 changed files with 9982 additions and 100 deletions
--- a/backend/public_html/js/feedback.js
+++ b/backend/public_html/js/feedback.js
@@ -0,0 +1,82 @@
+var ajaxFeedback;
+var formFeedback;
+var feedbackError = false;
+
+function showFeedbackError()
+{
+	feedbackError = true;
+	
+	jQuery('.feedback div.box .inner:eq(0)').html(_t('Leider ist ein unerwarteter Fehler aufgetreten. Bitte schließe das Feedback-Fenster und versuche es erneut. Andernfalls, schreibe mir unter <a href="%%s" target="_blank">Kontakt</a>.', 'https://willy-tech.de/kontakt/'));
+	jQuery('.feedback div.box img').remove();
+	jQuery('.feedback div.box .inner:eq(1)').html('<strong class="red">:(</strong>');
+	
+	return false;
+}
+
+jQuery(document).on('mousedown', 'a[href="https://willy-tech.de/kontakt/"]', function(e)
+{
+	if (e.which == 3)
+		return false;
+	
+	window.scrollTo(0, 0);
+	
+	var _this = this;
+	
+	if (feedbackError == true)
+	{
+		feedbackError = false;
+		jQuery('.feedback').remove();
+	}
+	
+	if (jQuery('.feedback').length == 0 )
+	{
+		jQuery('body').append('<div class="feedback"><a href="#close">' + _t('Schließen') + '</a><span class="feedback-inner"><div class="box"><div class="inner-header"><span>' + _t('Feedback') + '</span></div><div class="inner text-justify">' + _t('F&uuml;r das Feedback m&uuml;ssen noch einige Daten gesammelt werden.') + '</div><div class="inner"><img src="public_html/img/loader.svg" /></div><div class="inner-end"><a href="#close" class="button">' + _t('Schließen') + '</a></div></div></span></div>');
+		
+		ajaxFeedback = jQuery.ajax({
+			url: 'api/v1/feedback.php',
+			method: 'POST',
+			data: { url: window.location.href },
+			dataType: 'text',
+			async: true
+		}).done(function(data)
+		{
+			if (data == '')
+				return showFeedbackError();
+			
+			var langParam = '';
+			if (jQuery(_this).data('lang') != 'de')
+				langParam = '&amp;lang=' + jQuery(_this).data('lang');
+			
+			formFeedback = jQuery('<form action="https://pi-control.de/?service=feedback' + langParam + '" method="post" target="_blank"><input type="hidden" name="data" value="'+data+'" /><input type="hidden" name="error-handler" value="'+errorHandler+'" /></form>');
+			
+			jQuery('.feedback div.box .inner:eq(0)').html(_t('Diagnosedaten wurden gesammelt. Beim Klick auf den folgenden Button wird ein neues Fenster ge&ouml;ffnet.'));
+			jQuery('.feedback div.box img').remove();
+			jQuery('.feedback div.box .inner:eq(1)').addClass('text-align-center').html('<a href="#open" class="button">' + _t('Feedback &ouml;ffnen') + '</a>');
+		}).fail(function()
+		{
+			return showFeedbackError();
+		});
+	}
+	
+	jQuery('.feedback').fadeIn('fast');
+
+	return false;
+});
+
+jQuery(document).on('click', 'a[href="#close"], .feedback', function(e)
+{
+	if (jQuery(e.target).has('.box').length || jQuery(e.target).is('a[href="#close"]'))
+	{
+		ajaxFeedback.abort();
+		jQuery('.feedback').fadeOut('fast');
+    }
+	
+	return false;
+});
+
+jQuery(document).on('click', 'a[href="#open"]', function(e)
+{
+	formFeedback.appendTo('body').submit();
+	
+	return false;
+});
--- a/backend/public_html/js/jquery.min.js
+++ b/backend/public_html/js/jquery.min.js
--- a/backend/public_html/js/main.js
+++ b/backend/public_html/js/main.js
@@ -0,0 +1,6 @@
+jQuery(document).on('click', '.error > div span.cancel, .success > div span.cancel, .info > div span.cancel', function(e) {
+	jQuery(this).parents('.box').css("position", "relative").css("z-index", "-500").animate({marginTop: -jQuery(this).parents('.box').height()-20, opacity: 0}, 300, function(e)
+	{
+		jQuery(this).hide();
+	});
+});
--- a/backend/public_html/js/network_configuration.interface_refresh.js
+++ b/backend/public_html/js/network_configuration.interface_refresh.js
@@ -0,0 +1,43 @@
+function show_error(msg)
+{
+	jQuery('div.dummy-1').html('<strong class="red">' + msg + '</strong>');
+}
+
+jQuery(document).on('click', 'a[href=#refresh]', function(e)
+{
+	if (jQuery('a[href=#refresh]').css('opacity') == 1)
+	{
+		var _this = this;
+		var _interface = jQuery(this).attr('name');
+		
+		jQuery('a[href=#refresh]').not(this).animate({opacity: 0.2}, 300);
+		jQuery(this).find('span').addClass('rotate-icon');
+		
+		jQuery('div.dummy-1 .inner-header span').text('Status (' + _interface + ')');
+		jQuery('div.dummy-1 .inner').html('<strong>' + _t('Das Interface wird neu gestartet...') + '</strong>');
+		jQuery('div.dummy-1').slideDown('fast');
+		
+		jQuery.post('api/v1/network_configuration_interface.php', { interface: _interface }, function(data)
+		{
+			if (data.status == 200)
+			{
+				jQuery('div.dummy-1 .inner').html('<strong class="green">' + _t('Das Interface wurde neu gestartet.') + '</strong>');
+				jQuery('a[href=#refresh]').not(_this).animate({opacity: 1}, 300);
+				jQuery(_this).find('span').removeClass('rotate-icon');
+			}
+			else
+			{
+				show_error(_t('Es ist ein unerwarteter Fehler aufgetreten!'));
+				return false;
+			}
+		}).fail(function(e)
+		{
+			show_error(_t('Es ist ein Fehler aufgetreten! Vermutlich wurde die Verbindung getrennt.'));
+			return false;
+		});
+	}
+	else
+		alert(_t('Es kann nur ein Interface zeitgleich neu gestartet werden.'));
+	
+	return false;
+});
--- a/backend/public_html/js/network_configuration.method_select.js
+++ b/backend/public_html/js/network_configuration.method_select.js
@@ -0,0 +1,7 @@
+jQuery(document).on('change', 'select[name=method]', function()
+{
+	if (jQuery('select[name=method] option:selected').index() == 1)
+		jQuery('.hidden-method').show('fast');
+	else
+		jQuery('.hidden-method').hide('fast');
+});
--- a/backend/public_html/js/network_connect.wlan.js
+++ b/backend/public_html/js/network_connect.wlan.js
@@ -0,0 +1,97 @@
+var dummy2Msg = '';
+
+function showError(msg)
+{
+	if (msg != undefined)
+	{
+		console.log(msg);
+		jQuery('div.dummy-3 strong span').html(msg.data.errorMsg);
+	}
+	else
+	{
+		alert(_t('Es ist ein unerwarteter Fehler aufgetreten!'));
+ 		jQuery('div.dummy-3 strong span').html(_t('Es ist ein unerwarteter Fehler aufgetreten!'));
+	}
+	
+	jQuery('div.dummy-2').slideUp('fast');
+	jQuery('div.dummy-3').slideDown('fast');
+}
+
+jQuery(document).on('click', 'input[name=submit]', function(e)
+{
+	if (jQuery('input[name=password]').length == 1 && jQuery('input[name=password]').val().length < 8 && jQuery('input[name=password]').attr('data') == null)
+	{
+		alert(_t('Das Passwort sollte mindestens 8 Zeichen betragen.'));
+		return false;
+	}
+	
+	if (jQuery('input[name=password]').length == 1)
+		jQuery('input[name=password]').prop('disabled', true);
+		
+	if (dummy2Msg == '')
+		dummy2Msg = jQuery('div.dummy-2 strong').html();
+	else
+		jQuery('div.dummy-2 strong').html(dummy2Msg);
+	
+	jQuery('div.dummy-1').slideUp('fast');
+	jQuery('div.dummy-2').slideDown('fast');
+	
+	jQuery.post('api/v1/network_connect_wlan.php', { type: 'set', interface: _interface, ssid: _ssid, psk: jQuery('input[name=password]').val() }, function(data)
+	{
+		if (data.status == 200)
+			jQuery('div.dummy-2 strong').html(_t('Verbindung wird getrennt...'));
+		else
+		{
+			showError(data);
+			return false;
+		}
+		
+		jQuery.post('api/v1/network_connect_wlan.php', { type: 'down', interface: _interface }, function(data)
+		{
+			if (data.status == 200)
+				jQuery('div.dummy-2 strong').html(_t('Verbindung wird wieder hergestellt...'));
+			else
+			{
+				showError(data);
+				return false;
+			}
+			
+			jQuery.post('api/v1/network_connect_wlan.php', { type: 'up', interface: _interface }, function(data)
+			{
+				if (data.status == 200)
+					jQuery('div.dummy-2 strong').html(_t('Ermittle IP-Adresse von Verbindung...'));
+				else
+				{
+					showError(data);
+					return false;
+				}
+				
+				jQuery.post('api/v1/network_connect_wlan.php', { type: 'get', interface: _interface }, function(data)
+				{
+					if (data.data.ip != 'no ip')
+					{
+						jQuery('div.dummy-2 span').removeClass('svg-network-signal-animate').addClass('svg-network-signal-100');
+						jQuery('div.dummy-2 strong').html(_t('Verbindung mit "%%s" war erfolgreich.', _ssid)).addClass('green');
+						jQuery('div.dummy-2').append('<br /><br /><strong>' + _t('IP-Adresse') + ':</strong> <a href="http://'+data.data.ip+'" target="_blank">'+data.data.ip+'</a>');
+					}
+					else
+					{
+						showError(data);
+						return false;
+					}
+				}).fail(function(e) { showError(); });
+			}).fail(function(e) { showError(); });
+		}).fail(function(e) { showError(); });
+	}).fail(function(e) { showError(); });
+	
+	return false;
+});
+
+jQuery(document).on('click', 'a[href=#try_again]', function(e)
+{
+	jQuery('input[name=password]').prop('disabled', false);
+	jQuery('div.dummy-3').slideUp('fast');
+	jQuery('div.dummy-1').slideDown('fast');
+	
+	return false;
+});
--- a/backend/public_html/js/overview.status_refresh.js
+++ b/backend/public_html/js/overview.status_refresh.js
@@ -0,0 +1,138 @@
+var is_loding = false;
+
+function overviewStatusRefreshEffect(element)
+{
+	element.css({'transition': 'background-color 0.5s', 'background-color': 'rgba(243, 255, 164, 1)'});
+	setTimeout(function(){
+		element.css({'background-color': 'transparent'});
+	}, 800);
+}
+
+function showError()
+{
+	jQuery('.error-msg-refresh-bar').remove();
+	jQuery('.flex-box-refresh div:eq(0)').after('<div class="red error-msg-refresh-bar" style="vertical-align: bottom; font-weight: bold;">' + _t('Fehler!') + '</div>');
+	jQuery('.refresh-bar').stop(false, true).css('width', 0);
+	jQuery('a[href=#refresh] img').removeClass('rotate-icon');
+	
+	setTimeout('overviewStatusRefresh()', 3000);
+}
+
+function overviewStatusRefresh()
+{
+	jQuery('.error-msg-refresh-bar').remove();
+	jQuery('.refresh-bar').animate({width: '100%'}, reload_timeout, 'linear', function(e)
+	{
+		var this_ =			jQuery(this);
+		var runtime =		jQuery('.flex-container > div:eq(2)');
+		var cpuClock =		jQuery('.flex-container > div:eq(3)');
+		var cpuLoad =		jQuery('.flex-container > div:eq(4)');
+		var cpuTemp =		jQuery('.flex-container > div:eq(5)');
+		var ramPercentage =	jQuery('.flex-container > div:eq(6)');
+		var memoryUsed =	jQuery('.flex-container > div:eq(7)');
+		var memoryFree =	jQuery('.flex-container > div:eq(8)');
+		var memoryTotal =	jQuery('.flex-container > div:eq(9)');
+		
+		jQuery('a[href=#refresh] img').addClass('rotate-icon');
+		
+		this_.animate({width: '88.8%'}, 300, 'linear');
+		jQuery.post('api/v1/overview.php', { data: 'runtime' }, function(data)
+		{
+			if (runtime.find('span').html() != data.data.runtime)
+			{
+				overviewStatusRefreshEffect(runtime);
+				runtime.find('span').html(data.data.runtime);
+			}
+			
+			this_.animate({width: '77.7%'}, 300, 'linear');
+			jQuery.post('api/v1/overview.php', { data: 'cpuClock' }, function(data)
+			{
+				if (cpuClock.find('span').html() != data.data.cpuClock+' MHz')
+				{
+					overviewStatusRefreshEffect(cpuClock);
+					cpuClock.find('span').html(data.data.cpuClock+' MHz');
+				}
+				
+				this_.animate({width: '66.6%'}, 300, 'linear');
+				jQuery.post('api/v1/overview.php', { data: 'cpuLoad' }, function(data)
+				{
+					if (cpuLoad.find('.progressbar div').html() != data.data.cpuLoad+'%')
+					{
+						overviewStatusRefreshEffect(cpuLoad);
+						cpuLoad.find('.progressbar').attr('data-text', data.data.cpuLoad+'%').find('div').css('width', data.data.cpuLoad+'%');
+					}
+					
+					this_.animate({width: '55.5%'}, 300, 'linear');
+					jQuery.post('api/v1/overview.php', { data: 'cpuTemp' }, function(data)
+					{
+						if (cpuTemp.find('span').html() != data.data.cpuTemp+' °C')
+						{
+							overviewStatusRefreshEffect(cpuTemp);
+							cpuTemp.find('span').html(data.data.cpuTemp+' &deg;C');
+						}
+						
+						this_.animate({width: '44.4%'}, 300, 'linear');
+						jQuery.post('api/v1/overview.php', { data: 'ramPercentage' }, function(data)
+						{
+							if (ramPercentage.find('.progressbar div').html() != data.data.ramPercentage+'%')
+							{
+								overviewStatusRefreshEffect(ramPercentage);
+								ramPercentage.find('.progressbar').attr('data-text', data.data.ramPercentage+'%').find('div').css('width', data.data.ramPercentage+'%');
+							}
+							
+							this_.animate({width: '33.3%'}, 300, 'linear');
+							jQuery.post('api/v1/overview.php', { data: 'memoryUsed' }, function(data)
+							{
+								if (memoryUsed.find('span').html() != data.data.memoryUsed)
+								{
+									overviewStatusRefreshEffect(memoryUsed);
+									memoryUsed.find('span').html(data.data.memoryUsed);
+								}
+								
+								this_.animate({width: '22.2%'}, 300, 'linear');
+								jQuery.post('api/v1/overview.php', { data: 'memoryFree' }, function(data)
+								{
+									if (memoryFree.find('span').html() != data.data.memoryFree)
+									{
+										overviewStatusRefreshEffect(memoryFree);
+										memoryFree.find('span').html(data.data.memoryFree);
+									}
+									
+									this_.animate({width: '11.1%'}, 300, 'linear');
+									jQuery.post('api/v1/overview.php', { data: 'memoryTotal' }, function(data)
+									{
+										if (memoryTotal.find('span').html() != data.data.memoryTotal)
+										{
+											overviewStatusRefreshEffect(memoryTotal);
+											memoryTotal.find('span').html(data.data.memoryTotal);
+										}
+										
+										this_.animate({width: '0%'}, 300, 'linear', function(e) {
+											is_loding = false;
+											jQuery('a[href=#refresh] img').removeClass('rotate-icon');
+										});
+										
+										overviewStatusRefresh();
+									}).fail(function(e) { showError(); });
+								}).fail(function(e) { showError(); });
+							}).fail(function(e) { showError(); });
+						}).fail(function(e) { showError(); });
+					}).fail(function(e) { showError(); });
+				}).fail(function(e) { showError(); });
+			}).fail(function(e) { showError(); });
+		}).fail(function(e) { showError(); });
+	});
+}
+
+jQuery(document).on('click', 'a[href=#refresh]', function(e)
+{
+	if (is_loding == false)
+		jQuery('.refresh-bar').stop(false, true);
+	
+	return false;
+});
+
+jQuery(document).ready(function(e)
+{
+	overviewStatusRefresh();
+});
--- a/backend/public_html/js/settings.overview.weather.js
+++ b/backend/public_html/js/settings.overview.weather.js
@@ -0,0 +1,70 @@
+function toggleVisibilityWeatherLocationTyps(service)
+{
+	switch (service)
+	{
+		case 'darksky':
+			jQuery('input[name=weather-service-token]').attr('maxlength', 32).show();
+			jQuery('.weather-location-type-postcode').hide();
+			jQuery('.weather-location-type-city').hide();
+			jQuery('.weather-location-type-coordinates').show();
+				break;
+		case 'openweathermap':
+			jQuery('input[name=weather-service-token]').attr('maxlength', 32).show();
+			jQuery('.weather-location-type-postcode').show();
+			jQuery('.weather-location-type-city').show();
+			jQuery('.weather-location-type-coordinates').hide();
+				break;
+		case 'wunderground':
+			jQuery('input[name=weather-service-token]').attr('maxlength', 16).show();
+			jQuery('.weather-location-type-postcode').hide();
+			jQuery('.weather-location-type-city').show();
+			jQuery('.weather-location-type-coordinates').show();
+				break;
+		case 'yahoo':
+			jQuery('input[name=weather-service-token]').hide();
+			jQuery('.weather-location-type-postcode').show();
+			jQuery('.weather-location-type-city').show();
+			jQuery('.weather-location-type-coordinates').hide();
+				break;
+		case 'yr':
+			jQuery('input[name=weather-service-token]').hide();
+			jQuery('.weather-location-type-postcode').show();
+			jQuery('.weather-location-type-city').show();
+			jQuery('.weather-location-type-coordinates').hide();
+				break;
+	}
+}
+
+jQuery(document).on('change', 'select[name="weather-service"]', function (e)
+{
+	var service = jQuery(this).val();
+	
+	jQuery('.weather-service-link').attr('href', jQuery(this).find('option:selected').data('url'));
+	jQuery('input[name=weather-service-token]').val('');
+	toggleVisibilityWeatherLocationTyps(service);
+	
+	switch (service)
+	{
+		case 'darksky':
+			jQuery('#cb-weather-location-coordinates').prop('checked', true );
+				break;
+		case 'openweathermap':
+			jQuery('#cb-weather-location-postcode').prop('checked', true );
+				break;
+		case 'wunderground':
+			jQuery('#cb-weather-location-city').prop('checked', true );
+				break;
+		case 'yahoo':
+			jQuery('#cb-weather-location-postcode').prop('checked', true );
+				break;
+		case 'yr':
+			jQuery('#cb-weather-location-postcode').prop('checked', true );
+				break;
+	}
+});
+
+jQuery(function()
+{
+	jQuery('.weather-service-link').attr('href', jQuery('select[name="weather-service"]').find('option:selected').data('url'));
+	toggleVisibilityWeatherLocationTyps(jQuery('select[name="weather-service"]').val());
+});
--- a/backend/public_html/js/settings.pi-control.theme.js
+++ b/backend/public_html/js/settings.pi-control.theme.js
@@ -0,0 +1,73 @@
+jQuery(document).on('click', 'input[name=theme-color] + label', function(e)
+{
+	switch (jQuery(this).attr('for').substr(3))
+	{
+		case 'red':
+		var color = new Array('#FFEBEE', '#FFCDD2', '#EF9A9A', '#E57373', '#EF5350', '#F44336', '#E53935', '#D32F2F', '#C62828', '#B71C1C');
+			break;
+		case 'pink':
+		var color = new Array('#FCE4EC', '#F8BBD0', '#F48FB1', '#F06292', '#EC407A', '#E91E63', '#D81B60', '#C2185B', '#AD1457', '#880E4F');
+			break;
+		case 'purple':
+		var color = new Array('#F3E5F5', '#E1BEE7', '#CE93D8', '#BA68C8', '#AB47BC', '#9C27B0', '#8E24AA', '#7B1FA2', '#6A1B9A', '#4A148C');
+			break;
+		case 'deepPurple':
+		var color = new Array('#EDE7F6', '#D1C4E9', '#B39DDB', '#9575CD', '#7E57C2', '#673AB7', '#5E35B1', '#512DA8', '#4527A0', '#311B92');
+			break;
+		case 'indigo':
+		var color = new Array('#E8EAF6', '#C5CAE9', '#9FA8DA', '#7986CB', '#5C6BC0', '#3F51B5', '#3949AB', '#303F9F', '#283593', '#1A237E');
+			break;
+		case 'blue':
+		var color = new Array('#E3F2FD', '#BBDEFB', '#90CAF9', '#64B5F6', '#42A5F5', '#2196F3', '#1E88E5', '#1976D2', '#1565C0', '#0D47A1');
+			break;
+		case 'lightBlue':
+		var color = new Array('#E1F5FE', '#B3E5FC', '#81D4FA', '#4FC3F7', '#29B6F6', '#03A9F4', '#039BE5', '#0288D1', '#0277BD', '#01579B');
+			break;
+		case 'cyan':
+		var color = new Array('#E0F7FA', '#B2EBF2', '#80DEEA', '#4DD0E1', '#26C6DA', '#00BCD4', '#00ACC1', '#0097A7', '#00838F', '#006064');
+			break;
+		case 'teal':
+		var color = new Array('#E0F2F1', '#B2DFDB', '#80CBC4', '#4DB6AC', '#26A69A', '#009688', '#00897B', '#00796B', '#00695C', '#004D40');
+			break;
+		case 'green':
+		var color = new Array('#E8F5E9', '#C8E6C9', '#A5D6A7', '#81C784', '#66BB6A', '#4CAF50', '#43A047', '#388E3C', '#2E7D32', '#1B5E20');
+			break;
+		case 'lightGreen':
+		var color = new Array('#F1F8E9', '#DCEDC8', '#C5E1A5', '#AED581', '#9CCC65', '#8BC34A', '#7CB342', '#689F38', '#558B2F', '#33691E');
+			break;
+		case 'lime':
+		var color = new Array('#F9FBE7', '#F0F4C3', '#E6EE9C', '#DCE775', '#D4E157', '#CDDC39', '#C0CA33', '#AFB42B', '#9E9D24', '#827717');
+			break;
+		case 'yellow':
+		var color = new Array('#FFFDE7', '#FFF9C4', '#FFF59D', '#FFF176', '#FFEE58', '#FFEB3B', '#FDD835', '#FBC02D', '#F9A825', '#F57F17');
+			break;
+		case 'amber':
+		var color = new Array('#FFF8E1', '#FFECB3', '#FFE082', '#FFD54F', '#FFCA28', '#FFC107', '#FFB300', '#FFA000', '#FF8F00', '#FF6F00');
+			break;
+		case 'orange':
+		var color = new Array('#FFF3E0', '#FFE0B2', '#FFCC80', '#FFB74D', '#FFA726', '#FF9800', '#FB8C00', '#F57C00', '#EF6C00', '#E65100');
+			break;
+		case 'deepOrange':
+		var color = new Array('#FBE9E7', '#FFCCBC', '#FFAB91', '#FF8A65', '#FF7043', '#FF5722', '#F4511E', '#E64A19', '#D84315', '#BF360C');
+			break;
+		case 'brown':
+		var color = new Array('#EFEBE9', '#D7CCC8', '#BCAAA4', '#A1887F', '#8D6E63', '#795548', '#6D4C41', '#5D4037', '#4E342E', '#3E2723');
+			break;
+		case 'grey':
+		var color = new Array('#FAFAFA', '#F5F5F5', '#EEEEEE', '#E0E0E0', '#BDBDBD', '#9E9E9E', '#757575', '#616161', '#424242', '#212121');
+			break;
+		case 'blueGrey':
+		var color = new Array('#ECEFF1', '#CFD8DC', '#B0BEC5', '#90A4AE', '#78909C', '#607D8B', '#546E7A', '#455A64', '#37474F', '#263238');
+			break;
+	}
+
+	jQuery('a').css('color', color[9]);
+	jQuery('#header-navi > a, #header-navi > div > a').css('color', '#FFFFFF');
+	jQuery('.header-top-inner-cell a').css('color', '#DDDDDD');
+	jQuery('#header').css('background-color', color[7]);
+	jQuery('#header-top').css('background-color', color[8]);
+	jQuery('.box .inner-header span').css('color', color[7]);
+	jQuery('.table-form tr:nth-child(even)').css('background-color', color[0]);
+	jQuery('input[type="button"], button, input[type="submit"], .button').css('border-color', color[7]);
+	jQuery('input[type="button"], button, input[type="submit"], .button').css('color', color[8]);
+});
--- a/backend/public_html/js/settings.troubleshooting.cron_selection.js
+++ b/backend/public_html/js/settings.troubleshooting.cron_selection.js
@@ -0,0 +1,15 @@
+function selecttxt(objId)
+{
+	if (document.selection)
+	{
+		var range = document.body.createTextRange();
+		range.moveToElementText(document.getElementById(objId));
+		range.select();
+	}
+	else if (window.getSelection)
+	{
+		var range = document.createRange();
+		range.selectNode(document.getElementById(objId));
+		window.getSelection().addRange(range);
+	}
+}
--- a/backend/public_html/js/shutdown.restart.js
+++ b/backend/public_html/js/shutdown.restart.js
@@ -0,0 +1,34 @@
+var shutdown = false;
+
+function ping()
+{
+	var jsonData = jQuery.ajax(
+	{
+		url: 'api/v1/ping.php',
+		dataType:"json",
+		async: true,
+		timeout: 5000
+	}).done(function(data)
+	{
+		if (shutdown == true)
+		{
+			jQuery('.inner strong').text(_t('Online - Du wirst sofort weitergeleitet'));
+			setTimeout('window.document.location.href = \'?s=overview\'', 2000);
+		}
+		
+		jQuery('.inner strong').addClass('green').removeClass('red');
+		setTimeout('ping()', 5000);
+	}).error(function(data)
+	{
+		jQuery('.inner strong').text(_t('Offline'));
+		shutdown = true;
+		
+		jQuery('.inner strong').addClass('red').removeClass('green');
+		setTimeout('ping()', 5000);
+	});
+}
+
+jQuery(document).on('ready', function(e)
+{
+	ping();
+});
--- a/backend/public_html/js/statistic_builder.js
+++ b/backend/public_html/js/statistic_builder.js
@@ -0,0 +1,120 @@
+var dataSlider = [];
+var dataPeriods = [];
+
+function statisticBuilder(builder, plugin) {
+	jQuery.ajax({
+		url: 'api/v1/statistic.php',
+		method: 'POST',
+		data: { id: builder.id, plugin: plugin, type: 'googleChart' },
+		dataType: 'json',
+		async: true
+	}).done(function (data) {
+		if (data.error != null) {
+			if (data.error.message == 'Empty data.')
+				jQuery('#chart_log_' + builder.id).html('<br /><br /><strong class="red">' + _t('Es sind noch keine Werte verf&uuml;gbar. Werte werden alle %%s Minuten eingetragen.', builder.cycle) + '</strong>');
+			else
+				jQuery('#chart_log_' + builder.id).html('<br /><br /><strong class="red">' + _t('Es ist ein Fehler aufgetreten! Fehler: %%s', data.error.message) + '</strong>');
+
+			return;
+		}
+
+		dataPeriods[builder.id] = data.data.statistic.periods;
+
+		var myData = new google.visualization.DataTable(data.data.statistic);
+
+		jQuery('#chart_log_' + builder.id).html('');
+		var myDashboard = new google.visualization.Dashboard(document.getElementById('dashboard_log_' + builder.id));
+
+		dataSlider[builder.id] = new google.visualization.ControlWrapper({
+			'controlType': 'DateRangeFilter',
+			'containerId': 'chart_control_log_' + builder.id,
+			'options': {
+				'filterColumnLabel': _t('Zeit'),
+				'ui': {
+					'step': 'hour',
+					'label': '',
+					'format': { 'pattern': 'dd.MM. HH:mm' }
+				}
+			}
+		});
+
+		var myLine = new google.visualization.ChartWrapper({
+			'chartType': 'AreaChart',
+			'containerId': 'chart_log_' + builder.id,
+			'options': {
+				vAxis: { title: builder.label, viewWindow: { max: data.data.statistic.max, min: data.data.statistic.min }, textPosition: 'in', textStyle: { fontSize: 11, color: '#AAAAAA' }, titleTextStyle: { fontSize: 11, color: '#AAAAAA' }, gridlines: { color: '#fff' } },
+				dateFormat: 'dd.MM.yy HH:mm',
+				hAxis: { format: 'dd.MM. HH:mm', textPosition: 'out', gridlines: { color: '#fff' }, textStyle: { fontSize: 11, color: '#AAAAAA' } },
+				focusTarget: 'category',
+				crosshair: { orientation: 'vertical', trigger: 'both', color: '#AAAAAA', opacity: 0.4 },
+				chartArea: { width: '100%', height: '80%', top: 0 },
+				height: 200,
+				legend: { position: 'bottom', alignment: 'end', textStyle: { fontSize: 11, color: '#AAAAAA' } },
+				axisTitlesPosition: 'in',
+				seriesType: 'area',
+				series:
+				{
+					0: {
+						type: (typeof builder.columns[1] != 'undefined' && typeof builder.columns[1].style != 'undefined' && typeof builder.columns[1].style.type != 'undefined') ? builder.columns[1].style.type : null,
+						color: (typeof builder.columns[1] != 'undefined' && typeof builder.columns[1].style != 'undefined' && typeof builder.columns[1].style.color != 'undefined') ? builder.columns[1].style.color : null,
+						lineDashStyle: (typeof builder.columns[1] != 'undefined' && typeof builder.columns[1].style != 'undefined' && typeof builder.columns[1].style.lineDashStyle != 'undefined') ? [builder.columns[1].style.lineDashStyle, builder.columns[1].style.lineDashStyle] : null
+					},
+					1: {
+						type: (typeof builder.columns[2] != 'undefined' && typeof builder.columns[2].style != 'undefined' && typeof builder.columns[2].style.type != 'undefined') ? builder.columns[2].style.type : null,
+						color: (typeof builder.columns[2] != 'undefined' && typeof builder.columns[2].style != 'undefined' && typeof builder.columns[2].style.color != 'undefined') ? builder.columns[2].style.color : null,
+						lineDashStyle: (typeof builder.columns[2] != 'undefined' && typeof builder.columns[2].style != 'undefined' && typeof builder.columns[2].style.lineDashStyle != 'undefined') ? [builder.columns[2].style.lineDashStyle, builder.columns[2].style.lineDashStyle] : null
+					},
+					2: {
+						type: (typeof builder.columns[3] != 'undefined' && typeof builder.columns[3].style != 'undefined' && typeof builder.columns[3].style.type != 'undefined') ? builder.columns[3].style.type : null,
+						color: (typeof builder.columns[3] != 'undefined' && typeof builder.columns[3].style != 'undefined' && typeof builder.columns[3].style.color != 'undefined') ? builder.columns[3].style.color : null,
+						lineDashStyle: (typeof builder.columns[3] != 'undefined' && typeof builder.columns[3].style != 'undefined' && typeof builder.columns[3].style.lineDashStyle != 'undefined') ? [builder.columns[3].style.lineDashStyle, builder.columns[3].style.lineDashStyle] : null
+					},
+					3: {
+						type: (typeof builder.columns[4] != 'undefined' && typeof builder.columns[4].style != 'undefined' && typeof builder.columns[4].style.type != 'undefined') ? builder.columns[4].style.type : null,
+						color: (typeof builder.columns[4] != 'undefined' && typeof builder.columns[4].style != 'undefined' && typeof builder.columns[4].style.color != 'undefined') ? builder.columns[4].style.color : null,
+						lineDashStyle: (typeof builder.columns[4] != 'undefined' && typeof builder.columns[4].style != 'undefined' && typeof builder.columns[4].style.lineDashStyle != 'undefined') ? [builder.columns[4].style.lineDashStyle, builder.columns[4].style.lineDashStyle] : null
+					},
+				}
+
+			}
+		});
+
+		var formatter = new google.visualization.NumberFormat({ suffix: ' ' + builder.unit });
+
+		for (var i = 1; i < builder.columns.length; i++)
+			formatter.format(myData, i);
+
+		myDashboard.bind(dataSlider[builder.id], myLine);
+		myDashboard.draw(myData);
+
+		setRange();
+	}).fail(function (xhr, textStatus) {
+		jQuery('#chart_log_' + builder.id).html('<br /><br /><strong class="red">' + _t('Es ist ein Fehler aufgetreten! Fehlercode: %%s', xhr.status) + '</strong>');
+	});
+}
+
+function changeRange(dropdown) {
+	var day = dropdown.value;
+	window.localStorage.setItem("days", day);
+
+	setRange();
+}
+
+function setRange() {
+	var days = Array('seven', 'six', 'five', 'four', 'three', 'two', 'one');
+	var day = window.localStorage.getItem("days");
+
+	if (days.indexOf(day) > -1) {
+		for (var data in dataSlider) {
+			if (typeof dataSlider[data] != 'undefined') {
+				dataSlider[data].setState({ 'lowValue': new Date(dataPeriods[data][day]) });
+				dataSlider[data].draw();
+			}
+		}
+	}
+}
+
+window.addEventListener("DOMContentLoaded", function () {
+	if (window.localStorage.days)
+		document.getElementById("range").value = window.localStorage.days;
+}, false);
--- a/backend/public_html/js/terminal.websocket.js
+++ b/backend/public_html/js/terminal.websocket.js
@@ -0,0 +1,122 @@
+jQuery(document).on('ready', function(e)
+{
+	var msgBuffer = '';
+	
+	var wsUri = 'ws://' + ip + ':' + port+ '/?' + cookie;
+	websocket = new WebSocket(wsUri);
+	
+	websocket.onopen = function(ev)
+	{
+		jQuery('#status').text(_t('Verbindung herstellen...'));
+	}
+	
+	function sendCommand()
+	{
+		var mymessage = jQuery('#command').val();
+		
+		if(mymessage == '')
+		{
+			alert(_t('Bitte gebe einen Befehl ein!'));
+			return;
+		}
+		
+		var msg = { message: mymessage };
+		websocket.send(JSON.stringify(msg));
+		
+		jQuery('#command').val('');
+	}
+	
+	function sendCancel()
+	{
+		var mymessage = '^C';
+		var msg = { message: mymessage };
+		websocket.send(JSON.stringify(msg));
+	}
+	
+	jQuery(document).on('click', '#submit', function(e)
+	{
+		sendCommand();
+	});
+	
+	jQuery(document).on('keydown', '#command', function(e)
+	{
+		if (e.keyCode == 13)
+			sendCommand();
+		
+		if ((e.metaKey || e.ctrlKey) && (String.fromCharCode(e.which).toLowerCase() === 'c'))
+			sendCancel();
+	});
+	
+	jQuery(document).on('click', 'input[name=close]', function(e)
+	{
+		var mymessage = '^PI';
+		var msg = { message: mymessage };
+		websocket.send(JSON.stringify(msg));
+	});
+	
+	jQuery(document).on('click', '#cancel', function(e)
+	{
+		sendCancel();
+	});
+	
+	websocket.onmessage = function(ev)
+	{
+		var msg = JSON.parse(ev.data);
+		var type = msg.type;
+		var umsg = msg.message;
+		
+		if(type == 'console')
+		{
+			jQuery('#terminal').append('<span class="console">' + umsg + '</span>');
+			jQuery('#terminal').animate({scrollTop: jQuery('#terminal')[0].scrollHeight}, 'fast');
+		}
+		
+		if(type == 'system')
+		{
+			umsg = (umsg == 'connected') ? _t('Verbunden') : umsg;
+			jQuery('#status').text(umsg);
+			jQuery('#command').removeAttr('disabled');
+			msgBuffer = umsg;
+			
+			jQuery('select[name=terminal] option[value=' + port + ']').text(jQuery('select[name=terminal] option[value=' + port + ']').text().substr(0, 11) + '(' + _t('Online') + ')');
+			jQuery('select[name=terminal] option[value=' + port + ']').css('background-color', '#73CA3C');
+		}
+	};
+	
+	websocket.onerror = function(ev)
+	{
+		jQuery('#status').text(_t('Fehler aufgetreten!'));
+		jQuery('#command').attr('disabled', 'disabled');
+		
+		jQuery('input[name=close]').attr('name', 'reload').val(_t('Verbindung erneut herstellen'));
+	};
+	
+	websocket.onclose = function(ev)
+	{
+		if (msgBuffer == 'newSession')
+			jQuery('#status').html(_t('Verbindung getrennt<br />(Anmeldung an anderem Fenster)'));
+		else if (msgBuffer == 'denied')
+			jQuery('#status').html(_t('Verbindung getrennt<br />(Keine Berechtigung)'));
+		else
+		{
+			jQuery('#status').text(_t('Verbindung getrennt'));
+			jQuery('select[name=terminal] option[value=' + port + ']').text(jQuery('select[name=terminal] option[value=' + port + ']').text().substr(0, 11) + '(' + _t('Offline') + ')');
+			jQuery('select[name=terminal] option[value=' + port + ']').css('background-color', '#E9492E');
+		}
+		
+		jQuery('#command').attr('disabled', 'disabled');
+		jQuery('input[name=close]').attr('name', 'reload').val(_t('Verbindung erneut herstellen'));
+	};
+	
+	jQuery(document).on('change', 'select[name=terminal]', function(e)
+	{
+		window.document.location.href = '?s=terminal&port=' + this.value;
+	});
+	
+	jQuery(document).on('click', 'input[name=reload]', function(e)
+	{
+		window.document.location.href = '?s=terminal&port=' + port;
+	});
+	
+	jQuery("#frame").load('resources/library/terminal/terminal.php?port=' + port);
+});
--- a/backend/public_html/js/translation.js
+++ b/backend/public_html/js/translation.js
@@ -0,0 +1,12 @@
+var jsTranslations = {};
+
+function _t(format)
+{
+	if (format in jsTranslations)
+		format = jsTranslations[format];
+	
+	for (var i = 1; i < arguments.length; i++)
+		format = format.replace(/%s/, arguments[i]);
+	
+	return format;
+}