MMM-pages/MMM-pages.js

308 lines
11 KiB
JavaScript
Raw Normal View History

2018-04-26 00:25:40 -07:00
Module.register('MMM-pages', {
// We require the older style of function declaration for compatibility
// reasons.
2018-04-26 00:25:40 -07:00
/**
* By default, we have don't pseudo-paginate any modules. We also exclude
2018-04-26 00:25:40 -07:00
* the page indicator by default, in case people actually want to use the
* sister module. We also don't rotate out modules by default.
*/
defaults: {
modules: [],
excludes: [], // Keep for compatibility
fixed: ['MMM-page-indicator'],
2020-11-05 10:53:44 -08:00
hiddenPages: {},
2018-04-26 00:25:40 -07:00
animationTime: 1000,
rotationTime: 0,
2020-11-06 07:07:21 -08:00
rotationFirstPage: 0, // Keep for compatibility
rotationHomePage: 0,
rotationDelay: 10000,
homePage: 0,
useLockString: true,
2018-04-26 00:25:40 -07:00
},
/**
* Apply any styles, if we have any.
*/
getStyles: function () {
2018-04-26 00:25:40 -07:00
return ['pages.css'];
},
/**
* Modulo that also works with negative numbers.
2018-08-20 13:21:38 -07:00
*
* @param {number} x The dividend
* @param {number} n The divisor
*/
mod: function (x, n) {
return ((x % n) + n) % n;
},
2018-04-26 00:25:40 -07:00
/**
* Pseudo-constructor for our module. Makes sure that values aren't negative,
* and sets the default current page to 0.
*/
start: function () {
// Clamp homePage value to [0, num pages).
if (this.config.homePage >= this.config.modules.length || this.config.homePage < 0) {
this.config.homePage = 0;
}
this.curPage = this.config.homePage;
this.rotationPaused = false;
// Compatibility
if (this.config.excludes.length) {
2024-12-01 11:29:26 -08:00
Log.warn('[MMM-pages] The config option "excludes" is deprecated. Please use "fixed" instead.');
this.config.fixed = this.config.excludes;
}
if (this.config.rotationFirstPage) {
2024-12-01 11:29:26 -08:00
Log.warn('[MMM-pages] The config option "rotationFirstPage" is deprecated. Please used "rotationHomePage" instead.');
this.config.rotationHomePage = this.config.rotationFirstPage;
}
2018-04-26 00:25:40 -07:00
// Disable rotation if an invalid input is given
this.config.rotationTime = Math.max(this.config.rotationTime, 0);
this.config.rotationDelay = Math.max(this.config.rotationDelay, 0);
this.config.rotationHomePage = Math.max(this.config.rotationHomePage, 0);
if (!this.config.useLockString) {
2024-12-01 11:29:26 -08:00
Log.info('[MMM-pages] User opted to not use lock strings!');
}
2018-04-26 00:25:40 -07:00
},
2018-04-26 00:25:40 -07:00
/**
* Handles incoming notifications. Responds to the following:
2018-04-26 00:25:40 -07:00
* 'PAGE_CHANGED' - Set the page to the specified payload page.
* 'PAGE_INCREMENT' - Move to the next page.
* 'PAGE_DECREMENT' - Move to the previous page.
* 'DOM_OBJECTS_CREATED' - Starts the module.
2018-08-20 13:21:38 -07:00
* 'QUERY_PAGE_NUMBER' - Requests the current page number
* 'PAUSE_ROTATION' - Stops rotation
* 'RESUME_ROTATION' - Resumes rotation
* 'HOME_PAGE' - Calls PAGED_CHANGED with the default home page.
2020-11-06 00:42:31 -08:00
* 'SHOW_HIDDEN_PAGE' - Shows the (in the payload) specified hidden
* page by name
* 'LEAVE_HIDDEN_PAGE' - Hides the currently showing hidden page and
* resumes showing the last page
2018-08-20 13:21:38 -07:00
*
2018-04-26 00:25:40 -07:00
* @param {string} notification the notification ID
2020-11-06 00:13:24 -08:00
* @param {number|string} payload the page to change to/by
2018-04-26 00:25:40 -07:00
*/
notificationReceived: function (notification, payload) {
2018-04-26 00:25:40 -07:00
switch (notification) {
case 'PAGE_CHANGED':
2024-12-01 11:29:26 -08:00
Log.log(`[MMM-pages] received a notification to change to page ${payload} of type ${typeof payload}.`);
2018-08-20 13:21:38 -07:00
this.curPage = payload;
this.updatePages();
2018-04-26 00:25:40 -07:00
break;
case 'PAGE_INCREMENT':
2024-12-01 11:29:26 -08:00
Log.log('[MMM-pages] received a notification to increment pages!');
2018-08-20 13:21:38 -07:00
this.changePageBy(payload, 1);
this.updatePages();
2018-04-26 00:25:40 -07:00
break;
case 'PAGE_DECREMENT':
2024-12-01 11:29:26 -08:00
Log.log('[MMM-pages] received a notification to decrement pages!');
// We can't just pass in -payload for situations where payload is null
// JS will coerce -payload to -0.
this.changePageBy(payload ? -payload : payload, -1);
2018-08-20 13:21:38 -07:00
this.updatePages();
2018-04-26 00:25:40 -07:00
break;
case 'DOM_OBJECTS_CREATED':
2024-12-01 11:29:26 -08:00
Log.log('[MMM-pages] received that all objects are created; will now hide things!');
this.sendNotification('MAX_PAGES_CHANGED', this.config.modules.length);
this.sendNotification('NEW_PAGE', this.curPage);
2018-08-20 13:21:38 -07:00
this.animatePageChange();
this.resetTimerWithDelay(0);
2018-04-26 00:25:40 -07:00
break;
2018-07-30 08:56:12 -07:00
case 'QUERY_PAGE_NUMBER':
this.sendNotification('PAGE_NUMBER_IS', this.curPage);
break;
case 'PAUSE_ROTATION':
this.setRotation(false);
break;
case 'RESUME_ROTATION':
this.setRotation(true);
break;
case 'HOME_PAGE':
this.notificationReceived('PAGE_CHANGED', this.config.homePage);
break;
2020-11-05 10:53:44 -08:00
case 'SHOW_HIDDEN_PAGE':
2024-12-01 11:29:26 -08:00
Log.log(`[MMM-pages] received a notification to change to the hidden page "${payload}" of type "${typeof payload}".`);
this.setRotation(false);
2020-11-05 10:53:44 -08:00
this.showHiddenPage(payload);
break;
case 'LEAVE_HIDDEN_PAGE':
2024-12-01 11:29:26 -08:00
Log.log('[MMM-pages] received a notification to leave the current hidden page.');
2020-11-05 10:53:44 -08:00
this.animatePageChange();
this.setRotation(true);
2020-11-05 10:53:44 -08:00
break;
2018-08-20 13:21:38 -07:00
default: // Do nothing
}
},
/**
* Changes the internal page number by the specified amount. If the provided
* amount is invalid, use the fallback amount. If the fallback amount is
* missing or invalid, do nothing.
*
* @param {number} amt the amount of pages to move forward by. Accepts
* negative numbers.
* @param {number} fallback the fallback value to use. Accepts negative
* numbers.
*/
changePageBy: function (amt, fallback) {
if (typeof amt !== 'number' && typeof fallback === 'undefined') {
2024-12-01 11:29:26 -08:00
Log.warn(`[MMM-pages] ${amt} is not a number!`);
}
2019-08-08 10:14:01 -07:00
if (typeof amt === 'number' && !Number.isNaN(amt)) {
2018-08-20 13:21:38 -07:00
this.curPage = this.mod(
this.curPage + amt,
this.config.modules.length
);
} else if (typeof fallback === 'number') {
this.curPage = this.mod(
this.curPage + fallback,
this.config.modules.length
);
2018-04-26 00:25:40 -07:00
}
},
2018-04-26 00:25:40 -07:00
/**
* Handles hiding the current page's elements and showing the next page's
2018-04-26 00:25:40 -07:00
* elements.
*/
updatePages: function () {
2024-12-01 11:29:38 -08:00
// Update if there's at least one page.
2018-04-26 00:25:40 -07:00
if (this.config.modules.length !== 0) {
2018-08-20 13:21:38 -07:00
this.animatePageChange();
if (!this.rotationPaused) {
this.resetTimerWithDelay(0);
}
this.sendNotification('NEW_PAGE', this.curPage);
} else { Log.error('[MMM-pages] Pages are not properly defined!'); }
2018-04-26 00:25:40 -07:00
},
2018-08-20 13:21:38 -07:00
/**
* Animates the page change from the previous page to the current one. This
* assumes that there is a discrepancy between the page currently being shown
* and the page that is meant to be shown.
*
* @param {string} [targetPageName] the name of the hiddenPage we want to show.
2020-11-06 00:42:31 -08:00
* Optional and only used when we want to switch to a hidden page
2018-08-20 13:21:38 -07:00
*/
animatePageChange: function (targetPageName) {
2020-11-23 15:36:20 -08:00
let lockStringObj = { lockString: this.identifier };
if (!this.config.useLockString) {
// Passing in an undefined object is equivalent to not passing it in at
// all, effectively providing only one arg to the hide and show calls
lockStringObj = undefined;
}
2020-11-23 15:29:50 -08:00
// Hides all modules not on the current page. This hides any module not
// meant to be shown.
const self = this;
let modulesToShow;
if (typeof targetPageName !== 'undefined') {
modulesToShow = this.config.hiddenPages[targetPageName];
} else {
modulesToShow = this.config.fixed.concat(this.config.modules[this.curPage]);
}
const animationTime = self.config.animationTime / 2;
2020-11-06 00:13:24 -08:00
MM.getModules()
.exceptWithClass(modulesToShow)
2020-11-23 15:29:50 -08:00
.enumerate(module => module.hide(animationTime, lockStringObj));
2020-11-06 00:13:24 -08:00
// Shows all modules meant to be on the current page, after a small delay.
setTimeout(() => {
2020-11-05 10:53:44 -08:00
MM.getModules()
2020-11-06 00:13:24 -08:00
.withClass(modulesToShow)
2020-11-23 15:29:50 -08:00
.enumerate(module => module.show(animationTime, lockStringObj));
}, animationTime);
2018-08-20 13:21:38 -07:00
},
/**
* Resets the page changing timer with a delay.
*
* @param {number} delay the delay, in milliseconds.
*/
resetTimerWithDelay: function (delay) {
2018-08-20 13:21:38 -07:00
if (this.config.rotationTime > 0) {
// This timer is the auto rotate function.
clearInterval(this.timer);
// This is delay timer after manually updating.
clearInterval(this.delayTimer);
const self = this;
this.delayTimer = setTimeout(() => {
self.timer = setInterval(() => {
// Inform other modules and page change.
// MagicMirror automatically excludes the sender from receiving the
// message, so we need to trigger it for ourselves.
self.sendNotification('PAGE_INCREMENT');
self.notificationReceived('PAGE_INCREMENT');
2018-08-20 13:21:38 -07:00
}, self.config.rotationTime);
}, delay);
} else if (this.config.rotationHomePage > 0) {
// This timer is the auto rotate function.
clearInterval(this.timer);
// This is delay timer after manually updating.
clearInterval(this.delayTimer);
const self = this;
this.delayTimer = setTimeout(() => {
self.timer = setInterval(() => {
// Inform other modules and page change.
// MagicMirror automatically excludes the sender from receiving the
// message, so we need to trigger it for ourselves.
self.sendNotification('PAGE_CHANGED', 0);
2020-11-06 07:07:21 -08:00
self.notificationReceived('PAGE_CHANGED', self.config.homePage);
}, self.config.rotationHomePage);
}, delay);
}
2018-08-20 13:21:38 -07:00
},
2020-11-05 10:53:44 -08:00
/**
2020-11-06 00:13:24 -08:00
* Pause or resume the page rotation. If the provided isRotating value is
* set to true, it will resume the rotation. If the requested
2020-11-06 00:42:31 -08:00
* state (f.e. isRotating === true) equals the current state, print a warning
* and do nothing.
2020-11-05 10:53:44 -08:00
*
2020-11-06 00:13:24 -08:00
* @param {boolean} isRotating the parameter, if you want to pause or resume.
2020-11-05 10:53:44 -08:00
*/
2020-11-06 00:13:24 -08:00
setRotation: function (isRotating) {
const stateBaseString = (isRotating) ? "resum" : "paus";
2020-11-06 00:13:24 -08:00
if (isRotating === this.rotationPaused) {
2024-12-01 11:29:26 -08:00
Log.warn(`[MMM-pages] was asked to ${stateBaseString}e but rotation is already ${stateBaseString}ed!`);
2020-11-05 10:53:44 -08:00
} else {
2024-12-01 11:29:26 -08:00
Log.log(`[MMM-pages] ${stateBaseString}ing rotation`);
if (!isRotating) {
2020-11-05 10:53:44 -08:00
clearInterval(this.timer);
clearInterval(this.delayTimer);
} else {
this.resetTimerWithDelay(this.rotationDelay);
}
2020-11-06 00:13:24 -08:00
this.rotationPaused = isRotating;
2020-11-05 10:53:44 -08:00
}
},
/**
* Handles hidden pages.
*
2020-11-06 00:13:24 -08:00
* @param {string} name the name of the hiddenPage we want to show
2020-11-05 10:53:44 -08:00
*/
showHiddenPage: function (name) {
2020-11-06 00:13:24 -08:00
// Only proceed if the named hidden page actually exists
if (name in this.config.hiddenPages) {
this.animatePageChange(name);
} else {
2024-12-01 11:29:26 -08:00
Log.error(`[MMM-pages] Hidden page "${name}" does not exist!`);
2020-11-05 10:53:44 -08:00
}
},
2017-06-18 13:24:04 -07:00
});