added recording progress bars

dashboard-ui/css/librarybrowser.css

@@ -925,6 +925,18 @@ a.itemTag:hover {
     background-color: #52B54B;
 }
 
+.recordingProgressBar::-moz-progress-bar {
+    background-color: #cc3333;
+}
+
+.recordingProgressBar::-webkit-progress-value {
+    background-color: #cc3333;
+}
+
+.recordingProgressBar[aria-valuenow]:before {
+    background-color: #cc3333;
+}
+
 .userDataIcons .itemProgressBar {
     vertical-align: top;
     position: relative;
@@ -1012,9 +1024,9 @@ a.itemTag:hover {
 
 @media all and (min-height: 800px) {
 
-        .alphabetPicker a {
-            padding: 5px 0;
-        }
+    .alphabetPicker a {
+        padding: 5px 0;
+    }
 }
 
 @media all and (min-height: 900px) {
@@ -1054,4 +1066,4 @@ a.itemTag:hover {
     .viewCollageImage {
         width: 32.95%;
     }
-}
+}

dashboard-ui/scripts/librarybrowser.js

@@ -1532,6 +1532,12 @@
 
         getItemProgressBarHtml: function (item) {
 
+
+            if (item.Type == "Recording" && item.CompletionPercentage) {
+                
+                return '<progress class="itemProgressBar recordingProgressBar" min="0" max="100" value="' + item.CompletionPercentage + '"></progress>';
+            }
+            
             if (item.UserData && item.UserData.PlaybackPositionTicks && item.RunTimeTicks) {
 
                 var tooltip = Dashboard.getDisplayTime(item.UserData.PlaybackPositionTicks) + " / " + Dashboard.getDisplayTime(item.RunTimeTicks);