Hi all, it has taken a while for me, particularly as I was making the mirror for my wife as a surprise so keeping it under wraps in my workshop was difficult. Plus we had a baby in the meantime which really puts a stopper in workshop projects. But here it is:

A quick run down of what I used:

Raspberry Pi 3
Lenovo ThinkVision LT2323p 23" - no HDMI input, but I bought a HDMI to DVI cable and it did the job nicely
Belkin power adapter with usb power ports. Kept all of the monitor and Pi power internal.
You may notice that the monitor is kept in place by two L-brackets - spares from building Ikea bookshelves (they’re used to stop the bookshelf being pulled over). They came in very handy!
Velcro cable ties, Velcro dots and some double sided tape to keep everything on the back of the frame and monitor.
Speaking of the frame, just used Pine boards, butt jointed into the frame and then topped it with oak beading for a bit of decoration. That really came up a treat!

Painted with a water based enamel white.
Had the glass cut to size and then used 97% mirror film for the mirror. There are tiny air bubbles in the mirror, but only if you are up close. I may redo that some time down the track
Oh and I put it on the wall with a monitor wall stand which just slots in to attachment on the wall. As my monitor frame was quite deep, I had to do some Macgyver action with the wall plate. Utilised an offcut from my workshop tool bench frame that I made last summer.

So there you have it. It was a fun project, my wife likes it and I’m ready for another challenge (although we have enough with two little ones to look after for the moment)…
Mat

One aspect of the weather module I found was missing was the wind direction. Open Weather produces a wind direction as a number in degrees, however I prefer the compass points.

For anyone interested in my code in the currentweather.js file:

1. For the main display of wind speed and direction (I’ve also got rid of the Beaufort speeds and changed it back to km/h) my code is as follows:

var windSpeed = document.createElement("span");
windSpeed.innerHTML = " " + this.windSpeed + "km/h " + this.windDirection;
small.appendChild(windSpeed);

2. In the “processWeather” function I have the following:

