public
Last active

Ninja Blocks Presence Widget

  • Download Gist
options.js
JavaScript
1 2 3 4 5 6 7
return {
"name": "Ping Presence",
"deviceMap": [
{deviceId:264},
{deviceId:261}
]
}
style.less
Less
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29
.devices-online {
background-color:#DDD;
background-size: cover;
background-position:center;
height: 100%;
padding:5px;
margin-top:30px;
overflow:auto;
}
 
.device {
.name {display:block;}
.time{display:block;text-align:right;font-size:12px;}
border:white 1px solid;
color: black;
font-size: 18px;
padding:5px;
margin-bottom:5px;
 
background: #8fc400;
background: -moz-linear-gradient(left, #8fc400 0%, #8fc400 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#8fc400), color-stop(100%,#8fc400));
background: -webkit-linear-gradient(left, #8fc400 0%,#8fc400 100%);
background: -o-linear-gradient(left, #8fc400 0%,#8fc400 100%);
background: -ms-linear-gradient(left, #8fc400 0%,#8fc400 100%);
background: linear-gradient(to right, #8fc400 0%,#8fc400 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8fc400', endColorstr='#8fc400',GradientType=1 );
 
}
view.html
HTML
1 2
<div class="devices-online">
</div>
widget.js
JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37
var entities = [];
var ids = [];
 
scope.onData = function(data) {
data = JSON.parse(JSON.stringify(data));// FIXME
//console.log("Presence actuate", data);
//console.log("Entities: ",entities);
var index = ids.indexOf(data.DA.id);
if(index > -1) {
entities[index] = data.DA;
d = new Date(data.DA.TIMESTAMP);
element.find('#'+data.DA.id).attr('style','').find('.time').text('Last seen: '+d.toLocaleString());
} else {
item = data.DA;
var el = $('<div class="device"><span class="name"></span><span class="time"></span></div>');
el.find('.name').text(item.name);
d = new Date(item.TIMESTAMP);
el.find('.time').text('Last seen: '+d.toLocaleString());
el.attr('id',item.id);
element.find('.devices-online').append(el);
ids.push(item.id);
entities.push(item);
}
var timeoutTime = new Date();
timeoutTime.setMinutes(timeoutTime.getMinutes()-1);
for(var i = 0;i<ids.length;i++)
{
if(entities[i].TIMESTAMP < timeoutTime) {
element.find('#'+entities[i].id).attr('style','display:none');
entities[i].present = false;
}
}
}

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.