iobroker.vis-hqwidgets
Version:
hqwidgets Widgets for ioBroker.vis
991 lines (898 loc) • 158 kB
JavaScript
/*
ioBroker.vis high quality Widget-Set
version: "1.5.1"
Copyright 6'2014-2024 bluefox <dogafox@gmail.com>
*/
'use strict';
(function ( $ ) {
$.fn.scala = function (options, arg) {
if (typeof options === 'string') {
if (options === 'value') {
if (arg === null || arg === undefined) arg = '0';
return this.each(function () {
var $this = $(this);
var $input = $this.find('.scalaInput');
if ($input.val().toString() !== arg.toString()) {
$this.find('.scalaInput').val(arg).trigger('change');
}
});
}
return;
}
function h2rgba (h, a) {
var rgb;
h = h.substring(1,7);
rgb = [
parseInt(h.substring(0,2), 16),
parseInt(h.substring(2,4), 16),
parseInt(h.substring(4,6), 16)
];
return 'rgba(' + rgb[0] + ',' + rgb[1] + ',' + rgb[2] + ',' + a + ')';
}
var settings = $.extend({
bgColor: '#EEEEEE',
value: 0,
width: 0,
thickness: null,
unit: null,
fontSize: 24,
readOnly: false,
color: '#FFCC00',
alwaysShow: false,
hideNumber: false,
step: 1,
change: function (value) {
console.log('change ' + value);
},
changing: function (value) {},
onshow: function (isShow) {},
onhide: function (isShow) {},
click: function () {
//console.log('click');
},
colorize: function (color, value) {
return h2rgba(color, (value - settings.min) / (settings.max - settings.min) + 0.5)
},
min: 0,
max: 100,
isComma: false
}, options);
return this.each(function () {
// Do something to each element here.
var $this = $(this);
if ($this.data('scaled')) return;
$this.data('scaled', true);
$this.wrapInner('<div class="scalaWrapped"></div>');
var divW = $this.width();
var divH = $this.height();
var divMax = ((divW > divH) ? divW : divH);
// calculate thickness
if (!settings.width) settings.width = Math.round(divMax + 30) + '';
if (!settings.thickness) settings.thickness = 1 - (divMax / settings.width);
$this.prepend('<input type="text" value="' + settings.value + '" class="scalaInput" data-width="' + settings.width + '" data-height="' + settings.width + '" data-thickness="' + settings.thickness + '"/>');
var $scalaInput = $this.find('.scalaInput');
var $scalaWrapped = $this.find('.scalaWrapped');
if (typeof settings.step === 'string') {
settings.step = parseFloat(settings.step.replace(',', '.') || 1);
}
var $knobDiv = $scalaInput.knobHQ({
release: function (v, noAck) {
$knobDiv._mouseDown = false;
hide('release');
if ($knobDiv._pressTimer) {
$knobDiv._pressTimer = null;
setValue($knobDiv._oldValue);
if (settings.click) {
var newVal = settings.click($knobDiv._oldValue);
newVal !== undefined && newVal !== null && setValue(newVal);
}
} else {
// remove unit
var val = $scalaInput.val();
if (settings.unit !== null && val.substring(val.length - settings.unit.length, val.length) === settings.unit) {
val = val.substring(0, val.length - settings.unit.length);
}
if (settings.change/* && $knobDiv._oldValue != val*/) settings.change(val, noAck);
}
},
cancel: function () {
$knobDiv._mouseDown = false;
hide('cancel');
// set old value
setValue($knobDiv._oldValue);
},
change: function (value) {
if (settings.changing) settings.changing(value);
},
format: function (v) {
if (settings.digits !== null) v = v.toFixed(settings.digits);
if (settings.isComma && v) v = v.toString().replace('.', ',');
if (settings.unit) v = v + settings.unit;
return v;
},
displayPrevious: true,
displayInput: !settings.hideNumber,
bgColor: settings.bgColor,
readOnly: settings.readOnly,
fgColor: settings.color,
inputColor: settings.color,
colorize: settings.colorize ? settings.colorize : undefined,
min: settings.min,
max: settings.max,
step: parseFloat(settings.step || 1)
});
var w = $knobDiv.width();
$this.data('$knobDiv', $knobDiv);
function setValue(value) {
console.log('Restore value ' + value);
setTimeout(function () {
$scalaInput.data('setByUser', true);
$scalaInput.val(value).trigger('change');
}, 200);
}
function hide(event){
if (!settings.alwaysShow && !$knobDiv._mouseEnter && !$knobDiv._mouseDown) {
$knobDiv.hide();
$scalaWrapped.show();
if (settings.onhide) settings.onhide(false);
}
//console.log((event || '') + ' (enter: ' + $knobDiv._mouseEnter + ', down: ' + $knobDiv._mouseDown + ')');
}
function show(event){
$knobDiv.show();
if (settings.onshow) settings.onshow(true);
//console.log((event || '') + ' (enter: ' + $knobDiv._mouseEnter + ', down: ' + $knobDiv._mouseDown + ')');
}
function press(event) {
if (!$knobDiv._mouseDown) {
var val = $scalaInput.val();
if (settings.unit !== null) {
val = val.substring(0, val.length - settings.unit.length);
}
$knobDiv._oldValue = val;
$knobDiv._mouseDown = true;
$knobDiv._pressTimer = setTimeout(function () {
$knobDiv._pressTimer = null;
}, 300);
//console.log((new Date().getSeconds() + '.' + new Date().getMilliseconds())+ ' ' + (event || '') + ' (enter: ' + $knobDiv._mouseEnter + ', down: ' + $knobDiv._mouseDown + ')');
show(event);
}
}
function unpress(event) {
$knobDiv._mouseDown = false;
//console.log((new Date().getSeconds() + '.' + new Date().getMilliseconds()) + ' ' + (event || '') + ' (enter: ' + $knobDiv._mouseEnter + ', down: ' + $knobDiv._mouseDown + ')');
hide(event);
if ($knobDiv._pressTimer) {
clearTimeout($knobDiv._pressTimer);
}
}
$knobDiv.css({
position: 'absolute',
left: '-' + ((w - divW) / 2) + 'px',
top: '-' + ((w - divH) / 2) + 'px',
'z-index': 2,
cursor: 'pointer',
'opacity': 0.7
}).bind('mouseleave',function (e) {
$knobDiv._mouseEnter = false;
hide(e.type);
}).bind('mousedown', function (e) {
press(e.type);
}).bind('mouseup', function (e) {
unpress(e.type);
}).bind('mouseout', function (e) {
unpress(e.type);
}).bind('mouseenter', function (e) {
$knobDiv._mouseEnter = true;
show(e.type);
}).bind('touchend', function (e) {
$knobDiv._mouseEnter = false;
unpress(e.type);
});
if (!settings.alwaysShow) {
$knobDiv.hide();
}
$this.bind('mouseenter', function (e) {
$knobDiv._mouseEnter = true;
show(e.type);
}).bind('touchstart', function (e) {
if (e.simulated) {
e.preventDefault();
return;
}
press(e.type);
var event = $.Event(e.type, {simulated: true, originalEvent: {touches: [{pageX: e.originalEvent.touches[e.originalEvent.touches.length - 1].pageX, pageY: e.originalEvent.touches[e.originalEvent.touches.length - 1].pageY}]}} );
$knobDiv.find('canvas').trigger(event);
e.preventDefault();
}).bind('mousedown', function (e) {
if (e.simulated) {
e.preventDefault();
return;
}
press(e.type);
var event = $.Event(e.type, {simulated: true, pageX: e.pageX, pageY: e.pageY});
$knobDiv.find('canvas').trigger(event);
e.preventDefault();
});
$scalaInput.bind('focusout', function (e) {
$knobDiv._mouseEnter = false;
hide(e.type)
}).bind('focusin', function (e) {
unpress(e.type);
}).css({
'font-size': settings.fontSize,
cursor: 'pointer',
'-webkit-touch-callout': 'none',
'-webkit-user-select': 'none',
'-khtml-user-select': 'none',
'-moz-user-select': 'none',
'-ms-user-select': 'none',
'user-select': 'none'
}).prop('readonly', true);
});
};
$.fn.shineCheckbox = function (options, arg) {
if (typeof options === 'string') {
if (options === 'value') {
return this.each(function () {
var $this = $(this);
var f = parseFloat(arg);
var val;
if (f.toString() == arg) {
val = f > 0;
} else {
val = arg === 'true' || arg === true;
}
if (val != $this.prop('checked')) {
$this.data('update', true);
$this.prop('checked', val).trigger('change');
}
});
}
return;
}
if (!options) options = {};
var settings = {
backgroundCheckbox: '',//-webkit-linear-gradient(top, #fe9810 0%,#e75400 61%,#e75400 91%,#ea8810 100%)",
backgroundButton: '',//"-webkit-linear-gradient(top, #efeeee 0%,#bcb9b8 100%);",
checkboxSize: options.checkboxSize || 'big',
checkboxColor: options.checkboxColor || 'grey',
checkboxColorOn: options.checkboxColorOn || options.checkboxColor || 'orange',
readOnly: options.readOnly || false
};
return this.each(function () {
// Do something to each element here.
var $this = $(this);
if ($this.data('shineCheckbox')) return;
$this.data('shineCheckbox', true);
$this.hide();
var checkboxStyle = 'background: ' + settings.backgroundCheckbox;
var buttonStyle = 'background: ' + settings.backgroundButton;
var color = $this.prop('checked') ? settings.checkboxColorOn : settings.checkboxColor;
$this.wrap('<div class="checkbox-' + settings.checkboxSize + '-' + color + '-wrap" style="' + checkboxStyle + '"><div class="checkbox-' + settings.checkboxSize + '-' + color + '-button" style="' + buttonStyle + '"></div></div>');
$this.change(function () {
//console.log('change ' + $this.prop('checked'));
var color;
if ($this.prop('checked')) {
color = settings.checkboxColorOn;
setTimeout(function () {
$this.parent().addClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColorOn + '-button-active');
$this.parent().parent().removeClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColor + '-wrap').addClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColorOn + '-wrap');
}, 100);
} else {
color = settings.checkboxColor;
$this.parent().removeClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColorOn + '-button-active');
$this.parent().parent().removeClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColorOn + '-wrap').addClass('checkbox-' + settings.checkboxSize + '-' + settings.checkboxColor + '-wrap');
}
});
if (!settings.readOnly) {
$this.parent().parent().click(function () {
//console.log($this.prop('checked'));
$this.prop('checked', !$this.prop('checked')).trigger('change');
});
}
if ($this.prop('checked')) $this.parent().addClass('checkbox-' + settings.checkboxSize + '-' + color + '-button-active');
});
};
// possible options: waves wobble tada swing shake rubberBand pulse flash bounce
$.fn.animateDiv = function (effect, options) {
return this.each(function () {
// Do something to each element here.
var $this = $(this);
options = options || {};
effect = effect || 'waves';
if (options.speed != 1 && options.speed != 2 && options.speed != 2) {
options.speed = 1;
}
if (effect === 'waves') {
var borderThickness = (options.tickness || 3) - 1;
var border = ';border: ' + borderThickness + 'px ' + (options.style || 'solid') +' ' + (options.color || 'grey');
var text = '<div class="vis-hq-wave wave1" style="top:-' + borderThickness + 'px; left: -' + borderThickness + 'px;width: ' + Math.round($this.width()) +
'px;height: ' + Math.round($this.height()) + 'px;border-radius: ' + (options.radius || $this.css('border-radius')) +
border +
'; position: absolute"></div>';
$this.prepend(text);
$this.prepend(text.replace('wave1', 'wave2'));
$this.find('.wave1').show().addClass('animated' + options.speed + 's vis-hq-zoomIn1');
$this.find('.wave2').show().addClass('animated' + options.speed + 's vis-hq-zoomIn2');
setTimeout(function () {
$this.find('.wave1').remove();
$this.find('.wave2').remove();
}, 2050);
} else {
$this.addClass('animated' + options.speed + 's vis-hq-' + effect);
setTimeout(function () {
$this.removeClass('animated' + options.speed + 's vis-hq-' + effect);
}, 2100);
}
});
};
$.fn.popupShow = function ($div, options, callback) {
if (typeof options === 'function') {
callback = options;
options = null;
}
options = options || {};
options.effect = options.effect || 'zoomIn';
options.speed = options.speed || '05';
options.relative = options.relative || false;
return this.each(function () {
// Do something to each element here.
var $this = $(this);
if (!$div) {
console.log('no div');
return;
}
var offset = $this.position();
var eTop = options.relative ? 0 : offset.top; //get the offset top of the element
var eLeft = options.relative ? 0 : offset.left; //get the offset top of the element
var dh = $div.css({opacity: 0}).show().height();
var dw = $div.width();
// calculate center
//var x = $this.width();
//var y = $this.height();
var zindex = $div.css('z-index');
zindex = options.zindex || ((zindex === 'auto') ? 1 : (zindex || 0) + 1);
$div.css({position: 'absolute', left: eLeft + ($this.width() - dw) / 2, top: eTop + ($this.height() - dh) / 2, 'z-index': zindex});
setTimeout(function () {
$div.addClass('animated' + options.speed + 's vis-hq-' + options.effect);
}, 0);
setTimeout(function () {
$div.removeClass('animated' + options.speed + 's vis-hq-' + options.effect).css({opacity: 1});
if (callback) callback();
}, (options.speed === '05') ? 550 : parseInt(options.speed, 10) * 1000 + 50);
});
};
$.fn.popupHide = function ($div, options, callback) {
if (typeof $div === 'function') {
callback = $div;
$div = null;
}
if (typeof options === 'function') {
callback = options;
options = null;
}
options = options || {};
options.effect = options.effect || 'zoomOut';
options.speed = options.speed || '05';
return this.each(function () {
// Do something to each element here.
if (!$div) {
$div = $(this);
}
setTimeout(function () {
$div.addClass('animated' + options.speed + 's vis-hq-' + options.effect);
}, 0);
setTimeout(function () {
$div.removeClass('animated' + options.speed + 's vis-hq-' + options.effect);
$div.hide();
if (callback) callback();
}, (options.speed === '05') ? 550 : parseInt(options.speed, 10) * 1000 + 50);
});
};
$.fn.makeSlider = function (options, onChange, onIdle) {
if (options === 'hide') {
return this.each(function () {
var $this = $(this);
var timer = $this.data('hideTimer');
if (timer) clearTimeout(timer);
$this.data('hideTimer', null);
$this.hide();
});
} else if (options === 'show') {
return this.each(function () {
var $this = $(this).show();
var hideTimer = $this.data('hideTimer');
options = $this.data('options');
if (onChange !== undefined && onChange !== null) {
if (options.invert) {
onChange = options.max - onChange + options.min;
}
$this.slider('value', onChange);
}
if (hideTimer) clearTimeout(hideTimer);
if (options.timeout) {
$this.data('hideTimer', setTimeout(function () {
$this.data('hideTimer', null);
options.onIdle && options.onIdle();
}, options.timeout));
}
});
}
if (typeof options === 'string') {
if (options === 'restart') {
return this.each(function () {
var $this = $(this);
var options = $this.data('options');
if (options.timeout) {
$this.data('hideTimer', setTimeout(function () {
options.onIdle && options.onIdle();
}, options.timeout));
}
});
}
return;
}
if (typeof options === 'function') {
onIdle = onChange;
onChange = options;
options = null;
}
options = options || {};
options.timeout = (options.timeout === undefined) ? 2000 : options.timeout;
options.min = (options.min === undefined) ? 0 : options.min;
options.max = (options.max === undefined) ? 100 : options.max;
options.value = (options.value === undefined) ? options.max : options.value;
options.show = (options.show === undefined) ? true : options.show;
options.onIdle = onIdle;
options.onChange = onChange;
if (options.invert) {
options.value = options.max - options.value + options.min;
}
return this.each(function () {
var $this = $(this);
if (options.timeout && options.show) {
$this.data('hideTimer', setTimeout(function () {
$this.data('hideTimer', null);
onIdle && onIdle();
}, options.timeout));
}
$this.data('options', options);
$this.slider({
orientation: 'vertical',
range: 'max',
min: options.min,
max: options.max,
value: options.value,
start: function () {
var timer = $this.data('hideTimer');
if (timer) {
clearTimeout(timer);
$this.data('hideTimer', null);
}
},
stop: function (event, ui) {
var hideTimer = $this.data('hideTimer');
if (hideTimer) clearTimeout(hideTimer);
if (options.onChange) {
var val = ui.value;
if (options.invert) {
val = options.max - ui.value + options.min;
}
options.onChange(val);
}
if (options.timeout) {
$this.data('hideTimer', setTimeout(function () {
$this.data('hideTimer', null);
options.onIdle && options.onIdle();
}, options.timeout));
}
}
});
$this.find('.ui-slider-range').removeClass('ui-widget-header').addClass('hq-blind-blind').css({'background-position': '0% 100%'});
});
};
$.fn.batteryIndicator = function (options, args) {
if (typeof options === 'string') {
if (options === 'show') {
return this.each(function () {
var $this = $(this);
if (args === undefined || args === null) {
args = true;
}
if (args) {
$this.find('.vis-hq-battery').show();
} else {
$this.find('.vis-hq-battery').hide();
}
});
} else
if (options === 'hide') {
return this.each(function () {
$(this).find('.vis-hq-battery').hide();
});
}
return;
}
options = options || {};
options.color = options.color || '#FF5555';
options.angle = (options.angle !== undefined && options.angle !== null) ? options.angle : -90;
options.size = options.size || 32;
options.title = options.title || '';
return this.each(function () {
var $this = $(this);
$this.data('options', options);
if ($this.find('.vis-hq-battery').length) return;
$this.append('<div class="vis-hq-battery ' + (options.classes || '') + '" title="' + options.title + '">' +
'<svg xmlns="http://www.w3.org/2000/svg" width="' + options.size + '" height="' + options.size + '" viewBox="0 0 48 48">' +
'<path d="M0 0h48v48h-48z" fill="none"/>' +
'<path fill="' + options.color + '" transform="rotate(' + options.angle + ', 24, 24)" d="M31.33 8h-3.33v-4h-8v4h-3.33c-1.48 0-2.67 1.19-2.67 2.67v30.67c0 1.47 1.19 2.67 2.67 2.67h14.67c1.47 0 2.67-1.19 2.67-2.67v-30.67c-.01-1.48-1.2-2.67-2.68-2.67zm-5.33 28h-4v-4h4v4zm0-8h-4v-10h4v10z"/></svg>' +
'</div>');
if (!options.show) {
$this.find('.vis-hq-battery').hide();
}
});
};
$.fn.popupDialog = function (options) {
return this.each(function () {
var $this = $(this);
var $dialog;
// timeout: data.dialog_timeout,
var dialog = $this.data('dialog');
if (!dialog) {
if (typeof options === 'string') {
console.log('Show prior init');
return;
}
var text = '<div class="vis-hq-dialog" style="display: none"></div>';
$this.append(text);
$dialog = $this.find('.vis-hq-dialog');
$this.data('dialog', $dialog[0]);
var dialogButtons = [
{
text: _('Ok'),
click: function () {
$dialog.dialog('close');
},
id: 'ok'
}
];
dialogButtons[_('Ok')] = function () {
$dialog.dialog('close');
};
if (options.timeout) {
dialogButtons.unshift( {
id: 'donthide',
text: false,
icons: {primary: 'ui-icon-pin-w'},
click: function () {
$dialog.data('no-timeout', !$dialog.data('no-timeout'));
if ($dialog.data('no-timeout')) {
$(this).parent().find('#donthide').addClass('ui-state-error').button({
icons: {primary: 'ui-icon-pin-s'}
});
var timeout = $dialog.data('timeout');
if (timeout) {
clearTimeout(timeout);
$dialog.data('timeout', null);
}
} else {
$(this).parent().find('#donthide').removeClass('ui-state-error').button({
icons: {primary: 'ui-icon-pin-w'}
});
$dialog.data('timeout', setTimeout(function () {
$dialog.dialog('close');
}, data.timeout));
}
}
});
}
$dialog.dialog({
autoOpen: options.open || false,
width: options.width || 800,
height: options.height || 400,
modal: options.modal === undefined ? true : !!options.modal,
title: options.title || _('Chart'),
show: {
effect: options.effect,
duration: 500
},
open: function (event, ui) {
$dialog.height(options.height || 400);
$(this).parent().css('top', ($(window).height() - $(this).parent().height()) / 2);
$(this).parent().find('#donthide').css({width: 37, height: 37});
$(this).parent().find("#ok").focus();
if (options.effect) {
setTimeout(function () {
$dialog.html(options.content || '');
}, 500);
} else {
$dialog.html(options.content || '');
}
if (options.timeout && !$dialog.data('no-timeout')) {
$dialog.data('timeout', setTimeout(function () {
$dialog.dialog('close');
}, options.timeout));
}
//$('[aria-describedby="dialog_delete"]').css('z-index', 11002);
//$('.ui-widget-overlay').css('z-index', 1001);
},
close: function () {
$dialog.html('');
var timeout = $dialog.data('timeout');
if (timeout) {
clearTimeout(timeout);
$dialog.data('timeout', null);
}
},
buttons: dialogButtons
});
$dialog.data('data', options);
} else {
$dialog = $(dialog);
}
var data = $dialog.data('data');
if (typeof options === 'string') {
switch (options) {
case 'show':
$dialog.dialog('open');
break;
case 'hide':
$dialog.dialog('close');
break;
default:
console.log('Unknown command ' + options);
break;
}
}
});
};
}(jQuery));
// Add words for bars
if (vis.editMode) {
$.extend(true, systemDictionary, {
"circleWidth": {"en": "Сircle width", "de": "Kreisbreite", "ru": "Ширина дуги"},
"showValue": {"en": "Show value", "de": "Wert anzeigen", "ru": "Показать значение"},
"alwaysShow": {"en": "Always show circle", "de": "Kreis immer zeigen", "ru": "Показывать круг всегда"},
"iconName": {"en": "Icon", "de": "Kleinbild", "ru": "Миниатюра"},
"iconOn": {"en": "Active icon", "de": "Aktivbild", "ru": "Активная миниатюра"},
"btIconWidth": {"en": "Icon width", "de": "Bildbreite", "ru": "Ширина миниатюры"},
"offsetAuto": {"en": "Auto positioning", "de": "Positionieren(Auto)", "ru": "Автоматическое позиционирование"},
"leftOffset": {"en": "Left offset", "de": "Offset links", "ru": "Сдвиг слева"},
"topOffset": {"en": "Top offset", "de": "Offset von Oben", "ru": "Сдвиг сверху"},
"group_leftRight": {"en": "Descriptions", "de": "Beschreibungen", "ru": "Подписи"},
"hoursLastAction": {"en": "Hide last action after(hrs)", "de": "Ausblenden letze Anderungszeit nach(Std)", "ru": "Скрыть последнее изменение(часов)"},
"timeAsInterval": {"en": "Time as interval", "de": "Zeit als Intervall", "ru": "Время, как интервал"},
"descriptionLeft": {"en": "Description (left)", "de": "Beschreibung (links)", "ru": "Подпись (слева)"},
"descriptionLeftDisabled": {"en": "No description (left)", "de": "Keine Beschreibung (links)", "ru": "Без подписи (слева)"},
"infoLeftFontSize": {"en": "Left font size", "de": "Schriftgrosse links", "ru": "Размер шрифта слева"},
"infoRight": {"en": "Description (right)", "de": "Beschreibung (rechts)", "ru": "Подпись (справа)"},
"infoFontRightSize": {"en": "Right font size", "de": "Schriftgrosse rechts", "ru": "Размер шрифта справа"},
"group_styles": {"en": "Styles", "de": "Stil", "ru": "Стили"},
"styleNormal": {"en": "Normal", "de": "Normal", "ru": "Нормальный"},
"styleActive": {"en": "Active", "de": "Aktiv", "ru": "Активный"},
"usejQueryStyle": {"en": "Use jQuery Styles", "de": "jQuery Stil anwenden", "ru": "Применить jQuery стили"},
"changeEffect": {"en": "Change effect", "de": "Anderungseffekt", "ru": "Эффект при изменении"},
"waveColor": {"en": "Wave color", "de": "Wellenfarbe", "ru": "Цвет волн"},
"testActive": {"en": "Test", "de": "Test", "ru": "Тест"},
"group_value": {"en": "Value", "de": "Wert", "ru": "Значение"},
"unit": {"en": "Unit", "de": "Einheit", "ru": "Единицы"},
"readOnly": {"en": "Read only", "de": "Nur lesend", "ru": "Не изменять"},
"group_center": {"en": "Center", "de": "Zentrum", "ru": "Центр"},
"caption": {"en": "Caption", "de": "Beschriftung", "ru": "Подпись"},
"captionOn": {"en": "Caption active", "de": "Beschriftung bei aktiv", "ru": "Подпись когда активно"},
"hideNumber": {"en": "Hide number", "de": "Nummer ausblenden", "ru": "Скрыть число"},
"group_arc": {"en": "Arc", "de": "Bogen", "ru": "Дуга"},
"angleOffset": {"en": "Angle offset", "de": "Winkeloffset", "ru": "Сдвиг дуги"},
"angleArc": {"en": "Angle arc", "de": "Bogenwinkel", "ru": "Угол дуги"},
"displayPrevious": {"en": "Display previous", "de": "Letztes Wert zeigen", "ru": "Показывать предыдущее значение"},
"cursor": {"en": "Cursor", "de": "Griff", "ru": "Ручка"},
"thickness": {"en": "Thickness", "de": "Dicke", "ru": "Толщина"},
"bgcolor": {"en": "Background color", "de": "Hintergrundfarbe", "ru": "Цвет фона"},
"linecap": {"en": "Line cap", "de": "Linienende", "ru": "Округлое окончание"},
"anticlockwise": {"en": "Anticlockwise", "de": "Gegenuhrzeigersinn", "ru": "Против часовой стрелки"},
"oid-battery": {"en": "Battery object ID", "de": "Battery ObjektID", "ru": "ID батарейного индикатора"},
"oid-signal": {"en": "Signal object ID", "de": "Signal ObjektID", "ru": "ID качества сигнала"},
"oid-humidity": {"en": "Humidity ID", "de": "Luftfeuchtigkeit ID", "ru": "ID влажности"},
"oid-drive": {"en": "Valve ID", "de": "Ventil ID", "ru": "ID вентиля"},
"oid-actual": {"en": "Actual temperature ID", "de": "Ist ID", "ru": "ID актуальной температуры"},
"group_chart": {"en": "Chart", "de": "Grafik", "ru": "График"},
"dialog_effect": {"en": "Show effect", "de": "Anzeigeeffekt", "ru": "Эффект открытия"},
"dialog_timeout": {"en": "Hide timeout(ms)", "de": "Zumachen nach(ms)", "ru": "Закрыть после(мс)"},
"dialog_open": {"en": "Test open", "de": "Testen", "ru": "Тест"},
"border_width": {"en": "Border width", "de": "Rahmenbreite", "ru": "Ширина рамы"},
"slide_count": {"en": "Slides count", "de": "Flügelanzahl", "ru": "Кол-во створок"},
"hide_timeout": {"en": "Timeout for hide", "de": "Timeout für ", "ru": "Интервал для скрытия"},
"group_slides": {"en": "Slides", "de": "Flügel", "ru": "Створка"},
"slide_type": {"en": "Slide type", "de": "Flügeltyp", "ru": "Тип створки"},
"oid-slide-sensor": {"en": "Slide sensor", "de": "Fensterblatt-Sensor", "ru": "Сенсор на створке"},
"oid-slide-sensor-lowbat": {"en": "Slide sensor lowbat", "de": "FB-Sensor lowbat", "ru": "Сенсор на створке (lowbat)"},
"oid-slide-handle": {"en": "Slide handle", "de": "Griff-Sensor", "ru": "Сенсор на ручке"},
"oid-slide-handle-lowbat": {"en": "Slide handle lowbat", "de": "Griff-Sensor lowbat", "ru": "Сенсор на ручке (lowbat)"},
"door_type": {"en": "Door swing", "de": "Türtyp", "ru": "Тип двери"},
"noAnimate": {"en": "No animation", "de": "Keine Animation", "ru": "Не анимировать"},
"popupHorizontalPos": {"en": "Horizontal popup position", "de": "Horizontale PopUp Position", "ru": "Горизонтальное положение"},
"popupVerticalPos": {"en": "Vertical popup position", "de": "Vertikale PopUp Position", "ru": "Вертикальное положение"},
"infoColor": {"en": "Text color", "de": "Textfarbe", "ru": "Цвет текста"},
"infoBackground": {"en": "Background", "de": "Hintergrund", "ru": "Цвет фона"},
"midTextColor": {"en": "Middle text color", "de": "Textfarbe Mitte", "ru": "Цвет текста в середине"},
"pushButton": {"en": "Push-Button", "de": "Taster", "ru": "Кнопка"},
"big": {"en": "big", "de": "groß", "ru": "большой"},
"small": {"en": "small", "de": "klein", "ru": "маленький"},
"orange": {"en": "orange", "de": "orange", "ru": "оранжевый"},
"blue": {"en": "blue", "de": "blau", "ru": "синий"},
"green": {"en": "green", "de": "grün", "ru": "зелёный"},
"grey": {"en": "grey", "de": "grau", "ru": "серый"},
"show_value": {"en": "Show value", "de": "Wert anzeigen", "ru": "Показывать значение"},
"staticValue": {"en": "Static value", "de": "Statisches Wert", "ru": "Статичное значение"},
"staticValue_tooltip": {
"en": "Static value used if no Object ID set",
"de": "Statisches Wert wird nur dann verwendet,\x0Afalls keine ObjektID gesetzt ist",
"ru": "Статичное значение используется если не задан ID объекта"
},
"checkboxSize": {"en": "Size", "de": "Größe", "ru": "Размер"},
"checkboxColor": {"en": "Color by OFF", "de": "Farbe bei AUS", "ru": "Цвет при 0"},
"checkboxColorOn": {"en": "Color by ON", "de": "Farbe bei ON", "ru": "Цвет при 1"},
"group_style": {"en": "Style", "de": "Still", "ru": "Стиль"},
"oid-open": {"en": "Object ID Open", "de": "Objekt-ID Aufmachen", "ru": "Полностью открыть ID"},
"group_image": {"en": "Images", "de": "Bilder", "ru": "Кнопки"},
"closedIcon": {"en": "Icon-Closed", "de": "Bild für Zu", "ru": "Картинка 'Закрыть'"},
"openedIcon": {"en": "Icon-Opened", "de": "Bild für Auf", "ru": "Картинка 'Открыть'"},
"group_popup": {"en": "Popup", "de": "Popup", "ru": "Popup"},
"popupRadius": {"en": "Popup radius", "de": "Popup-Radius", "ru": "Popup радиус"},
"buttonRadius": {"en": "Buttons radius", "de": "Knopfe-Radius", "ru": "Радиус кнопок"},
"closeIcon": {"en": "Close-Icon", "de": "Zu-Bild", "ru": "Закрыть-Картинка"},
"closeValue": {"en": "Close-Value", "de": "Zu-Wert", "ru": "Закрыть-Значение"},
"closeStyle": {"en": "Close-Style", "de": "Zu-Still", "ru": "Закрыть-Стиль"},
"openIcon": {"en": "Open Lock-Icon", "de": "Schloss Auf-Bild", "ru": "Открыть замок-Картинка"},
"openValue": {"en": "Open Lock-Value", "de": "Schloss Auf-Wert", "ru": "Открыть замок-Значение"},
"openStyle": {"en": "Open Lock-Style", "de": "Schloss Auf-Still", "ru": "Открыть замок-Стиль"},
"openDoorIcon": {"en": "Open Door-Icon", "de": "Tür Auf-Bild", "ru": "Открыть дверь-Картинка"},
"openDoorValue": {"en": "Open Door-Value", "de": "Tür Auf-Wert", "ru": "Открыть дверь-Значение"},
"openDoorStyle": {"en": "Open Door-Style", "de": "Tür Auf-Still", "ru": "Открыть дверь-Стиль"},
"showTimeout": {"en": "Popup timeout", "de": "Popup-Timeout", "ru": "Popup таймаут"},
"val_false": {"en": "Off value", "de": "Aus-Wert", "ru": "Выкл.-Значение"},
"val_true": {"en": "On value", "de": "An-Wert", "ru": "Вкл.-Значение"},
"invert": {"en": "Invert", "de": "Invertieren", "ru": "Инвертировать"},
"infoLeftPaddingLeft": {"en": "Left padding (left)", "de": "Linker Abstand (Links)", "ru": "Отступ слева (левый текст)"},
"infoLeftPaddingRight": {"en": "Right padding (left", "de": "Rechter Abstand (Links)", "ru": "Отступ справа (левый текст)"},
"infoRightPaddingLeft": {"en": "Left padding (right)", "de": "Linker Abstand (Rechts)", "ru": "Отступ слева (правый текст)"},
"infoRightPaddingRight": {"en": "Right padding (right)", "de": "Rechter Abstand (Rechts)", "ru": "Отступ справа (правый текст)"},
"valveBinary": {"en": "Valve only On/Off", "de": "Ventil nur An/Aus", "ru": "Вентиль только Откр/Закр"},
"valve1": {"en": "Valve is from 0 to 1", "de": "Ventil ist von 0 bis 1", "ru": "Вентиль от 0 до 1"},
"set_by_click": {"en": "Set value by click", "de": "Wert Beim Klick", "ru": "Значение при щелчке мыши"},
});
}
$.extend(true, systemDictionary, {
"just now": {"en": "just now", "de": "gerade jetzt", "ru": "только что"},
"for %s min.": {"en": "for %s min.", "de": "vor %s Min.", "ru": "%s мин. назад"},
// plural hours
"forHours": {
"en": "for %s hrs. and %s min.",
"de": "vor %s St. und %s Min.",
"ru": "%s часов и %s мин. назад"
},
// singular hour
"for1Hour": {
"en": "for %s hr. and %s min.",
"de": "vor %s St. und %s Min.",
"ru": "%s час и %s мин. назад"
},
// 2-4 hour
"for2-4Hours": {
"en": "for %s hr. and %s min.",
"de": "vor %s St. und %s Min.",
"ru": "%s часа и %s мин. назад"
},
"yesterday": {"en": "yesterday", "de": "gestern", "ru": "вчера"},
"for %s hours": {"en": "for %s hours", "de": "vor %s Stunden", "ru": "%s ч. назад"},
"Chart": {"en": "Chart", "de": "Grafik", "ru": "График"},
"opened": {"en": "opened", "de": "auf", "ru": "откр."},
"closed": {"en": "closed", "de": "zu", "ru": "закр."}
});
// widget can has following parts:
// left info (descriptionLeft)
// right info (additional info)
// working/cancel icon
// center icon
// main form
// <div class="vis-widget-body">
// <div class="vis-hq-rightinfo" style='position: absolite; z-index: 0"></div>
// <div class="vis-hq-leftinfo" style='position: absolite; z-index: 0"></div>
// <div class="vis-hq-main" style='z-index: 1">
// <div class="vis-hq-icon" style='z-index: 1"></div>
// <div class="vis-hq-text" style='z-index: 1"></div>
// </div>
// <div class="vis-hq-info-icon" style='position: absolite; z-index: 2"></div>
// </div>
vis.binds.hqwidgets = {
version: "1.5.1",
contextEnabled: true,
zindex: [],
preventDefault: function (e) {
e.preventDefault();
},
contextMenu: function (isEnable) {
if (isEnable && !vis.binds.hqwidgets.contextEnabled) {
vis.binds.hqwidgets.contextEnabled = true;
document.removeEventListener('contextmenu', vis.binds.hqwidgets.preventDefault, false);
}
if (!isEnable && vis.binds.hqwidgets.contextEnabled) {
vis.binds.hqwidgets.contextEnabled = false;
document.addEventListener('contextmenu', vis.binds.hqwidgets.preventDefault, false);
}
},
showVersion: function () {
if (vis.binds.hqwidgets.version) {
console.log('Version vis-hqwidgets: ' + vis.binds.hqwidgets.version);
vis.binds.hqwidgets.version = null;
}
},
getTimeInterval: function (oldTime, hoursToShow) {
// if less than 2000.01.01 00:00:00
if (oldTime < 946681200000) oldTime = oldTime * 1000;
var result = '';
var newTime = new Date ();
if (!oldTime) return '';
if (typeof oldTime === 'string') {
oldTime = new Date(oldTime);
} else {
if (typeof oldTime === 'number') {
oldTime = new Date(oldTime);
}
}
var seconds = (newTime.getTime() - oldTime.getTime ()) / 1000;
if (hoursToShow && (seconds / 3600) > hoursToShow) return '';
if (seconds < 60) {
result = _('just now');
} else
if (seconds <= 3600) {
result = _('for %s min.', Math.floor(seconds / 60));
}
else
if (seconds <= 3600 * 24) { // between 1 und 24 hours
var hrs = Math.floor(seconds / 3600);
if (hrs === 1 || hrs === 21) {
result = _('for1Hour', hrs, (Math.floor(seconds / 60) % 60));
} else if (hrs >= 2 && hrs <= 4) {
result = _('for2-4Hours', hrs, (Math.floor(seconds / 60) % 60));
} else {
result = _('forHours', hrs, (Math.floor(seconds / 60) % 60));
}
}
else
if (seconds > 3600 * 24 && seconds <= 3600 * 48) {
result = _('yesterday');
}
else
if (seconds > 3600 * 48) { // over 2 days
result = _('for %s hours', Math.floor(seconds / 3600));
}
return result;
},
button: {
showRightInfo: function ($div, value) {
var data = $div.data('data');
var time = null;
var timer = null;
if (data.hoursLastAction) {
// show time interval. It must be updated every minute
if (data.timeAsInterval) {
time = vis.binds.hqwidgets.getTimeInterval(data.lc, data.hoursLastAction);
$div.find('.vis-hq-time').html(time);
if (!vis.editMode) {
timer = $div.data('lastTimer');
if (!timer) {
timer = setInterval(function () {
var time = vis.binds.hqwidgets.getTimeInterval(data.lc, data.hoursLastAction);
$div.find('.vis-hq-time').html(time);
if (time && $div.find('.vis-hq-time').text()){
$div.find('.vis-hq-rightinfo').show();
} else {
$div.find('.vis-hq-rightinfo').hide();
}
}, 60000);
$div.data('lastTimer', timer);
}
}
} else {