Magic In The Mirror

  • Magic in the Mirror (1996) A girl (Jaime Renee Smith) finds a magic world on the other side of her grandmother's antique mirror. A girl (Jaime Renee Smith) finds a magic world on the other side of her grandmother's antique mirror. Watch Online.
  • Magic in The Mirror (8) IMDb 5.3 86 min 1996 G Subtitles and Closed Captions. One mirror, two sides. One side is the world we know. The other is guarded by the Mirror.

MagicMirror² is an open source modular smart mirror platform. With a growing list of installable modules, the MagicMirror² allows you to convert your hallway or bathroom mirror into your personal assistant. MagicMirror² is built by the creator of the original MagicMirror with the incredible help of a growing community of contributors.

MagicMirror² focuses on a modular plugin system and uses Electron as an application wrapper. So no more web server or browser installs necessary!

Table Of Contents

  • Installation
    • Raspberry Pi
  • Configuration

Join GitHub today. GitHub is home to over 28 million developers working together to host and review code, manage projects, and build software together. Use your terminal to go to your Magic Mirror folder and type the following command: git pull && npm install. If you changed nothing more than the config or the modules, this should work.

Installation

Raspberry Pi

Automatic Installation (Raspberry Pi only!)

Electron, the app wrapper around MagicMirror², only supports the Raspberry Pi 2/3. The Raspberry Pi 0/1 is currently not supported. If you want to run this on a Raspberry Pi 1, use the server only feature and setup a fullscreen browser yourself. (Yes, people have managed to run MM² also on a Pi0, so if you insist, search in the forums.)

Note that you will need to install the latest full version of Raspbian, don't use the Lite version.

Execute the following command on your Raspberry Pi to install MagicMirror²:

Manual Installation

  1. Download and install the latest Node.js version:
  • curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
  • sudo apt install -y nodejs
  1. Clone the repository and check out the master branch: git clone https://github.com/MichMich/MagicMirror
  2. Enter the repository: cd MagicMirror/
  3. Install and run the app with: npm install && npm start
    For Server Only use: npm install && node serveronly .

⚠️ Important!

  • The installation step for npm install will take a very long time, often with little or no terminal response!
    For the RPi3 this is ~10 minutes and for the Rpi2 ~25 minutes.
    Do not interrupt or you risk getting a 💔 by Raspberry Jam.

Also note that:

Magic In The Mirror
  • npm start does not work via SSH. But you can use DISPLAY=:0 nohup npm start & instead.
    This starts the mirror on the remote display.
  • If you want to debug on Raspberry Pi you can use npm start dev which will start MM with Dev Tools enabled.
  • To access toolbar menu when in mirror mode, hit ALT key.
  • To toggle the (web) Developer Tools from mirror mode, use CTRL-SHIFT-I or ALT and select View.

Server Only

In some cases, you want to start the application without an actual app window. In this case, you can start MagicMirror² in server only mode by manually running node serveronly or using Docker. This will start the server, after which you can open the application in your browser of choice. Detailed description below.

Important: Make sure that you whitelist the interface/ip (ipWhitelist) in the server config where you want the client to connect to, otherwise it will not be allowed to connect to the server. You also need to set the local host address field to 0.0.0.0 in order for the RPi to listen on all interfaces and not only localhost (default).

Client Only

This is when you already have a server running remotely and want your RPi to connect as a standalone client to this instance, to show the MM from the server. Then from your RPi, you run it with: node clientonly --address 192.168.1.5 --port 8080. (Specify the ip address and port number of the server)

Docker

MagicMirror² in server only mode can be deployed using Docker. After a successful Docker installation you just need to execute the following command in the shell:

To get more information about the available Dockerfile versions and configurations head over to the respective GitHub repository.

Configuration

Raspberry Specific

The following wiki links are helpful for the initial configuration of your MagicMirror² operating system:

General

  1. Copy /home/pi/MagicMirror/config/config.js.sample to /home/pi/MagicMirror/config/config.js.
    Note: If you used the installer script. This step is already done for you.

  2. Modify your required settings.
    Note: You can check your configuration running npm run config:check in /home/pi/MagicMirror.

The following properties can be configured:

OptionDescription
portThe port on which the MagicMirror² server will run on. The default value is 8080.
addressThe interface ip address on which to accept connections. The default is localhost, which would prevent exposing the built-in webserver to machines on the local network. To expose it to other machines, use: 0.0.0.0.
ipWhitelistThe list of IPs from which you are allowed to access the MagicMirror². The default value is ['127.0.0.1', '::ffff:127.0.0.1', '::1'], which is from localhost only. Add your IP when needed. You can also specify IP ranges with subnet masks (['127.0.0.1', '127.0.0.1/24']) or directly with (['127.0.0.1', ['192.168.0.1', '192.168.0.100']]). Set [] to allow all IP addresses. For more information see: follow post ipWhitelist HowTo
zoomThis allows to scale the mirror contents with a given zoom factor. The default value is 1.0
languageThe language of the interface. (Note: Not all elements will be localized.) Possible values are en, nl, ru, fr, etc., but the default value is en.
timeFormatThe form of time notation that will be used. Possible values are 12 or 24. The default is 24.
unitsThe units that will be used in the default weather modules. Possible values are metric or imperial. The default is metric.
modulesAn array of active modules. The array must contain objects. See the next table below for more information.
electronOptionsAn optional array of Electron (browser) options. This allows configuration of e.g. the browser screen size and position (example: electronOptions: { fullscreen: false, width: 800, height: 600 }). Kiosk mode can be enabled by setting kiosk: true, autoHideMenuBar: false and fullscreen: false. More options can be found here.
customCssThe path of the custom.css stylesheet. The default is css/custom.css.

