283 lines
16 KiB
HTML
283 lines
16 KiB
HTML
<!--
|
|
todayT.htm v:0.0.1 d:Feb 2021 Neil Thomas
|
|
Last modified: 2022/10/15 11:15:18
|
|
Page: 1 main panel plus a sidebar
|
|
-->
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="weather data">
|
|
<meta name="keywords" content="Cumulus, weather, data, weather station">
|
|
<title>Cumulus MX - Today vs Yesterday</title>
|
|
<link rel="icon" type="image/png" href="images/favicon.png">
|
|
|
|
<!-- jQuery Local -->
|
|
<script src="lib/jquery/jquery-latest.min.js"></script>
|
|
|
|
<!-- Fonts System will default to a sans-serif font if no Internet connection -->
|
|
<link rel="preconnect" href="https://fonts.gstatic.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Rosario:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap" rel="stylesheet">
|
|
|
|
<!-- All Styles -->
|
|
<link href="css/w3Pro.css" rel="stylesheet"> <!-- Basic w3shools responsive styles -->
|
|
<link href="css/colours.css" rel="stylesheet"> <!-- Slightly enhanced w3schools colours -->
|
|
<link href="css/mx-templates.css" rel="stylesheet"> <!-- Specific styles for these templates. -->
|
|
|
|
<!-- Scripts -->
|
|
<script src="js/setpagedata.js"></script> <!-- Utility javascripts for all pages. -->
|
|
</head>
|
|
<body>
|
|
<div id="Header" class="w3-row w3-top w3-theme-dark w3-theme-bdr">
|
|
<div class="w3-row-padding site-width">
|
|
<div class="at-flex-between at-flex-items-center">
|
|
<img src="images/CumulusMX-Logo.png" alt="CumulusmX Logo" class="w3-image logo"/>
|
|
<div class="w3-right-align statusPanel">
|
|
<h5 class="location w3-hide-small">Latitude: <span data-cmxdata="latitude"></span><span class="at-divider">|</span>Longitude: <span data-cmxdata="longitude"></span><span class="at-divider">|</span>Altitude: <span data-cmxdata="altitude"></span></h5>
|
|
<h6 class="location w3-hide-medium w3-hide-large">Lat:<span data-cmxdata="latitude"></span><span class="at-divider">|</span>Lon:<span data-cmxdata="longitude"></span><span class="at-divider">|</span>Alt:<span data-cmxdata="altitude"></span></h6>
|
|
</div>
|
|
</div>
|
|
<!-- Start of Menu -->
|
|
<div id="Main_Menu" class="w3-bar w3-theme-d4 w3-theme-bdr">
|
|
</div>
|
|
<!-- Mobile menu -->
|
|
<div id="Main_Menu_Mobile" class="w3-bar-block w3-hide w3-hide-large">
|
|
</div> <!-- End of Mobile menu -->
|
|
</div>
|
|
</div>
|
|
<div id="Content"> <!-- Start of panel content -->
|
|
<div class="w3-row-padding w3-theme-light site-width"> <!-- Page Title -->
|
|
<div class="w3-col l12">
|
|
<h1>Today vs Yesterday <span class="subText"> (<span data-cmxdata="yesterday"></span>)</span></h1>
|
|
</div>
|
|
</div> <!-- End of title row -->
|
|
<div class="w3-row site-width w3-theme-light"> <!-- Start of Main panel -->
|
|
<div class="w3-col l9 m12"> <!-- 3/4 width panel -->
|
|
<div class="w3-row-padding"> <!-- Row 1 of 3/4 width panel -->
|
|
<div class="w3-col s12"> <!-- Full width of above panel -->
|
|
<div class="w3-panel w3-card w3-theme-white">
|
|
<h2>Today and Yesterday's data</h2>
|
|
<div class="w3-responsive">
|
|
<table class="w3-table w3-hoverable" style="width:100%">
|
|
<tbody>
|
|
<tr class="w3-theme-d5">
|
|
<th style="width:50%">Temperature and Humidity</th>
|
|
<th style="width:10%">Today</th>
|
|
<th style="width:15%"></th>
|
|
<th style="width:10%">Yesterday</th>
|
|
<th style="width:15%"></th>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>High Temperature</td>
|
|
<td><span data-cmxdata="tempTH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TtempTH"></span></td>
|
|
<td><span data-cmxdata="tempYH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TtempYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>Low Temperature</td>
|
|
<td><span data-cmxdata="tempTL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TtempTL"></span></td>
|
|
<td><span data-cmxdata="tempYL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TtempYL"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>Temperature Range</td>
|
|
<td><span data-cmxdata="temprange"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td></td>
|
|
<td><span data-cmxdata="temprangeY"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td></td>
|
|
</tr>
|
|
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
|
|
<td>High Apparent<span class="w3-hide-medium w3-hide-small"> Temperature</span></td>
|
|
<td><span data-cmxdata="apptempTH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TapptempTH"></span></td>
|
|
<td><span data-cmxdata="apptempYH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TapptempYH"></span></td>
|
|
</tr>
|
|
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
|
|
<td>Low Apparent<span class="w3-hide-medium w3-hide-small"> Temperature</span></td>
|
|
<td><span data-cmxdata="apptempTL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TapptempTL"></span></td>
|
|
<td><span data-cmxdata="apptempYL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TapptempYL"></span></td>
|
|
</tr>
|
|
<tr data-cmx-feels class="w3-theme-l2">
|
|
<td>High Feels Like</td>
|
|
<td><span data-cmxdata="feelslikeTH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TfeelslikeTH"></span></td>
|
|
<td><span data-cmxdata="feelslikeYH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TfeelslikeYH"></span></td>
|
|
</tr>
|
|
<tr data-cmx-feels class="w3-theme-l2">
|
|
<td>Low Feels Like</td>
|
|
<td><span data-cmxdata="feelslikeTL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TfeelslikeTL"></span></td>
|
|
<td><span data-cmxdata="feelslikeYL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TfeelslikeYL"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>Low Wind Chill</td>
|
|
<td><span data-cmxdata="wchillTL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwchillTL"></span></td>
|
|
<td><span data-cmxdata="wchillYL"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwchillYL"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>High Heat Index</td>
|
|
<td><span data-cmxdata="heatindexTH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TheatindexTH"></span></td>
|
|
<td><span data-cmxdata="heatindexYH"></span> <span data-cmxdata="tempunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TheatindexYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>High Humidity</td>
|
|
<td><span data-cmxdata="humTH"></span> %</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </spaw3-hide-medium w3-hide-smalln><span data-cmxdata="ThumTH"></span></td>
|
|
<td><span data-cmxdata="humYH"></span> %</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="ThumYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l2">
|
|
<td>Low Humidity</td>
|
|
<td><span data-cmxdata="humTL"></span> %</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="ThumTL"></span></td>
|
|
<td><span data-cmxdata="humYL"></span> %</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="ThumYL"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-d4">
|
|
<td>Rainfall</td>
|
|
<td colspan="2">Today</td>
|
|
<td colspan="2">Yesterday</td>
|
|
</tr>
|
|
<tr class="w3-theme-l3">
|
|
<td>Rainfall</td>
|
|
<td><span data-cmxdata="rfall"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td></td>
|
|
<td><span data-cmxdata="rfallY"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="w3-theme-l3">
|
|
<td>Rainfall Rate<span class="w3-hide-medium w3-hide-small"> Max</span></td>
|
|
<td><span data-cmxdata="rrateTM"></span> <span data-cmxdata="rainunit"></span>/hr</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TrrateTM"></span></td>
|
|
<td><span data-cmxdata="rrateYM"></span> <span data-cmxdata="rainunit"></span>/hr</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TrrateYM"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l3">
|
|
<td><span class="w3-hide-medium w3-hide-small">High </span>Hourly Rainfall</td>
|
|
<td><span data-cmxdata="hourlyrainTH"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="ThourlyrainTH"></span></td>
|
|
<td><span data-cmxdata="hourlyrainYH"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="ThourlyrainYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l3">
|
|
<td><span class="w3-hide-medium w3-hide-small">High </span>24 Hour Rainfall</td>
|
|
<td><span data-cmxdata="rain24hourTH"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="Train24hourTH"></span></td>
|
|
<td><span data-cmxdata="rain24hourYH"></span> <span data-cmxdata="rainunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="Train24hourYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-d3">
|
|
<td>Wind</td>
|
|
<td colspan="2">Today</td>
|
|
<td colspan="2">Yesterday</td>
|
|
</tr>
|
|
<tr class="w3-theme-l4">
|
|
<td>Highest Gust</td>
|
|
<td><span data-cmxdata="wgustTM"></span> <span data-cmxdata="windunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwgustTM"></span></td>
|
|
<td><span data-cmxdata="wgustYM"></span> <span data-cmxdata="windunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwgustYM"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l4">
|
|
<td>Highest Avg Speed</td>
|
|
<td><span data-cmxdata="windTM"></span> <span data-cmxdata="windunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwindTM"></span></td>
|
|
<td><span data-cmxdata="windYM"></span> <span data-cmxdata="windunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TwindYM"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l4">
|
|
<td>Wind Run</td>
|
|
<td><span data-cmxdata="windrun"></span> <span data-cmxdata="windrununit"></span></td>
|
|
<td></td>
|
|
<td><span data-cmxdata="windrunY"></span> <span data-cmxdata="windrununit"></span></td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="w3-theme-l4">
|
|
<td>Dominant Direction</td>
|
|
<td><span data-cmxdata="domwindbearing"></span>° <span data-cmxdata="domwinddir"></span></td>
|
|
<td></td>
|
|
<td><span data-cmxdata="domwindbearingY"></span>° <span data-cmxdata="domwinddirY"></span></td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="w3-theme-d2">
|
|
<td>Pressure (sea level)</td>
|
|
<td colspan="2">Today</td>
|
|
<td colspan="2">Yesterday</td>
|
|
</tr>
|
|
<tr class="w3-theme-l5">
|
|
<td>High Pressure</td>
|
|
<td><span data-cmxdata="pressTH"></span> <span data-cmxdata="pressunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TpressTH"></span></td>
|
|
<td><span data-cmxdata="pressYH"></span> <span data-cmxdata="pressunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TpressYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l5">
|
|
<td>Low Pressure</td>
|
|
<td><span data-cmxdata="pressTL"></span> <span data-cmxdata="pressunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TpressTL"></span></td>
|
|
<td><span data-cmxdata="pressYL"></span> <span data-cmxdata="pressunit"></span></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TpressYL"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-d1 w3-hide" data-cmx-solar>
|
|
<td>Solar</td>
|
|
<td colspan="2">Today</td>
|
|
<td colspan="2">Yesterday</td>
|
|
</tr>
|
|
<tr class="w3-theme-l6 w3-hide" data-cmx-solar>
|
|
<td>High Solar Radiation</td>
|
|
<td><span data-cmxdata="solarTH"></span> W/m<sup>2</sup></td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TsolarTH"></span></td>
|
|
<td><span data-cmxdata="solarYH"></span> W/m²</td>
|
|
<td><span class="w3-hide-medium w3-hide-small">at </span><span data-cmxdata="TsolarYH"></span></td>
|
|
</tr>
|
|
<tr class="w3-theme-l6 w3-hide" data-cmx-solar>
|
|
<td>Hours of Sunshine</td>
|
|
<td><span data-cmxdata="SunshineHours"></span> hrs</td>
|
|
<td></td>
|
|
<td><span data-cmxdata="YSunshineHours"></span> hrs</td>
|
|
<td></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<p class="w3-small">Page data updated <span data-cmxdata="update"></span>.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="w3-col l3 m12"> <!-- Start of Sidebar 1/4 screen width -->
|
|
<div class="w3-row-padding">
|
|
<div class="w3-col l12"> <!-- Full width of sidebar -->
|
|
<div class="w3-panel w3-container w3-theme-light">
|
|
<h3 class="w3-center">Welcome to <br/><span class="subText"><span data-cmxdata="longlocation"></span></span></h3>
|
|
<p>This page shows the highs, lows and current values for today and yesterday.<br>
|
|
This page is updated every <span data-cmxdata="interval"></span> minutes. The meteorological day used <span class="w3-hide-medium w3-hide-small">at </span>this station ends at
|
|
<span data-cmxdata="rollovertime"></span>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> <!-- End of panel content -->
|
|
</div> <!-- End of content -->
|
|
<!-- Footer -->
|
|
<div id="Footer" class="w3-row w3-bottom w3-theme-dark w3-theme-bdr">
|
|
<div class="w3-row-padding site-width">
|
|
<p><em>Cumulus MX Template by Neil Thomas <script>document.write(new Date().getFullYear());</script>
|
|
<span class="w3-right">Powered by <span class="w3-theme-txt">Cumulus MX</span> v:<span data-cmxdata="version"></span>, b:<span data-cmxdata="build"></span></span></em></p>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |