Like a movie fanatic i am interested in a movie info providing module. Something like new in theaters and new on dvd/blu-ray. More people like this? Anyone who can create something like this?
There are a several api’s on the web. , OMDb, IMDB, ThemovieDB
ok just for the record. if i got the most simple maps js api code:
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0">
<meta charset="utf-8">
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
async defer></script>
</body>
</html>
can i just create a module with:
var x = document.getElementById("map").id;for the div?
var x = document.createElement("SCRIPT");for the script tags? (w3schools said it supports async and defer)
and then create 2 functions. 1 for the src api url that i can callback within the script tags and 1 for the initMap that i can callback after the scr url?
Is this good thinking or is it not that simple?
Good one! i will see if i can get something working.
What i try to do is:
Get a map with a route to my work.
Get traffic status along this route.
Style the maps so it’s nice visable through the mirror. (black/white maps and red lines/triangels for traffic jam.
Abillity to switch route with @alexyak voicecontrol module. (work me = to amsterdam) (work girlfriend = to utrecht)
This are a few wishes. But i am happy already if i get the first two working ^^ i am not skilled at node and js at all… any help is appreciated.
If you got a RPI3 try:
sudo nano ~/.asoundrc and paste:
pcm.!default {
type asym
playback.pcm "plughw:0"
capture.pcm "plughw:1"
}
ctl.!default {
type hw
card 0
}
OR
pcm.!default {
type asym
playback.pcm "hw:0,0"
capture.pcm "hw:1,1"
}
ctl.!default {
type hw
card 0
}
anyone who want to show a google staticmap on there mirror. Here is the code:
/* global Module */
/* Magic Mirror
* Module: staticmap
*
*/
Module.register("staticmap",{
defaults: {
center: "new york",
zoom: 14,
mapwidth: 600,
mapheight: 500,
highway: "on",
arterial: "on",
local: "on"
},
start: function(){
Log.info('Starting module: ' + this.name);
},
getDom: function() {
var wrapper = document.createElement("div");
var img = document.createElement("img");
img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + this.config.center +
"&zoom=" + this.config.zoom +
"&size=" + this.config.mapwidth + "x" + this.config.mapheight +
"&maptype=roadmap" +
"&style=feature:road.highway|visibility:" + this.config.highway +
"&style=feature:road.arterial|visibility:" + this.config.arterial +
"&style=feature:road.local|visibility:" + this.config.local +
"&style=feature:road|invert_lightness:true|saturation:-100|weight:1|lightness:1" +
"&style=feature:administrative|invert_lightness:true|saturation:-100|weight:1|lightness:1|visibility:on" +
"&style=feature:poi|invert_lightness:true|weight:1|saturation:-100|lightness:1|visibility:on" +
"&style=feature:transit|invert_lightness:true|saturation:-100|lightness:1|weight:1|visibility:on" +
"&style=feature:landscape|invert_lightness:true|weight:1|saturation:-100|lightness:1|visibility:on" +
"&style=feature:water|invert_lightness:true|weight:1|saturation:-100|lightness:1|visibility:on" +
"&style=feature:road|element:labels.text.fill|lightness:100" +
"&style=feature:road|element:labels.text.stroke|lightness:-100";
img.width = this.config.mapwidth;
img.height = this.config.mapheight;
wrapper.appendChild(img);
return wrapper;
}
});
@KirAsh4 i’ve seen that one ;) but i don’t know where to start. That module uses some different dependeties that are already in magicmirror. As suggested by @MichMich i should first build a simple module. (Well i’ve build one already that works very well but i don’t know if thats the right way of writing code and if it’s fail proof). Anyway i will keep try some stuff. I die got a map on my mirror with static map. But i want this trafficlayer. So i need to use the javascript api.
On the mirror i can already see what i have to wear, where i have to go (appointments), and what happend in the world before i go. Wouldn’t it be cool if we can display traffic info and map before we leave to work. :D
Does anybody know what modules i have to use to get the maps js api working? Angular? Async? Express? Or somerhing like a google api module?
@MichMich yea i noticed that. But it’s still too hard for me to implent a simple javascript like google maps js api. The js code is simple to untherstand but i still need the node-modules that are used by it. And it’s still not as straight forward because node is server sided. I got the idea but not the knowledge.
I have to give up on this one. I found topics where people said its really hard to call the google maps js api in nodejs environment. Even just only displaying a map. That explains why there are no codes of others available to learn from.
I think i just go for the static map (image) url from the google api. But that won’t be a trafficmap couse that’s not possible.
@KirAsh4 Thanks for your motivating words and help. I will expand my notification module for the voicecontrol module from alexyak96, that is working very well!. Maybe i come back later on this one when i got more knowledge or if someone else made a basic map module that i can expand for traffic ^^.
in basics i untherstand the concept of node.js. It’s not like a website where you can load a page from a server. node js is basicly the server that creates and push the website when requested.
I will have to learn some more i guess ^^ I always want to go the fast way :P