230 lines
9.7 KiB
HTML
230 lines
9.7 KiB
HTML
<!--
|
|
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>
|