fix word wrap

This commit is contained in:
Matt Walsh 2020-11-01 22:05:08 -06:00
parent dd98daf0c2
commit e41febccb3
5 changed files with 88 additions and 21 deletions

2
dist/index.html vendored
View file

@ -1 +1 @@
<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="utf-8"><link rel="preload" href="fonts/Star4000.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star 4 Radar.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Extended.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Large Compressed.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Large.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Small.woff" as="font" crossorigin="anonymous"><title>WeatherStar 4000+</title><meta name="description" content="Web based WeatherStar 4000 simulator that reports current and forecast weather conditions plus a few extras!"><meta name="keywords" content="WeatherStar 4000+"><meta name="author" content="Matt Walsh"><meta name="application-name" content="WeatherStar 4000+"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="manifest" href="manifest.json"><link rel="icon" href="images/Logo192.png"><link rel="stylesheet" type="text/css" href="resources/ws.min.css?_=3.8.0"><script type="text/javascript" src="resources/data.min.js?_=3.8.0"></script><script type="text/javascript" src="resources/ws.min.js?_=3.8.0"></script></head><body><div id="divQuery"><form id="frmGetLatLng"><input id="txtAddress" type="text" value="" placeholder="Zip or City, State"><button id="btnGetGps" type="button" title="Get GPS Location"><img id="imgGetGps" src="images/nav/ic_gps_fixed_black_18dp_1x.png"></button> <input id="btnGetLatLng" type="submit" value="GO"> <input id="btnClearQuery" type="reset" value="Reset"></form><div id="divLat"></div><div id="divLng"></div></div><br><img id="imgPause1x" src="images/nav/ic_pause_white_24dp_1x.png"> <img id="imgPause2x" src="images/nav/ic_pause_white_24dp_2x.png"><div id="version" style="display:none">3.8.0</div><div id="divTwc"><div id="container"><div id="loading" width="640" height="480"><div><div class="title">WeatherStar 4000+</div><div class="instructions">Enter your location above to continue</div></div></div></div><div id="divTwcBottom"><div id="divTwcBottomLeft"><img id="NavigateMenu" class="navButton" src="images/nav/ic_menu_white_24dp_1x.png" title="Menu"> <img id="NavigatePrevious" class="navButton" src="images/nav/ic_skip_previous_white_24dp_1x.png" title="Previous"> <img id="NavigateNext" class="navButton" src="images/nav/ic_skip_next_white_24dp_1x.png" title="Next"> <img id="NavigatePlay" class="navButton" src="images/nav/ic_play_arrow_white_24dp_1x.png" title="Play"></div><div id="divTwcBottomMiddle"><img id="NavigateRefresh" class="navButton" src="images/nav/ic_refresh_white_24dp_1x.png" title="Refresh"></div><div id="divTwcBottomRight"><img id="ToggleFullScreen" class="navButton" src="images/nav/ic_fullscreen_exit_white_24dp_1x.png" title="Exit Fullscreen"></div></div></div><br><div class="info"><a href="https://github.com/netbymatt/ws4kp#weatherstar-4000">More information</a></div><div class="heading">Selected displays</div><div id="enabledDisplays"></div><div id="divInfo">Location: <span id="spanCity"></span> <span id="spanState"></span><br>Station Id: <span id="spanStationId"></span><br>Radar Id: <span id="spanRadarId"></span><br>Zone Id: <span id="spanZoneId"></span><br></div><div id="divRefresh">Last Update: <span id="spanLastRefresh">(None)</span><br><input id="chkAutoRefresh" name="chkAutoRefresh" type="checkbox"><label id="lblRefreshCountDown" for="chkAutoRefresh">Auto Refresh: <span id="spanRefreshCountDown">--:--</span></label></div><div id="divUnits">Units: <input id="radEnglish" name="radUnits" type="radio" value="ENGLISH"><label for="radEnglish">English</label> <input id="radMetric" name="radUnits" type="radio" value="METRIC"><label for="radMetric">Metric</label></div></body></html> <!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="utf-8"><link rel="preload" href="fonts/Star4000.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star 4 Radar.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Extended.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Large Compressed.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Large.woff" as="font" crossorigin="anonymous"><link rel="preload" href="fonts/Star4000 Small.woff" as="font" crossorigin="anonymous"><title>WeatherStar 4000+</title><meta name="description" content="Web based WeatherStar 4000 simulator that reports current and forecast weather conditions plus a few extras!"><meta name="keywords" content="WeatherStar 4000+"><meta name="author" content="Matt Walsh"><meta name="application-name" content="WeatherStar 4000+"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="manifest" href="manifest.json"><link rel="icon" href="images/Logo192.png"><link rel="stylesheet" type="text/css" href="resources/ws.min.css?_=3.8.1"><script type="text/javascript" src="resources/data.min.js?_=3.8.1"></script><script type="text/javascript" src="resources/ws.min.js?_=3.8.1"></script></head><body><div id="divQuery"><form id="frmGetLatLng"><input id="txtAddress" type="text" value="" placeholder="Zip or City, State"><button id="btnGetGps" type="button" title="Get GPS Location"><img id="imgGetGps" src="images/nav/ic_gps_fixed_black_18dp_1x.png"></button> <input id="btnGetLatLng" type="submit" value="GO"> <input id="btnClearQuery" type="reset" value="Reset"></form><div id="divLat"></div><div id="divLng"></div></div><br><img id="imgPause1x" src="images/nav/ic_pause_white_24dp_1x.png"> <img id="imgPause2x" src="images/nav/ic_pause_white_24dp_2x.png"><div id="version" style="display:none">3.8.1</div><div id="divTwc"><div id="container"><div id="loading" width="640" height="480"><div><div class="title">WeatherStar 4000+</div><div class="instructions">Enter your location above to continue</div></div></div></div><div id="divTwcBottom"><div id="divTwcBottomLeft"><img id="NavigateMenu" class="navButton" src="images/nav/ic_menu_white_24dp_1x.png" title="Menu"> <img id="NavigatePrevious" class="navButton" src="images/nav/ic_skip_previous_white_24dp_1x.png" title="Previous"> <img id="NavigateNext" class="navButton" src="images/nav/ic_skip_next_white_24dp_1x.png" title="Next"> <img id="NavigatePlay" class="navButton" src="images/nav/ic_play_arrow_white_24dp_1x.png" title="Play"></div><div id="divTwcBottomMiddle"><img id="NavigateRefresh" class="navButton" src="images/nav/ic_refresh_white_24dp_1x.png" title="Refresh"></div><div id="divTwcBottomRight"><img id="ToggleFullScreen" class="navButton" src="images/nav/ic_fullscreen_exit_white_24dp_1x.png" title="Exit Fullscreen"></div></div></div><br><div class="info"><a href="https://github.com/netbymatt/ws4kp#weatherstar-4000">More information</a></div><div class="heading">Selected displays</div><div id="enabledDisplays"></div><div id="divInfo">Location: <span id="spanCity"></span> <span id="spanState"></span><br>Station Id: <span id="spanStationId"></span><br>Radar Id: <span id="spanRadarId"></span><br>Zone Id: <span id="spanZoneId"></span><br></div><div id="divRefresh">Last Update: <span id="spanLastRefresh">(None)</span><br><input id="chkAutoRefresh" name="chkAutoRefresh" type="checkbox"><label id="lblRefreshCountDown" for="chkAutoRefresh">Auto Refresh: <span id="spanRefreshCountDown">--:--</span></label></div><div id="divUnits">Units: <input id="radEnglish" name="radUnits" type="radio" value="ENGLISH"><label for="radEnglish">English</label> <input id="radMetric" name="radUnits" type="radio" value="METRIC"><label for="radMetric">Metric</label></div></body></html>

