delightedcrow / mmm-habiticastats

MMM-HabiticaStats is a module for MagicMirror² that displays player statistics for Habitica.

MMM-HabiticaStats: A MagicMirror² Module

MMM-HabiticaStats is a module for MagicMirror² that displays player statistics for Habitica.

REQUIRED API KEYS:

You're gonna need a (free) Habitica account to get an API token (see the Habitica wiki for details on how to find your API Token in your Habitica account).

Screenshots

Example Screenshots of MMM-HabiticaStats running in the default MagicMirror² theme:

---

Example Screenshots of MMM-HabiticaStats running in the WallberryTheme:

Installing the Module

To use this module:

1. Copy the MMM-HabiticaStats folder to your MagicMirror/modules directory
2. Add the module to the modules array in the config/config.js file like in the following example:

modules: [
	{
		module: "MMM-HabiticaStats",
		position: "middle_center", // put it wherever you want
		config: {
			userID: "YOUR-HABITICA-USER-ID-HERE",
			APIToken: "YOUR-HABITICA-API-TOKEN-HERE"
		}
	}
]

Configuration options

The following properties can be configured:

Option	Type	Description
userID	String	Your Habitica userID. Sign up for free at https://habitica.com. This value is REQUIRED
APIToken	String	Your Habitica API Token. This value is REQUIRED
refreshRate	Number	How often the module should refresh your Habitica data (in milliseconds). Possible values: Any positive integer Default value: 60 * 60 * 1000, 1 hour
backgroundBlurOn	Boolean	Turn the background blur on; good for making the text more legible on photo backgrounds. Possible values: true (turn on) or false (turn off) Default value: true
zoom	Float	Scale this module using the CSS zoom property. Possible values: A float number. Examples: 1.5 (scale up 150%), 0.7 (scale down 70%) Default value: none
orientation	String	Whether to display the module in portrait or landscape orientation. Possible values: portrait, landscape Default value: portrait
positionCSS	String	Finely position this module with the power of CSS. BE CAREFUL, you can break all kinds of things with this. Possible values: Any string of valid CSS. Example: "float: right; position: relative; top: -10px;" Default value: none

Fixing The Background Blur

Please make sure you have the config option backgroundBlurOn: true set first!

If you're running MagicMirror using Electron (i.e, not in serveronly mode) and the background blur isn't showing up for you, try enabling Electron's experimentalFeatures option by adding the following block to your config options in your MagicMirror config.js file:

electronOptions: {
	webPreferences: {
		experimentalFeatures: true,
		nodeIntegration: false
	}
},

Contributing & Development

Changelog

To view the changelog see CHANGELOG.md.

Building CSS

This module uses SASS, so to make style changes please edit the MMM-HabiticaStats.scss file and use node-sass to compile the css file:

• Run the command npm install to install node-sass.
• Run npm run watch and node-sass will autocompile the CSS file any time changes are made to the MMM-HabiticaStats.scss file.
• Run npm run build to build the CSS file.

mmm-habiticastats's Issues

Issues with number of calls to the Habitica API

Hi @delightedCrow , Matteo from Habitica here.

We've had some issues with an user of this module unknowingly making hundreds of thousands of requests to the content API in a very short period of time.

We're still unsure if this was caused by setting a zero refreshRate or if there's some loop in the code but I've noticed a few things:

• here https://github.com/delightedCrow/MMM-HabiticaStats/blob/master/MMM-HabiticaStats.js#L74-L85 the catch block is entered only if there's an error when calling JSON.parse(fetchError)
• in the HabiticaMagic code here https://github.com/delightedCrow/HabiticaMagic/blob/master/src/HabiticaAPIManager.js#L130 you're resolving the Promise without an error only if the code is 200 but for example the content api often returns a 304 code if the browser (in this case the Electron app) has already cached the last version of the file and nothing has changed. It would be considered as an error even though it's not. I would suggest to use an external library that's been built specifically for making AJAX requests as it's not easy to make it right (for example jQuery.ajax, axios) or the Fetch API which is now available in every browser https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
• But I think the biggest issue is in this code https://github.com/delightedCrow/MMM-HabiticaStats/blob/master/MMM-HabiticaStats.js#L92 , in particular every time you call scheduleUpdate from here https://github.com/delightedCrow/MMM-HabiticaStats/blob/master/MMM-HabiticaStats.js#L68 a new interval is created because the previous one is never cleared. So for example after 10 times that scheduleUpdate has been called you'll have 10 timers that will call the Habitica API at the refresh rate and every time one of them returns correctly a new timer is created increasing exponentially the number of intervals

please let me know if you can fix these issues and if you have any question :)

Ah, I'd also make sure the refresh rate cannot be set lower than 30s to avoid API calls being made too often as explained here https://habitica.fandom.com/wiki/Guidance_for_Comrades

Could not connect to Habitica server

I get the error Could not connect to Habitica server.. when I load it.

    {
      module: "MMM-HabiticaStats",
      position: "bottom_right",
      config: {
        userID: "a22efff0-2af3-4bce-8075-e810ea228871",
        APIToken: "truncated"
      }
    },