From bbf03fdf40fb83797f058a66ff723625b5265586 Mon Sep 17 00:00:00 2001
From: Luke Pulverenti <luke.pulverenti@gmail.com>
Date: Fri, 5 Feb 2016 12:04:46 -0500
Subject: [PATCH] update now playing bar

---
 dashboard-ui/css/nowplayingbar.css    | 8 ++++++++
 dashboard-ui/scripts/nowplayingbar.js | 6 ++----
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/dashboard-ui/css/nowplayingbar.css b/dashboard-ui/css/nowplayingbar.css
index 8d845aa2ab..52ae8c76c0 100644
--- a/dashboard-ui/css/nowplayingbar.css
+++ b/dashboard-ui/css/nowplayingbar.css
@@ -109,6 +109,14 @@
         height: 80px;
     }
 
+    .nowPlayingBar .nowPlayingImage {
+        height: 80px;
+        width: 80px;
+        background-position: center center;
+        background-repeat: no-repeat;
+        background-size: cover;
+    }
+
 .nowPlayingBarText {
     display: inline-block;
     font-weight: normal;
diff --git a/dashboard-ui/scripts/nowplayingbar.js b/dashboard-ui/scripts/nowplayingbar.js
index bf5b3bd670..148490e42e 100644
--- a/dashboard-ui/scripts/nowplayingbar.js
+++ b/dashboard-ui/scripts/nowplayingbar.js
@@ -130,7 +130,7 @@
     function bindEvents(elem) {
 
         currentTimeElement = $('.nowPlayingBarCurrentTime', elem);
-        nowPlayingImageElement = $('.nowPlayingImage', elem);
+        nowPlayingImageElement = elem.querySelector('.nowPlayingImage');
         nowPlayingTextElement = $('.nowPlayingBarText', elem);
         nowPlayingUserData = $('.nowPlayingBarUserDataButtons', elem);
 
@@ -522,9 +522,7 @@
 
         currentImgUrl = url;
 
-        var imgHtml = '<img src="' + url + '" />';
-
-        nowPlayingImageElement.html(imgHtml);
+        ImageLoader.lazyImage(nowPlayingImageElement, url);
 
         if (nowPlayingItem.Id) {
             ApiClient.getItem(Dashboard.getCurrentUserId(), nowPlayingItem.Id).then(function (item) {