File diff suppressed because one or more lines are too long

View file

@ -136,33 +136,98 @@ const utils = (() => {
const wrap = (x, m) => ((x % m) + m) % m; const wrap = (x, m) => ((x % m) + m) % m;
// ********************************* strings ********************************************* // ********************************* strings *********************************************
const wordWrap = (str = '', ...rest) => { const wordWrap = (_str, ...rest) => {
const m = ((rest.length >= 1) ? rest[0] : 75); // discuss at: https://locutus.io/php/wordwrap/
const b = ((rest.length >= 2) ? rest[1] : '\n'); // original by: Jonas Raoni Soares Silva (https://www.jsfromhell.com)
const c = ((rest.length >= 3) ? rest[2] : false); // improved by: Nick Callen
// improved by: Kevin van Zonneveld (https://kvz.io)
// improved by: Sakimori
// revised by: Jonas Raoni Soares Silva (https://www.jsfromhell.com)
// bugfixed by: Michael Grier
// bugfixed by: Feras ALHAEK
// improved by: Rafał Kukawski (https://kukawski.net)
// example 1: wordwrap('Kevin van Zonneveld', 6, '|', true)
// returns 1: 'Kevin|van|Zonnev|eld'
// example 2: wordwrap('The quick brown fox jumped over the lazy dog.', 20, '<br />\n')
// returns 2: 'The quick brown fox<br />\njumped over the lazy<br />\ndog.'
// example 3: wordwrap('Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.')
// returns 3: 'Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod\ntempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim\nveniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea\ncommodo consequat.'
const intWidth = rest[0] ?? 75;
const strBreak = rest[1] ?? '\n';
const cut = rest[2] ?? false;
let i; let i;
let j; let j;
let l; let line;
let s;
let r;
if (m < 1) { let str = _str;
str += '';
if (intWidth < 1) {
return str; return str;
} }
for (i = -1, l = (r = str.split(/\r\n|\n|\r/)).length; ++i < l; r[i] += s) { const reLineBreaks = /\r\n|\n|\r/;
for (s = r[i], r[i] = ''; const reBeginningUntilFirstWhitespace = /^\S*/;
s.length > m; const reLastCharsWithOptionalTrailingWhitespace = /\S*(\s)?$/;
r[i] += s.slice(0, j) + ((s = s.slice(j)).length ? b : '')) {
j = c === 2 || (j = s.slice(0, m + 1).match(/\S*(\s)?$/))[1] const lines = str.split(reLineBreaks);
? m const l = lines.length;
: ((j.input.length - j[0].length || c === true) && m) let match;
|| j.input.length + (j = s.slice(m).match(/^\S*/))[0].length;
// for each line of text
// eslint-disable-next-line no-plusplus
for (i = 0; i < l; lines[i++] += line) {
line = lines[i];
lines[i] = '';
while (line.length > intWidth) {
// get slice of length one char above limit
const slice = line.slice(0, intWidth + 1);
// remove leading whitespace from rest of line to parse
let ltrim = 0;
// remove trailing whitespace from new line content
let rtrim = 0;
match = slice.match(reLastCharsWithOptionalTrailingWhitespace);
// if the slice ends with whitespace
if (match[1]) {
// then perfect moment to cut the line
j = intWidth;
ltrim = 1;
} else {
// otherwise cut at previous whitespace
j = slice.length - match[0].length;
if (j) {
rtrim = 1;
}
// but if there is no previous whitespace
// and cut is forced
// cut just at the defined limit
if (!j && cut && intWidth) {
j = intWidth;
}
// if cut wasn't forced
// cut at next possible whitespace after the limit
if (!j) {
const charsUntilNextWhitespace = (line.slice(intWidth).match(reBeginningUntilFirstWhitespace) || [''])[0];
j = slice.length + charsUntilNextWhitespace.length;
}
}
lines[i] += line.slice(0, j - rtrim);
line = line.slice(j + ltrim);
lines[i] += line.length ? strBreak : '';
} }
} }
return r.join('\n').replace(/\n /g, '\n'); return lines.join('\n');
}; };
// ********************************* cors ******************************************** // ********************************* cors ********************************************
// rewrite some urls for local server // rewrite some urls for local server

View file

@ -1 +1 @@
module.exports = '3.8.0'; module.exports = '3.8.1';

View file

@ -23,7 +23,9 @@
"Visib", "Visib",
"arcgis", "arcgis",
"devbridge", "devbridge",
"nosleep" "ltrim",
"nosleep",
"rtrim"
], ],
"cSpell.ignorePaths": [ "cSpell.ignorePaths": [
"**/package-lock.json", "**/package-lock.json",