Initial commit
@@ -0,0 +1,229 @@
|
||||
<!--
|
||||
yunkong2.vis material Widget-Set
|
||||
version: "0.1.5"
|
||||
Copyright 2018 nisiode<nisio.air@mail.com>
|
||||
forked by Pix (7/2018) (Humidty, shutter)
|
||||
|
||||
-->
|
||||
|
||||
<!-- here you can include so many css as you want -->
|
||||
<link rel="stylesheet" href="widgets/material/css/material.css" />
|
||||
<link rel="stylesheet" href="widgets/material/css/style.css" />
|
||||
<!-- here you can include so many js-files as you want -->
|
||||
<script type="text/javascript" src="widgets/material/js/material.js"></script>
|
||||
|
||||
<script id="tplMaListDoor"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListWindow" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/fts_door.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListDoor">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/fts_door.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value mdui-value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListDoor(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListWindow"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListWindow" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/fts_window_2w.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListWindow">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/fts_window_2w.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value mdui-value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListWindow(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListShutter"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListShutter" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/fts_shutter_100.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListWindowShutter">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/fts_shutter_100.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value" >
|
||||
<div class="mdui-slider" >
|
||||
<div class="sliderJQUI" id="<%= this.data.attr('wid') %>_slider" data-oid="<%= this.data.attr('oid') %>" data-oid2="<%= this.data.attr('oid-2') %>" data-oid-working="<%= this.data.attr('oid-working') %>" data-oid2-working="<%= this.data.attr('oid-2-working') %>"<%= (el) -> vis.binds.jqueryui.slider(el, {min:0,max:100,step:1,inverted:true}) %> /></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListShutter(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListTemp"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListTemp" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/temp_temperature.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListTemperature">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/temp_temperature.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value mdui-value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListTemp(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListHumid"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListHumid" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/humid_humidity.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListHumidity">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/humid_humidity.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value mdui-value"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListHumid(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListLight"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListLight" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/light_light_dim_100.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListLight">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/light_light_dim_100.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value" >
|
||||
<div class="mdui-switch" >
|
||||
<input type="checkbox" name="<%= this.data.attr('wid') %>_checkbox" id="<%= this.data.attr('wid') %>_checkbox" data-oid="<%= this.data.attr('oid') %>" />
|
||||
<label for="<%= this.data.attr('wid') %>_checkbox"><label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListLight(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
|
||||
<script id="tplMaListLightDim"
|
||||
type="text/ejs"
|
||||
class="vis-tpl"
|
||||
data-vis-prev='<div id="prev_tplMaListLightDim" style="position: relative; text-align: initial;padding: 4px ">
|
||||
<div class="vis-widget_prev " style="width: 100px; height: 100px; padding:2px; background-color: #212121" >
|
||||
<img src="widgets/material/img/light_light_dim_100.png" style="width: 100px; height: 100px;"></div></div>'
|
||||
data-vis-attrs="oid/id;title/text;subtitle/text;"
|
||||
data-vis-set="material"
|
||||
data-vis-type="val"
|
||||
data-vis-name="ListLightDim">
|
||||
<div class="vis-widget <%== this.data.attr('class') %> md-list" id="<%= this.data.attr('wid') %>" >
|
||||
<div class="vis-widget-body" >
|
||||
<div class="md-list-icon">
|
||||
<img src="widgets/material/img/light_light_dim_100.png">
|
||||
</div>
|
||||
<div class="md-list-desc">
|
||||
<div class="md-list-title mdui-title" >
|
||||
<%= this.data.attr('title') %>
|
||||
</div>
|
||||
<div class="md-list-subtitle mdui-subtitle">
|
||||
<%= this.data.attr('subtitle') %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-list-value" >
|
||||
<div class="mdui-slider" >
|
||||
<div class="sliderJQUI" id="<%= this.data.attr('wid') %>_slider" data-oid="<%= this.data.attr('oid') %>" data-oid2="<%= this.data.attr('oid-2') %>" data-oid-working="<%= this.data.attr('oid-working') %>" data-oid2-working="<%= this.data.attr('oid-2-working') %>"<%= (el) -> vis.binds.jqueryui.slider(el, {min:0,max:100,step:1,inverted:false}) %> /></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% vis.binds.material.tplMdListLightDim(this.data.wid, this.view, this.data); %>
|
||||
</script>
|
||||
@@ -0,0 +1,34 @@
|
||||
.md-list{
|
||||
width: 100%;
|
||||
height: 56px;
|
||||
}
|
||||
.md-list-icon{
|
||||
float: left;
|
||||
width: 72px;
|
||||
height: 56px;
|
||||
}
|
||||
.md-list-icon img{
|
||||
margin-left: 8px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
.md-list-desc{
|
||||
float: left;
|
||||
width: calc(100% - 72px - 100px - 16px);
|
||||
height: 56px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.md-list-value{
|
||||
float: left;
|
||||
width: 100px !important;
|
||||
text-align: right;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.md-list-value .mdui-switch{
|
||||
width: 48px;
|
||||
height: 24px;
|
||||
margin-left: 52px;
|
||||
}
|
||||
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 3.3 KiB |
|
After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 8.8 KiB |
@@ -0,0 +1,2 @@
|
||||
http://creativecommons.org/licenses/by-sa/3.0/de/
|
||||
Creative Commons Namensnennung-Weitergabe unter gleichen Bedingungen 3.0 Deutschland Lizenz
|
||||
|
After Width: | Height: | Size: 4.1 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 5.1 KiB |
|
After Width: | Height: | Size: 4.3 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
@@ -0,0 +1,274 @@
|
||||
/*
|
||||
yunkong2.vis material Widget-Set
|
||||
version: "0.1.4"
|
||||
Copyright 2018 nisiode<nisio.air@mail.com>
|
||||
forked by Pix 7/2018 (humidity, shutter)
|
||||
*/
|
||||
"use strict";
|
||||
|
||||
// add translations for edit mode
|
||||
if (vis.editMode) {
|
||||
$.extend(true, systemDictionary, {
|
||||
"title": {"en": "Title", "de": "Titel", "ru": "???"},
|
||||
"subtitle": {"en": "Subtitle", "de": "Untertitel", "ru": "???"}
|
||||
});
|
||||
}
|
||||
|
||||
// add translations for non-edit mode
|
||||
$.extend(true, systemDictionary, {
|
||||
"Instance": {"en": "Instance", "de": "Instanz", "ru": "?????????"},
|
||||
"open": {"en": "open", "de": "offen", "ru": "?????????"},
|
||||
"tilted": {"en": "tilted", "de": "gekippt", "ru": "?????????"},
|
||||
"closed": {"en": "closed", "de": "geschlossen", "ru": "?????????"},
|
||||
"on": {"en": "on", "de": "an", "ru": "?????????"},
|
||||
"off": {"en": "off", "de": "aus", "ru": "?????????"}
|
||||
});
|
||||
|
||||
vis.binds.material = {
|
||||
version: "0.1.5",
|
||||
showVersion: function () {
|
||||
if (vis.binds.material.version) {
|
||||
console.log('Version material: ' + vis.binds.material.version);
|
||||
vis.binds.material.version = null;
|
||||
}
|
||||
},
|
||||
tplMdListDoor: function (widgetID, view, data) {
|
||||
const srcOpen = 'widgets/material/img/fts_door_open.png';
|
||||
const srcClosed = 'widgets/material/img/fts_door.png';
|
||||
const valOpen = _('open');
|
||||
const valClosed = _('closed');
|
||||
|
||||
var $div = $('#' + widgetID);
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListDoor(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function update(state){
|
||||
var value = (state) ? valOpen : valClosed;
|
||||
var src = (state) ? srcOpen : srcClosed;
|
||||
$div.find('.md-list-value').html(value);
|
||||
$div.find('.md-list-icon').find('img').attr('src', src);
|
||||
}
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListWindow: function (widgetID, view, data) {
|
||||
const srcOpen = 'widgets/material/img/fts_window_2w_open.png';
|
||||
const srcClosed = 'widgets/material/img/fts_window_2w.png';
|
||||
const valOpen = _('open');
|
||||
const valClosed = _('closed');
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListWindow(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function update(state){
|
||||
var value = (state) ? valOpen : valClosed;
|
||||
var src = (state) ? srcOpen : srcClosed;
|
||||
$div.find('.md-list-value').html(value);
|
||||
$div.find('.md-list-icon').find('img').attr('src', src);
|
||||
}
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListTemp: function (widgetID, view, data) {
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListTemp(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
// grey out the value in case the last change is more than 24h ago
|
||||
var curTime = new Date().getTime();
|
||||
var lcTime = vis.states[data.oid + '.lc'];
|
||||
var seconds = (curTime - lcTime) / 1000;
|
||||
if(seconds > 86400){
|
||||
$div.find('.md-list-value').css('opacity', '0.5');
|
||||
}
|
||||
|
||||
function update(state){
|
||||
if(typeof state === 'number'){
|
||||
$div.find('.md-list-value').html(state.toFixed(1) + ' °C');
|
||||
}
|
||||
}
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListHumid: function (widgetID, view, data) {
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListHumid(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
// grey out the value in case the last change is more than 24h ago
|
||||
var curTime = new Date().getTime();
|
||||
var lcTime = vis.states[data.oid + '.lc'];
|
||||
var seconds = (curTime - lcTime) / 1000;
|
||||
if(seconds > 86400){
|
||||
$div.find('.md-list-value').css('opacity', '0.5');
|
||||
}
|
||||
|
||||
function update(state){
|
||||
if(typeof state === 'number'){
|
||||
$div.find('.md-list-value').html(state.toFixed(1) + ' %');
|
||||
}
|
||||
}
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListLight: function (widgetID, view, data) {
|
||||
const srcOff = 'widgets/material/img/light_light_dim_00.png';
|
||||
const srcOn = 'widgets/material/img/light_light_dim_100.png';
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListLight(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function update(state){
|
||||
var src = (state) ? srcOn : srcOff;
|
||||
var $tmp = $('#' + widgetID + '_checkbox');
|
||||
$tmp.prop('checked', state);
|
||||
$div.find('.md-list-icon').find('img').attr('src', src);
|
||||
}
|
||||
|
||||
if (!vis.editMode) {
|
||||
var $this = $('#' + widgetID + '_checkbox');
|
||||
$this.change(function () {
|
||||
var $this_ = $(this);
|
||||
vis.setValue($this_.data('oid'), $this_.prop('checked'));
|
||||
});
|
||||
}
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListLightDim: function (widgetID, view, data) {
|
||||
const srcOff = 'widgets/material/img/light_light_dim_00.png';
|
||||
const srcOn = 'widgets/material/img/light_light_dim_100.png';
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListLightDim(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function update(state){
|
||||
var src = 'widgets/material/img/light_light_dim_' + Math.ceil(state/10) + '0.png';
|
||||
$div.find('.md-list-icon').find('img').attr('src', src);
|
||||
}
|
||||
|
||||
/* if (!vis.editMode) {
|
||||
var $this = $('#' + widgetID + '_slider');
|
||||
$this.change(function () {
|
||||
var $this_ = $(this);
|
||||
vis.setValue($this_.data('oid'), $this_.prop('checked'));
|
||||
});
|
||||
} */
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
},
|
||||
tplMdListShutter: function (widgetID, view, data) {
|
||||
const srcOff = 'widgets/material/img/fts_shutter_00.png';
|
||||
const srcOn = 'widgets/material/img/fts_shutter_100.png';
|
||||
var $div = $('#' + widgetID);
|
||||
|
||||
// if nothing found => wait
|
||||
if (!$div.length) {
|
||||
return setTimeout(function () {
|
||||
vis.binds.material.tplMdListShutter(widgetID, view, data);
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function update(state){
|
||||
var src = 'widgets/material/img/fts_shutter_' + Math.ceil(state/10) + '0.png';
|
||||
$div.find('.md-list-icon').find('img').attr('src', src);
|
||||
}
|
||||
|
||||
/* if (!vis.editMode) {
|
||||
var $this = $('#' + widgetID + '_slider');
|
||||
$this.change(function () {
|
||||
var $this_ = $(this);
|
||||
vis.setValue($this_.data('oid'), $this_.prop('checked'));
|
||||
});
|
||||
} */
|
||||
|
||||
if (data.oid) {
|
||||
// subscribe on updates of value
|
||||
vis.states.bind(data.oid + '.val', function (e, newVal, oldVal) {
|
||||
update(newVal);
|
||||
});
|
||||
|
||||
// set current value
|
||||
update(vis.states[data.oid + '.val']);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
vis.binds.material.showVersion();
|
||||