fixed HMI does not apply Display mode to the main screen image

LuxoftSDL · Jul 24, 2021 · c0df972 · c0df972
1 parent 8e9640d
commit c0df972
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 10 deletions.
diff --git a/app/model/sdl/MediaModel.js b/app/model/sdl/MediaModel.js
@@ -149,21 +149,20 @@ SDL.SDLMediaModel = SDL.ABSAppModel.extend({
   countRate: 1.0,
 
   /**
-   * Method hides sdl activation button and sdl application
-   *
-   * @param {Number}
+   * @description Callback for display image mode change.
    */
-  setMode:function(mode){
+  imageModeChanged: function() { 
+    const mode = SDL.SDLModel.data.imageMode;
     if(this.isTemplate){
       switch(mode){
         case SDL.SDLModel.data.imageModeList[0]:this.set('mode','day-mode');break;
         case SDL.SDLModel.data.imageModeList[1]:this.set('mode','night-mode');break;
         case SDL.SDLModel.data.imageModeList[2]:this.set('mode','high-lighted-mode');break;
         default:this.set('mode','');
-      }
-    }
-    else this.set('mode','');
-  },
+        }
+    }else this.set('mode','');
+  }.observes('SDL.SDLModel.data.imageMode'),
+
   onDeleteApplication: function(appID) {
 
     SDL.SDLMediaController.onDeleteApplication(appID);

diff --git a/app/view/media/sdl/controllsView.js b/app/view/media/sdl/controllsView.js
@@ -57,8 +57,9 @@ SDL.SDLMediaControlls = Em.ContainerView.create(
             '<div class="artist textLimit"{{bindAttr class="SDL.SDLController.model.mediaPreset:hidden"}}>{{SDL.SDLController.model.appInfo.field3}}</div>' +
             '<div class="track textLimit"{{bindAttr style="SDL.SDLController.model.appInfo.alignment"}}>{{SDL.SDLController.model.appInfo.mediaTrack}}</div>' +
             '<div class="time"{{bindAttr class="SDL.SDLController.model.mediaPreset:timeV2"}}>{{SDL.SDLController.model.appInfo.mediaClock}}</div>' +
-            '<img class="cd_logo" onerror="this.style.display=\'none\'" {{bindAttr class="SDL.SDLController.model.mediaPreset:cd_logoV2"}} {{bindAttr class="SDL.SDLController.model.mode"}} {{bindAttr class="SDL.SDLController.model.isTemplate"}}/>' +       
-            '<img class="cd_logo" onerror="this.style.display=\'none\'" {{bindAttr src="SDL.SDLController.model.appInfo.mainImage" class="SDL.SDLController.model.mediaPreset:cd_logoV2"}} />' +       
+            '<img {{bindAttr class="SDL.SDLController.model.isTemplate:ico-overlay"}} {{bindAttr class="SDL.SDLController.model.mediaPreset:cd_logoV2"}} {{bindAttr class="SDL.SDLController.model.mode"}} {{bindAttr class="SDL.SDLController.model.isTemplate"}} />'+
+            '<img class="cd_logo" onerror="this.style.display=\'none\'"  onload="this.style.display=\'block\'" {{bindAttr src="SDL.SDLController.model.appInfo.trackIcon" class="SDL.SDLController.model.mediaPreset:cd_logoV2"}}/>' +       
+            '<img class="cd_logo" onerror="this.style.display=\'none\'" onload="this.style.display=\'block\'" {{bindAttr src="SDL.SDLController.model.appInfo.trackIcon" class="SDL.SDLController.model.mediaPreset:cd_logoV2"}} />' +       
             '</div>' + '{{/with}}'
           )
       }

diff --git a/css/sdl.css b/css/sdl.css
@@ -663,6 +663,49 @@
     height: 109px;
 }
 
+#sdl_view_container .cd_logoV2.day-mode.is-template.ico-overlay {
+    position: absolute;
+    top: 70px;
+    right: 10px;
+    border: 1px solid #393939;
+    -webkit-border-radius: 2px;
+    width: 109px;
+    height: 109px;    
+    background:url(../images/template/imagetype-pattern-day.png);
+    background-repeat: no-repeat;
+    background-size: cover;
+    opacity: 0.4;
+}
+
+#sdl_view_container .cd_logoV2.is-template.night-mode.ico-overlay {
+    position: absolute;
+    top: 70px;
+    right: 10px;
+    border: 1px solid #393939;
+    -webkit-border-radius: 2px;
+    width: 109px;
+    height: 109px;
+    background:url(../images/template/imagetype-pattern-night.png);
+    background-repeat: no-repeat;
+    background-size: cover;
+    opacity: 0.4;
+}
+
+#sdl_view_container .cd_logoV2.is-template.high-lighted-mode.ico-overlay {
+    position: absolute;
+    top: 70px;
+    right: 10px;
+    border: 1px solid #393939;
+    -webkit-border-radius: 2px;
+    width: 109px;
+    height: 109px;
+    background:url(../images/template/imagetype-pattern-highlighted.png);
+    background-repeat: no-repeat;
+    background-size: cover;
+    opacity: 0.4;    
+}
+
+
 #sdl_view_container .is-template.day-mode {
     background:url(../images/template/imagetype-pattern-day.png);
     opacity: 0.6;