mirror of
https://gitlab.silvrtree.co.uk/martind2000/censis-archive.git
synced 2025-02-25 10:13:36 +00:00
”2016-09-14”
This commit is contained in:
Martin Donnelly
parent
70b9b267a8
commit
f578eab065
@ -482,7 +482,7 @@
|
||||
filter.push(co2);
|
||||
|
||||
|
||||
//if (step % 100 === 0) {
|
||||
//If (step % 100 === 0) {
|
||||
if (filter.length >= max) {
|
||||
let sub100 = filter.reduce((prev, cur) => prev + cur);
|
||||
chunk.sub100 = sub100 / max;
|
||||
@ -498,9 +498,9 @@
|
||||
},
|
||||
setSocket: function(newSocket) {
|
||||
this.socketHandler = newSocket;
|
||||
this.socketHandler.on('update', function() {
|
||||
console.log('Model updated:', this.get('data'));
|
||||
});
|
||||
this.socketHandler.on('update', function() {
|
||||
console.log('Model updated:', this.get('data'));
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
@ -508,29 +508,33 @@
|
||||
|
||||
|
||||
var Widget = Backbone.View.extend({
|
||||
tagName : 'div',
|
||||
//el: '#widgets',
|
||||
template: _.template($('#widget-template').html()),
|
||||
initialize: function() {
|
||||
_.bindAll(this, 'render');
|
||||
|
||||
this.listenTo(this.model,'change',function(d){
|
||||
let data = d.get('data');
|
||||
this.modes = ['', 'lux', 'temp', 'co2', 'humid', 'noise'];
|
||||
this.titles = [
|
||||
'', 'Light Levels', 'Temperature', 'Co2 Levels', 'Humidity', 'Sound'
|
||||
];
|
||||
this.listenTo(this.model,'change',function() {
|
||||
this.render();
|
||||
});
|
||||
|
||||
this.widgetMode = this.id.split('-')[1];
|
||||
this.title = this.titles[this.modes.indexOf(this.widgetMode)];
|
||||
this.render();
|
||||
},
|
||||
render: function() {
|
||||
let data = this.model.get('data');
|
||||
let value = (typeof data !== 'undefined') ? data[this.widgetMode] : 0;
|
||||
var html = this.template({name:this.widgetMode,value:value});
|
||||
var html = this.template({name: this.title,value: value});
|
||||
console.log(html);
|
||||
console.log(this.$el);
|
||||
this.$el.empty();
|
||||
this.$el.html('<p>hello</p>');
|
||||
return this;
|
||||
}});
|
||||
console.log('rendering');
|
||||
this.$el.append(html);
|
||||
|
||||
return this;
|
||||
}});
|
||||
|
||||
|
||||
notification.configProfile('global', {
|
||||
@ -557,6 +561,6 @@
|
||||
views.mainview.setSocket(webSocketModel);
|
||||
views.grapher.setSocket(webSocketModel);
|
||||
|
||||
var tempWidget = new Widget({model:webSocketModel, id:'widget-temp'});
|
||||
var co2Widget = new Widget({model:webSocketModel, id:'widget-co2'});
|
||||
var tempWidget = new Widget({model: webSocketModel, id: 'widget-temp'});
|
||||
var co2Widget = new Widget({model: webSocketModel, id: 'widget-co2'});
|
||||
})(jQuery);
|
||||
|
||||
@ -55,171 +55,176 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="widget-temp" style="color:yellow;background-color:grey;border:1px yellow solid;">
|
||||
<div id="widgets">
|
||||
<div class='mui-row' id="widget-temp">
|
||||
</div>
|
||||
<div id="widget-co2" style="color:yellow;background-color:grey;border 1px solid yellow;"></div>
|
||||
<script type="text/template" id="loaded-template">
|
||||
<div
|
||||
style="background-color: darkred;color: white;font-weight: 900;text-align: center">Loaded
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="main-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-select">
|
||||
<select id="device" name="device">
|
||||
<option></option>
|
||||
<option>
|
||||
HIE-mobile-1
|
||||
</option>
|
||||
<option>
|
||||
HIE-demo
|
||||
</option>
|
||||
<option>
|
||||
HIE-mobile-2
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-1
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-2
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-3
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-4
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-5
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-6
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-7
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-1
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-2
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-3
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-4
|
||||
</option>
|
||||
<option>
|
||||
HIE-mDot-1
|
||||
</option>
|
||||
</select> <label>Device</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='mui-row' id="widget-co2"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/template" id="loaded-template">
|
||||
<div
|
||||
style="background-color: darkred;color: white;font-weight: 900;text-align: center">Loaded
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="main-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-col-md-12">
|
||||
<button id='refresh'
|
||||
class="mui-btn mui-btn--small mui-btn--primary">Refresh
|
||||
</button>
|
||||
|
||||
</div>
|
||||
<div class="mui-select">
|
||||
<select id="device" name="device">
|
||||
<option></option>
|
||||
<option>
|
||||
HIE-mobile-1
|
||||
</option>
|
||||
<option>
|
||||
HIE-demo
|
||||
</option>
|
||||
<option>
|
||||
HIE-mobile-2
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-1
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-2
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-3
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-4
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-5
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-6
|
||||
</option>
|
||||
<option>
|
||||
HIE-smart-campus-7
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-1
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-2
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-3
|
||||
</option>
|
||||
<option>
|
||||
CENSIS-LoRa-4
|
||||
</option>
|
||||
<option>
|
||||
HIE-mDot-1
|
||||
</option>
|
||||
</select> <label>Device</label>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="list-template">
|
||||
<ul></ul>
|
||||
</script>
|
||||
<script type="text/template" id="item-template">
|
||||
</div>
|
||||
<div class="mui-row">
|
||||
<div class="mui-col-md-12">
|
||||
<button id='refresh'
|
||||
class="mui-btn mui-btn--small mui-btn--primary">Refresh
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="list-template">
|
||||
<ul></ul>
|
||||
</script>
|
||||
<script type="text/template" id="item-template">
|
||||
<div class="mui-row">
|
||||
<div class="mui-col-md-2"><%= item.timestamp %></div>
|
||||
<div class="mui-col-md-2"><%= item.lux %></div>
|
||||
<div class="mui-col-md-2"><%= item.co2 %></div>
|
||||
<div class="mui-col-md-2"><%= item.temp %></div>
|
||||
<div class="mui-col-md-2"><%= item.humidity %></div>
|
||||
<div class="mui-col-md-2"><%= item.sound %></div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="AMChart-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-col-md-2"><%= item.timestamp %></div>
|
||||
<div class="mui-col-md-2"><%= item.lux %></div>
|
||||
<div class="mui-col-md-2"><%= item.co2 %></div>
|
||||
<div class="mui-col-md-2"><%= item.temp %></div>
|
||||
<div class="mui-col-md-2"><%= item.humidity %></div>
|
||||
<div class="mui-col-md-2"><%= item.sound %></div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="AMChart-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-select mui-col-md-12">
|
||||
<select id="displaymode" name="displaymode">
|
||||
<option value="0"></option>
|
||||
<option value="1">
|
||||
Light
|
||||
</option>
|
||||
<option value="2">
|
||||
Temp
|
||||
</option>
|
||||
<option value="3">
|
||||
Co2
|
||||
</option>
|
||||
<option value="4">
|
||||
Humidity
|
||||
</option>
|
||||
<option value="5">
|
||||
Noise
|
||||
</option>
|
||||
<option value="6">
|
||||
Light & Co2
|
||||
</option>
|
||||
<option value="7">
|
||||
Temperature & Humidity
|
||||
</option>
|
||||
<div class="mui-select mui-col-md-12">
|
||||
<select id="displaymode" name="displaymode">
|
||||
<option value="0"></option>
|
||||
<option value="1">
|
||||
Light
|
||||
</option>
|
||||
<option value="2">
|
||||
Temp
|
||||
</option>
|
||||
<option value="3">
|
||||
Co2
|
||||
</option>
|
||||
<option value="4">
|
||||
Humidity
|
||||
</option>
|
||||
<option value="5">
|
||||
Noise
|
||||
</option>
|
||||
<option value="6">
|
||||
Light & Co2
|
||||
</option>
|
||||
<option value="7">
|
||||
Temperature & Humidity
|
||||
</option>
|
||||
|
||||
</select> <label>Graph</label>
|
||||
</div>
|
||||
</select> <label>Graph</label>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="graph-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-select mui-col-md-6">
|
||||
<select id="displaymode" name="displaymode">
|
||||
<option value="0"></option>
|
||||
<option value="1">
|
||||
Light
|
||||
</option>
|
||||
<option value="2">
|
||||
Temp
|
||||
</option>
|
||||
<option value="3">
|
||||
Co2
|
||||
</option>
|
||||
<option value="4">
|
||||
Humidity
|
||||
</option>
|
||||
<option value="5">
|
||||
Noise
|
||||
</option>
|
||||
</select> <label>Graph</label>
|
||||
</div>
|
||||
<div class="mui-col-md-6">
|
||||
<svg id="graphSVG" width="300" height="150" fill="blue">
|
||||
<line x1="46" y1="12" x2="280" y2="12"
|
||||
style="stroke:#004c6d;stroke-width:2;"></line>
|
||||
<text id="maxY" x="36" y="15" text-anchor="end">--</text>
|
||||
<line x1="46" y1="136" x2="280" y2="136"
|
||||
style="stroke:#004c6d;stroke-width:2;"></line>
|
||||
<text id="MinY" x="36" y="139" text-anchor="end">0</text>
|
||||
<polyline id="line" fill="none" stroke="#2196F3" text-anchor="end"
|
||||
stroke-width="1" points=""></polyline>
|
||||
<g id="datapoints"></g>
|
||||
<g id="baseline"></g>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="graph-template">
|
||||
<div class="mui-container">
|
||||
<div class="mui-row">
|
||||
<div class="mui-select mui-col-md-6">
|
||||
<select id="displaymode" name="displaymode">
|
||||
<option value="0"></option>
|
||||
<option value="1">
|
||||
Light
|
||||
</option>
|
||||
<option value="2">
|
||||
Temp
|
||||
</option>
|
||||
<option value="3">
|
||||
Co2
|
||||
</option>
|
||||
<option value="4">
|
||||
Humidity
|
||||
</option>
|
||||
<option value="5">
|
||||
Noise
|
||||
</option>
|
||||
</select> <label>Graph</label>
|
||||
</div>
|
||||
<div class="mui-col-md-6">
|
||||
<svg id="graphSVG" width="300" height="150" fill="blue">
|
||||
<line x1="46" y1="12" x2="280" y2="12"
|
||||
style="stroke:#004c6d;stroke-width:2;"></line>
|
||||
<text id="maxY" x="36" y="15" text-anchor="end">--</text>
|
||||
<line x1="46" y1="136" x2="280" y2="136"
|
||||
style="stroke:#004c6d;stroke-width:2;"></line>
|
||||
<text id="MinY" x="36" y="139" text-anchor="end">0</text>
|
||||
<polyline id="line" fill="none" stroke="#2196F3" text-anchor="end"
|
||||
stroke-width="1" points=""></polyline>
|
||||
<g id="datapoints"></g>
|
||||
<g id="baseline"></g>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="widget-template">
|
||||
<div>
|
||||
<div class="mui-col-md-2"><%= name %></div>
|
||||
<div class="mui-col-md-2"><%= value %></div>
|
||||
</div>
|
||||
</script>
|
||||
<script type="text/template" id="widget-template">
|
||||
<div class="mui-col-md-3 panel">
|
||||
<div class="mui-col-md-2"><%= name %></div>
|
||||
<div class="mui-col-md-2"><%= value %></div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<!-- build:vendor -->
|
||||
<script src="lib/mui.js"></script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user