Module configuration:

OptionDescription
moduleThe name of the module. This can also contain the subfolder. Valid examples include clock, default/calendar and custommodules/mymodule.
positionThe location of the module in which the module will be loaded. Possible values are top_bar, top_left, top_center, top_right, upper_third, middle_center, lower_third, bottom_left, bottom_center, bottom_right, bottom_bar, fullscreen_above, and fullscreen_below. This field is optional but most modules require this field to set. Check the documentation of the module for more information. Multiple modules with the same position will be ordered based on the order in the configuration file.
classesAdditional classes which are passed to the module. The field is optional.
headerTo display a header text above the module, add the header property. This field is optional.
disabledSet disabled to true to skip creating the module. This field is optional.
configAn object with the module configuration properties. Check the documentation of the module for more information. This field is optional, unless the module requires extra configuration.

Modules

The following modules are installed by default.

For more available modules, check out out the wiki page MagicMirror² 3rd Party Modules. If you want to build your own modules, check out the MagicMirror² Module Development Documentation and don't forget to add it to the wiki and the forum!

Updating

If you want to update your MagicMirror² to the latest version, use your terminal to go to your Magic Mirror folder and type the following command:

If you changed nothing more than the config or the modules, this should work without any problems.Type git status to see your changes, if there are any, you can reset them with git reset --hard. After that, git pull should be possible.

Community

The community around the MagicMirror² is constantly growing. We even have a forum now where you can share your ideas, ask questions, help others and get inspired by other builders. We would love to see you there!

Contributing Guidelines

Contributions of all kinds are welcome, not only in the form of code but also with regards bug reports and documentation.

Please keep the following in mind:

  • Bug Reports: Make sure you're running the latest version. If the issue(s) still persist: please open a clearly documented issue with a clear title.
  • Minor Bug Fixes: Please send a pull request with a clear explanation of the issue or a link to the issue it solves.
  • Major Bug Fixes: please discuss your approach in an GitHub issue before you start to alter a big part of the code.
  • New Features: please please discuss in a GitHub issue before you start to alter a big part of the code. Without discussion upfront, the pull request will not be accepted / merged.

Thanks for your help in making MagicMirror² better!

Enjoying MagicMirror? Consider a donation!

MagicMirror² is opensource and free. That doesn't mean we don't need any money.

Please consider a donation to help us cover the ongoing costs like webservers and email services.If we receive enough donations we might even be able to free up some working hours and spend some extra time improving the MagicMirror² core.

To donate, please follow this link.

Manifesto

A real Manifesto is still to be written. Till then, Michael's response on one of the repository issues gives a great summary:

'... I started this project as an ultimate starter project for Raspberry Pi enthusiasts. As a matter of fact, for most of the contributors, the MagicMirror project is the first open source project they ever contributed to. This is one of the reasons why the MagicMirror project is featured in several RasPi magazines.

The project has a lot of opportunities for improvement. We could use a powerful framework like Vue to ramp up the development speed. We could use SASS for better/easier css implementations. We could make it an NPM installable package. And as you say, we could bundle it up. The big downside of of of these changes is that it over complicates things: a user no longer will be able to open just one file and make a small modification and see how it works out.

Of course, a bundled version can be complimentary to the regular un-bundled version. And I'm sure a lot of (new) users will opt for the bundled version. But this means those users won't be motivated to take a peek under the hood. They will just remain 'users'. They won't become contributors, and worse: they won't be motivated to take their first steps in software development.

And to be honest: motivating curious users to step out of their comfort zone and take those first steps is what drives me in this project. Therefor my ultimate goal is this project is to keep it as accessible as possible.'

~ Michael Teeuw


In this project I will show you how I made a Magic Mirror that shows the date, time, some news and a little phrase at the bottom. You will use a Raspberry Pi, a computer screen and a webpage to make it look like you have 'a smart mirror'.

Everything on the mirror will be in Swedish (on the pictures), but I will translate what you need. I made this with a Raspberry Pi model B, but I will recommend that you use a Raspberry pi 2 or better. The first Raspberry Pi can't really handle the new OS Jessie when the screen is rotated and keep freezing and loosing internet connection. Make sure you are paying attention to if I write just 'Raspberry Pi model B' or 'Raspberry Pi 2 model B'!

What you need:

Dailymotion Magic In The Mirror

  • A computer screen (that you can take apart)
  • An observation mirror or glas and a mirrorfilm
  • A Raspberry Pi with casing + micro USB power cord
  • A SD-card (8GB)
  • A network adapter (for wifi, look at this link, not necessary for Raspberry Pi 3,)
  • Wood frame (boards, screw, glue, paint, drill)
  • HDMI-to-VGA-adapter (depending on if your screen has HDMI or not)
  • A mouse and a keyboard with USB
  • A second computer (for fixing OS and stuff)

Remember to don't take the measurements for the mirror until you have opened the screen. It will be smaller once the plastic is gone!

Also, when you get the screen, make sure that the contacts are on one of the sides and not straight back. If they are straight back, you might get a problem if you want to hang it on the wall later on.

Magic in the mirror fowl play

I decided to do my own guide after having a lot of problems during my project, and I figured I could help other people who might end up with the same problems.

I followed these two guides:

Magic In The Mirrorstone

http://michaelteeuw.nl/tagged/magicmirror (English, original creator)

Magic In The Mirror 1996

http://pcforalla.idg.se/2.1054/1.601411/sa-bygger-... (Swedish)