Skip to content

Latest commit

 

History

History
188 lines (138 loc) · 5.2 KB

README.md

File metadata and controls

188 lines (138 loc) · 5.2 KB
Raw

MMM-OneDrive

Display your photos from album of OneDrive on MagicMirror². Inspired by MMM-GooglePhotos.

Screenshot

screenshot

screenshot

Installation & Upgrade

INSTALL.md

Configuration

{
  module: "MMM-OneDrive",
  position: "top_right",
  config: {
    albums: [], // Set your album name. like ["My wedding", "family share", "Travle to Paris"]
    updateInterval: 1000 * 60, // minimum 10 seconds.
    sort: "new", // "old", "random"
    condition: {
      fromDate: null, // Or "2018-03", RFC ... format available
      toDate: null, // Or "2019-12-25",
      minWidth: null, // Or 400
      maxWidth: null, // Or 8000
      minHeight: null, // Or 400
      maxHeight: null, // Or 8000
      minWHRatio: null,
      maxWHRatio: null,
      // WHRatio = Width/Height ratio ( ==1 : Squared Photo,   < 1 : Portraited Photo, > 1 : Landscaped Photo)
    },
    showWidth: 1080, // These values will be used for quality of downloaded photos to show. real size to show in your MagicMirror region is recommended.
    showHeight: 1920,
    timeFormat: "YYYY/MM/DD HH:mm", // Or `relative` can be used.
  }
},

Usage

albums

Now this module can access not only your owns but also shared. You can specify album title like this.

albums: ["My wedding", "family share", "Travle to Paris", "from Tom"],
  • Caution. Too many albums and photos could make long bootup delay.
  • Remember this. You can only show max 8640 photos in a day. Manage your album what to show, it will make better performance.

updateInterval

  • Minimum updateInterval is 10 seconds. Too often update could makes API quota drains or network burden.

sort

  • new, old, random are supported.

condition

  • You can filter photos by this object.
  • fromDate : If set, The photos which was created after this value will be loaded. (e.g: fromDate:"2015-12-25" or fromDate:"6 Mar 17 21:22 UT")
  • toDate : If set, The photos which was created before this value will be loaded. (e.g: toDate:"Mon 06 Mar 2017 21:22:23 z" or toDate:"20130208")
  • ISO 8601 and RFC 2822 is supported for fromDate and toDate.
  • minWidth, maxWidth, minHeight, maxHeight : If set, the photos have these value as original dimensiont will be loaded. You can use these values to avoid too big or too small pictures(like icons)
  • minWHRatio, maxWHRatio : With these values, you can get only portrait photos(or landscaped, or squared)
  • WHRatio is width / height. So =1 will be squared dimension. >1 will be landscaped. <1 will be portrait.
  • Example:
condition: {
  fromDate: "2018-01-01", // I don't want older photos than this.
  minWidth: 600, // I don't want to display some icons or meme-pictures from my garbage collecting albums.
  maxWHRatio: 1, // I want to display photos which are portrait.
}

showWidth, showHeight

  • Specify your real resolution to show.

timeFormat

  • Specify time format for photo info. You can also use relative to show more humanized.

debug

  • If set, more detailed info will be logged.

autoInfoPosition

  • For preventing LCD burning, Photo info can be relocated by condition.
    • true : automatically change position to each corner per 15 minutes.
    • false : not using.
    • callbackfunction (album, photo) : User can make his own position. It should return [top, left, bottom, right]
autoInfoPosition: true, // or false

// User custom callback
autoInfoPosition: (album, photo)=> {
 return ['10px', '10px', 'none', 'none'] // This will show photo info top-left corner.
}

Tip

  • Not to show photo info : Add this into your css/custom.css.
#ONEDRIVE_PHOTO_INFO {
  display: none;
}
  • To move photo info to other position (e.g: top-left corner): Add this into your css/custom.css.
#ONEDRIVE_PHOTO_INFO {
  top: 10px;
  left: 10px;
  bottom: inherit;
  right: inherit;
}
  • Not to show blurred Background : Add this into your css/custom.css.
#ONEDRIVE_PHOTO_BACK {
  display: none;
}
  • To cover whole region with image : Add this into your css/custom.css.
#ONEDRIVE_PHOTO_CURRENT {
  background-size: cover;
}
  • To shrink image and be fully visible on smaller screens : Add this into your css/custom.css.
#ONEDRIVE_PHOTO_CURRENT {
  background-size: contain;
}
  • To display clock more clearly on showing in fullscreen_below : Add this into your css/custom.css.
.clock {
  padding: 10px;
  background-color: rgba(0, 0, 0, 0.5);
}
  • To give opacity to photos:
@keyframes trans {
  from {opacity: 0}
  to {opacity: 0.5}
}
#ONEDRIVE_PHOTO_CURRENT {
  background-size:cover;
  opacity:0.5;
}

Notice

  • First scanning will take a few (~dozens) seconds. Don't panic.
  • If there are 1000s of photos, this scan could take minutes(over 10). longer scans increase the probablity of an error happening. If a single error happens in the scan, it will retry after 1 hour. After first successful scan, subsequent startups should go very quickly(seconds).

Last Tested

  • MagicMirror : v2.26.0
  • node.js : required over v18.