From 58e11474a997ef94aa44fa0f2e86205664afded2 Mon Sep 17 00:00:00 2001 From: Matt Walsh Date: Mon, 21 Nov 2022 21:50:22 -0600 Subject: [PATCH] canvas reference cleanup --- package.json | 4 +- server/scripts/data/regionalcities.js | 1 - server/scripts/index.js | 4 +- server/scripts/modules/almanac.js | 2 +- server/scripts/modules/currentweather.js | 32 +- server/scripts/modules/extendedforecast.js | 2 +- server/scripts/modules/hourly.js | 2 +- server/scripts/modules/latestobservations.js | 2 +- server/scripts/modules/localforecast.js | 2 +- server/scripts/modules/progress.js | 9 +- server/scripts/modules/radar.js | 2 +- server/scripts/modules/regionalforecast.js | 7 +- server/scripts/modules/travelforecast.js | 2 +- server/scripts/modules/utilities.js | 25 -- server/scripts/modules/weatherdisplay.js | 83 +---- server/scripts/twc3.js | 288 ------------------ .../scripts/vendor/jquery.touchswipe.min.js | 14 - server/styles/main.css | 2 +- server/styles/main.css.map | 2 +- views/index.ejs | 1 - 20 files changed, 26 insertions(+), 460 deletions(-) delete mode 100644 server/scripts/twc3.js delete mode 100644 server/scripts/vendor/jquery.touchswipe.min.js diff --git a/package.json b/package.json index cf5d9a2..689976f 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,9 @@ "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", - "build:css": "sass ./server/styles/scss/style.scss ./server/styles/compiled.css" + "build:css": "sass ./server/styles/scss/style.scss ./server/styles/compiled.css", + "lint": "eslint ./server/scripts/**", + "lint:fix": "eslint --fix ./server/scripts/**" }, "repository": { "type": "git", diff --git a/server/scripts/data/regionalcities.js b/server/scripts/data/regionalcities.js index 6c07d6c..b88cd7e 100644 --- a/server/scripts/data/regionalcities.js +++ b/server/scripts/data/regionalcities.js @@ -581,4 +581,3 @@ const RegionalCities = [ lon: -110.9698, }, ]; - diff --git a/server/scripts/index.js b/server/scripts/index.js index 8344ec4..83d84c7 100644 --- a/server/scripts/index.js +++ b/server/scripts/index.js @@ -4,9 +4,7 @@ document.addEventListener('DOMContentLoaded', () => { }); const index = (() => { - const overrides = { - // '32899, Orlando, Florida, USA': { x: -80.6774, y: 28.6143 }, - }; + const overrides = {}; const AutoRefreshIntervalMs = 500; const AutoRefreshTotalIntervalMs = 600000; // 10 min. diff --git a/server/scripts/modules/almanac.js b/server/scripts/modules/almanac.js index 63ecd28..73bec99 100644 --- a/server/scripts/modules/almanac.js +++ b/server/scripts/modules/almanac.js @@ -5,7 +5,7 @@ // eslint-disable-next-line no-unused-vars class Almanac extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Almanac', true, true); + super(navId, elemId, 'Almanac', true); // pre-load background images (returns promises) this.backgroundImage0 = utils.image.load('images/BackGround3_1.png'); diff --git a/server/scripts/modules/currentweather.js b/server/scripts/modules/currentweather.js index f4346b2..7a5d419 100644 --- a/server/scripts/modules/currentweather.js +++ b/server/scripts/modules/currentweather.js @@ -4,7 +4,7 @@ // eslint-disable-next-line no-unused-vars class CurrentWeather extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Current Conditions', true, true); + super(navId, elemId, 'Current Conditions', true); // pre-load background image (returns promise) this.backgroundImage = utils.image.load('images/BackGround1_1.png'); } @@ -134,36 +134,6 @@ class CurrentWeather extends WeatherDisplay { fill.visibility = data.Visibility + data.VisibilityUnit; fill.pressure = `${data.Pressure} ${data.PressureDirection}`; - // switch (data.PressureDirection) { - // case 'R': - // // Shadow - // draw.triangle(this.context, '#000000', 552, 302, 542, 312, 562, 312); - // draw.box(this.context, '#000000', 549, 312, 6, 15); - - // // Border - // draw.triangle(this.context, '#000000', 550, 300, 540, 310, 560, 310); - // draw.box(this.context, '#000000', 547, 310, 6, 15); - - // // Fill - // draw.triangle(this.context, '#FFFF00', 550, 301, 541, 309, 559, 309); - // draw.box(this.context, '#FFFF00', 548, 309, 4, 15); - // break; - // case 'F': - // // Shadow - // draw.triangle(this.context, '#000000', 552, 327, 542, 317, 562, 317); - // draw.box(this.context, '#000000', 549, 302, 6, 15); - - // // Border - // draw.triangle(this.context, '#000000', 550, 325, 540, 315, 560, 315); - // draw.box(this.context, '#000000', 547, 300, 6, 15); - - // // Fill - // draw.triangle(this.context, '#FFFF00', 550, 324, 541, 314, 559, 314); - // draw.box(this.context, '#FFFF00', 548, 301, 4, 15); - // break; - // default: - // } - if (data.observations.heatIndex.value && data.HeatIndex !== data.Temperature) { fill['heat-index-label'] = 'Heat Index:'; fill['heat-index'] = data.HeatIndex + String.fromCharCode(176); diff --git a/server/scripts/modules/extendedforecast.js b/server/scripts/modules/extendedforecast.js index c64a7eb..ca64ead 100644 --- a/server/scripts/modules/extendedforecast.js +++ b/server/scripts/modules/extendedforecast.js @@ -6,7 +6,7 @@ // eslint-disable-next-line no-unused-vars class ExtendedForecast extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Extended Forecast', true, true); + super(navId, elemId, 'Extended Forecast', true); // set timings this.timing.totalScreens = 2; diff --git a/server/scripts/modules/hourly.js b/server/scripts/modules/hourly.js index c4b7a3d..a8aadab 100644 --- a/server/scripts/modules/hourly.js +++ b/server/scripts/modules/hourly.js @@ -5,7 +5,7 @@ class Hourly extends WeatherDisplay { constructor(navId, elemId, defaultActive) { // special height and width for scrolling - super(navId, elemId, 'Hourly Forecast', defaultActive, true); + super(navId, elemId, 'Hourly Forecast', defaultActive); // set up the timing this.timing.baseDelay = 20; diff --git a/server/scripts/modules/latestobservations.js b/server/scripts/modules/latestobservations.js index dca1250..baaa0d5 100644 --- a/server/scripts/modules/latestobservations.js +++ b/server/scripts/modules/latestobservations.js @@ -4,7 +4,7 @@ // eslint-disable-next-line no-unused-vars class LatestObservations extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Latest Observations', true, true); + super(navId, elemId, 'Latest Observations', true); // constants this.MaximumRegionalStations = 7; diff --git a/server/scripts/modules/localforecast.js b/server/scripts/modules/localforecast.js index 22f5c63..bc0612e 100644 --- a/server/scripts/modules/localforecast.js +++ b/server/scripts/modules/localforecast.js @@ -5,7 +5,7 @@ // eslint-disable-next-line no-unused-vars class LocalForecast extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Local Forecast', true, true); + super(navId, elemId, 'Local Forecast', true); // set timings this.timing.baseDelay = 5000; diff --git a/server/scripts/modules/progress.js b/server/scripts/modules/progress.js index 25fd34a..ee7ebd4 100644 --- a/server/scripts/modules/progress.js +++ b/server/scripts/modules/progress.js @@ -5,7 +5,7 @@ // eslint-disable-next-line no-unused-vars class Progress extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, '', false, true); + super(navId, elemId, '', false); // pre-load background image (returns promise) this.backgroundImage = utils.image.load('images/BackGround1_1.png'); @@ -97,12 +97,7 @@ class Progress extends WeatherDisplay { const display = navigation.getDisplay(index); if (display && display.status === STATUS.loaded) { display.showCanvas(navigation.msg.command.firstFrame); - if (this.canvas) { - this.canvas.style.display = 'none'; - } - if (this.isHtml) { - this.elem.classList.remove('show'); - } + this.elem.classList.remove('show'); } } } diff --git a/server/scripts/modules/radar.js b/server/scripts/modules/radar.js index a7700aa..fbab92b 100644 --- a/server/scripts/modules/radar.js +++ b/server/scripts/modules/radar.js @@ -4,7 +4,7 @@ // eslint-disable-next-line no-unused-vars class Radar extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Local Radar', true, true); + super(navId, elemId, 'Local Radar', true); // set max images this.dopplerRadarImageMax = 6; diff --git a/server/scripts/modules/regionalforecast.js b/server/scripts/modules/regionalforecast.js index c4e3763..04d2722 100644 --- a/server/scripts/modules/regionalforecast.js +++ b/server/scripts/modules/regionalforecast.js @@ -6,7 +6,7 @@ // eslint-disable-next-line no-unused-vars class RegionalForecast extends WeatherDisplay { constructor(navId, elemId) { - super(navId, elemId, 'Regional Forecast', true, true); + super(navId, elemId, 'Regional Forecast', true); // timings this.timing.totalScreens = 3; @@ -102,7 +102,7 @@ class RegionalForecast extends WeatherDisplay { RegionalForecast.buildForecast(forecast.properties.periods[2], city, cityXY), ]; } catch (e) { - console.log(`No regional forecast data for '${city.name}'`); + console.log(`No regional forecast data for '${city.name ?? city.city}'`); console.log(e); return false; } @@ -149,11 +149,12 @@ class RegionalForecast extends WeatherDisplay { // get the observation data const observation = await utils.fetch.json(`${station}/observations/latest`); // preload the image + if (!observation.properties.icon) return false; utils.image.preload(icons.getWeatherRegionalIconFromIconLink(observation.properties.icon, !observation.properties.daytime)); // return the observation return observation.properties; } catch (e) { - console.log(`Unable to get regional observations for ${city.Name}`); + console.log(`Unable to get regional observations for ${city.Name ?? city.city}`); console.error(e.status, e.responseJSON); return false; } diff --git a/server/scripts/modules/travelforecast.js b/server/scripts/modules/travelforecast.js index f62f221..dafe2d2 100644 --- a/server/scripts/modules/travelforecast.js +++ b/server/scripts/modules/travelforecast.js @@ -5,7 +5,7 @@ class TravelForecast extends WeatherDisplay { constructor(navId, elemId, defaultActive) { // special height and width for scrolling - super(navId, elemId, 'Travel Forecast', defaultActive, true); + super(navId, elemId, 'Travel Forecast', defaultActive); // set up the timing this.timing.baseDelay = 20; diff --git a/server/scripts/modules/utilities.js b/server/scripts/modules/utilities.js index 97559a8..6b95dfb 100644 --- a/server/scripts/modules/utilities.js +++ b/server/scripts/modules/utilities.js @@ -1,6 +1,5 @@ // radar utilities -/* globals SuperGif */ // eslint-disable-next-line no-unused-vars const utils = (() => { // ****************************** weather data ******************************** @@ -30,12 +29,6 @@ const utils = (() => { } }); - // async version of SuperGif - const superGifAsync = (e) => new Promise((resolve) => { - const gif = new SuperGif(e); - gif.load(() => resolve(gif)); - }); - // preload an image // the goal is to get it in the browser's cache so it is available more quickly when the browser needs it // a list of cached icons is used to avoid hitting the cache multiple times @@ -47,22 +40,6 @@ const utils = (() => { return true; }; - // draw an image on a local canvas and return the context - const drawLocalCanvas = (img) => { - // create a canvas - const canvas = document.createElement('canvas'); - canvas.width = img.width; - canvas.height = img.height; - - // get the context - const context = canvas.getContext('2d'); - context.imageSmoothingEnabled = false; - - // draw the image - context.drawImage(img, 0, 0); - return context; - }; - // *********************************** unit conversions *********************** Math.round2 = (value, decimals) => Number(`${Math.round(`${value}e${decimals}`)}e-${decimals}`); @@ -218,9 +195,7 @@ const utils = (() => { }, image: { load: loadImg, - superGifAsync, preload, - drawLocalCanvas, }, weather: { getPoint, diff --git a/server/scripts/modules/weatherdisplay.js b/server/scripts/modules/weatherdisplay.js index a608128..062e1c4 100644 --- a/server/scripts/modules/weatherdisplay.js +++ b/server/scripts/modules/weatherdisplay.js @@ -12,7 +12,7 @@ const STATUS = { // eslint-disable-next-line no-unused-vars class WeatherDisplay { - constructor(navId, elemId, name, defaultEnabled, isHtml) { + constructor(navId, elemId, name, defaultEnabled) { // navId is used in messaging this.navId = navId; this.elemId = undefined; @@ -21,7 +21,6 @@ class WeatherDisplay { this.loadingStatus = STATUS.loading; this.name = name ?? elemId; this.getDataCallbacks = []; - this.isHtml = isHtml; // default navigation timing this.timing = { @@ -32,8 +31,8 @@ class WeatherDisplay { this.navBaseCount = 0; this.screenIndex = -1; // special starting condition - // create the canvas, also stores this.elemId - this.createCanvas(elemId); + // store elemId once + this.storeElemId(elemId); if (elemId !== 'progress') this.addCheckbox(defaultEnabled); if (this.enabled) { @@ -96,21 +95,10 @@ class WeatherDisplay { this.loadingStatus = state; } - createCanvas(elemId, width = 640, height = 480) { + storeElemId(elemId) { // only create it once if (this.elemId) return; this.elemId = elemId; - - // no additional work if this is HTML - if (this.isHtml) return; - - // create a canvas - const canvas = document.createElement('template'); - canvas.innerHTML = `