Initial commit

This commit is contained in:
2018-09-22 07:55:32 +08:00
commit ee02b95f4d
51 changed files with 3323 additions and 0 deletions
+229
View File
@@ -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>
File diff suppressed because it is too large Load Diff
+34
View File
@@ -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;
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

+2
View File
@@ -0,0 +1,2 @@
http://creativecommons.org/licenses/by-sa/3.0/de/
Creative Commons Namensnennung-Weitergabe unter gleichen Bedingungen 3.0 Deutschland Lizenz
Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

+274
View File
@@ -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();