fix to show canva when start player

MMM-OnSpotify.js

@@ -554,7 +554,8 @@ Module.register("MMM-OnSpotify", {
 
  smartUpdate: function (type) {
  // Request data to display when the player is empty
- // Update only if there is no data or the player is changing state
+ // Update only if there is no data or the player is changing state 
+
  this.requestUserData =
  this.displayUser &&
  this.isConnectedToSpotify &&
@@ -597,6 +598,10 @@ Module.register("MMM-OnSpotify", {
  this.lastStatus = this.currentStatus;
  }
 
+ if (type === "CANVAS") {
+ this.builder.updateCanvasData(this.canvasData);
+ } 
+
  if (this.currentStatus === "onReconnecting") {
  this.retries = this.retries > 25 ? this.retries : this.retries + 1;
  if (this.retries === 25) {
@@ -623,7 +628,7 @@ Module.register("MMM-OnSpotify", {
  return;
  } else {
  this.retries = 0;
- }
+ } 
 
  if (
  this.playerData &&
@@ -662,10 +667,7 @@ Module.register("MMM-OnSpotify", {
  }
  if (type === "USER_DATA") this.builder.updateUserData(this.userData);
  if (type === "AFFINITY_DATA")
- this.builder.updateAffinityData(this.affinityData);
- if (type === "CANVAS") {
- this.builder.updateCanvasData(this.canvasData);
- }
+ this.builder.updateAffinityData(this.affinityData); 
  },
 
  getImage: (im, prefersLarge) =>

utils/SpotifyDomBuilder.js

@@ -168,6 +168,7 @@ class SpotifyDomBuilder {
  spotifyLogoGreen: "assets/spotifyLogoGreen.png",
  spotifyLogoWide: "assets/spotifyLogoWide.png",
  };
+ this.tmpCanva = null;
  }
 
  /* All cases */
@@ -446,6 +447,10 @@ class SpotifyDomBuilder {
  video.autobuffer = true;
  video.autoplay = true;
  video.loop = true;
+ if (this.tmpCanva != null) {
+ video.src = this.tmpCanva;
+ this.tmpCanva = null;
+ }
  mycanvas.appendChild(video);
 
  player.appendChild(mycanvas);
@@ -483,7 +488,11 @@ class SpotifyDomBuilder {
 
  updateCanvasData(data) {
  const vid = document.getElementById("VSNO-TARGET-VIDEO");
- vid.src = data != null ? data : '';
+ if (vid == null) {
+ this.tmpCanva = data;
+ } else {
+ vid.src = data != null ? data : '';
+ }
  }
 
  updatePlayerData(data) {