thestigh / mmm-windyv2 Goto Github PK

Hey. Great idea for a module, love the windy map. Unfortunately I just get a grey background when I set up this module, all other modules are fine. Any idea what the problem could be?

Hi,

Please add a noob installation guide to the front page for people like me, saves some time:

Step 1
Navigate into your MagicMirror's modules folder and execute: git clone https://github.com/TheStigh/MMM-WindyV2.

Step 2
Add the module in config.js placing it where you prefer.

Hi all,

For anyone like myself looking at this module, I was able to get it working as I wanted by making the following adjustments:

In MMM-WindyV2.js, I updated the following line:
From:
56: 'https://unpkg.com/[email protected]/dist/leaflet.js',

To:
56: 'https://unpkg.com/[email protected]/dist/leaflet.js',

This got the module working alone, but I wanted to use windy with "radar" so I added the "overlay" line on 130:
/////////////////////////////////////////////////////////////////////////////////////
scheduleInit: function(delay) {
setTimeout(() => {
const options = {
graticule: false,
key: this.config.apiKey,
lat: this.config.latitude,
lon: this.config.longitude,
animate: false,
zoom: this.config.zoomLevel,
minZoom: 3,
maxZoom: 18,
overlay: 'radar', //ADDED THIS LINE TO FORCE RADAR

Finally, I wanted the radar to automatically 'play', as well as remove all the other unnecessary buttons/logos/ etc. Therefore, i made the below adjustments to the MAIN.JS of MM at the very end:

// Add polyfill for Object.assign.
if (typeof Object.assign !== "function") {
(function () {
Object.assign = function (target) {
"use strict";
if (target === undefined || target === null) {
throw new TypeError("Cannot convert undefined or null to object");
}
const output = Object(target);
for (let index = 1; index < arguments.length; index++) {
const source = arguments[index];
if (source !== undefined && source !== null) {
for (const nextKey in source) {
if (source.hasOwnProperty(nextKey)) {
output[nextKey] = source[nextKey];
}
}
}
}
return output;
};
})();
}
///////BELOW WILL AUTOMATICALLY CLICK THE PLAY BUTTON///////
setTimeout(function() {
document.evaluate(
'//[@[starts-with(name(), "data-ref")]="play"]',
document,
null,
XPathResult.ANY_TYPE,
null
).iterateNext().click()
}, 2000);
///////BELOW WILL HIDE LOADING BARS AND LOGOS///////
setTimeout(function() {
document.getElementById("radar-wrapper").style.display = "none";
document.getElementById("progress-bar").style.display = "none";
document.getElementById("mobile-ovr-select").style.display = "none";
document.getElementById("logo").style.display = "none";
}, 3000);
//////////////////////////////////////////////////////////////////
MM.init();

With these changes above, I now have a radar loop that will display as the background of my magic mirror. Currently, I have a cronjob to restart MM every 6 hours as the radar play will eventually expire. I'm sure there is a better way to achieve this but I haven't explored any other options yet. Lastly, here is an example of my config.js for reference.

{
disabled: false,
module: "MMM-WindyV2",
position: 'fullscreen_above', // this must be set to 'fullscreen_above'
config: {
apiKey: 'PLACE YOUR API KEY HERE!!!!', // insert your free or paid API key here
initLoadDelay: 50, // optional, default is 50 milliseconds
latitude: 69.123, // example: 69.123
longitude: 17.123, // example: 17.123
zoomLevel: 9, // set your preferred zoom level
showLayer: 'radar', // wind, rain, clouds, temp, pressure, currents, waves
rotateLayers: false, // set to true to rotate layers
layersToRotate: ['radar','radar'], // layers to rotate
delayRotate: 5000, // delay between rotated layers, in milliseconds
wMinZoom: 3, // set minimum zoom level for WindyV2
wMaxZoom: 17, // set maximum zoom level for WindyV2
windyMetric: 'm/s', // 'kt', 'bft', 'm/s', 'km/h' and 'mph'
updateTimer: 60 * 60 * 1000 * 6, // update per 6 hours
retainZoom: true // retain zoomlevel between changing overlays
}
},

I hope this helps someone looking to achieve the same goal as I was!