From: Philipp Klaus Date: Wed, 1 Jul 2015 10:01:41 +0000 (+0200) Subject: opus20: auto update for the status page / more graphs X-Git-Url: https://jspc29.x-matter.uni-frankfurt.de/git/?a=commitdiff_plain;h=20fce7459f8f8f5ba801ea2ce73ee839d8dbb13d;p=labtools.git opus20: auto update for the status page / more graphs --- diff --git a/opus20/opus20/opus20.py b/opus20/opus20/opus20.py index 482c692..6be8409 100644 --- a/opus20/opus20/opus20.py +++ b/opus20/opus20/opus20.py @@ -691,6 +691,9 @@ class Object(object): def __str__(self): return repr(self) + def to_dict(self): + return self.__dict__.copy() + @classmethod def from_dict(cls, d): o = Object() diff --git a/opus20/opus20/webapp/__init__.py b/opus20/opus20/webapp/__init__.py index 2470e20..4a307de 100755 --- a/opus20/opus20/webapp/__init__.py +++ b/opus20/opus20/webapp/__init__.py @@ -50,9 +50,9 @@ class PlotWebServer(Bottle): self._current_values_last_call = -1E13 self._download_device_data_last_call = -1E13 super(PlotWebServer, self).__init__() - self.route('/connected/device', callback = self._connected_device) self.route('/list/devices', callback = self._list_devices) self.route('/download/', callback = self._download_device_data) + self.route('/status/', callback = self._status_device) self.route('/plot/_history.', callback = self._plot_history) self.route('/static/', callback = self._serve_static) if self.debug: self.route('/debug', callback = self._debug_page) @@ -61,13 +61,14 @@ class PlotWebServer(Bottle): self.route('/', callback = self._status_page) def _atg(self, vals): - """ Add template globals """ + """ Add template globals + A wrapper function for the templated routes decorated with a @view() """ vals.update(self.TPL_GLOBALS) return vals @view('status.jinja2') def _status_page(self): - return self._atg({'current_values': self.current_values, 'active': 'status'}) + return self._atg({'device_id': self._connected_device, 'current_values': self.current_values, 'active': 'status'}) @view('about.jinja2') def _about_page(self): @@ -75,7 +76,7 @@ class PlotWebServer(Bottle): @view('plots.jinja2') def _plots_page(self): - return self._atg({'device_id': self._connected_device(), 'active': 'plots'}) + return self._atg({'device_id': self._connected_device, 'active': 'plots'}) @view('debug.jinja2') def _debug_page(self): @@ -105,14 +106,29 @@ class PlotWebServer(Bottle): self._cached_current_values = cur return cur + def _status_device(self, device_id): + assert device_id == self._connected_device + status = self.current_values.to_dict() + status['ts'] = status['ts'].isoformat() + return { + 'success': True, + 'status': status, + } + def _serve_static(self, filename): return static_file(filename, root=os.path.join(PATH, 'static')) + @property def _connected_device(self): + """ As long as the webserver can handle only a single + OPUS20 device, we return this single one here. """ return self.o20.device_id def _list_devices(self): - return dict(devices=self.ps.get_device_ids()) + return { + 'success': True, + 'devices': list(set([self._connected_device]) | set(self.ps.get_device_ids())) + } def _download_device_data(self, device_id): if clock() - self._download_device_data_last_call < 10.0: @@ -170,18 +186,16 @@ class PlotWebServer(Bottle): else: right = right.split(',') #selected_cols = df.columns - selected_cols = set() + selected_cols = [] for measure in measures: for col in df.columns: if measure in col: - selected_cols.add(col) - selected_cols = list(selected_cols) - right_cols = set() + if col not in selected_cols: selected_cols.append(col) + right_cols = [] for col in selected_cols: for measure in right: if measure in col: - right_cols.add(col) - right_cols = list(right_cols) + if col not in right_cols: right_cols.append(col) # / End handling URL query variables fig, ax = plt.subplots(figsize=figsize) diff --git a/opus20/opus20/webapp/static/css/style.css b/opus20/opus20/webapp/static/css/style.css index de1218d..37786d3 100644 --- a/opus20/opus20/webapp/static/css/style.css +++ b/opus20/opus20/webapp/static/css/style.css @@ -13,3 +13,7 @@ body { pre { text-align: left; } + +.chart { + margin: 10px 20px; +} diff --git a/opus20/opus20/webapp/static/js/script.js b/opus20/opus20/webapp/static/js/script.js index dad1e8a..8b13789 100644 --- a/opus20/opus20/webapp/static/js/script.js +++ b/opus20/opus20/webapp/static/js/script.js @@ -1,21 +1 @@ - -$(function(){ - $('#fetchData').on('click', function(){ - var $btn = $(this).button('loading') - $.ajax({ - url: "/download/" + device_id, - type: 'get', - success: function (response) { - //console.log('response received'); - location.reload() - $btn.button('reset') - }, error: function (response) { - console.log('ajax request to fetch data failed'); - alert('ajax request to fetch data failed'); - $btn.button('reset') - }, - }); - }); -}); - diff --git a/opus20/opus20/webapp/views/base.jinja2 b/opus20/opus20/webapp/views/base.jinja2 index b75fade..959195a 100644 --- a/opus20/opus20/webapp/views/base.jinja2 +++ b/opus20/opus20/webapp/views/base.jinja2 @@ -21,7 +21,7 @@ @@ -69,6 +69,10 @@ + + diff --git a/opus20/opus20/webapp/views/plots.jinja2 b/opus20/opus20/webapp/views/plots.jinja2 index c77bb1c..22a9294 100644 --- a/opus20/opus20/webapp/views/plots.jinja2 +++ b/opus20/opus20/webapp/views/plots.jinja2 @@ -2,20 +2,56 @@ {% block title %}Plot{% endblock %} -{% block globals %} +{% block top_javascript %} + var device_id = "{{ device_id }}"; + +$(function(){ + $('#fetchData').on('click', function(){ + var $btn = $(this); + $btn.prop('disabled', true); + var $text = $btn[0].textContent; + $btn.prop('textContent', "Loading..."); + $.ajax({ + url: "/download/" + device_id, + type: 'get', + success: function (response) { + //console.log('response received'); + $btn.prop('disabled', false); + $btn.prop('textContent', $text); + location.reload() + }, error: function (response) { + console.log('ajax request to fetch data failed'); + alert('ajax request to fetch data failed'); + $btn.prop('disabled', false); + $btn.prop('textContent', $text); + }, + }); + }); +}); + + {% endblock %} {% block content %}

