Add instrument status to the buoy pages

ddb13af6 · David Hoese · 8beb6e6b · ddb13af6 · ddb13af6 · ddb13af6
Verified Commit ddb13af6 authored 3 years ago by David Hoese
--- a/content/pages/buoy_meteorogram.html
+++ b/content/pages/buoy_meteorogram.html
@@ -14,6 +14,7 @@
 <div id="content">
    <div class="container">
        <h2 class="row">Meteorogram</h2>
+        <h3>Status: <span id="instrument_status" class="instrument_status_nominal" data-status-stem="mendota/buoy">Loading...</span></h3>
        <div class="row" style="padding:0 1em">
            <h4 class="col-sm-12">Timeframe</h4>
            <div class="col-sm-12">

--- a/content/pages/instruments/mendota/buoy.html
+++ b/content/pages/instruments/mendota/buoy.html
@@ -16,6 +16,7 @@
        <div class="row">
            <div class="col-sm-8">
                <h1>Lake Mendota Buoy</h1>
+                <h3>Status: <span id="instrument_status" class="instrument_status_nominal" data-status-stem="mendota/buoy">Loading...</span></h3>
                <p>The Lake Mendota buoy project is a collaboration between the <a href="http://www.limnology.wisc.edu/">University of Wisconsin Limnology</a>, <a href="http://www.ssec.wisc.edu">Space Science and Engineering Center</a> (SSEC) and <a href="https://www.engr.wisc.edu/department/civil-environmental-engineering/">Environmental Engineering</a>. The buoy measurements provide researchers valuable information to better understand the biological process governing the health of the lake and the impact of human activity on water quality. The buoy is located approximately 1.5 km North East of Picnic Point. The buoy measures both atmospheric and lake properties including: <ul><li>Wind Direction and Speed</li><li>Air Temperature</li><li>Dew Point/Relative Humidity</li><li>Vertical Profile of Water Temperature</li><li>Dissolved Oxygen</li><li>Chlorophyll</li><li>Phycocyanin.</li></ul> This site provides public access to the current lake conditions.
                <p>
                    <a class="btn btn-default btn-lg" href="/file_download">Order Files &raquo;</a>

--- a/content/pages/instruments/mendota/buoy_text_popup.html
+++ b/content/pages/instruments/mendota/buoy_text_popup.html
@@ -11,6 +11,7 @@
 </head>
 <body>
 <div class="instrument">
+    <h3 class="text-center">Status: <span id="instrument_status" class="instrument_status_nominal" data-status-stem="mendota/buoy">Loading...</span></h3>
    <div id="graph" class="text-center"></div>
 </div>
 <script src="{static}/js/moment.min.js"></script>

--- a/themes/rain-theme/static/css/instrument.css
+++ b/themes/rain-theme/static/css/instrument.css
+/* Instrument Status classes */
+span.instrument_status_nominal {
+    color: green;
+}
+span.instrument_status_warning {
+    color: yellow;
+}
+span.instrument_status_error {
+    color: red;
+}
--- a/themes/rain-theme/templates/page.html
+++ b/themes/rain-theme/templates/page.html
 {% extends "base.html" %}
 {% block title %}{{ page.title }}{% endblock %}
+{% block header %}
+    {{ super() }}
+    <!--Instrument Page Header-->
+    <link href="/theme/css/instrument.css" rel="stylesheet" type="text/css">
+    <script type="text/javascript">
+        $(document).ready(function(){
+            var statusElem = $("#instrument_status");
+            if (statusElem.length == 0) {
+                return;
+            }
+            $.ajax({
+                type: 'GET',
+                url: METOBS_API_URL + "/api/status/" + statusElem.attr("data-status-stem") + ".json",
+                jsonp: "callback",
+                dataType: "json",
+                success: function(dataObj){
+                    statusElem.text(dataObj.status_message);
+                    if ((dataObj.status_code & 16) > 0) {
+                        statusElem.removeClass("instrument_status_nominal");
+                        statusElem.addClass("instrument_status_error");
+                    } else if ((dataObj.status_code & 8) > 0) {
+                        statusElem.removeClass("instrument_status_nominal");
+                        statusElem.addClass("instrument_status_warning");
+                    }
+                }
+            });
+        });
+    </script>
+{% endblock %}
 {% block content %}
    {% include page.url[:-1] + "_header.html" ignore missing %}
    {{page.content}}