Magic Mirror Redesign WIP :D

bachoo786

@earlman this looks proper nice do you mind sharing the whole lot i.e. your css, the wallpapers etc?

Thanks.

earlman

@bachoo786 @skibro What modules are you guys currently using? I’m doing some prep work for release and wanna make sure it works with your current setups

A Former User

Is it possible to use horizontal layout instead vertical?

earlman

@Sean yup! The reason I messed around with the CSS so much was to make it much more flexible with different screen sizes. I’ll post a screenshot once I get back to my computer

earlman

@Sean i like keeping it pretty minimal right now, but here’s what it looks like in landscape 0_1567030482787_25D7C3A6-B9CA-4000-97FB-A1B08E8810AD.png

smackenzie5

@earlman
I’m using the default clock, calendar, current weather, and weather forecast. I’m also using google-route. I’d be interested in anything you could do to make the Google map look better in the route module. I assume you don’t care about the modules that run in the background and don’t show on the screen. Thanks

A Former User

@earlman
Looks so nice. I want to try yours.

earlman

Project Update (& Installation Instructions)

@skibro @bachoo786 @Sean @smackenzie5
Alrighty y’all! Got some great news for those who wanna try this setup out. Heads up though—might take a bit of time to set up,
so don’t expect to get it looking right in a couple clicks.

First, I’ve added Pexels support to MMM-Wallpaper (thanks @kolbyjack for the quick response).

As for everything else, all the instructions for setting it up can be found here

Though I’ve been doing development work for a while, this is one of my first open-source projects, so I’ll definitely do my best to help you guys out if you need it.

lavolp3

@earlman I have to say I really love the grid concept. I have a monitor sitting in the lower right corner of the mirror and a grid design would look much better.
~~Can you share your main.css or is it on GitHub?~~
Sorry just saw the latest reply with all the information I needed. Thanks man!!

smackenzie5

@earlman
Thanks for putting this together.
Finally had some time to work on this today but got the following error message when running it for the first time:

pi@raspberrypi:~ $ cd MagicMirror
pi@raspberrypi:~/MagicMirror $ sudo npm start

> magicmirror@2.7.1 start /home/pi/MagicMirror
> sh run-start.sh

Starting MagicMirror: v2.7.1
Loading config ...
WARNING! Could not validate config file. Starting with default configuration. Please correct syntax errors at or above this line: /home/pi/MagicMirror/config/config.js:116
    				pexels_key: [my API key was here],
    				             ^^^^^^

SyntaxError: Invalid or unexpected token
    at new Script (vm.js:74:7)
    at createScript (vm.js:246:10)
    at Object.runInThisContext (vm.js:298:10)
    at Module._compile (internal/modules/cjs/loader.js:678:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:722:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:559:12)
    at Function.Module._load (internal/modules/cjs/loader.js:551:3)
    at Module.require (internal/modules/cjs/loader.js:658:17)
    at require (internal/modules/cjs/helpers.js:20:18)
Loading module helpers ...
Initializing new module helper ...
Module helper loaded: updatenotification
No helper found for module: helloworld.
All module helpers loaded.
Starting server on port 8080 ... 
Server started ...
Connecting socket for: updatenotification
Sockets connected & modules started ...
Launching application.

Here’s my config.js:

{
			module: "MMM-Wallpaper",
			position: "fullscreen_below",
			config: { // See "Configuration options" for more information.
				source: "pexels",
    				slideInterval: 60 * 1000, // Change slides every minute
    				orientation: "vertical",
    				pexels_key: [my API key was here],
    				pexels_search: "beach"
				}
  		},

Thoughts?

Thanks,
Scott