https://github.com/roramirez/MMM-ImagesPhotos

Show images and photos in your MagicMirror
https://github.com/roramirez/MMM-ImagesPhotos

family images magicmirror modules photoframe photos utils

Last synced: 3 months ago
JSON representation

Show images and photos in your MagicMirror

• Host: GitHub
• URL: https://github.com/roramirez/MMM-ImagesPhotos
• Owner: roramirez
• License: mit
• Created: 2017-02-01T21:53:04.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2023-12-29T14:11:15.000Z (11 months ago)
• Last Synced: 2024-06-29T10:32:19.519Z (5 months ago)
• Topics: family, images, magicmirror, modules, photoframe, photos, utils
• Language: JavaScript
• Size: 3.03 MB
• Stars: 41
• Watchers: 5
• Forks: 17
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-mmm - **MMM-ImagesPhotos**

README

        
# MMM-ImagesPhotos

This is a module for the [MagicMirror²](https://github.com/MichMich/MagicMirror). It will show photos from a directory.

This module reads the images from the _uploads_ directory inside the module.

**Directory**: `~/MagicMirror/modules/MMM-ImagesPhotos/uploads`

## Installation

1. Clone this repository inside your MagicMirror's `modules` folder

```bash

cd ~/MagicMirror/modules

git clone https://github.com/sdetweil/MMM-ImagesPhotos

cd MMM-ImagesPhotos

npm install

```

## How it looks

![Demo](.github/animate.gif)

## Config

The entry in `config.js` can include the following options:

| Option             | Description

|--------------------|-----------

| `opacity`          | The opacity of the image.

**Type:** `double`
Default 0.9

| `animationSpeed`   | How long the fade out and fade in of photos should take.

**Type:** `int`
Default 500

| `updateInterval`   | How long before loading a new image.

**Type:** `int`(milliseconds) 
Default 5000 milliseconds

| `getInterval`      | Interval value to get new images from directory.

**Type:** `int`(milliseconds) 
Default 60000 milliseconds

| `sequential`       | true or false, whether to process the images randomly(default) or sequentially
Default false

| only when position is `NOT` fullscreen_below or fullscreen_above|

| `maxWidth`         | Value for maximum width. Optional, possible values: absolute (e.g. "700px") or relative ("50%") 
 Default 100%

| `maxHeight`        | Value for maximum height. Optional, possible values: absolute (e.g. "400px") or relative ("70%") 
 Default 100%

|only when position `IS` fullscreen_below or fullscreen_above 

| `backgroundColor`  | Value for color used to fill around the image if not fullscreen,  can be #xxyyzz, like #808080 (grey),
 if fill is true, the backgroundColor setting is ignored
Default 'black'

| `fill`             | true or false,  instead of color use a blurred copy of the image to fill around the image, 
Default false.

| `blur`             | the size of the pixel blur of the background fill, 
Default 8

Here is an example of an entry in `config.js`

not fullscreen

```js

{

 module: "MMM-ImagesPhotos",

 position: "middle_center",

 config: {

  opacity: 0.9,

  animationSpeed: 500,

  updateInterval: 5000,

  maxHeight: "500px",

  maxWidth:"500px",

  sequential: false  // process the image list randomly

 }

},

```

fullscreen

```

{

	module: "MMM-ImagesPhotos",

	position: "fullscreen_below",

	config: {

		opacity: 0.9,

		animationSpeed: 500,

		updateInterval: 5000,

		backgroundColor: 'grey',  // not used if fill is true

		fill: false,   // fill around image with blurred copy of image

		blur: 10,   // only used if fill is true

		sequential: false  // process the image list randomly

	}

},

```