diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css
index 5fe9422102..a0537c4682 100644
--- a/dashboard-ui/css/site.css
+++ b/dashboard-ui/css/site.css
@@ -701,15 +701,21 @@ progress {
     background-position: right center;
 }
 
+.userItemRating {
+	height: 24px;
+	width: 24px;
+	margin-right: 1em;
+	overflow: hidden;
+	display: inline-block;
+}
 .imgUserItemRating {
     height: 24px;
-    margin-right: 1em;
     cursor: pointer;
 }
 
-    .imgUserItemRating:hover {
-        opacity: .5;
-    }
+.imgUserItemRating:hover {
+    opacity: .5;
+}
 
 @media all and (min-width: 650px) {
     .itemImageBlock {
diff --git a/dashboard-ui/scripts/Itemdetailpage.js b/dashboard-ui/scripts/Itemdetailpage.js
index f882b73080..0e515a4851 100644
--- a/dashboard-ui/scripts/Itemdetailpage.js
+++ b/dashboard-ui/scripts/Itemdetailpage.js
@@ -722,22 +722,29 @@
         var userData = item.UserData || {};
 
         if (typeof userData.Likes == "undefined") {
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" />';
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" />';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" /></div>';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" /></div>';
         } else if (userData.Likes) {
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" />';
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_on.png" alt="Liked" title="Like" onclick="ItemDetailPage.clearLike();" />';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" /></div>';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_up_on.png" alt="Liked" title="Like" onclick="ItemDetailPage.clearLike();" /></div>';
         } else {
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_on.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.clearLike();" />';
-            html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" />';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_down_on.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.clearLike();" /></div>';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" /></div>';
         }
 
         if (userData.IsFavorite) {
-            html += '<img class="imgUserItemRating" src="css/images/userdata/heart_on.png" alt="Favorite" title="Favorite" onclick="ItemDetailPage.setFavorite();" />';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/heart_on.png" alt="Favorite" title="Favorite" onclick="ItemDetailPage.setFavorite();" /></div>';
         } else {
-            html += '<img class="imgUserItemRating" src="css/images/userdata/heart_off.png" alt="Favorite" title="Favorite" onclick="ItemDetailPage.setFavorite();" />';
+            html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/heart_off.png" alt="Favorite" title="Favorite" onclick="ItemDetailPage.setFavorite();" /></div>';
         }
 
+	    //played/unplayed
+	    if (userData.Played) {
+		    html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/played.png" alt="Played" title="Played" onclick="ItemDetailPage.setPlayed();" /></div>';
+	    } else {
+		    html += '<div class="userItemRating"><img class="imgUserItemRating" src="css/images/userdata/unplayed.png" alt="Unplayed" title="Unplayed" onclick="ItemDetailPage.setPlayed();" /></div>';
+	    }
+
         $('#itemRatings', page).html(html);
     },
 
@@ -790,7 +797,20 @@
         ApiClient.updateUserItemRating(Dashboard.getCurrentUserId(), item.Id, false);
 
         ItemDetailPage.renderFav(item);
-    }
+    },
+
+	setPlayed: function () {
+		var item = ItemDetailPage.item;
+
+		item.UserData = item.UserData || {};
+
+		var setting = !item.UserData.Played;
+		item.UserData.Played = setting;
+
+		ApiClient.updatePlayedStatus(Dashboard.getCurrentUserId(), item.Id, setting);
+
+		ItemDetailPage.renderFav(item);
+	}
 
 };
 
diff --git a/dashboard-ui/scripts/mediaplayer.js b/dashboard-ui/scripts/mediaplayer.js
index 5f78e10fbd..2a2a7a1632 100644
--- a/dashboard-ui/scripts/mediaplayer.js
+++ b/dashboard-ui/scripts/mediaplayer.js
@@ -114,7 +114,7 @@
         }
 
         html += "<div><img class='nowPlayingBarImage ' alt='' title='' src='" + url + "' style='height:36px;display:inline-block;' /></div>";
-        html += '<div>' + name + '<br/>' + series_name + '</div>';
+        html += '<div>' + series_name + '<br/>' + name + '</div>';
 
         $('#mediaInfo', nowPlayingBar).html(html);
     },