##// END OF EJS Templates
piura :: templates files update - proc
jespinoza -
r487:544c94befb82
parent child
Show More
@@ -0,0 +1,2
1 <div id='error_pow' class="d-flex flex-row"></div>
2 {% asset 'static/js/error/style_error.js' %}
@@ -0,0 +1,13
1 <div class="card-body right-dashboard-item">
2 <div class="row w-100">
3 <div class="col pt-3">
4 {#<label for="textarea_ch0" class="label-title-ch d-block text-center w-100">CH0</label>#}
5 <label for="textarea_ch0">CH0</label>
6 <textarea id="textarea_ch0" class="form-control mb-3" rows="8" style="width: 100%;"></textarea>
7 {#<label for="textarea_ch1" class="label-title-ch d-block text-center w-100">CH1</label>#}
8 <label for="textarea_ch1" >CH1</label>
9 <textarea id="textarea_ch1" class="form-control mb-3" rows="8" style="width: 100%;"></textarea>
10 </div>
11 </div>
12 </div>
13 {% asset 'static/js/logs/style_logs.js' %}
@@ -0,0 +1,11
1 {% asset 'static/css/map/leaflet.css' %}
2 {% asset 'static/css/map/style.css' %}
3
4 <div id="turfMap" class="card-body right-dashboard-item">
5 <div id="chart1"></div>
6 </div>
7
8 {% asset 'static/js/map/popper.min.js' %}
9 {% asset 'static/js/map/leaflet.js' %}
10 {% asset 'static/js/map/turf.min.js' %}
11 {% asset 'static/js/map/style.js' %}
@@ -0,0 +1,12
1 <div class="card-header d-flex justify-content-between align-items-center">
2 <h5><i class="fa-solid fa-rotate"></i>Pedestal Position</h5>
3 <div>
4 <button type="button" id="toggle-pos-primary" class="btn btn-outline-primary" data-mdb-ripple-init data-mdb-ripple-color="dark">Azimuth</button>
5 <button type="button" id="toggle-pos-danger" class="btn btn-outline-danger" data-mdb-ripple-init data-mdb-ripple-color="dark">Elevation</button>
6 </div>
7 </div>
8 <div class="card-body left-dashboard-item">
9 <div id='indicator-pos'class="additionalContent"></div>
10 <div id='plot-pos' class="additionalContent"></div>
11 </div>
12 {% asset 'static/js/plots/style_position.js' %}
@@ -0,0 +1,12
1 <div class="card-header d-flex justify-content-between align-items-center">
2 <h5><i class="fa-solid fa-bolt"></i>SSPA's Power</h5>
3 <div>
4 <button type="button" id="toggle-pow-primary" class="btn btn-outline-primary" data-mdb-ripple-init data-mdb-ripple-color="dark">Power A</button>
5 <button type="button" id="toggle-pow-danger" class="btn btn-outline-danger" data-mdb-ripple-init data-mdb-ripple-color="dark">Power B</button>
6 </div>
7 </div>
8 <div class="card-body left-dashboard-item">
9 <div id='indicator-pow'class="additionalContent"></div>
10 <div id='plot-pow' class="additionalContent"></div>
11 </div>
12 {% asset 'static/js/plots/style_power.js' %}
@@ -0,0 +1,12
1 <div class="card-header d-flex justify-content-between align-items-center">
2 <h5><i class="fa-solid fa-gauge-high"></i>Pedestal Speed</h5>
3 <div>
4 <button type="button" id="toggle-vel-primary" class="btn btn-outline-primary" data-mdb-ripple-init data-mdb-ripple-color="dark">AZ Speed</button>
5 <button type="button" id="toggle-vel-danger" class="btn btn-outline-danger" data-mdb-ripple-init data-mdb-ripple-color="dark">EL Speed</button>
6 </div>
7 </div>
8 <div class="card-body left-dashboard-item">
9 <div id='indicator-vel'class="additionalContent"></div>
10 <div id='plot-vel' class="additionalContent"></div>
11 </div>
12 {% asset 'static/js/plots/style_velocity.js' %}
@@ -1,68 +1,94
1 {% extends "bootstrap/base.html" %}
1 <!DOCTYPE html>
2 {% block title %}SOPHY monitor{% endblock %}
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>SOPHy monitor</title>
7 <link rel="shortcut icon" href="static/css/logo/igp.ico">
8 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9 {% asset 'static/css/bootstrap.min.css' %}
10 {% asset 'static/css/style.css' %}
3
11
4 {% block styles %}
12 {% asset 'static/js/jquery-3.5.1.slim.min.js' %}
5 {{ super() }}
13 {% asset 'static/js/bootstrap.min.js' %}
6 {% endblock %}
14 {% asset 'static/js/plots/plotly-latest.min.js' %}
7
15 {% asset 'static/js/socket.io.min.js' %}
8 {% block scripts %}
16 {% asset 'static/js/style.js' %}
9 {{ super() }}
17 </head>
10 <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/4.4.1/socket.io.min.js"></script>
18 <body>
11 <script type="text/javascript" charset="utf-8">
19 <div class="container-fluid">
12 $(document).ready(function() {
20 <div class="row">
13 var socket = io.connect('http://' + document.domain + ':' + location.port);
21 <div class="col-lg-12">
14
22 <div class="d-flex justify-content-between align-items-center mb-3">
15 socket.on('connect', function(data) {
23 <div class="d-flex justify-content-center"><a href="https://www.gob.pe/igp">
16 console.log('Connecting... OK');
24 <img src="static/css/logo/igp.png" alt="IGP">
17 })
25 </a>
18 socket.on('mqtt_message', function(data) {
26 <h1 class='ml-2'>SOPHy monitor</h1></div>
19 console.log(data.topic);
27 {% snippet 'error.html'%}
20 if (data['topic'].includes('rawch0')) {
28 </div>
21 var payload = JSON.parse(data.payload);
29 </div>
22 console.log(payload);
23 }
24 else if (data['topic'].includes('rawch1')) {
25 var payload = JSON.parse(data.payload);
26 console.log(payload);
27 }
28 else{}
29 })
30 });
31
32 </script>
33 {% endblock %}
34
35 {% block content %}
36 <div class="container-fluid">
37 <div class="row">
38 <div class="col-xs-12">
39 <h1>SOPHy monitor</h1>
40 </div>
41 </div>
42 <div class="row">
43 <!--Messages-->
44 <div class="col-xs-12">
45 <div class="panel panel-default">
46 <div class="panel-heading">
47 <h3 class="panel-title">MQTT</h3>
48 </div>
30 </div>
49 <div class="panel-body">
31 <div class="row">
50 <div class="col-xs-12">
32 <div class="col-lg-8">
51 <div class="row">
33 <div class="card">
52 <div class="form-horizontal">
34 {% snippet 'position.html' %}
53 <div class="form-group">
35 </div>
54 <div class="col-xs-12">
36 <div class="card">
55 <label for="mqtt_acq">Log Message</label>
37 {% snippet 'velocity.html' %}
56 <textarea id="mqtt_acq" class="form-control" rows=10></textarea>
38 </div>
57 </div>
39 <div class="card">
40 {% snippet 'power.html' %}
58 </div>
41 </div>
59 </div>
42 </div>
60 </div>`
43 <div class="col-lg-4">
61 </div>
44 <div class="card">
45 <div class="card-header">
46 <h5><i class="fa-regular fa-folder"></i>Experiment Name</h5>
47 </div>
48 <div class="card-body right-dashboard-item">
49 <div id="experiment_name"><h5 class='pt-2'>{{ experiment_name }}</h5></div>
50 </div>
51 {% asset 'static/js/name/style_name.js' %}
52 </div>
53 <div class="card">
54 <div class="card-header">
55 <h5><i class="fa-regular fa-map"></i>Locations</h5>
56 </div>
57 {% snippet 'map.html' %}
58 </div>
59 <div class="card">
60 <div class="card-header">
61 <h5><i class="fa-solid fa-cloud"></i>Parameters</h5>
62 </div>
63 <div class="card-body right-dashboard-item">
64 {% set parameters_label = {'Z':'reflectivity',
65 'W':'spectral_width',
66 'V': 'velocity',
67 'S': 'power',
68 'P': 'phi_dp',
69 'D': 'zdr',
70 'R': 'rho_hv'} %}
71
72 {% if parameters is string %}
73 <div id="parameters"><h5 class='pt-2'>{{ parameters }}</h5></div>
74 {% else %}
75 <div id="parameters" class="row w-100 d-flex justify-content-center">
76 {% for parameter in parameters %}
77 <a href="https://www.igp.gob.pe/observatorios/radio-observatorio-jicamarca/realtime/plot/400/{{parameters_label[parameter]}}" class="btn btn-outline-primary btn m-2" data-mdb-ripple-init data-mdb-ripple-color="dark" target="_blank">{{parameters_label[parameter]|replace('_', ' ')|title}}</a>
78 {% endfor %}
79 </div>
80 {% endif %}
81 </div>
82 {% asset 'static/js/parameters/style_parameters.js' %}
83 </div>
84 <div class="card">
85 <div class="card-header">
86 <h5><i class="fa-solid fa-filter"></i>Rx Logs</h5>
87 </div>
88 {% snippet 'logs.html' %}
89 </div>
90 </div>
62 </div>
91 </div>
63 </div>
92 </div>
64 </div>
93 </body>
65 </div>
94 </html>
66 </div>
67 {{debug}}
68 {% endblock %} No newline at end of file
General Comments 0
You need to be logged in to leave comments. Login now