lifning/ws4kp
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

index.ejs cleanup

Browse source
This commit is contained in:
Matt Walsh 2022-12-12 14:47:53 -06:00
parent e326c3464b
commit e5a18ea073
4 changed files with 60 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

106
server/scripts/index.mjs
View file

@ -3,12 +3,13 @@ import noSleep from './modules/utils/nosleep.mjs';
import { import {
message as navMessage, isPlaying, resize, resetStatuses, latLonReceived, stopAutoRefreshTimer, registerRefreshData, message as navMessage, isPlaying, resize, resetStatuses, latLonReceived, stopAutoRefreshTimer, registerRefreshData,
} from './modules/navigation.mjs'; } from './modules/navigation.mjs';
import { round2 } from './modules/utils/units.mjs';
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
init(); init();
}); });
let FullScreenOverride = false; let fullScreenOverride = false;
const categories = [ const categories = [
'Land Features', 'Land Features',
@ -27,7 +28,7 @@ const init = () => {
e.target.select(); e.target.select();
}); });
registerRefreshData(LoadTwcData); registerRefreshData(loadData);
document.getElementById('NavigateMenu').addEventListener('click', btnNavigateMenuClick); document.getElementById('NavigateMenu').addEventListener('click', btnNavigateMenuClick);
document.getElementById('NavigateRefresh').addEventListener('click', btnNavigateRefreshClick); document.getElementById('NavigateRefresh').addEventListener('click', btnNavigateRefreshClick);
@ -38,11 +39,11 @@ const init = () => {
document.getElementById('btnGetGps').addEventListener('click', btnGetGpsClick); document.getElementById('btnGetGps').addEventListener('click', btnGetGpsClick);
document.getElementById('divTwc').addEventListener('click', () => { document.getElementById('divTwc').addEventListener('click', () => {
if (document.fullscreenElement) UpdateFullScreenNavigate(); if (document.fullscreenElement) updateFullScreenNavigate();
}); });
document.addEventListener('keydown', documentKeydown); document.addEventListener('keydown', documentKeydown);
document.addEventListener('touchmove', (e) => { if (FullScreenOverride) e.preventDefault(); }); document.addEventListener('touchmove', (e) => { if (fullScreenOverride) e.preventDefault(); });
$('#frmGetLatLng #txtAddress').devbridgeAutocomplete({ $('#frmGetLatLng #txtAddress').devbridgeAutocomplete({
serviceUrl: 'https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/suggest', serviceUrl: 'https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/suggest',
@ -56,7 +57,7 @@ const init = () => {
}, },
dataType: 'json', dataType: 'json',
transformResult: (response) => ({ transformResult: (response) => ({
suggestions: $.map(response.suggestions, (i) => ({ suggestions: response.suggestions.map((i) => ({
value: i.text, value: i.text,
data: i.magicKey, data: i.magicKey,
})), })),
@ -68,23 +69,23 @@ const init = () => {
width: 490, width: 490,
}); });
const ac = $('#frmGetLatLng #txtAddress').devbridgeAutocomplete();
$('#frmGetLatLng').on('submit', () => { $('#frmGetLatLng').on('submit', () => {
if (ac.suggestions[0]) $(ac.suggestionsContainer.children[0]).click(); const ac = $('#frmGetLatLng #txtAddress').devbridgeAutocomplete();
if (ac.suggestions[0]) $(ac.suggestionsContainer.children[0]).trigger('click');
return false; return false;
}); });
// Auto load the previous query // Auto load the previous query
const TwcQuery = localStorage.getItem('TwcQuery'); const query = localStorage.getItem('latLonQuery');
const TwcLatLong = localStorage.getItem('TwcLatLon'); const latLon = localStorage.getItem('latLonLon');
if (TwcQuery && TwcLatLong) { if (query && latLon) {
const txtAddress = document.getElementById('txtAddress'); const txtAddress = document.getElementById('txtAddress');
txtAddress.value = TwcQuery; txtAddress.value = query;
LoadTwcData(JSON.parse(TwcLatLong)); loadData(JSON.parse(latLon));
} }
const TwcPlay = localStorage.getItem('TwcPlay'); const twcPlay = localStorage.getItem('play');
if (TwcPlay === null || TwcPlay === 'true') postMessage('navButton', 'play'); if (twcPlay === null || twcPlay === 'true') postMessage('navButton', 'play');
document.getElementById('btnClearQuery').addEventListener('click', () => { document.getElementById('btnClearQuery').addEventListener('click', () => {
document.getElementById('spanCity').innerHTML = ''; document.getElementById('spanCity').innerHTML = '';
@ -93,19 +94,14 @@ const init = () => {
document.getElementById('spanRadarId').innerHTML = ''; document.getElementById('spanRadarId').innerHTML = '';
document.getElementById('spanZoneId').innerHTML = ''; document.getElementById('spanZoneId').innerHTML = '';
localStorage.removeItem('TwcScrollText');
localStorage.removeItem('TwcScrollTextChecked');
document.getElementById('chkAutoRefresh').checked = true; document.getElementById('chkAutoRefresh').checked = true;
localStorage.removeItem('TwcAutoRefresh'); localStorage.removeItem('autoRefresh');
document.getElementById('radEnglish').checked = true; localStorage.removeItem('play');
localStorage.removeItem('TwcPlay');
postMessage('navButton', 'play'); postMessage('navButton', 'play');
localStorage.removeItem('TwcQuery'); localStorage.removeItem('latLonQuery');
localStorage.removeItem('TwcLatLon'); localStorage.removeItem('latLonLon');
}); });
// swipe functionality // swipe functionality
@ -134,20 +130,20 @@ const autocompleteOnSelect = async (suggestion, elem) => {
}; };
const doRedirectToGeometry = (geom) => { const doRedirectToGeometry = (geom) => {
const latLon = { lat: Math.round2(geom.y, 4), lon: Math.round2(geom.x, 4) }; const latLon = { lat: round2(geom.y, 4), lon: round2(geom.x, 4) };
// Save the query // Save the query
localStorage.setItem('TwcQuery', document.getElementById('txtAddress').value); localStorage.setItem('latLonQuery', document.getElementById('txtAddress').value);
localStorage.setItem('TwcLatLon', JSON.stringify(latLon)); localStorage.setItem('latLonLon', JSON.stringify(latLon));
// get the data // get the data
LoadTwcData(latLon); loadData(latLon);
}; };
const btnFullScreenClick = () => { const btnFullScreenClick = () => {
if (!document.fullscreenElement) { if (!document.fullscreenElement) {
EnterFullScreen(); enterFullScreen();
} else { } else {
ExitFullscreen(); exitFullscreen();
} }
if (isPlaying()) { if (isPlaying()) {
@ -156,12 +152,12 @@ const btnFullScreenClick = () => {
noSleep(false); noSleep(false);
} }
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
const EnterFullScreen = () => { const enterFullScreen = () => {
const element = document.getElementById('divTwc'); const element = document.getElementById('divTwc');
// Supports most browsers and their versions. // Supports most browsers and their versions.
@ -174,10 +170,10 @@ const EnterFullScreen = () => {
} else { } else {
// iOS doesn't support FullScreen API. // iOS doesn't support FullScreen API.
window.scrollTo(0, 0); window.scrollTo(0, 0);
FullScreenOverride = true; fullScreenOverride = true;
} }
resize(); resize();
UpdateFullScreenNavigate(); updateFullScreenNavigate();
// change hover text and image // change hover text and image
const img = document.getElementById('ToggleFullScreen'); const img = document.getElementById('ToggleFullScreen');
@ -185,11 +181,11 @@ const EnterFullScreen = () => {
img.title = 'Exit fullscreen'; img.title = 'Exit fullscreen';
}; };
const ExitFullscreen = () => { const exitFullscreen = () => {
// exit full-screen // exit full-screen
if (FullScreenOverride) { if (fullScreenOverride) {
FullScreenOverride = false; fullScreenOverride = false;
} }
if (document.exitFullscreen) { if (document.exitFullscreen) {
@ -211,15 +207,15 @@ const ExitFullscreen = () => {
const btnNavigateMenuClick = () => { const btnNavigateMenuClick = () => {
postMessage('navButton', 'menu'); postMessage('navButton', 'menu');
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
const LoadTwcData = (_latLon) => { const loadData = (_latLon) => {
// if latlon is provided store it locally // if latlon is provided store it locally
if (_latLon) LoadTwcData.latLon = _latLon; if (_latLon) loadData.latLon = _latLon;
// get the data // get the data
const { latLon } = LoadTwcData; const { latLon } = loadData;
// if there's no data stop // if there's no data stop
if (!latLon) return; if (!latLon) return;
@ -243,39 +239,39 @@ const swipeCallBack = (direction) => {
const btnNavigateRefreshClick = () => { const btnNavigateRefreshClick = () => {
resetStatuses(); resetStatuses();
LoadTwcData(); loadData();
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
const btnNavigateNextClick = () => { const btnNavigateNextClick = () => {
postMessage('navButton', 'next'); postMessage('navButton', 'next');
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
const btnNavigatePreviousClick = () => { const btnNavigatePreviousClick = () => {
postMessage('navButton', 'previous'); postMessage('navButton', 'previous');
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
let NavigateFadeIntervalId = null; let navigateFadeIntervalId = null;
const UpdateFullScreenNavigate = () => { const updateFullScreenNavigate = () => {
document.activeElement.blur(); document.activeElement.blur();
document.getElementById('divTwcBottom').classList.remove('hidden'); document.getElementById('divTwcBottom').classList.remove('hidden');
document.getElementById('divTwcBottom').classList.add('visible'); document.getElementById('divTwcBottom').classList.add('visible');
if (NavigateFadeIntervalId) { if (navigateFadeIntervalId) {
clearTimeout(NavigateFadeIntervalId); clearTimeout(navigateFadeIntervalId);
NavigateFadeIntervalId = null; navigateFadeIntervalId = null;
} }
NavigateFadeIntervalId = setTimeout(() => { navigateFadeIntervalId = setTimeout(() => {
if (document.fullscreenElement) { if (document.fullscreenElement) {
document.getElementById('divTwcBottom').classList.remove('visible'); document.getElementById('divTwcBottom').classList.remove('visible');
document.getElementById('divTwcBottom').classList.add('hidden'); document.getElementById('divTwcBottom').classList.add('hidden');
@ -324,11 +320,9 @@ const documentKeydown = (e) => {
return false; return false;
}; };
Math.round2 = (value, decimals) => Number(`${Math.round(`${value}e${decimals}`)}e-${decimals}`);
const btnNavigatePlayClick = () => { const btnNavigatePlayClick = () => {
postMessage('navButton', 'playToggle'); postMessage('navButton', 'playToggle');
UpdateFullScreenNavigate(); updateFullScreenNavigate();
return false; return false;
}; };
@ -363,13 +357,13 @@ const btnGetGpsClick = async () => {
const { City } = data.address; const { City } = data.address;
const State = states.getTwoDigitCode(data.address.Region); const State = states.getTwoDigitCode(data.address.Region);
const Country = data.address.CountryCode; const Country = data.address.CountryCode;
const TwcQuery = `${ZipCode}, ${City}, ${State}, ${Country}`; const query = `${ZipCode}, ${City}, ${State}, ${Country}`;
const txtAddress = document.getElementById('txtAddress'); const txtAddress = document.getElementById('txtAddress');
txtAddress.value = TwcQuery; txtAddress.value = query;
txtAddress.blur(); txtAddress.blur();
txtAddress.focus(); txtAddress.focus();
// Save the query // Save the query
localStorage.setItem('TwcQuery', TwcQuery); localStorage.setItem('latLonQuery', query);
}; };

3
server/scripts/modules/utils/units.mjs
View file

@ -1,6 +1,6 @@
// *********************************** unit conversions *********************** // *********************************** unit conversions ***********************
const round2 = (value, decimals) => Number(`${Math.round(`${value}e${decimals}`)}e-${decimals}`); const round2 = (value, decimals) => Math.trunc(value * 10 ** decimals) / 10 ** decimals;
const kphToMph = (Kph) => Math.round(Kph / 1.60934); const kphToMph = (Kph) => Math.round(Kph / 1.60934);
const celsiusToFahrenheit = (Celsius) => Math.round((Celsius * 9) / 5 + 32); const celsiusToFahrenheit = (Celsius) => Math.round((Celsius * 9) / 5 + 32);
@ -14,4 +14,5 @@ export {
kilometersToMiles, kilometersToMiles,
metersToFeet, metersToFeet,
pascalToInHg, pascalToInHg,
round2,
}; };

6
server/scripts/modules/weatherdisplay.mjs
View file

@ -52,7 +52,7 @@ class WeatherDisplay {
if (this.elemId === 'progress') return false; if (this.elemId === 'progress') return false;
// get the saved status of the checkbox // get the saved status of the checkbox
let savedStatus = window.localStorage.getItem(`${this.elemId}Enabled`); let savedStatus = window.localStorage.getItem(`display-enabled: ${this.elemId}`);
if (savedStatus === null) savedStatus = defaultEnabled; if (savedStatus === null) savedStatus = defaultEnabled;
if (savedStatus === 'true' || savedStatus === true) { if (savedStatus === 'true' || savedStatus === true) {
this.enabled = true; this.enabled = true;
@ -61,7 +61,7 @@ class WeatherDisplay {
} }
// refresh (or initially store the state of the checkbox) // refresh (or initially store the state of the checkbox)
window.localStorage.setItem(`${this.elemId}Enabled`, this.enabled); window.localStorage.setItem(`display-enabled: ${this.elemId}`, this.enabled);
// create a checkbox in the selected displays area // create a checkbox in the selected displays area
const checkbox = document.createElement('template'); const checkbox = document.createElement('template');
@ -77,7 +77,7 @@ class WeatherDisplay {
// update the state // update the state
this.enabled = e.target.checked; this.enabled = e.target.checked;
// store the value for the next load // store the value for the next load
window.localStorage.setItem(`${this.elemId}Enabled`, this.enabled); window.localStorage.setItem(`display-enabled: ${this.elemId}`, this.enabled);
// calling get data will update the status and actually get the data if we're set to enabled // calling get data will update the status and actually get the data if we're set to enabled
this.getData(); this.getData();
} }

5
ws4kp.code-workspace
View file

@ -50,5 +50,10 @@
"[html]": { "[html]": {
"editor.defaultFormatter": "j69.ejs-beautify" "editor.defaultFormatter": "j69.ejs-beautify"
}, },
"files.exclude": {
"**/node_modules": true,
"**/debug.log": true,
"server/scripts/custom.js": true
},
}, },
} }