radar complete

This commit is contained in:
Matt Walsh
2022-09-05 10:52:30 -05:00
parent 31343f3eff
commit c109e2604a
7 changed files with 114 additions and 32 deletions

View File

@@ -1,10 +1,10 @@
// current weather conditions display
/* globals WeatherDisplay, utils, STATUS, draw, luxon */
/* globals WeatherDisplay, utils, STATUS, luxon */
// eslint-disable-next-line no-unused-vars
class Radar extends WeatherDisplay {
constructor(navId, elemId) {
super(navId, elemId, 'Local Radar');
super(navId, elemId, 'Local Radar', true, true);
// set max images
this.dopplerRadarImageMax = 6;
@@ -204,31 +204,10 @@ class Radar extends WeatherDisplay {
async drawCanvas() {
super.drawCanvas();
if (this.screenIndex === -1) return;
const { DateTime } = luxon;
// Title
draw.text(this.context, 'Arial', 'bold 28pt', '#ffffff', 155, 60, 'Local', 2);
draw.text(this.context, 'Arial', 'bold 28pt', '#ffffff', 155, 95, 'Radar', 2);
draw.text(this.context, 'Star4000', 'bold 18pt', '#ffffff', 438, 49, 'PRECIP', 2, 'center');
draw.text(this.context, 'Star4000', 'bold 18pt', '#ffffff', 298, 73, 'Light', 2);
draw.text(this.context, 'Star4000', 'bold 18pt', '#ffffff', 517, 73, 'Heavy', 2);
let x = 362;
const y = 52;
draw.box(this.context, '#000000', x - 2, y - 2, 154, 28);
draw.box(this.context, 'rgb(49, 210, 22)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(28, 138, 18)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(20, 90, 15)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(10, 40, 10)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(196, 179, 70)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(190, 72, 19)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(171, 14, 14)', x, y, 17, 24); x += 19;
draw.box(this.context, 'rgb(115, 31, 4)', x, y, 17, 24); x += 19;
this.context.drawImage(this.data[this.screenIndex], 0, 0, 640, 367, 0, 113, 640, 367);
draw.text(this.context, 'Star4000 Small', '24pt', '#ffffff', 438, 105, this.times[this.screenIndex].toLocaleString(DateTime.TIME_SIMPLE), 2, 'center');
const time = this.times[this.screenIndex].toLocaleString(DateTime.TIME_SIMPLE);
const timePadded = time.length >= 8 ? time : ` ${time}`;
this.elem.querySelector('.header .right .time').innerHTML = timePadded;
// scroll to image
this.elem.querySelector('.scroll-area').style.top = `${-this.screenIndex * 371}px`;