Fix #17.

Also introduced immichTimeout for further customization in case requests timeout occasionally.

Author: pelaxa

MMM-ImmichSlideShow.js

@@ -26,6 +26,8 @@ Module.register('MMM-ImmichSlideShow', {
     apiKey: 'provide your API KEY',
     // Base Immich URL.  /api will be appended to this URL to make API calls.
     immichUrl: 'provide your base Immich URL',
+    // The amount of timeout for immich API calls
+    immichTimeout: 6000,
     // Mode of operation: 
     //    memory = show recent photos.  requires numDaystoInclude
     //    album = show picture from album.  requires albumId/albumName
@@ -624,8 +626,12 @@ Module.register('MMM-ImmichSlideShow', {
   suspend: function () {
     Log.debug(LOG_PREFIX + 'Suspend called...');
     // Hide the progress while paused
-    const oldDiv = document.getElementsByClassName('progress-inner')[0];
-    oldDiv.style.display = 'none';
+    if (this.config.showProgressBar) {
+      const oldDiv = document.getElementsByClassName('progress-inner')[0];
+      if (oldDiv) {
+        oldDiv.style.display = 'none';
+      }
+    }
 
     this.sendSocketNotification(
       'IMMICHSLIDESHOW_SUSPEND'

README.md

@@ -132,6 +132,14 @@ The following properties can be configured:
 				<br>This value is <b>REQUIRED</b>
 			</td>
 		</tr>
+		<tr>
+			<td><code>immichTimeout</code></td>
+			<td>The timeout for Immich API calls in milliseconds.<br>
+				<br><b>Example:</b> <code>10000</code>
+				<br><b>Default value:</b> <code>6000</code>
+				<br>This value is <b>OPTIONAL</b>
+			</td>
+		</tr>
 		<tr>
 			<td><code>mode</code></td>
 			<td>The mode of operation for the module.  Valid options are 'memory' or 'album' and depending on which is chosen, additional settings are required.<br>

immichApi.js

@@ -34,7 +34,7 @@ const immichApi = {
             // create and axis instance
             this.http = axios.create({
               baseURL: config.immichUrl + this.baseUrl,
-              timeout: 5000,
+              timeout: config.immichTimeout,
               headers: {
                 'x-api-key': config.apiKey,
                 'Accept': 'application/json'

node_helper.js

@@ -203,70 +203,69 @@ module.exports = NodeHelper.create({
 
   displayImage: async function(showCurrent = false) {
     Log.debug(LOG_PREFIX + 'displayImage called', showCurrent, this.lastImageLoaded ? 'has last image' : 'no last image');
-    if (showCurrent && this.lastImageLoaded) {
-      // Just send the current image
-      this.sendSocketNotification(
-        'IMMICHSLIDESHOW_DISPLAY_IMAGE',
-        this.lastImageLoaded
-      );
-      return;
-    }
+    
+    // If we are not showing the current image, then fetch the next one.
+    if (!(showCurrent && this.lastImageLoaded)) {
+      
+      // if there are no images or all the images have been displayed or it is the next day, try loading the images again
+      if (!this.imageList.length || this.index >= this.imageList.length || Date.now() - this.pictureDate > 86400000) {
+        Log.debug(LOG_PREFIX + 'image list is empty or index out of range or list too old!  fetching new image list...');
+        // Force the index to 0 so that we start from the beginning
+        // and calling this function again will not get stuck in a loop
+        if (this.index >= this.imageList.length) {
+          this.index = 0;
+        }
+        // Set the last Image to null so we cannot load it and have to progress
+        this.lastImageLoaded = null;
+        this.gatherImageList(this.config);
+        return;
+      }
 
-    // if there are no images or all the images have been displayed or it is the next day, try loading the images again
-    if (!this.imageList.length || this.index >= this.imageList.length || Date.now() - this.pictureDate > 86400000) {
-      Log.debug(LOG_PREFIX + 'image list is empty or index out of range or list too old!  fetching new image list...');
-      // Force the index to 0 so that we start from the beginning
-      // and calling this function again will not get stuck in a loop
-      if (this.index >= this.imageList.length) {
-        this.index = 0;
+      // If still do not have images, just call this function in 5 min
+      if (!this.imageList.length) {
+        Log.debug(LOG_PREFIX + 'image list is empty!  setting timeout for next image...');
+        // still no images, search again after 5 mins
+        setTimeout(() => {
+          this.displayImage();
+        }, 300000);
+        return;
       }
-      // Set the last Image to null so we cannot load it and have to progress
-      this.lastImageLoaded = null;
-      this.gatherImageList(this.config);
-      return;
-    }
-    // Log.debug(LOG_PREFIX + 'image list', this.imageList.length, this.imageList);
-    if (!this.imageList.length) {
-      Log.debug(LOG_PREFIX + 'image list is empty!  setting timeout for next image...');
-      // still no images, search again after 5 mins
-      setTimeout(() => {
-        this.displayImage();
-      }, 300000);
-      return;
-    }
 
-    let image = this.imageList[this.index];
+      let image = this.imageList[this.index];
+
+      Log.debug(LOG_PREFIX + 'reading image "' + image.originalPath + '"');
+      
+      this.lastImageLoaded = {
+        identifier: this.config.identifier,
+        path: image.originalPath,
+        exifInfo: image.exifInfo || {},
+        people: [],
+        data: null,
+        imageId: image.id,
+        index: this.index+1, // Index is zero based
+        total: this.imageList.length
+      };
 
-    Log.debug(LOG_PREFIX + 'reading image "' + image.originalPath + '"');
-    
-    this.lastImageLoaded = {
-      identifier: this.config.identifier,
-      path: image.originalPath,
-      exifInfo: image.exifInfo || {},
-      people: [],
-      data: null,
-      imageId: image.id,
-      index: this.index+1, // Index is zero based
-      total: this.imageList.length
-    };
-
-    // If there is no exif info available, or if we need people but no people are listed
-    // then fetch it with a separate call based on the API version
-    if (!image.exifInfo || image.exifInfo.length == 0 || 
-      this.config.imageInfo.includes('people') && (!image.people || image.people.length == 0)) {
-      const assetInfo = await immichApi.getAssetInfo(image.id);
-      if (assetInfo) {
-        this.lastImageLoaded.exifInfo = assetInfo.exifInfo;
-        this.lastImageLoaded.people = assetInfo.people;
+      // If there is no exif info available, or if we need people but no people are listed
+      // then fetch it with a separate call based on the API version
+      if (!image.exifInfo || image.exifInfo.length == 0 || 
+        this.config.imageInfo.includes('people') && (!image.people || image.people.length == 0)) {
+        const assetInfo = await immichApi.getAssetInfo(image.id);
+        if (assetInfo) {
+          this.lastImageLoaded.exifInfo = assetInfo.exifInfo;
+          this.lastImageLoaded.people = assetInfo.people;
+        }
       }
+      this.lastImageLoaded.data = await immichApi.getBase64EncodedAsset(image.id);
     }
 
-    this.lastImageLoaded.data = await immichApi.getBase64EncodedAsset(image.id);
-
-    this.sendSocketNotification(
-      'IMMICHSLIDESHOW_DISPLAY_IMAGE',
-      this.lastImageLoaded
-    );
+    // Only send a notification if we have the new image loaded
+    if (this.lastImageLoaded.data) {
+      this.sendSocketNotification(
+        'IMMICHSLIDESHOW_DISPLAY_IMAGE',
+        this.lastImageLoaded
+      );
+    }
   },
 
   getNextImage: function (showCurrent = false, reloadOnLoop = false) {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mmm-immichslideshow",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "description": "A plugin for MagicMirror2 to show slideshows from Immich",
   "author": "Pelaxa Inc.",
   "license": "MIT",