Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/MichMich/MMM-Snow
https://github.com/MichMich/MMM-Snow
Last synced: 22 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/MichMich/MMM-Snow
- Owner: MichMich
- Created: 2016-12-21T10:28:03.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2023-04-20T23:20:03.000Z (over 1 year ago)
- Last Synced: 2024-11-19T22:27:40.872Z (23 days ago)
- Language: JavaScript
- Size: 190 KB
- Stars: 55
- Watchers: 6
- Forks: 16
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-mmm - **MMM-Snow**
README
# Module: MMM-Snow
Inspired by [NHubbard's Snow Plugin](https://github.com/nhubbard/MagicPlugins/tree/master/snow) I created a little more realistic snow plugin to improve your winter experience!The module supports themes. Current themes are *winter* and *love*. The first one let's it snow while the latter conjurs hearts on your mirror.
**Screenshot theme "winter"**
![](.github/example-winter.png)
**Screenshot theme "love"**
![](.github/example-love.png)
**Screenshot theme "water"**
![](.github/example-water.png)
## Installation
In your terminal, go to your MagicMirror's Module folder:
````
cd ~/MagicMirror/modules
````Clone this repository:
````
git clone https://github.com/MichMich/MMM-Snow.git
````Configure the module in your `config.js` file.
**Note:** After starting the Mirror, it will take a few seconds before the snow begins to fall ...
## Using the module
To use this module, add it to the modules array in the `config/config.js` file:
````javascript
modules: [
{
module: 'MMM-Snow',
position: 'fullscreen_above',
config: { // See 'Configuration options' for more information.
flakeCount: 100,
theme: "winter"
}
}
]
````## Configuration options
The following property can be configured:
|Option|Description|
|---|---|
|`flakeCount`|The number of snow flakes. More flakes are havier for the cpu, so don't go wild.
**Default value:** `100`|
|`theme`| Defines the type of "flakes". Possible values are `winter`, `love`, and `water`.
**Default value:** `winter`|## Defineing new themes
Certainly, there are many opportunities for new themes. To extend this module with new themes takes three simple development steps.
### Add image files
Add your "flake" images to folder `./images` in `MMM-Snow`directory. The image has to be a PNG with transparent background color. Make size of the file similar to existing files (50x50). The file names have to have a prefix followed by a number, e.g. `foo1.png`, `foo2.png`, `foo3.png`.### Reference images in CSS classes
Create new CSS classes in `MMM-Snow.css`, which reference your images. Class name and file name n´have to be identical.
````css
.MMM-Snow .foo1 {background-image: url('images/foo1.png');}
.MMM-Snow .foo2 {background-image: url('images/foo2.png');}
````### Define theme
Extend the `themes` map in the file `MMM-Snow.js`. Just add another entry
````javascript
"bar" : {
"flakePrefix" : "foo",
"imagesCount" : 3, // number of images in this theme, here: foo1, foo2, foo3
"downwards" : false, // flakes move upwards from bottom to top
"sizeFactor" : 2} // adapt size of flakes to your liking, <1 smaller, =1 original, >1 larger
````
The named index `bar` is the externally visible theme name, which has to be used in `config.js`. Setting `flakePrefix` tells how the image files and CSS classes are called; in our example it should be `foo`. `imagesCount` defines how many image files / css classes are there. If you have three images, put `3` which makes the module using `foo1`, `foo2`, and `foo3` respectively. The boolean setting `downwards` defines the direction of flakes' movements; `true` means downwards and `true` means upwards. Setting `sizeFactor` makes the flake images larger or smaller; values between 0 and 1 makes the flake smaller, while values larger than 1 enlarges them.### Configure new theme
To use the new theme, change the `theme` parameter for the `MMM-Snow` module in the `config/config.js` file:
````javascript
modules: [
{
module: 'MMM-Snow',
position: 'fullscreen_above',
config: {
theme: "bar"
}
}
]
````
After restarting the mirror the new MMM-Snow theme should be displayed.