Last active
August 29, 2023 13:24
-
-
Save vgrovestine/9a99506174850909a5abfa1f79b899a0 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>PSU METEO 410: METAR Highlighter</title> | |
<style> | |
body, | |
input { | |
font-family: sans-serif; | |
font-size: 16px; | |
line-height: 1.375em; | |
} | |
body { | |
background-color: #f9f9f9; | |
color: #111; | |
padding: 1.375em; | |
} | |
h1 { | |
font-size: 2em; | |
font-weight: bold; | |
margin: 0; | |
} | |
h2 { | |
font-size: 1.75em; | |
font-weight: normal; | |
color: #333; | |
margin: 1em 0 0.5em 0; | |
} | |
.smaller { | |
font-size: 0.875em; | |
} | |
textarea#metar_raw { | |
font-family: monospace; | |
font-size: 14px; | |
display: block; | |
width: 100%; | |
height: 11em; | |
padding: 0.0625em 0.125em; | |
white-space: pre; | |
} | |
ol#metar_formatted { | |
padding: 0 0 0 2em; | |
} | |
#metar_formatted li { | |
font-family: monospace; | |
margin: 0.25em; | |
} | |
#metar_formatted li::marker { | |
font-family: sans-serif; | |
font-size: 0.75em; | |
color: #999; | |
margin-right: 0.5em; | |
} | |
#metar_formatted li:nth-child(odd) { | |
background-color: #f3f3f3; | |
} | |
#metar_formatted li:hover { | |
background-color: #fec; | |
} | |
#metar_formatted span { | |
font-weight: bold; | |
} | |
.m_datetime { | |
background-color: #ccc; | |
} | |
.m_wind { | |
background-color: #fcf; | |
} | |
.m_slp { | |
background-color: #cff; | |
} | |
.m_grp1 { | |
background-color: #fcc; | |
} | |
.m_grp2 { | |
background-color: #cfc; | |
} | |
.m_grp6 { | |
background-color: #ccf; | |
} | |
.m_grpt { | |
background-color: #ffc; | |
} | |
</style> | |
<script text="text/javascript"> | |
function doHighlight() { | |
var m = document.getElementById("metar_raw").value; | |
m = m.trim(); | |
if(m.length > 0) { | |
m = m.replace(/ +/g, ' '); | |
m = m.replace(/ (\d{6}Z)/g, ' <span class="m_datetime">$1</span>'); | |
m = m.replace(/ ((\d|VRB|G)+KT)/g, ' <span class="m_wind">$1</span>'); | |
m = m.replace(/ (SLP\d+)/g, ' <span class="m_slp">$1</span>'); | |
m = m.replace(/ (1\d{4})/g, ' <span class="m_grp1">$1</span>'); | |
m = m.replace(/ (2\d{4})/g, ' <span class="m_grp2">$1</span>'); | |
m = m.replace(/ (6\d{4})/g, ' <span class="m_grp6">$1</span>'); | |
m = m.replace(/ (T\d{8})/g, ' <span class="m_grpt">$1</span>'); | |
m = '<li>' + m.replace(/\n/g, '</li><li>') + '</li>'; | |
} | |
document.getElementById("metar_formatted").innerHTML = m; | |
} | |
function doClear() { | |
document.getElementById("metar_raw").value = ''; | |
} | |
</script> | |
</head> | |
<body> | |
<h1>PSU METEO 410: METAR Highlighter</h1> | |
<h2>Raw METAR</h2> | |
<form action="#" method="get" onsubmit="doHighlight(); return(false);"> | |
<p><textarea name="metar_raw" id="metar_raw" rows="10" cols="100"> | |
KMLT 282353Z AUTO 00000KT 10SM FEW041 BKN050 BKN100 21/16 A3006 RMK AO2 SLP181 T02110161 10256 20211 53007 | |
KMLT 282253Z AUTO 10SM FEW075 22/15 A3004 RMK AO2 SLP177 T02220150 | |
KMLT 282153Z AUTO 00000KT 10SM CLR 24/14 A3003 RMK AO2 SLP174 T02440139 | |
KMLT 282053Z AUTO VRB05KT 10SM CLR 25/14 A3003 RMK AO2 SLP175 T02500139 56008 | |
KMLT 281953Z AUTO VRB04KT 10SM FEW050 26/13 A3004 RMK AO2 SLP175 T02560133 | |
KMLT 281853Z AUTO VRB04KT 10SM SCT050 25/13 A3004 RMK AO2 SLP178 T02500133 | |
KMLT 281753Z AUTO VRB04KT 10SM SCT049 SCT060 24/13 A3006 RMK AO2 SLP182 T02440133 10244 20139 58010 | |
KMLT 281653Z AUTO 30004KT 10SM FEW049 23/12 A3007 RMK AO2 SLP187 T02330122 | |
KMLT 281553Z AUTO 00000KT 10SM CLR 23/12 A3008 RMK AO2 SLP191 T02330122 | |
KMLT 281453Z AUTO 24004KT 10SM CLR 22/12 A3009 RMK AO2 SLP192 T02170117 58002 | |
KMLT 281353Z AUTO 00000KT 10SM CLR 21/12 A3009 RMK AO2 SLP193 T02060117 | |
KMLT 281253Z AUTO 00000KT 10SM CLR 17/13 A3009 RMK AO2 SLP195 T01720133 | |
KMLT 281153Z AUTO 00000KT 10SM CLR 14/11 A3009 RMK AO2 SLP195 T01390111 10139 20089 53012 | |
KMLT 281053Z AUTO 00000KT 10SM CLR 11/09 A3008 RMK AO2 SLP192 T01060089 | |
KMLT 280953Z AUTO 00000KT 10SM CLR 09/08 A3006 RMK AO2 SLP186 T00940083 | |
KMLT 280853Z AUTO 31003KT 10SM CLR 09/09 A3006 RMK AO2 SLP183 T00940089 53005 | |
KMLT 280753Z AUTO 00000KT 10SM CLR 10/09 A3005 RMK AO2 SLP180 T01000094 | |
KMLT 280653Z AUTO 00000KT 10SM CLR 11/10 A3004 RMK AO2 SLP178 T01060100 | |
KMLT 280553Z AUTO 00000KT 10SM CLR 11/10 A3004 RMK AO2 SLP178 T01110100 10167 20111 51008 | |
KMLT 280453Z AUTO 00000KT 10SM CLR 12/11 A3004 RMK AO2 SLP177 T01170106 402390117 | |
KMLT 280353Z AUTO 00000KT 10SM CLR 13/12 A3003 RMK AO2 SLP173 T01280117 | |
KMLT 280253Z AUTO 00000KT 10SM CLR 13/12 A3002 RMK AO2 SLP170 T01330122 51012 | |
KMLT 280153Z AUTO 00000KT 10SM CLR 14/13 A3002 RMK AO2 SLP168 T01440133 | |
KMLT 280053Z AUTO 00000KT 10SM CLR 16/14 A3000 RMK AO2 SLP163 T01560139 | |
KMLT 272353Z AUTO 00000KT 10SM CLR 16/14 A2999 RMK AO2 SLP158 T01610139 10239 20161 53013 | |
KMLT 272253Z AUTO 00000KT 10SM FEW050 20/14 A2997 RMK AO2 SLP153 T02000139 | |
KMLT 272153Z AUTO 07003KT 10SM BKN060 22/12 A2996 RMK AO2 SLP149 T02220122 | |
KMLT 272053Z AUTO VRB03KT 10SM OVC050 23/13 A2995 RMK AO2 SLP145 T02330128 55001 | |
KMLT 271953Z AUTO 04007KT 10SM OVC047 24/12 A2995 RMK AO2 SLP143 T02390117 | |
KMLT 271853Z AUTO 10SM BKN042 BKN050 23/13 A2995 RMK AO2 SLP144 T02280128 | |
KMLT 271753Z AUTO 34006KT 10SM BKN038 OVC047 22/13 A2995 RMK AO2 SLP145 T02220128 10228 20167 56010 | |
KMLT 271653Z AUTO 34007KT 10SM BKN039 22/12 A2996 RMK AO2 SLP146 T02220122 | |
KMLT 271553Z AUTO 34005KT 10SM CLR 21/12 A2997 RMK AO2 SLP151 T02060122 | |
KMLT 271537Z AUTO VRB06KT 10SM FEW028 21/12 A2997 RMK AO2 T02060122 | |
KMLT 271453Z AUTO 05006KT 10SM BKN028 19/12 A2998 RMK AO2 SLP156 T01940122 50002 | |
KMLT 271440Z AUTO 01005KT 10SM BKN029 20/12 A2998 RMK AO2 T02000122 | |
KMLT 271353Z AUTO 36009KT 320V040 10SM CLR 19/12 A2999 RMK AO2 SLP159 T01890122 | |
KMLT 271253Z AUTO 03006KT 10SM FEW017 18/12 A2999 RMK AO2 SLP160 T01780122 | |
</textarea></p> | |
<p> | |
<input type="submit" value="Highlight"> | |
<input type="submit" value="Clear" onclick="doClear();"> | |
<span class="smaller">(Hint: Get METAR texts from <a href="https://weather.rap.ucar.edu/surface/">NCAR surface observations</a>.)</span> | |
</p> | |
</form> | |
<h2>Highlighted METAR</h2> | |
<ol reversed id="metar_formatted"></ol> | |
<p class="smaller"> | |
<strong>Legend:</strong> | |
<span class="m_datetime">Date+Time</span>, | |
<span class="m_wind">Wind</span>, | |
<span class="m_slp">Surface-level Pressure</span>, | |
<span class="m_grpt">T-group (Temperatures)</span>, | |
<span class="m_grp1">1-group (Max temperature)</span>, | |
<span class="m_grp2">2-group (Min temperature)</span>, | |
<span class="m_grp6">6-group (Precipitation)</span>, | |
</p> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment