Image Galery

[Shampooman]

Did anyone try to do something like this? You could use it like these digital pictureframes and show your favourite holidaypictures.
I can’t find a module, that does something like this. It’s such a simple idea, that I thought someone might have done it, and I’m just to stupid to find it… :)

[Nexxic]

I would love this! :D

[zombi27]

i would also be interested in this :) are you thinking about flickr, icloud or something? or a simple picture folder on the pi?

[Shampooman]

or even Facebook. :) That sounds interesting. But I think, that I’m not able to do it. Just thought, someone allready did it, because it sounds so logic to me. :)

[KirAsh4]

So just looking at this, and all you amazing folks who are eager to jump in and start writing code … seriously, you all should. That’s no joke … start somewhere. There’s plenty of information on the web, and several folks here who can also help.

Anyway, my take on this:
Doing a local folder with pictures, while possible, also adds a lot of unknowns. For example, the images might not necessarily all be the same physical dimension, and loading one might go really fast while loading another will be rather slow because it’s so much bigger and you’re scaling it down. Or, or you pre-process your images to a specific size and then upload them to the rpi. BUT! Why do that when there are services out there that automatically do that for you? Let’s look at options:

Flickr has a public API: https://www.flickr.com/services/api/
They even have a node.js API kit making it easier to integrate: https://www.npmjs.com/package/flickrapi

iCloud API … iCloud API … anyone, iCloud API? (sorry, Ferris Bueller reference there.)
Same goes for Facebook …
And unfortunately, also Google Photos. They terminated development on the Picasa API on May 1st, but have yet to open their Photos API to the public. So you’re stuck using the Picasa one for now till they completely shut it down, at which point you can only hope they would’ve released the new one.

[Woody]

@KirAsh4 I was also looking for a picture frame module and thought MMM-RandomPhoto is what I’m looking for but it only seems to be working with unsplash.it. Therefore I would prefer the possibility to load the images from any URL, NAS or whatever. All those services like flikr or picasa are comming and going and within my infrastructure everything is more save.
I would highly appreciate a module like this.

[Mephiston2K]

I’m interested in this kind of module since the Mirror version 1.0

I would use it as “Stache of the day”
Every 24 hours a different, simple comic mustache in the correct position and size will brighten up your day when standing in front of the mirror.

[zombi27]

@Mephiston2K : haha, that’s a good one :D this would be great with 3D tracking via camera ;)

[nuckinfutz]

I’m interested in doing something similar but with random video files

[Woody]

With the origin MM version 1.0 I realized this with Scott Robbins jquery plugin ‘Backstretch’. This was realy simple to integrate and has satisfied my demands. Unfortunately I couldn’t get it running with the new MM version 2.0. Maybe someone with a higher skill level than myself may succeed. http://srobbin.com/jquery-plugins/backstretch/

[mikenewhouse]

Bump, would love the Flickr API worked in. I have it working on DAKBoard but would like to use M2

[Jeff]

Is it important that it’s flickr?
I’m using my picture frame with instagram. I created a new instagram acc, registered as a dev and received the API.
The new instagram account is made private, so it’s just possible for me to see the pictures.
Works perfect!
I used this this modul:
https://github.com/kapsolas/MMM-Instagram

[fragator]

@Jeff
I did exactly the same thing as you,
And it works perfectly well.
J adds, or removes pictures as I wish.
I would like to succeed to change the size of the photos on the mirror, what you do ???

[Jeff]

@fragator
I thought that would be a quick thing ;)
But I can’t find the right parameters neigther…

I was looking at

 getStyles: function() {
        return ['instagram.css', 'font-awesome.css'];

but can’t find font-awesome.css. Maybe just a file the creator forgot to delete.

The pictures are smaller in the mirror, than they are on instagram.
So there must be a parameter somewhere.

I’ll keep searching for them or try to add some.

We should go to the original thread for this modul:
https://forum.magicmirror.builders/topic/396/mmm-instagram-pull-and-animate-photos-from-instagram-feed

[Jeff]

Take this one :)
https://github.com/jeffjoe/MMM-Instagram

Or just change in the config.js:

{
    module: 'MMM-Instagram',
    position: 'top_right',
    config: {
        access_token: '......',
        count: 200,  
        min_timestamp: 0,
        animationSpeed: 5500,
        updateInterval: 12500,
        instaMaxWidth: '20%', // Optional parameter, can be relative (percentage) or absolute (px)
        instaMaxHeight: '' // Optional parameter, can be absolute only (px)
    }
},

and in the MMM-instagram.js use this

// set the first item in the list...
        if (this.activeItem >= this.images.photo.length) {
            this.activeItem = 0;
        }
        
        var tempimage = this.images.photo[this.activeItem];
        
        // image       
	//imageLink.innerHTML = "<img src='https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png'>";
        

        var imageWrapper = document.createElement("img");
	    imageWrapper.src = tempimage.photolink;
	    imageWrapper.id = "MMM-Instagram-image";
	    imageWrapper.style.maxWidth = this.config.instaMaxWidth;
	    imageWrapper.style.maxHeight = this.config.instaMaxHeight;
	    imageDisplay.appendChild(imageWrapper);
        

	wrapper.appendChild(imageDisplay);
       
        return wrapper;
    },

and for using the css file use:

#MMM-Instagram-image {
    }

e.g.:

#MMM-Instagram-image {
    -webkit-filter: invert(1);
    filter: invert(1);
}

[strawberry 3.141]

@Jeff the font-awesome.css is located in the vendor directory of MagicMirror

[fragator]

@Jeff
I tried the method, it does not always work. He must have a simpler method to enlarge these photos on the mirror.

[Jeff]

@fragator
When does it mot work?
Always the same picture?

[fragator]

@Jeff
Yes, I just do it at the moment, always the same image size.

[Ultimatum22]

This is exactly what I am currently developing, loading random photos from a directory. For my personal use I want additional info about the photo, which I have done by using subdirectories. Last directory is the name who took the photo, the rest is the ‘album’.

For example folder structure:
photos\Vacation\Cuba - 2013\Dave
photos\Vacation\Cuba - 2013\Erik
photos\Vacation\Egypt - 2012\Dave

This displays Vacation\Cuba - 2013 as album and Dave as person who took the photo. I am also trying to get the timestamp from the photo but not sure it works yet. I am going to make it an option to show extra photo information.

Anybody still interested? I can do an early release in the near future.