Plots of the Environment Values


+

Combined Plot

+

+ +

+

Temperature Plot

+

+ +

+

Relative Humidity Plot

- - +

+

Absolute Humidity Plot

- +

- +

{% endblock %} diff --git a/opus20/opus20/webapp/views/status.jinja2 b/opus20/opus20/webapp/views/status.jinja2 index a892402..4128726 100644 --- a/opus20/opus20/webapp/views/status.jinja2 +++ b/opus20/opus20/webapp/views/status.jinja2 @@ -2,17 +2,55 @@ {% block title %}Status{% endblock %} +{% block top_javascript %} + +var update_every_ms = 2050; +var device_id = "{{ device_id }}"; + +{% endblock %} + +{% block bottom_javascript %} + +function updateStatus() { + $.getJSON("/status/" + device_id, function( data ) { + $("#device_id").text(data.status.device_id); + $("#temperature").text(data.status.temperature.toFixed(1)); + $("#dewpoint").text(data.status.dewpoint.toFixed(1)); + $("#relative_humidity").text(data.status.relative_humidity.toFixed(1)); + $("#absolute_humidity").text(data.status.absolute_humidity.toFixed(1)); + $("#battery_voltage").text(data.status.battery_voltage.toFixed(1)); + $("#timestamp").text(data.status.ts.replace('T', ' - ')); + }); +}; + +function timedUpdate() { + updateStatus(); + setTimeout(function() { + timedUpdate(); + }, update_every_ms); +}; + +$(function() { + // on page load + updateStatus(); + setTimeout(function() { + timedUpdate(); + }, update_every_ms); +}); + +{% endblock %} + {% block content %}

Current Status

-

Device ID: {{ current_values.device_id }}
-
Temperature: {{ current_values.temperature | round(1) }} °C
-
Dewpoint: {{ current_values.dewpoint | round(1) }} °C
-
Relative Humidity: {{ current_values.relative_humidity | round(1) }} %
-
Absolute Humidity: {{ current_values.absolute_humidity | round(1) }} g/m³
-
Battery Voltage: {{ current_values.battery_voltage | round(1) }} V
+
Device ID: {{ current_values.device_id }}
+
Temperature: {{ current_values.temperature | round(1) }} °C
+
Dewpoint: {{ current_values.dewpoint | round(1) }} °C
+
Relative Humidity: {{ current_values.relative_humidity | round(1) }} %
+
Absolute Humidity: {{ current_values.absolute_humidity | round(1) }} g/m³
+
Battery Voltage: {{ current_values.battery_voltage | round(1) }} V

-
Date & Time of this information: {{ current_values.ts.isoformat().replace('T', ' - ') }}
+
Date & Time of this information: {{ current_values.ts.isoformat().replace('T', ' - ') }}