RoscoeDaWah/wahs-the-weather
RoscoeDaWah/wahs-the-weather
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: RoscoeDaWah:b856cb894f734d92b275e8caba5c56b45d54656c
Branches Tags
RoscoeDaWah:master
..
compare: RoscoeDaWah:d719a3af9a2cdd4ecd5ad655d4f21f5244ee3ff9
Branches Tags
RoscoeDaWah:master

2 commits
b856cb894f ... d719a3af9a

Author SHA1 Message Date
floppydiskette
d719a3af9a
Add editorconfig, remove unused assets 2024-12-11 23:10:01 +00:00
floppydiskette
98bad33895
Add today and yesterday pages 2024-12-11 23:05:59 +00:00
25 changed files with 6867 additions and 7759 deletions
Show stats Expand all files Collapse all files

8
.editorconfig Normal file
View file

@ -0,0 +1,8 @@
root = true
[*]
end_of_line = lf
insert_final_newline = true
indent_style = space
indent_size = 4
charset = utf-8

40
css/colours.css
View file

@ -1,40 +0,0 @@
/* -------------------------------------------------------------------
* Colours for the CumulusMX Alternative Interface
* Produced using w3Schools colour generator
*
* Key Colour: #4e5b31
*
* Theme modified to change font 'color's to either lightest or darkest
* theme colour. Also modified names for text, borders & hover colours.
* I have added a few extras. Not all are used.
* Neil Thomas
------------------------------------------------------------------*/
/* Check that your theme is named as shown below */
.w3-theme-white {color:#2e5473; background-color:#FFFFFF;}
.w3-theme-l5 {color:#2e5473; background-color:#f7fafc;}
.w3-theme-l4 {color:#2e5473; background-color:#e4edf4;}
.w3-theme-l3 {color:#2e5473 ; background-color:#c9dbe9;}
.w3-theme-l2 {color:#2e5473 ; background-color:#aec9df;}
.w3-theme-l1 {color:#2e5473 ; background-color:#93b7d4;}
.w3-theme-d1 {color:#f7fafc ; background-color:#6195c0;}
.w3-theme-d2 {color:#f7fafc ; background-color:#4a86b7;}
.w3-theme-d3 {color:#f7fafc ; background-color:#4075a1;}
.w3-theme-d4 {color:#f7fafc ; background-color:#37658a;}
.w3-theme-d5 {color:#f7fafc ; background-color:#2e5473;}
.w3-theme-light {color:#2e5473 ; background-color:#f7fafc;}
.w3-theme-dark {color:#f7fafc ; background-color:#2e5473;}
.w3-theme-action {color:#f7fafc ; background-color:#2e5473;}
.w3-theme {color:#f7fafc ; background-color:#78a5c9;}
.w3-theme-txt {color:#78a5c9;}
.w3-theme-bdr {border-color:#78a5c9;}
.w3-theme-d5-bdr {border-color:#2e5473;}
.w3-theme-l1-bdr {border-color:#f7fafc;}
.w3-theme-hvr:hover {color:#f7fafc; background-color:#78a5c9;}
.w3-theme-d5-hvr:hover {color:#f7fafc; background-color:#2e5473;}
.w3-theme-txt-hvr:hover {color:#78a5c9;}
.w3-theme-bdr-hvr:hover {border-color:#78a5c9;}

27
css/gauges.css
View file

File diff suppressed because one or more lines are too long

249
css/mx-templates.css
View file

@ -1,249 +0,0 @@
/* -----------------------------------
* Styles for CumulusMX Templates
Last modified: 2021/03/19 09:23:15
* ----------------------------------*/
html,
body,
p,
h1,
h2,
h3,
h4,
h5,
h6,
li,
td,
th {
font-family: "Rosario", sans-serif;
}
p {
font-size: 15px;
}
#Header {
border-style: solid;
border-width: 0 0 10px 0;
}
.site-width {
max-width: 1140px;
margin: auto;
}
.graph-width {
max-width: 1250px;
margin: auto;
}
#Footer {
border-width: 5px 0 0 0;
border-style: solid;
}
.logo {
max-width: 250px;
margin: 5px 0 5px 16px;
}
.subText {
font-size: 80% !important;
font-weight: 400;
}
body {
background-image: url("../images/picture.jpg");
background-position: bottom left;
background-repeat: no-repeat;
background-attachment: fixed;
}
.statusPanel h5 {
margin-bottom: -5px;
}
/* -------------------------------------
* Flex boxes
* -------------------------------------*/
.at-flex-start {
display: flex;
}
.at-flex-end {
display: flex;
justify-content: flex-end;
flex-wrap: wrap;
}
.at-flex-justify {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
.at-flex-between {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.at-flex-bottom,
.at-flex-items-bottom {
align-items: flex-end;
}
.at-flex-items-center {
align-items: center;
}
/* --------------------------------------------------
* Menu enhancements
* --------------------------------------------------*/
#Main_Menu {
margin-bottom: 4px;
border-width: 2px 0 0 0;
border-style: solid;
min-height: 32px;
}
.at-slim {
padding: 4px 14px !important;
}
.at-divider {
margin: 0 5px;
color: #f80;
}
.at-spacer {
min-height: 2em;
}
.at-menu-lable {
display: block;
width: 100%;
font-size: 13px;
font-style: italic;
padding-bottom: 2px !important;
padding-top: 4px !important;
border-bottom: 1px dotted #c2cfa5 !important;
}
.at-menu-bar {
display: block;
height: 2px;
padding: 0 2px !important;
}
.at-indent {
padding-left: 40px !important;
}
/* -------------------------------
* Model enhancements
* ------------------------------*/
.w3-modal-content {
margin-top: 10%;
border-radius: 8px;
}
.w3-modal header {
border-radius: 8px 8px 0 0;
}
.w3-modal footer {
border-radius: 0 0 8px 8px;
}
.w3-modal .w3-btn {
border-radius: 0 8px;
}
/* ----------------------------------------
* Media enhancements
* ---------------------------------------*/
@media screen and (max-width: 780px) {
#Footer {
position: unset;
}
#Content {
/*margin-top: 170px!important;*/
margin-bottom: 5px !important;
}
.statusPanel {
text-align: center !important;
margin: auto !important;
}
}
@media screen and (max-height: 768px) {
#Footer {
position: unset;
item: center;
}
#Content {
margin-bottom: 5px !important;
}
}
/* --------------------------------------
* LED enhancements
* -------------------------------------*/
.at-led-round {
display: inline-block;
height: 1.2em;
width: 1.2em;
margin: 0 0.5em -3px 0.5em;
border-radius: 50%;
background-color: #888;
box-shadow: inset 3px 3px 2px rgba(220, 220, 220, 0.6),
inset -2px -2px 2px rgba(32, 32, 32, 0.6);
}
.at-led-block {
display: inline-block;
height: 1.2em;
width: 1.2em;
margin: 0 0.5em -3px 0.5em;
background-color: #888;
box-shadow: inset 3px 3px 2px rgba(220, 220, 220, 0.6),
inset -2px -2px 2px rgba(32, 32, 32, 0.6);
}
.at-led-brick {
display: inline-block;
height: 0.8em;
width: 1.6em;
margin: 0 0.5em -3px 0.5em;
background-color: #888;
box-shadow: inset 3px 3px 2px rgba(220, 220, 220, 0.6),
inset -2px -2px 2px rgba(32, 32, 32, 0.6);
}
.at-led-oval {
display: inline-block;
height: 1em;
width: 2em;
margin: 0 0.5em -3px 0.5em;
border-radius: 50%;
background-color: #888;
box-shadow: inset 3px 3px 2px rgba(220, 220, 220, 0.6),
inset -2px -2px 2px rgba(32, 32, 32, 0.6);
}
.at-led-green {
background-color: #0b0;
}
.at-led-flash-red {
animation: flashR 1s infinite;
}
@keyframes flashR {
0%,
60% {
background-color: #f00;
}
61%,
100% {
background-color: #800;
}
}

247
css/w3Pro.css
View file

@ -1,247 +0,0 @@
/* W3PRO.CSS 4.15 December 2020 by Jan Egil and Borge Refsnes */
html {
box-sizing: border-box;
}
*,
*:before,
*:after {
box-sizing: inherit;
}
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
display: block;
}
summary {
display: list-item;
}
audio,
canvas,
progress,
video {
display: inline-block;
}
progress {
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background-color: transparent;
}
a:active,
a:hover {
outline-width: 0;
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
text-decoration: underline dotted;
}
b,
strong {
font-weight: bolder;
}
dfn {
font-style: italic;
}
mark {
background: #ff0;
color: #000;
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
figure {
margin: 1em 40px;
}
img {
border-style: none;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}
button,
input,
select,
textarea,
optgroup {
font: inherit;
margin: 0;
}
optgroup {
font-weight: bold;
}
button,
input {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
color: inherit;
display: table;
max-width: 100%;
padding: 0;
white-space: normal;
}
textarea {
overflow: auto;
}
[type="checkbox"],
[type="radio"] {
padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
/* End extract */
html,
body {
font-family: Verdana, sans-serif;
font-size: 15px;
line-height: 1.5;
}
html {
overflow-x: hidden;
}
h1 {
font-size: 36px;
}
h2 {
font-size: 30px;
}
h3 {
font-size: 24px;
}
h4 {
font-size: 20px;
}
h5 {
font-size: 18px;
}
h6 {
font-size: 16px;
}
.w3-serif {
font-family: serif;
}
.w3-sans-serif {
font-family: sans-serif;
}
.w3-cursive {
font-family: cursive;
}
.w3-monospace {
font-family: monospace;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Segoe UI", Arial, sans-serif;
font-weight: 400;
margin: 10px 0;
}
.w3-wide {
letter-spacing: 4px;
}
hr {
border: 0;
border-top: 1px solid #eee;
margin: 20px 0;
}
.w3-image {
max-width: 100%;
height: auto;
}
img {
vertical-align: middle;
}
a {
color: inherit;
}

41
css/wah.css
View file

@ -94,6 +94,20 @@ div.page-container > div:last-child {
margin-bottom: 0;
}
div#header {
display: grid;
grid-template-columns: 66px 1fr;
grid-template-rows: 1fr;
grid-column-gap: 15px;
grid-row-gap: 0px;
}
div#header img {
filter: drop-shadow(2px 2px hsl(0, 0%, 66%));
margin-right: 10px;
image-rendering: pixelated;
}
div#header h1 {
margin: 0;
font-style: italic;
@ -118,8 +132,8 @@ div#footer {
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
grid-column-gap: 0;
grid-row-gap: 0;
align-items: center;
}
@ -127,14 +141,6 @@ div#footer div:last-child {
text-align: right;
}
div#footer div:last-child img {
image-rendering: pixelated;
margin: 0;
padding: 0;
width: 88px;
height: 31px;
}
/* -------------------------------------------------------------------------- */
table.almanac td:nth-child(odd) {
@ -153,32 +159,33 @@ table.almanac {
min-width: 100%;
}
table.conditions-now {
table.mx-datatable {
width: 100%;
border-collapse: collapse;
border: var(--border);
filter: var(--shadow-small);
background-color: var(--background);
}
table.conditions-now th {
table.mx-datatable th {
text-align: left;
background-color: var(--background-dim);
border-top: var(--border);
}
table.conditions-now tr td,
table.conditions-now tr th {
table.mx-datatable tr td,
table.mx-datatable tr th {
padding: 5px 10px 5px 5px;
}
table.conditions-now tr td:nth-child(2) {
table.mx-datatable tr td:nth-child(2) {
padding-right: 40px;
}
table.conditions-now tr td:nth-child(odd) {
table.current-conditions tr td:nth-child(odd) {
font-weight: bold;
}
table.conditions-now tr:last-child td:nth-child(3) {
table.current-conditions tr:last-child td:nth-child(3) {
font-weight: normal;
font-style: italic;
}

BIN
images/CumulusMX-Logo.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 22 KiB

BIN
images/favicon.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 57 KiB

BIN
images/logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 22 KiB

BIN
images/picture.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 13 KiB

12
includes/footer.inc.php Normal file
View file

@ -0,0 +1,12 @@
<div id="footer">
<div>
<span>
&copy; floppydisk 2021-<?= date("Y") ?>
</span>
</div>
<div>
<span>
Powered by Cumulus MX v:<span data-cmxdata="version"></span>, b:<span data-cmxdata="build"></span>
</span>
</div>
</div>

14
includes/head.inc.php Normal file
View file

@ -0,0 +1,14 @@
<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</title>
<link rel="icon" type="image/png" href="/images/favicon.png">
<script src="/lib/jquery/jquery-latest.min.js"></script>
<!-- All Styles -->
<link href="/css/wah.css" rel="stylesheet"> <!-- Specific styles for these templates. -->
<!-- Scripts -->
<script src="/js/setpagedata.js"></script> <!-- Utility javascripts for all pages. -->

19
includes/header.inc.php Normal file
View file

@ -0,0 +1,19 @@
<div id="header">
<div>
<img src="/images/logo.png" width="65">
</div>
<div>
<h1>wah's the weather?</h1>
<nav>
<strong>Pages:</strong>
<a href="/">now</a> |
<a href="/today">today</a> |
<a href="/yesterday">yesterday</a> |
<a href="/todayyest">today-yest</a> |
<a href="/gauges">gauges</a> |
<a href="/records">records</a> |
<a href="/charts">charts</a> |
<a href="/reports">reports</a>
</nav>
</div>
</div>

60
index.php
View file

@ -2,26 +2,13 @@
<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</title>
<link rel="icon" type="image/png" href="images/favicon.png">
<script src="lib/jquery/jquery-latest.min.js"></script>
<!-- All Styles -->
<link href="css/wah.css" rel="stylesheet"> <!-- Specific styles for these templates. -->
<!-- Scripts -->
<script src="js/setpagedata.js"></script> <!-- Utility javascripts for all pages. -->
<?php include("./includes/head.inc.php"); ?>
<script>
window.onload = () => {
$('#moonImg').attr('src', 'images/moon.png?' + Date.now());
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
// update the moon image every 20 minutes if the page is left open
setInterval(() => {
$('#moonImg').attr('src', 'images/moon.png?' + Date.now());
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
}, 1200000);
};
</script>
@ -29,20 +16,7 @@
<body>
<div class="page-container">
<div id="header">
<h1>wah's the weather?</h1>
<nav>
<strong>Pages:</strong>
<a href="/">now</a> |
<a href="">today</a> |
<a href="">yesterday</a> |
<a href="">today-yest</a> |
<a href="">gauges</a> |
<a href="">records</a> |
<a href="">charts</a> |
<a href="">reports</a>
</nav>
</div>
<?php include("./includes/header.inc.php"); ?>
<div id="content">
<h3>Almanac</h3>
<table class="almanac">
@ -55,8 +29,8 @@
<td>Moon Rise:</td>
<td><span data-cmxdata="moonrise"></span></td>
<td rowspan="3" style="width:75px; height: 75px; padding:0"><img id="moonImg"
src="images/moon.png" alt="Moon" width="75" height="75" class="w3-image" />Visible <span
data-cmxdata="MoonPercentAbs"></span>%
src="/images/moon.png" alt="Moon" width="75" height="75" class="w3-image" />Visible
<span data-cmxdata="MoonPercentAbs"></span>%
</td>
</tr>
<tr>
@ -79,7 +53,7 @@
</table>
<br><br>
<h3>Conditions at local time <span data-cmxdata="time"></span></h3>
<table class="conditions-now">
<table class="mx-datatable current-conditions">
<tr>
<th colspan="4">Temperature and Humidity</th>
</tr>
@ -108,7 +82,8 @@
</tr>
<tr>
<td>Temp change last hour</td>
<td><span data-cmxdata="TempChangeLastHour"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td><span data-cmxdata="TempChangeLastHour"></span>&nbsp;<span data-cmxdata="tempunit"></span>
</td>
<td></td>
<td></td>
</tr>
@ -177,22 +152,13 @@
<td><span data-cmxdata="press"></span>&nbsp;<span data-cmxdata="pressunit"></span>
</td>
<td><span data-cmxdata="presstrend"></span></td>
<td><span data-cmxdata="presstrendval"></span>&nbsp;<span data-cmxdata="pressunit"></span>/hr</td>
<td><span data-cmxdata="presstrendval"></span>&nbsp;<span data-cmxdata="pressunit"></span>/hr
</td>
</tr>
</table>
<small>Page data updated <span data-cmxdata="update"></span></small>
</div>
<div id="footer">
<div>
<span>
&copy; floppydisk 2021-2024
</span>
</div>
<div>
<span>
Powered by Cumulus MX v:<span data-cmxdata="version"></span>, b:<span data-cmxdata="build"></span>
</span>
</div>
</div>
<?php include("./includes/footer.inc.php"); ?>
</div>
</body>

2
js/menuSample.js
View file

@ -38,7 +38,7 @@ menuSrc = [
{ title: "Cumulus Forum", menu: "w", url: "#", forum: true, new_window: true },
{ title: "Webcam", menu: "b", url: "#", webcam: true, new_window: true },
{ title: "My Cat", menu: "b", url: "mycatpage.htm" },
{ title: "Some Cat", menu: "b", url: "https://pixnio.com/free-images/2020/07/26/2020-07-26-08-52-19-1200x1200.jpg", new_window: true }
{ title: "Some Cat", menu: "b", url: "https://pixnio.com/free-/images/2020/07/26/2020-07-26-08-52-19-1200x1200.jpg", new_window: true }
]
}
];

2
js/setpagedata.js
View file

@ -14,7 +14,7 @@ let fixedHeader = false; // Use only true or false
let fixedFooter = true; // Use only true or false
let headerMargin = 20; // Gap between the header and the main body
let footerMargin = 10; // Gap between the body and the footer
let load_menu = "js/menu.js"; // menu file to load - path is relative to the page
let load_menu = "/js/menu.js"; // menu file to load - path is relative to the page
// Thats the only changes you should make unless you know better!

2
lib/steelseries/scripts/RGraph.rose.min.js vendored
View file

File diff suppressed because one or more lines are too long

33
lib/steelseries/scripts/gauges.js
View file

@ -38,7 +38,7 @@ gauges = (function () {
// Script configuration parameters you may want to 'tweak'
scriptVer: '2.7.7',
weatherProgram: 0, // Set 0=Cumulus, 1=Weather Display, 2=VWS, 3=WeatherCat, 4=Meteobridge, 5=WView, 6=WeeWX, 7=WLCOM
imgPathURL : './images/', // *** Change this to the relative path for your 'Trend' graph images
imgPathURL: './/images/', // *** Change this to the relative path for your 'Trend' graph /images
oldGauges: 'gauges.htm', // *** Change this to the relative path for your 'old' gauges page.
realtimeInterval: 15, // *** Download data interval, set to your realtime data update interval in seconds
longPoll: false, // if enabled, use long polling and PHP generated data !!only enable if you understand how this is implemented!!
@ -77,7 +77,7 @@ gauges = (function () {
realTimeUrlWeewx: 'gauge-data.txt', // *** WeeWX Users: Change to your location of the gauge data file ***
realTimeUrlWLCOM: 'WLrealtimegauges.php', // *** WLCOM Users: change to location of WLCOMtags.php file ***
useCookies: true, // Persistently store user preferences in a cookie?
tipImages : [],
tip/ images : [],
dashboardMode: false, // Used by Cumulus MX dashboard - SET TO FALSE OTHERWISE
dewDisplayType: 'dew' // Initial 'scale' to display on the 'dew point' gauge.
// 'dew' - Dewpoint
@ -213,9 +213,9 @@ gauges = (function () {
// Cumulus
realtimeVer = 12; // minimum version of the realtime JSON file required
config.realTimeURL = config.longPoll ? config.realTimeUrlLongPoll : config.realTimeUrlCumulus;
// the trend images to be used for the pop-up data, used in conjunction with config.imgPathURL
// the trend /images to be used for the pop-up data, used in conjunction with config.imgPathURL
// by default this is configured for the Cumulus 'standard' web site
// ** If you specify one image in a sub-array, then you MUST provide images for all the other sub-elements
// ** If you specify one image in a sub-array, then you MUST provide /images for all the other sub-elements
config.tipImgs = [ // config.tipImgs for Cumulus users using the 'default' weather site
['temp.png', 'intemp.png'], // Temperature: outdoor, indoor
// Temperature: dewpoint, apparent, windChill, heatIndex, humidex
@ -254,7 +254,8 @@ gauges = (function () {
// WD useer generally use wxgraphs - tweak the CSS to accomadate the different aspect ratio
$('.tipimg').css({
width: '360px',
height: '260px'});
height: '260px'
});
break;
case 2:
// WVS
@ -302,10 +303,10 @@ gauges = (function () {
// Meteobridge
realtimeVer = 10; // minimum version of the realtime JSON file required
config.realTimeURL = config.longPoll ? config.realTimeUrlLongPoll : config.realTimeUrlMB;
config.showPopupGraphs = false; // config.tipImgs - no Meteobridge images available
config.showPopupGraphs = false; // config.tipImgs - no Meteobridge /images available
config.showRoseGauge = false; // no windrose data from MB
config.showCloudGauge = false;
config.tipImgs = null; // config.tipImgs - no Meteobridge images available
config.tipImgs = null; // config.tipImgs - no Meteobridge /images available
config.showWindVariation = false; // no wind variation data from MB
break;
case 5:
@ -358,10 +359,10 @@ gauges = (function () {
// WLCOM
realtimeVer = 10; // minimum version of the realtime JSON file required
config.realTimeURL = config.realTimeUrlWLCOM;
config.showPopupGraphs = false; // config.tipImgs - no WL images available
config.showPopupGraphs = false; // config.tipImgs - no WL /images available
config.showRoseGauge = false; // no windrose data from WL
config.showCloudGauge = false;
config.tipImgs = null; // config.tipImgs - no WL images available
config.tipImgs = null; // config.tipImgs - no WL /images available
config.showWindVariation = false; // no wind variation data from WL
break;
default:
@ -382,7 +383,7 @@ gauges = (function () {
config.gaugeScaling = 1;
}
// Logo images are used to 'personalise' the gauge backgrounds
// Logo /images are used to 'personalise' the gauge backgrounds
// To add a logo to a gauge, add the parameter:
// params.customLayer = _imgBackground;
// to the corresponding drawXxxx() function below.
@ -393,7 +394,7 @@ gauges = (function () {
_imgBackground = document.createElement('img'); // small logo
$(_imgBackground).attr('src', config.imgPathURL + 'logoSmall.png');
*/
// End of logo images
// End of logo /images
// Get the display units the user last used when they visited before - if present
displayUnits = getCookie('units');
@ -740,7 +741,7 @@ gauges = (function () {
params.titleString = cache.title;
params.unitString = data.tempunit;
params.trendVisible = gaugeGlobals.tempTrendVisible;
// params.customLayer = _imgBackground; // uncomment to add a background image - See Logo Images above
// params.customLayer = _imgBackground; // uncomment to add a background image - See Logo /images above
ssGauge = new steelseries.Radial('canvas_temp', params);
ssGauge.setValue(cache.value);
@ -3115,9 +3116,9 @@ gauges = (function () {
$('#programName').html(programLink[config.weatherProgram]);
if (config.showPopupData) {
// now initialise the pop-up script and download the trend images
// now initialise the pop-up script and download the trend /images
// - has to be done here as doFirst may remove elements from the page
// - and we delay the download of the images speeding up page display
// - and we delay the download of the /images speeding up page display
ddimgtooltip.init('[id^="tip_"]');
// Are we running on a phone device (or really low res screen)?
if ($(window).width() < 480) {
@ -3126,9 +3127,9 @@ gauges = (function () {
}
if (config.showPopupData && config.showPopupGraphs) {
// now download the trend images
// now download the trend /images
// - has to be done here as doFirst may remove elements from the page
// - and we delay the download of the images speeding up page display
// - and we delay the download of the /images speeding up page display
//
$('#imgtip0_img').attr('src', config.imgPathURL + config.tipImgs[0][0] + cacheDefeat);
if (gaugeDew) {

55
lib/steelseries/scripts/src/RGraph.rose.js
View file

@ -20,8 +20,7 @@
* @param object canvas
* @param array data
*/
RGraph.Rose = function (id, data)
{
RGraph.Rose = function (id, data) {
this.id = id;
this.canvas = document.getElementById(id);
this.context = this.canvas.getContext('2d');
@ -174,8 +173,7 @@
* @param string name The name of the property to set
* @param string value The value of the property
*/
RGraph.Rose.prototype.Set = function (name, value)
{
RGraph.Rose.prototype.Set = function (name, value) {
/**
* This should be done first - prepend the propertyy name with "chart." if necessary
*/
@ -193,8 +191,7 @@
*
* @param string name The name of the property to get
*/
RGraph.Rose.prototype.Get = function (name)
{
RGraph.Rose.prototype.Get = function (name) {
/**
* This should be done first - prepend the property name with "chart." if necessary
*/
@ -209,8 +206,7 @@
/**
* This method draws the rose chart
*/
RGraph.Rose.prototype.Draw = function ()
{
RGraph.Rose.prototype.Draw = function () {
/**
* Fire the onbeforedraw event
*/
@ -302,8 +298,7 @@
/**
* This method draws the rose charts background
*/
RGraph.Rose.prototype.DrawBackground = function ()
{
RGraph.Rose.prototype.DrawBackground = function () {
this.context.lineWidth = 1;
@ -424,8 +419,7 @@
/**
* This method draws the data on the graph
*/
RGraph.Rose.prototype.DrawRose = function ()
{
RGraph.Rose.prototype.DrawRose = function () {
var max = 0;
var data = this.data;
var margin = RGraph.degrees2Radians(this.Get('chart.margin'));
@ -715,8 +709,7 @@
/**
* Unsuprisingly, draws the labels
*/
RGraph.Rose.prototype.DrawLabels = function ()
{
RGraph.Rose.prototype.DrawLabels = function () {
this.context.lineWidth = 1;
var key = this.Get('chart.key');
@ -798,8 +791,7 @@
*
* @param labels array The labels that go around the chart
*/
RGraph.Rose.prototype.DrawCircularLabels = function (context, labels, font_face, font_size, r)
{
RGraph.Rose.prototype.DrawCircularLabels = function (context, labels, font_face, font_size, r) {
var variant = this.Get('chart.variant');
var position = this.Get('chart.labels.position');
var r = r + 5 + this.Get('chart.labels.offset');
@ -864,8 +856,7 @@
* @param object e Your event object
*/
RGraph.Rose.prototype.getShape =
RGraph.Rose.prototype.getSegment = function (e)
{
RGraph.Rose.prototype.getSegment = function (e) {
RGraph.FixEventObject(e);
var canvas = this.canvas;
@ -949,8 +940,7 @@
/**
* Returns any exploded for a particular segment
*/
RGraph.Rose.prototype.getexploded = function (index, startAngle, endAngle, exploded)
{
RGraph.Rose.prototype.getexploded = function (index, startAngle, endAngle, exploded) {
var explodedx, explodedy;
/**
@ -979,10 +969,9 @@
* This function facilitates the installation of tooltip event listeners if
* tooltips are defined.
*/
RGraph.Rose.prototype.AllowTooltips = function ()
{
// Preload any tooltip images that are used in the tooltips
RGraph.PreLoadTooltipImages(this);
RGraph.Rose.prototype.AllowTooltips = function () {
// Preload any tooltip /images that are used in the tooltips
RGraph.PreLoadTooltip / images(this);
/**
@ -1013,8 +1002,7 @@
*
* @param object shape The shape to highlight
*/
RGraph.Rose.prototype.Highlight = function (shape)
{
RGraph.Rose.prototype.Highlight = function (shape) {
if (this.Get('chart.tooltips.highlight')) {
// Add the new segment highlight
this.context.beginPath();
@ -1045,8 +1033,7 @@
*
* @param object e The event object
*/
RGraph.Rose.prototype.getObjectByXY = function (e)
{
RGraph.Rose.prototype.getObjectByXY = function (e) {
var mouseXY = RGraph.getMouseXY(e);
// Work out the radius
@ -1074,8 +1061,7 @@
* @param int y The Y coordinate specified for the tooltip
* @param objec tooltip The tooltips DIV element
*/
RGraph.Rose.prototype.positionTooltip = function (obj, x, y, tooltip, idx)
{
RGraph.Rose.prototype.positionTooltip = function (obj, x, y, tooltip, idx) {
var coordX = obj.angles[idx][4];
var coordY = obj.angles[idx][5];
@ -1131,8 +1117,7 @@
*
* @param number value The relevant value to get the radius for
*/
RGraph.Rose.prototype.getRadius = function (value)
{
RGraph.Rose.prototype.getRadius = function (value) {
// Range checking (the Rose minimum is always 0)
if (value < 0 || value > this.max) {
return null;
@ -1148,8 +1133,7 @@
/**
* This allows for easy specification of gradients
*/
RGraph.Rose.prototype.parseColors = function ()
{
RGraph.Rose.prototype.parseColors = function () {
for (var i = 0; i < this.properties['chart.colors'].length; ++i) {
this.properties['chart.colors'][i] = this.parseSingleColorForGradient(this.properties['chart.colors'][i]);
}
@ -1174,8 +1158,7 @@
/**
* This parses a single color value
*/
RGraph.Rose.prototype.parseSingleColorForGradient = function (color)
{
RGraph.Rose.prototype.parseSingleColorForGradient = function (color) {
var canvas = this.canvas;
var context = this.context;

112
lib/steelseries/scripts/src/steelseries.js
View file

@ -985,10 +985,14 @@ var steelseries = (function () {
this.setMinValue = function (value) {
minValue = parseFloat(value);
resetBuffers({frame: true,
background: true});
init({frame: true,
background: true});
resetBuffers({
frame: true,
background: true
});
init({
frame: true,
background: true
});
this.repaint();
return this;
};
@ -999,10 +1003,14 @@ var steelseries = (function () {
this.setMaxValue = function (value) {
maxValue = parseFloat(value);
resetBuffers({frame: true,
background: true});
init({frame: true,
background: true});
resetBuffers({
frame: true,
background: true
});
init({
frame: true,
background: true
});
this.repaint();
return this;
};
@ -1023,9 +1031,12 @@ var steelseries = (function () {
this.setArea = function (areaVal) {
area = areaVal;
resetBuffers({background: true,
foreground: true});
init({background: true,
resetBuffers({
background: true,
foreground: true
});
init({
background: true,
foreground: true
});
this.repaint();
@ -1034,9 +1045,12 @@ var steelseries = (function () {
this.setSection = function (areaSec) {
section = areaSec;
resetBuffers({background: true,
foreground: true});
init({background: true,
resetBuffers({
background: true,
foreground: true
});
init({
background: true,
foreground: true
});
this.repaint();
@ -1073,11 +1087,13 @@ var steelseries = (function () {
};
this.setBackgroundColor = function (newBackgroundColor) {
resetBuffers({background: true,
resetBuffers({
background: true,
pointer: (pointerType.type === 'type2' || pointerType.type === 'type13' ? true : false) // type2 & 13 depend on background
});
backgroundColor = newBackgroundColor;
init({background: true, // type2 & 13 depend on background
init({
background: true, // type2 & 13 depend on background
pointer: (pointerType.type === 'type2' || pointerType.type === 'type13' ? true : false)
});
this.repaint();
@ -1093,11 +1109,13 @@ var steelseries = (function () {
};
this.setPointerType = function (newPointerType) {
resetBuffers({pointer: true,
resetBuffers({
pointer: true,
foreground: true
});
pointerType = newPointerType;
init({pointer: true,
init({
pointer: true,
foreground: true
});
this.repaint();
@ -1213,14 +1231,16 @@ var steelseries = (function () {
this.repaint = function () {
if (!initialized) {
init({frame: true,
init({
frame: true,
background: true,
led: true,
userLed: true,
pointer: true,
trend: true,
foreground: true,
odo: true});
odo: true
});
}
mainCtx.clearRect(0, 0, size, size);
@ -1668,9 +1688,11 @@ var steelseries = (function () {
sectionAngles = [];
do {
sectionIndex--;
sectionAngles.push({start: (((section[sectionIndex].start + Math.abs(minValue)) / (maxValue - minValue)) * degAngleRange),
sectionAngles.push({
start: (((section[sectionIndex].start + Math.abs(minValue)) / (maxValue - minValue)) * degAngleRange),
stop: (((section[sectionIndex].stop + Math.abs(minValue)) / (maxValue - minValue)) * degAngleRange),
color: customColorDef(section[sectionIndex].color)});
color: customColorDef(section[sectionIndex].color)
});
} while (0 < sectionIndex);
}
@ -2087,11 +2109,15 @@ var steelseries = (function () {
};
this.setBackgroundColor = function (newBackgroundColor) {
resetBuffers({background: true,
led: true});
resetBuffers({
background: true,
led: true
});
backgroundColor = newBackgroundColor;
init({background: true,
led: true});
init({
background: true,
led: true
});
this.repaint();
return this;
};
@ -2313,13 +2339,15 @@ var steelseries = (function () {
fraction;
if (!initialized) {
init({frame: true,
init({
frame: true,
background: true,
led: true,
userLed: true,
value: true,
trend: true,
foreground: true});
foreground: true
});
}
mainCtx.clearRect(0, 0, size, size);
@ -2799,7 +2827,7 @@ var steelseries = (function () {
// Buffer for LCD displays
var lcdBuffer;
// Buffer for latest pointer images painting code
// Buffer for latest pointer /images painting code
var pointerBufferLatest = createBuffer(size, size);
var pointerContextLatest = pointerBufferLatest.getContext('2d');
@ -3427,10 +3455,12 @@ var steelseries = (function () {
this.setPointerType = function (newPointerType) {
pointerTypeLatest = newPointerType;
resetBuffers({pointer: true,
resetBuffers({
pointer: true,
foreground: true
});
init({pointer: true,
init({
pointer: true,
foreground: true
});
this.repaint();
@ -3439,10 +3469,12 @@ var steelseries = (function () {
this.setPointerTypeAverage = function (newPointerType) {
pointerTypeAverage = newPointerType;
resetBuffers({pointer: true,
resetBuffers({
pointer: true,
foreground: true
});
init({pointer: true,
init({
pointer: true,
foreground: true
});
this.repaint();
@ -3475,11 +3507,13 @@ var steelseries = (function () {
this.repaint = function () {
if (!initialized) {
init({frame: true,
init({
frame: true,
background: true,
led: true,
pointer: true,
foreground: true});
foreground: true
});
}
mainCtx.clearRect(0, 0, mainCtx.canvas.width, mainCtx.canvas.height);
@ -6370,9 +6404,11 @@ var steelseries = (function () {
}
function section(start, stop, color) {
return {start : start,
return {
start: start,
stop: stop,
color : color};
color: color
};
}
Math.log10 = function (value) {
@ -6940,7 +6976,7 @@ var steelseries = (function () {
Led: led,
Odometer: odometer,
// Images
// /images
drawFrame: drawRadialFrameImage,
drawBackground: drawRadialBackgroundImage,
drawForeground: drawRadialForegroundImage,

242
oldindex.htm
View file

@ -1,242 +0,0 @@
<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" style="align-items:center; flex-wrap:wrap;">
<img src="images/CumulusMX-Logo.png" class="w3-image logo" alt="Header logo" />
<div class="w3-right-align" style="max-width:600px;">
<h5>Lat<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="latitude"></span><span
class="at-divider">|<wbr></span>Long<span class="w3-hide-small">itude</span>:&nbsp;<span
data-cmxdata="longitude"></span><span class="at-divider">|<wbr></span>Alt<span
class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="altitude"></span></h5>
</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><span data-cmxdata="location"></span> Weather <span class="subText"></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-container w3-theme-white">
<h3 class="">Almanac</h3>
<div class="w3-responsive">
<table class="w3-table" style="min-width:100%;">
<tbody>
<tr>
<td class="">Dawn:</td>
<td class=""><span data-cmxdata="dawn"></span></td>
<td class="">Sun Rise:</td>
<td class=""><span data-cmxdata="sunrise"></span></td>
<td class="">Moon Rise:</td>
<td class=""><span data-cmxdata="moonrise"></span></td>
<td rowspan="3" style="width:75px; height: 75px; padding:0"><img id="moonImg"
src="images/moon.png" alt="Moon" width="75" height="75"
class="w3-image" />Visible <span data-cmxdata="MoonPercentAbs"></span>%
</td>
</tr>
<tr>
<td class="">Dusk:</td>
<td class=""><span data-cmxdata="dusk"></span></td>
<td class="">Sun Set:</td>
<td class=""><span data-cmxdata="sunset"></span></td>
<td class="">Moon Set:</td>
<td class=""><span data-cmxdata="moonset"></span></td>
</tr>
<tr>
<td class="">Daylight:</td>
<td class=""><span data-cmxdata="daylightlength"></span></td>
<td class="">Day Length:</td>
<td class=""><span data-cmxdata="daylength"></span></td>
<td class="">Moon Phase:</td>
<td class=""><span id="moonPhase" data-cmxdata="moonphase"></span></td>
</tr>
<tr id="currCond" class="w3-hide">
<td colspan="7"><strong>Current conditions</strong>: <span
data-cmxdata="currcond"></span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="w3-row-padding">
<!-- Row 2 of 3/4 width panel -->
<div class="w3-col s12">
<!-- Full width of above panel -->
<div class="w3-panel w3-card w3-theme-white">
<h3 class="">Conditions at local time <span data-cmxdata="time"></span></h3>
<div class="w3-responsive">
<table class="w3-table w3-hoverable" style="min-width:100%;">
<tr>
<td colspan="4" class="w3-theme-d5">Temperature and Humidity</td>
</tr>
<tr class="w3-theme-l2">
<td>Temperature</td>
<td><span data-cmxdata="temp"></span>&nbsp;<span data-cmxdata="tempunit"></span>
</td>
<td>Dew Point</td>
<td><span data-cmxdata="dew"></span>&nbsp;<span data-cmxdata="tempunit"></span>
</td>
</tr>
<tr class="w3-theme-l2">
<td>Windchill</td>
<td><span data-cmxdata="wchill"></span>&nbsp;<span data-cmxdata="tempunit"></span>
</td>
<td>Humidity</td>
<td><span data-cmxdata="hum"></span>&nbsp;%</td>
</tr>
<tr class="w3-theme-l2">
<td>Heat Index</td>
<td><span data-cmxdata="heatindex"></span>&nbsp;<span
data-cmxdata="tempunit"></span></td>
<td><span data-cmx-apparent class="w3-hide">Apparent Temperature</span><span
data-cmx-feels>Feels Like</span></td>
<td><span data-cmx-apparent data-cmxdata="apptemp" class="w3-hide"></span><span
data-cmx-feels data-cmxdata="feelslike"></span>&nbsp;<span
data-cmxdata="tempunit"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Temp change last hour</td>
<td><span data-cmxdata="TempChangeLastHour"></span>&nbsp;<span
data-cmxdata="tempunit"></span></td>
<td></td>
<td></td>
</tr>
<tr>
<td colspan="4" class="w3-theme-d4">Rainfall</td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Today</td>
<td><span data-cmxdata="rfall"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
<td>Rainfall Rate</td>
<td><span data-cmxdata="rrate"></span>&nbsp;<span data-cmxdata="rainunit"></span>/hr
</td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall This Month</td>
<td><span data-cmxdata="rmonth"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
<td>Rainfall This Year</td>
<td><span data-cmxdata="ryear"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Last Hour</td>
<td><span data-cmxdata="rhour"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
<td>Last rainfall</td>
<td><span data-cmxdata="LastRainTip"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Since Midnight</td>
<td><span data-cmxdata="rmidnight"></span>&nbsp;<span
data-cmxdata="rainunit"></span></td>
<td>Rainfall Last 24 Hours</td>
<td><span data-cmxdata="r24hour"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
</tr>
<tr>
<td colspan="4" class="w3-theme-d3">Wind</td>
</tr>
<tr class="w3-theme-l4">
<td>Wind Speed <span class="subText">(gust)</span></td>
<td><span data-cmxdata="wgust"></span>&nbsp;<span data-cmxdata="windunit"></span>
</td>
<td>Wind Speed <span class="subText">(avg)</span></td>
<td><span data-cmxdata="wspeed"></span>&nbsp;<span data-cmxdata="windunit"></span>
</td>
</tr>
<tr class="w3-theme-l4">
<td>Wind Bearing</td>
<td><span data-cmxdata="avgbearing"></span>&deg; <span data-cmxdata="wdir"></span>
</td>
<td>Beaufort <span data-cmxdata="beaufort"></span></td>
<td><span data-cmxdata="beaudesc"></span></td>
</tr>
<tr class="w3-theme-l4">
<td>Wind Variation <span class="subText">(last 10 minutes)</span></td>
<td colspan="3">From <span data-cmxdata="BearingRangeFrom"></span>&deg; to <span
data-cmxdata="BearingRangeTo"></span>&deg;</td>
</tr>
<tr>
<td colspan="4" class="w3-theme-d2">Pressure <span class="subText">(sea
level)</span></td>
</tr>
<tr class="w3-theme-l5">
<td>Barometer</td>
<td><span data-cmxdata="press"></span>&nbsp;<span data-cmxdata="pressunit"></span>
</td>
<td><span data-cmxdata="presstrend"></span></td>
<td><span data-cmxdata="presstrendval"></span>&nbsp;<span
data-cmxdata="pressunit"></span>/hr</td>
</tr>
<tr class="w3-hide" data-cmx-solar data-cmx-uv>
<td colspan="4" class="w3-theme-d1">Solar</td>
</tr>
<tr class="w3-theme-l6 w3-hide" data-cmx-solar>
<td>Solar Radiation</td>
<td><span data-cmxdata="SolarRad"></span>&nbsp;W/m&sup2;</td>
<td>Evapotranspiration Today</td>
<td><span data-cmxdata="ET"></span>&nbsp;<span data-cmxdata="rainunit"></span>
</td>
</tr>
<tr class="w3-theme-l6 w3-hide" data-cmx-uv>
<td>UV Index</td>
<td><span data-cmxdata="UV"></span></td>
<td></td>
<td></td>
</tr>
</table>
</div>
<p class="w3-small credits">Page updated <span data-cmxdata="update"></span>.</p>
</div>
</div>
</div>
</div>
<div class="w3-col l3 m12">
<!-- Start of Sidebar 1/4 width -->
<div class="w3-row-padding">
<div class="w3-col l12">
<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>The weather station in use is the <span data-cmxdata="stationtype"></span><br>
This page is updated every <span data-cmxdata="interval"></span> minutes. The
meteorological day used at this station ends at <span data-cmxdata="rollovertime"></span>.
</p>
<p><strong>Forecast:</strong> <span data-cmxdata="forecast"></span></p>
</div>
</div>
</div>
</div>
</div> <!-- End of panel content -->
</div> <!-- End of content -->
<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>

239
today.htm
View file

@ -1,239 +0,0 @@
<!--
today.htm v:0.0.1 d:Feb 2021 Neil Thomas
Last modified: 2022/07/27 10:11:12
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</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" style="align-items:center; flex-wrap:wrap;">
<img src="images/CumulusMX-Logo.png" class="w3-image logo" alt="Header logo"/>
<div class="w3-right-align" style="max-width:600px;">
<h5>Lat<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="latitude"></span><span class="at-divider">|<wbr></span>Long<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="longitude"></span><span class="at-divider">|<wbr></span>Alt<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="altitude"></span></h5>
</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 <span class="subText"><span data-cmxdata="date"></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&#39;s data</h2>
<div class="w3-responsive">
<table class="w3-table w3-hoverable" style="width:100%">
<tbody>
<tr class="w3-theme-d5">
<td colspan="3">Temperature and Humidity</td>
</tr>
<tr class="w3-theme-l2">
<td>High Temperature</td>
<td><span data-cmxdata="tempTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempTH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Temperature</td>
<td><span data-cmxdata="tempTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempTL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Temperature Range</td>
<td><span data-cmxdata="temprange"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td></td>
</tr>
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
<td>High Apparent Temperature</td>
<td><span data-cmxdata="apptempTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TapptempTH"></span></td>
</tr>
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
<td>Low Apparent Temperature</td>
<td><span data-cmxdata="apptempTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TapptempTL"></span></td>
</tr>
<tr data-cmx-feels class="w3-theme-l2">
<td>High Feels Like</td>
<td><span data-cmxdata="feelslikeTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeTH"></span></td>
</tr>
<tr data-cmx-feels class="w3-theme-l2">
<td>Low Feels Like</td>
<td><span data-cmxdata="feelslikeTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeTL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Wind Chill</td>
<td><span data-cmxdata="wchillTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TwchillTL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>High Heat Index</td>
<td><span data-cmxdata="heatindexTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TheatindexTH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>High Humidity</td>
<td><span data-cmxdata="humTH"></span> %</td>
<td>at <span data-cmxdata="ThumTH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Humidity</td>
<td><span data-cmxdata="humTL"></span> %</td>
<td>at <span data-cmxdata="ThumTL"></span></td>
</tr>
<tr class="w3-theme-d4">
<td colspan="3">Rainfall</td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Today</td>
<td><span data-cmxdata="rfall"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td></td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Rate Max</td>
<td><span data-cmxdata="rrateTM"></span>&nbsp;<span data-cmxdata="rainunit"></span>/hr</td>
<td>at <span data-cmxdata="TrrateTM"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>High Hourly Rainfall</td>
<td><span data-cmxdata="hourlyrainTH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="ThourlyrainTH"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>High 24 Hour Rainfall</td>
<td><span data-cmxdata="rain24hourTH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="Train24hourTH"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>Days Since Last Dry Day</td>
<td><span data-cmxdata="ConsecutiveRainDays"></span></td>
<td></td>
</tr>
<tr class="w3-theme-l3">
<td>Days Since It Last Rained</td>
<td><span data-cmxdata="ConsecutiveDryDays"></span></td>
<td></td>
</tr>
<tr class="w3-theme-d3">
<td colspan="3">Wind</td>
</tr>
<tr class="w3-theme-l4">
<td>High Gust</td>
<td><span data-cmxdata="wgustTM"></span>&nbsp;<span data-cmxdata="windunit"></span></td>
<td>at <span data-cmxdata="TwgustTM"></span></td>
</tr>
<tr class="w3-theme-l4">
<td>High Speed <span class="subText">(10 minute average)</span></td>
<td><span data-cmxdata="windTM"></span>&nbsp;<span data-cmxdata="windunit"></span> (<span data-cmxdata="Tbeaufort"></span>)</td>
<td>at <span data-cmxdata="TwindTM"></span></td>
</tr>
<tr class="w3-theme-l4">
<td>Wind Run</td>
<td><span data-cmxdata="windrun"></span>&nbsp;<span data-cmxdata="windrununit"></span></td>
<td></td>
</tr>
<tr class="w3-theme-l4">
<td>Dominant Direction</td>
<td><span data-cmxdata="domwindbearing"></span>&deg; <span data-cmxdata="domwinddir"></span></td>
<td></td>
</tr>
<tr class="w3-theme-d2">
<td colspan="3">Pressure <span class="subText">(sea level)</span></td>
</tr>
<tr class="w3-theme-l5">
<td>High Pressure</td>
<td><span data-cmxdata="pressTH"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressTH"></span></td>
</tr>
<tr class="w3-theme-l5">
<td>Low Pressure</td>
<td><span data-cmxdata="pressTL"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressTL"></span></td>
</tr>
<tr class="w3-theme-d1 w3-hide" data-cmx-solar data-cmx-uv>
<td colspan="3" class="w3-theme-d1">Solar</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>at <span data-cmxdata="TsolarTH"></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>
</tr>
<tr class="w3-theme-l6 w3-hide" data-cmx-uv>
<td>High UV Index</td>
<td><span data-cmxdata="UVTH"></span></td>
<td>at <span data-cmxdata="TUVTH"></span></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.<br>
This page is updated every <span data-cmxdata="interval"></span> minutes. The meteorological day used at 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>

148
today/index.php Normal file
View file

@ -0,0 +1,148 @@
<!DOCTYPE html>
<html lang="en">
<head>
<?php include("../includes/head.inc.php"); ?>
<script>
window.onload = () => {
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
// update the moon image every 20 minutes if the page is left open
setInterval(() => {
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
}, 1200000);
};
</script>
</head>
<body>
<div class="page-container">
<?php include("../includes/header.inc.php"); ?>
<div id="content">
<h3>Data for today (<span data-cmxdata="date"></span>)</h3>
<table class="mx-datatable">
<tr>
<th colspan="4">Temperature and Humidity</th>
</tr>
<tr>
<td>High Temperature</td>
<td><span data-cmxdata="tempTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempTH"></span></td>
</tr>
<tr>
<td>Low Temperature</td>
<td><span data-cmxdata="tempTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempTL"></span></td>
</tr>
<tr>
<td>Temperature Range</td>
<td><span data-cmxdata="temprange"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td></td>
</tr>
<tr data-cmx-feels>
<td>High Feels Like</td>
<td><span data-cmxdata="feelslikeTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeTH"></span></td>
</tr>
<tr data-cmx-feels>
<td>Low Feels Like</td>
<td><span data-cmxdata="feelslikeTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeTL"></span></td>
</tr>
<tr>
<td>Low Wind Chill</td>
<td><span data-cmxdata="wchillTL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TwchillTL"></span></td>
</tr>
<tr>
<td>High Heat Index</td>
<td><span data-cmxdata="heatindexTH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TheatindexTH"></span></td>
</tr>
<tr>
<td>High Humidity</td>
<td><span data-cmxdata="humTH"></span> %</td>
<td>at <span data-cmxdata="ThumTH"></span></td>
</tr>
<tr>
<td>Low Humidity</td>
<td><span data-cmxdata="humTL"></span> %</td>
<td>at <span data-cmxdata="ThumTL"></span></td>
</tr>
<tr>
<th colspan="4">Rainfall</th>
</tr>
<tr>
<td>Rainfall Today</td>
<td><span data-cmxdata="rfall"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td></td>
</tr>
<tr>
<td>Rainfall Rate Max</td>
<td><span data-cmxdata="rrateTM"></span>&nbsp;<span data-cmxdata="rainunit"></span>/hr</td>
<td>at <span data-cmxdata="TrrateTM"></span></td>
</tr>
<tr>
<td>High Hourly Rainfall</td>
<td><span data-cmxdata="hourlyrainTH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="ThourlyrainTH"></span></td>
</tr>
<tr>
<td>High 24 Hour Rainfall</td>
<td><span data-cmxdata="rain24hourTH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="Train24hourTH"></span></td>
</tr>
<tr>
<td>Days Since Last Dry Day</td>
<td><span data-cmxdata="ConsecutiveRainDays"></span></td>
<td></td>
</tr>
<tr>
<td>Days Since It Last Rained</td>
<td><span data-cmxdata="ConsecutiveDryDays"></span></td>
<td></td>
</tr>
<tr>
<th colspan="4">Wind</th>
</tr>
<tr>
<td>High Gust</td>
<td><span data-cmxdata="wgustTM"></span>&nbsp;<span data-cmxdata="windunit"></span></td>
<td>at <span data-cmxdata="TwgustTM"></span></td>
</tr>
<tr>
<td>High Speed <span class="subText">(10 minute average)</span></td>
<td><span data-cmxdata="windTM"></span>&nbsp;<span data-cmxdata="windunit"></span> (<span
data-cmxdata="Tbeaufort"></span>)</td>
<td>at <span data-cmxdata="TwindTM"></span></td>
</tr>
<tr>
<td>Wind Run</td>
<td><span data-cmxdata="windrun"></span>&nbsp;<span data-cmxdata="windrununit"></span></td>
<td></td>
</tr>
<tr>
<td>Dominant Direction</td>
<td><span data-cmxdata="domwindbearing"></span>&deg; <span data-cmxdata="domwinddir"></span></td>
<td></td>
</tr>
<tr>
<th colspan="4">Pressure (sea level)</th>
</tr>
<tr>
<td>High Pressure</td>
<td><span data-cmxdata="pressTH"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressTH"></span></td>
</tr>
<tr>
<td>Low Pressure</td>
<td><span data-cmxdata="pressTL"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressTL"></span></td>
</tr>
</table>
<small>Page data updated <span data-cmxdata="update"></span></small>
</div>
<?php include("../includes/footer.inc.php"); ?>
</div>
</body>
</html>

225
yesterday.htm
View file

@ -1,225 +0,0 @@
<!--
yesterday.htm v:0.0.1 d:Feb 2021 Neil Thomas
Last modified: 2022/07/27 10:10:28
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</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" style="align-items:center; flex-wrap:wrap;">
<img src="images/CumulusMX-Logo.png" class="w3-image logo" alt="Header logo"/>
<div class="w3-right-align" style="max-width:600px;">
<h5>Lat<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="latitude"></span><span class="at-divider">|<wbr></span>Long<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="longitude"></span><span class="at-divider">|<wbr></span>Alt<span class="w3-hide-small">itude</span>:&nbsp;<span data-cmxdata="altitude"></span></h5>
</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>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 class="">Yesterday's data</h2>
<div class="w3-responsive">
<table class="w3-table w3-hoverable" style="width:100%">
<tbody>
<tr class="w3-theme-d5">
<td colspan="3">Temperature and Humidity</td>
</tr>
<tr class="w3-theme-l2">
<td>High Temperature</td>
<td><span data-cmxdata="tempYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempYH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Temperature</td>
<td><span data-cmxdata="tempYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempYL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Temperature Range</td>
<td><span data-cmxdata="temprangeY"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td></td>
</tr>
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
<td>High Apparent Temperature</td>
<td><span data-cmxdata="apptempYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TapptempYH"></span></td>
</tr>
<tr data-cmx-apparent class="w3-theme-l2 w3-hide">
<td>Low Apparent Temperature</td>
<td><span data-cmxdata="apptempYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TapptempYL"></span></td>
</tr>
<tr data-cmx-feels class="w3-theme-l2">
<td>High Feels Like</td>
<td><span data-cmxdata="feelslikeYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeYH"></span></td>
</tr>
<tr data-cmx-feels class="w3-theme-l2">
<td>Low Feels Like</td>
<td><span data-cmxdata="feelslikeYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeYL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Wind Chill</td>
<td><span data-cmxdata="wchillYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TwchillYL"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>High Heat Index</td>
<td><span data-cmxdata="heatindexYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TheatindexYH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>High Humidity</td>
<td><span data-cmxdata="humYH"></span>&nbsp;%</td>
<td>at <span data-cmxdata="ThumYH"></span></td>
</tr>
<tr class="w3-theme-l2">
<td>Low Humidity</td>
<td><span data-cmxdata="humYL"></span>&nbsp;%</td>
<td>at <span data-cmxdata="ThumYL"></span></td>
</tr>
<tr class="w3-theme-d4">
<td colspan="3">Rainfall</td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Yesterday</td>
<td><span data-cmxdata="rfallY"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td></td>
</tr>
<tr class="w3-theme-l3">
<td>Rainfall Rate Max</td>
<td><span data-cmxdata="rrateYM"></span>&nbsp;<span data-cmxdata="rainunit"></span>/hr</td>
<td>at <span data-cmxdata="TrrateYM"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>High Hourly Rainfall</td>
<td><span data-cmxdata="hourlyrainYH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="ThourlyrainYH"></span></td>
</tr>
<tr class="w3-theme-l3">
<td>High 24 Hour Rainfall</td>
<td><span data-cmxdata="rain24hourYH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="Train24hourYH"></span></td>
</tr>
<tr class="w3-theme-d3">
<td colspan="3">Wind</td>
</tr>
<tr class="w3-theme-l4">
<td>High Gust</td>
<td><span data-cmxdata="wgustYM"></span>&nbsp;<span data-cmxdata="windunit"></span></td>
<td>at <span data-cmxdata="TwgustYM"></span></td>
</tr>
<tr class="w3-theme-l4">
<td>High Speed <span class="subText">(10 minute average)</span></td>
<td><span data-cmxdata="windYM"></span>&nbsp;<span data-cmxdata="windunit"></span> (<span data-cmxdata="Ybeaufort"></span>)</td>
<td>at <span data-cmxdata="TwindYM"></span></td>
</tr>
<tr class="w3-theme-l4">
<td>Wind Run</td>
<td><span data-cmxdata="windrunY"></span>&nbsp;<span data-cmxdata="windrununit"></span></td>
<td></td>
</tr>
<tr class="w3-theme-l4">
<td>Dominant Direction</td>
<td><span data-cmxdata="domwindbearingY"></span>&deg; <span data-cmxdata="domwinddirY"></span></td>
<td></td>
</tr>
<tr class="w3-theme-d2">
<td colspan="3">Pressure <span class="subText">(sea level)</span></td>
</tr>
<tr class="w3-theme-l5">
<td>High Pressure</td>
<td><span data-cmxdata="pressYH"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressYH"></span></td>
</tr>
<tr class="w3-theme-l5">
<td>Low Pressure</td>
<td><span data-cmxdata="pressYL"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressYL"></span></td>
</tr>
<tr class="w3-theme-d1 w3-hide" data-cmx-solar data-cmx-uv>
<td colspan="3">Solar</td>
</tr>
<tr class="w3-theme-l6 w3-hide" data-cmx-solar>
<td>High Solar Radiation</td>
<td><span data-cmxdata="solarYH"></span>&nbsp;W/m&sup2;</td>
<td>at <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="YSunshineHours"></span>&nbsp;hrs</td>
<td></td>
</tr>
<tr class="w3-theme-l6 w3-hide" data-cmx-uv>
<td>High UV Index</td>
<td><span data-cmxdata="UVYH"></span></td>
<td>at <span data-cmxdata="TUVYH"></span></td>
</tr>
</tbody>
</table>
<p class="w3-small credits">Page updated <span data-cmxdata="update"></span>.</p>
</div>
</div>
</div>
</div>
</div>
<div class="w3-col l3 m12"> <!-- Start of Sidebar 1/4 width -->
<div class="w3-row-padding">
<div class="w3-col l12">
<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 a summary of the data for the 24 hrs up to <span data-cmxdata="rollovertime"></span> local time. </p>
</div>
</div>
</div>
</div>
</div> <!-- End of panel content -->
</div> <!-- End of content -->
<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>

149
yesterday/index.php Normal file
View file

@ -0,0 +1,149 @@
<!DOCYYPE html>
<html lang="en">
<head>
<?php include("../includes/head.inc.php"); ?>
<script>
window.onload = () => {
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
// update the moon image every 20 minutes if the page is left open
setInterval(() => {
$('#moonImg').attr('src', '/images/moon.png?' + Date.now());
}, 1200000);
};
</script>
</head>
<body>
<div class="page-container">
<?php include("../includes/header.inc.php"); ?>
<div id="content">
<h3>Data for today (<span data-cmxdata="yesterday"></span>)</h3>
<table class="mx-datatable">
<tr>
<th colspan="4">Temperature and Humidity</th>
</tr>
<tr>
<td>High Temperature</td>
<td><span data-cmxdata="tempYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempYH"></span></td>
</tr>
<tr>
<td>Low Temperature</td>
<td><span data-cmxdata="tempYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TtempYL"></span></td>
</tr>
<tr>
<td>Temperature Range</td>
<td><span data-cmxdata="temprange"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td></td>
</tr>
<tr data-cmx-feels>
<td>High Feels Like</td>
<td><span data-cmxdata="feelslikeYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeYH"></span></td>
</tr>
<tr data-cmx-feels>
<td>Low Feels Like</td>
<td><span data-cmxdata="feelslikeYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TfeelslikeYL"></span></td>
</tr>
<tr>
<td>Low Wind Chill</td>
<td><span data-cmxdata="wchillYL"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TwchillYL"></span></td>
</tr>
<tr>
<td>High Heat Index</td>
<td><span data-cmxdata="heatindexYH"></span>&nbsp;<span data-cmxdata="tempunit"></span></td>
<td>at <span data-cmxdata="TheatindexYH"></span></td>
</tr>
<tr>
<td>High Humidity</td>
<td><span data-cmxdata="humYH"></span> %</td>
<td>at <span data-cmxdata="ThumYH"></span></td>
</tr>
<tr>
<td>Low Humidity</td>
<td><span data-cmxdata="humYL"></span> %</td>
<td>at <span data-cmxdata="ThumYL"></span></td>
</tr>
<tr>
<th colspan="4">Rainfall</th>
</tr>
<tr>
<td>Rainfall Today</td>
<td><span data-cmxdata="rfall"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td></td>
</tr>
<tr>
<td>Rainfall Rate Max</td>
<td><span data-cmxdata="rrateYM"></span>&nbsp;<span data-cmxdata="rainunit"></span>/hr</td>
<td>at <span data-cmxdata="TrrateYM"></span></td>
</tr>
<tr>
<td>High Hourly Rainfall</td>
<td><span data-cmxdata="hourlyrainYH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="ThourlyrainYH"></span></td>
</tr>
<tr>
<td>High 24 Hour Rainfall</td>
<td><span data-cmxdata="rain24hourYH"></span>&nbsp;<span data-cmxdata="rainunit"></span></td>
<td>at <span data-cmxdata="Train24hourYH"></span></td>
</tr>
<tr>
<td>Days Since Last Dry Day</td>
<td><span data-cmxdata="ConsecutiveRainDays"></span></td>
<td></td>
</tr>
<tr>
<td>Days Since It Last Rained</td>
<td><span data-cmxdata="ConsecutiveDryDays"></span></td>
<td></td>
</tr>
<tr>
<th colspan="4">Wind</th>
</tr>
<tr>
<td>High Gust</td>
<td><span data-cmxdata="wgustYM"></span>&nbsp;<span data-cmxdata="windunit"></span></td>
<td>at <span data-cmxdata="TwgustYM"></span></td>
</tr>
<tr>
<td>High Speed <span class="subText">(10 minute average)</span></td>
<td><span data-cmxdata="windYM"></span>&nbsp;<span data-cmxdata="windunit"></span> (<span
data-cmxdata="Tbeaufort"></span>)</td>
<td>at <span data-cmxdata="TwindYM"></span></td>
</tr>
<tr>
<td>Wind Run</td>
<td><span data-cmxdata="windrun"></span>&nbsp;<span data-cmxdata="windrununit"></span></td>
<td></td>
</tr>
<tr>
<td>Dominant Direction</td>
<td><span data-cmxdata="domwindbearing"></span>&deg; <span data-cmxdata="domwinddir"></span>
</td>
<td></td>
</tr>
<tr>
<th colspan="4">Pressure (sea level)</th>
</tr>
<tr>
<td>High Pressure</td>
<td><span data-cmxdata="pressYH"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressYH"></span></td>
</tr>
<tr>
<td>Low Pressure</td>
<td><span data-cmxdata="pressYL"></span>&nbsp;<span data-cmxdata="pressunit"></span></td>
<td>at <span data-cmxdata="TpressYL"></span></td>
</tr>
</table>
<small>Page data updated <span data-cmxdata="update"></span></small>
</div>
<?php include("../includes/footer.inc.php"); ?>
</div>
</body>
</html>