Initial commit
This commit is contained in:
61
.gitignore
vendored
Normal file
61
.gitignore
vendored
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# Runtime data
|
||||||
|
pids
|
||||||
|
*.pid
|
||||||
|
*.seed
|
||||||
|
*.pid.lock
|
||||||
|
|
||||||
|
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||||
|
lib-cov
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
|
||||||
|
# nyc test coverage
|
||||||
|
.nyc_output
|
||||||
|
|
||||||
|
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||||
|
.grunt
|
||||||
|
|
||||||
|
# Bower dependency directory (https://bower.io/)
|
||||||
|
bower_components
|
||||||
|
|
||||||
|
# node-waf configuration
|
||||||
|
.lock-wscript
|
||||||
|
|
||||||
|
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directories
|
||||||
|
node_modules/
|
||||||
|
jspm_packages/
|
||||||
|
|
||||||
|
# Typescript v1 declaration files
|
||||||
|
typings/
|
||||||
|
|
||||||
|
# Optional npm cache directory
|
||||||
|
.npm
|
||||||
|
|
||||||
|
# Optional eslint cache
|
||||||
|
.eslintcache
|
||||||
|
|
||||||
|
# Optional REPL history
|
||||||
|
.node_repl_history
|
||||||
|
|
||||||
|
# Output of 'npm pack'
|
||||||
|
*.tgz
|
||||||
|
|
||||||
|
# Yarn Integrity file
|
||||||
|
.yarn-integrity
|
||||||
|
|
||||||
|
# dotenv environment variables file
|
||||||
|
.env
|
||||||
|
|
||||||
|
# package lock
|
||||||
|
package-lock.json
|
21
LICENSE
Normal file
21
LICENSE
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
MIT License
|
||||||
|
|
||||||
|
Copyright (c) 2018
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
90
MMM-Unsplash.js
Normal file
90
MMM-Unsplash.js
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
Module.register('MMM-Unsplash', {
|
||||||
|
defaults: {
|
||||||
|
opacity: 0.3,
|
||||||
|
collections: '',
|
||||||
|
width: 1080,
|
||||||
|
height: 1920,
|
||||||
|
orientation: 'portrait',
|
||||||
|
apiKey: '',
|
||||||
|
updateInterval: 1800,
|
||||||
|
},
|
||||||
|
|
||||||
|
start: function() {
|
||||||
|
this.load()
|
||||||
|
},
|
||||||
|
|
||||||
|
load: function() {
|
||||||
|
var self = this
|
||||||
|
|
||||||
|
var req = new XMLHttpRequest()
|
||||||
|
var params = {
|
||||||
|
collections: self.config.collections,
|
||||||
|
w: self.config.width,
|
||||||
|
h: self.config.height,
|
||||||
|
orientation: self.config.orientation,
|
||||||
|
}
|
||||||
|
|
||||||
|
req.addEventListener('load', function() {
|
||||||
|
if (this.status == 200) {
|
||||||
|
var obj = JSON.parse(this.responseText)
|
||||||
|
var img1 = document.getElementById('mmm-unsplash-placeholder1')
|
||||||
|
var img2 = document.getElementById('mmm-unsplash-placeholder2')
|
||||||
|
|
||||||
|
img1.addEventListener('load', function() {
|
||||||
|
fade(img1, self.config.opacity, function() {
|
||||||
|
img1.id = 'mmm-unsplash-placeholder2'
|
||||||
|
})
|
||||||
|
|
||||||
|
fade(img2, 0, function() {
|
||||||
|
img2.id = 'mmm-unsplash-placeholder1'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
img1.src = obj.urls.custom
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
req.open('GET', 'https://api.unsplash.com/photos/random' + formatParams(params))
|
||||||
|
req.setRequestHeader('Accept-Version', 'v1')
|
||||||
|
req.setRequestHeader('Authorization', 'Client-ID ' + this.config.apiKey)
|
||||||
|
req.send()
|
||||||
|
|
||||||
|
setTimeout(function() {
|
||||||
|
self.load();
|
||||||
|
}, (self.config.updateInterval * 1000));
|
||||||
|
},
|
||||||
|
|
||||||
|
getDom: function() {
|
||||||
|
var wrapper = document.createElement('div')
|
||||||
|
wrapper.innerHTML = '<img id="mmm-unsplash-placeholder1" style="opacity: 0; position: absolute; top: 0" /><img id="mmm-unsplash-placeholder2" style="opacity: 0; position: absolute; top: 0" />'
|
||||||
|
return wrapper
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
function formatParams( params ){
|
||||||
|
return "?" + Object
|
||||||
|
.keys(params)
|
||||||
|
.map(function(key){
|
||||||
|
return key+"="+encodeURIComponent(params[key])
|
||||||
|
})
|
||||||
|
.join("&")
|
||||||
|
}
|
||||||
|
|
||||||
|
function fade(elem, target, done) {
|
||||||
|
var opacity = parseFloat(elem.style.opacity)
|
||||||
|
var out = opacity > target
|
||||||
|
if (opacity > target) {
|
||||||
|
opacity -= 0.05
|
||||||
|
} else if (opacity < target) {
|
||||||
|
opacity += 0.05
|
||||||
|
}
|
||||||
|
|
||||||
|
elem.style.opacity = opacity
|
||||||
|
|
||||||
|
if ((!out && opacity < target) || (out && opacity > target)) {
|
||||||
|
setTimeout(function() { fade(elem, target, done) }, 60)
|
||||||
|
} else {
|
||||||
|
elem.style.opacity = target
|
||||||
|
done()
|
||||||
|
}
|
||||||
|
}
|
38
README.md
Normal file
38
README.md
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
# MMM-Unsplash
|
||||||
|
A <a href="https://github.com/MichMich/MagicMirror">MagicMirror²</a> module used to pull a random photo from one or more Unsplash collections. Like <a href="https://github.com/diego-vieira/MMM-RandomPhoto">MMM-RandomPhoto</a>, but for specific collections. Tested with MagicMirror² v2.2.2, v2.3.1 servers, Chrome 65 on Windows 10 and Midori 0.4.3 on a Raspberry Pi Zero W with Raspbian Jessie.
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
1. Navigate into your MagicMirror's `modules` folder and execute `git clone https://github.com/parnic/MMM-Unsplash.git`.
|
||||||
|
2. Add the module inside `config.js` placing it where you prefer.
|
||||||
|
|
||||||
|
## Config
|
||||||
|
|Option|Type|Description|Default|
|
||||||
|
|---|---|---|---|
|
||||||
|
|`opacity`|double|The opacity of the image.|0.3|
|
||||||
|
|`collections`|string|(REQUIRED) Comma-delimited list of collections to pull from.|`''`|
|
||||||
|
|`width`|int|Desired image width.|`1080`|
|
||||||
|
|`height`|int|Desired image height.|`1920`|
|
||||||
|
|`orientation`|string|Orientation of the image. Valid values: `landscape`, `portrait`, `squarish`|`'portrait'`|
|
||||||
|
|`apiKey`|string|(REQUIRED) Your Unsplash API key.|`''`|
|
||||||
|
|`updateInterval`|int|Number of seconds between image updates. Note that your API key is rate-limited, so if, for example, your rate limit was 50/hr, this should be no less than 72.|`1800` (30mins)|
|
||||||
|
|
||||||
|
Here is an example of an entry in config.js
|
||||||
|
```
|
||||||
|
{
|
||||||
|
module: 'MMM-Unsplash',
|
||||||
|
position: 'fullscreen_below',
|
||||||
|
config: {
|
||||||
|
collections: '369966,1240111,1136512,629911,150672,920773',
|
||||||
|
apiKey: 'your_api_key'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
```
|
||||||
|
|
||||||
|
## Notes
|
||||||
|
Pull requests are very welcome! If you'd like to see any additional functionality, don't hesitate to let me know.
|
||||||
|
|
||||||
|
## Dependencies
|
||||||
|
None!
|
||||||
|
|
||||||
|
## Special Thanks
|
||||||
|
<a href="https://github.com/diego-vieira/MMM-RandomPhoto">MMM-RandomPhoto</a> for the inspiration. The core image update functionality is cribbed from this module.
|
11
package.json
Normal file
11
package.json
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
{
|
||||||
|
"name": "magic-mirror-module-unsplash",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Display images from Unsplash collections",
|
||||||
|
"main": "MMM-Unsplash.js",
|
||||||
|
"author": "Chris Pickett",
|
||||||
|
"repository": "https://github.com/parnic/MMM-Unsplash.git",
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user