processWeather: function(data) {
		this.temperature = this.roundValue(data.main.temp);
		this.windSpeed = this.roundValue((data.wind.speed)* 60 * 60 / 1000);
		this.windDeg = data.wind.deg;
		this.windDirection = this.deg2dir(this.windDeg);
		this.weatherType = this.config.iconTable[data.weather[0].icon];

From this function I removed the coversion to the Beaufort scale and added a windSpeed variable to convert metres per second to km/h. Then I have two lines, one giving me the current wind direction in degrees (windDeg) and windDirection which I convert below…

3. My deg2dir function is a simple nested array which converts the numerical degrees value into a compass point direction:

deg2dir: function(windDeg) {
		var degrees = [[11.25,"N"],[33.75,"NNE"],[56.25, "NE"],[78.75, "ENE"],[101.25, "E"], [123.75,"ESE"], [146.25,"SE"],[168.75, "SSE"],[191.25,"S"],[213.75, "SSW"],[236.25, "SW"],[258.75, "WSW"],[281.25,"W"],[303.75,"WNW"],[326.25,"NW"],[348.75,"NNW"],[360, "N"]];
			for (var i=0; i<degrees.length; i++) {
			var direction = degrees[i][0];
			if (direction > windDeg) {
				return degrees[i][1];
			}
		}
		return "";
	},

Hope this is of use to someone who is looking for alternative data to display.

Cheers,

Mat

Note from Moderator: Please use Markdown on code snippets for easier reading.

It seems that since I have updated my mirror to the live version 2 (was working on v2-beta for some time) that there has been very similar code included in the latest version to cater for wind direction, as well as the option to not use the Beaufort scale for wind speed.

I’ll have to come up with some new code to blow your minds with…

Cheers,

Mat

@jc21 Yes that is the stuff I used. For some reason I thought it was a 10m roll, but yes 2.4m x 1.2m Pillar brand. Still plenty of film for multiple mirrors if you need to redo and/or people are impressed enough to ask you to make another for them…

@jc21 I’ll have to get back to you about the brand of the film I used (at work at the moment). Film should be applied to the rear of the glass, works so much better. That way, when you clean the mirror it doesn’t damage the film and it looks way better…

When I sourced my glass (see https://forum.magicmirror.builders/topic/724/mat-s-mirror-completed) I asked about two-way mirror option. They quoted me $200+ (can’t remember the exact figure) for a 312mm x 534mm mirrored glass (23’’ widescreen monitor). Alternatively that size in regular glass cost me $23 and a 10m roll of 97% mirror film was $45 from Bunnings.

As mentioned in my post link above, my mirror is not perfect, but given the relative price of film, if I had the time, I could redo my effort to get a better mirror, but as it is, the tiny air bubbles (less than 1mm) are hardly noticeable unless you get really close up.

Mirror film is quite a reasonable option if cash is tight and/or you have the time to follow the install instructions to the letter and/or you can find a glassy to be mates with who might do it for you…

Anyway that’s my two cents…

Hi all, it has taken a while for me, particularly as I was making the mirror for my wife as a surprise so keeping it under wraps in my workshop was difficult. Plus we had a baby in the meantime which really puts a stopper in workshop projects. But here it is:

A quick run down of what I used:

Raspberry Pi 3
Lenovo ThinkVision LT2323p 23" - no HDMI input, but I bought a HDMI to DVI cable and it did the job nicely
Belkin power adapter with usb power ports. Kept all of the monitor and Pi power internal.
You may notice that the monitor is kept in place by two L-brackets - spares from building Ikea bookshelves (they’re used to stop the bookshelf being pulled over). They came in very handy!
Velcro cable ties, Velcro dots and some double sided tape to keep everything on the back of the frame and monitor.
Speaking of the frame, just used Pine boards, butt jointed into the frame and then topped it with oak beading for a bit of decoration. That really came up a treat!

Painted with a water based enamel white.
Had the glass cut to size and then used 97% mirror film for the mirror. There are tiny air bubbles in the mirror, but only if you are up close. I may redo that some time down the track
Oh and I put it on the wall with a monitor wall stand which just slots in to attachment on the wall. As my monitor frame was quite deep, I had to do some Macgyver action with the wall plate. Utilised an offcut from my workshop tool bench frame that I made last summer.

So there you have it. It was a fun project, my wife likes it and I’m ready for another challenge (although we have enough with two little ones to look after for the moment)…
Mat

It seems that since I have updated my mirror to the live version 2 (was working on v2-beta for some time) that there has been very similar code included in the latest version to cater for wind direction, as well as the option to not use the Beaufort scale for wind speed.

I’ll have to come up with some new code to blow your minds with…

Cheers,

Mat

Thank you all for your help and suggestions and help!.

It seems that as I have been working on this mirror project for some time, I have been working on v2-beta version which has different configuration to the current version. Just reinstalled the mirror and with a couple of minor adjustments have managed to get it working as I like.

Now the config is sorted it’s time to source the monitor and framing materials…

Cheers,

Mat

Here is my complete config.js (with a few identifiers removed). Hoping something jumps out!

/* Magic Mirror Config Sample
*

• By Michael Teeuw http://michaelteeuw.nl
• MIT Licensed.
  */

var config = {
port: 8080,

language: 'en',
timeFormat: 24,

modules: [
	{
		module: 'alert',
	},
	{
		module: 'clock',
		position: 'top_left'
	},
	{
		module: 'calendar',
		header: 'Calendar',
		position: 'top_left',
		config: {
			calendars: [
				{
					symbol: 'calendar-check-o ',
					url: 'webcal://www.calendarlabs.com/templates/ical/Australia-Holidays.ics'
				},
				{
					symbol: 'heart-o',
					url: 'webcal://p08-calendarws.icloud.com/ca/subscribe/1/xxxxxxxxx'
				}
			]
		}
	},
	{
		module: 'compliments',
		position: 'lower_third'
	},
	{
		module: 'currentweather',
		position: 'top_right',
		config: {
			location: 'Perth, AU',
			appid: 'xxxxxxxxx'
		}
	},
	{
		module: 'weatherforecast',
		position: 'top_right',
		header: 'Weather Forecast',
		config: {
            location: 'Perth, AU',
			appid: 'xxxxxxx'
		}
	},
	{
		module: 'newsfeed',
		position: 'bottom_bar',
		config: {
			feedUrl: 'http://www.abc.net.au/news/feed/45910/rss.xml',
			showPublishDate: true
		}
	},
]

};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (typeof module !== ‘undefined’) {module.exports = config;}

Thank you for that. The calendar is starting to work (there seems to be an issue with me including an icloud calendar but I’ll verify that I have the settings correct before hitting up the forum for help with that).

However, now that I have the calendar working, all of the other modules have disappeared (weather, compliments, news rss feed). Has anyone else experienced that?

One aspect of the weather module I found was missing was the wind direction. Open Weather produces a wind direction as a number in degrees, however I prefer the compass points.

For anyone interested in my code in the currentweather.js file:

1. For the main display of wind speed and direction (I’ve also got rid of the Beaufort speeds and changed it back to km/h) my code is as follows:

var windSpeed = document.createElement("span");
windSpeed.innerHTML = " " + this.windSpeed + "km/h " + this.windDirection;
small.appendChild(windSpeed);

2. In the “processWeather” function I have the following:

processWeather: function(data) {
		this.temperature = this.roundValue(data.main.temp);
		this.windSpeed = this.roundValue((data.wind.speed)* 60 * 60 / 1000);
		this.windDeg = data.wind.deg;
		this.windDirection = this.deg2dir(this.windDeg);
		this.weatherType = this.config.iconTable[data.weather[0].icon];

From this function I removed the coversion to the Beaufort scale and added a windSpeed variable to convert metres per second to km/h. Then I have two lines, one giving me the current wind direction in degrees (windDeg) and windDirection which I convert below…

3. My deg2dir function is a simple nested array which converts the numerical degrees value into a compass point direction:

deg2dir: function(windDeg) {
		var degrees = [[11.25,"N"],[33.75,"NNE"],[56.25, "NE"],[78.75, "ENE"],[101.25, "E"], [123.75,"ESE"], [146.25,"SE"],[168.75, "SSE"],[191.25,"S"],[213.75, "SSW"],[236.25, "SW"],[258.75, "WSW"],[281.25,"W"],[303.75,"WNW"],[326.25,"NW"],[348.75,"NNW"],[360, "N"]];
			for (var i=0; i<degrees.length; i++) {
			var direction = degrees[i][0];
			if (direction > windDeg) {
				return degrees[i][1];
			}
		}
		return "";
	},

Hope this is of use to someone who is looking for alternative data to display.

Cheers,

Mat

Note from Moderator: Please use Markdown on code snippets for easier reading.

I have managed to get all of the various modules to work, even wrote some code to display wind direction, converting degrees to compass points (which I’ll share soon).

However, I have not been able to get the calendar to display anything except “module_2_calendar”.

My main question is where should I put the calendar config? In the config.js file or in the calendar module js file? Or both? I feel that I have tried all combinations and don’t seem to be able to get it working at all.

Cheers,

Mat