From 9ba0623987842f89cf5e33889ad050342599a66a Mon Sep 17 00:00:00 2001
From: Mark McDowall <markus.mcd5@gmail.com>
Date: Thu, 25 Jul 2013 20:25:56 -0700
Subject: [PATCH] Episode count on posters and coloured bars

---
 UI/Cells/AirDateCell.js                     | 26 +++++++++++++++++++++
 UI/Content/base.less                        | 11 +++++----
 UI/Handlebars/Helpers/Series.js             | 15 +++++++++++-
 UI/Series/Index/EpisodeProgressPartial.html | 15 ++++++++++++
 UI/Series/Index/List/ItemTemplate.html      | 10 +++-----
 UI/Series/Index/Posters/ItemTemplate.html   |  5 ++--
 UI/Series/series.less                       | 13 +++++++++--
 7 files changed, 78 insertions(+), 17 deletions(-)
 create mode 100644 UI/Cells/AirDateCell.js
 create mode 100644 UI/Series/Index/EpisodeProgressPartial.html

diff --git a/UI/Cells/AirDateCell.js b/UI/Cells/AirDateCell.js
new file mode 100644
index 000000000..568646523
--- /dev/null
+++ b/UI/Cells/AirDateCell.js
@@ -0,0 +1,26 @@
+'use strict';
+define(
+    [
+        'backgrid',
+        'moment',
+        'Shared/FormatHelpers'
+    ], function (Backgrid, Moment, FormatHelpers) {
+        return Backgrid.Cell.extend({
+            className: 'air-date-cell',
+
+            render: function () {
+
+                this.$el.empty();
+                var date = this.model.get(this.column.get('name'));
+
+                if (date) {
+                    this.$el.html(FormatHelpers.DateHelper(date));
+
+                    this.$el.attr('title', Moment(date).format('LLLL'));
+                }
+
+                return this;
+
+            }
+        });
+    });
diff --git a/UI/Content/base.less b/UI/Content/base.less
index 24201c5f7..30c1be6c3 100644
--- a/UI/Content/base.less
+++ b/UI/Content/base.less
@@ -15,19 +15,22 @@
   width         : 125px;
   position      : relative;
   margin-bottom : 2px;
+
+  .progressbar-back-text, .progressbar-front-text {
+    font-size  : 11.844px;
+    font-weight: bold;
+    text-align : center;
+  }
+
   .progressbar-back-text {
     position   : absolute;
     width      : 100%;
     height     : 100%;
-    font-size  : 12px;
-    text-align : center;
   }
 
   .progressbar-front-text {
     display    : block;
     width      : 125px;
-    font-size  : 12px;
-    text-align : center;
   }
   .bar {
     position : absolute;
diff --git a/UI/Handlebars/Helpers/Series.js b/UI/Handlebars/Helpers/Series.js
index 5a2a40013..ac2a21747 100644
--- a/UI/Handlebars/Helpers/Series.js
+++ b/UI/Handlebars/Helpers/Series.js
@@ -35,7 +35,6 @@ define(
             return '/series/' + this.titleSlug;
         });
 
-
         Handlebars.registerHelper('percentOfEpisodes', function () {
             var episodeCount = this.episodeCount;
             var episodeFileCount = this.episodeFileCount;
@@ -49,4 +48,18 @@ define(
             return percent;
         });
 
+        Handlebars.registerHelper('seasonCountHelper', function () {
+            var seasonCount = this.seasonCount;
+            var continuing = this.status === 'continuing';
+
+            if (continuing) {
+                return new Handlebars.SafeString('<span class="label label-info">Season {0}</span>'.format(seasonCount));
+            }
+
+            if (seasonCount === 1) {
+                return new Handlebars.SafeString('<span class="label label-info">{0} Season</span>'.format(seasonCount))
+            }
+
+            return new Handlebars.SafeString('<span class="label label-info">{0} Seasons</span>'.format(seasonCount))
+        });
     });
diff --git a/UI/Series/Index/EpisodeProgressPartial.html b/UI/Series/Index/EpisodeProgressPartial.html
new file mode 100644
index 000000000..b4f5931e8
--- /dev/null
+++ b/UI/Series/Index/EpisodeProgressPartial.html
@@ -0,0 +1,15 @@
+{{#if_eq episodeFileCount compare=episodeCount}}
+    {{#if_eq status compare="continuing"}}
+        <div class="progress">
+    {{else}}
+        <div class="progress progress-success">
+    {{/if_eq}}
+
+{{else}}
+    <div class="progress progress-danger">
+{{/if_eq}}
+
+    <span class="progressbar-back-text">{{episodeFileCount}} / {{episodeCount}}</span>
+
+    <div class="bar" style="width:{{percentOfEpisodes}}%"><span class="progressbar-front-text">{{episodeFileCount}} / {{episodeCount}}</span></div>
+</div>
\ No newline at end of file
diff --git a/UI/Series/Index/List/ItemTemplate.html b/UI/Series/Index/List/ItemTemplate.html
index 6527d6f6e..886e977df 100644
--- a/UI/Series/Index/List/ItemTemplate.html
+++ b/UI/Series/Index/List/ItemTemplate.html
@@ -33,20 +33,16 @@
                         {{#if nextAiring}}
                             <span class="label">{{NextAiring nextAiring}}</span>
                         {{/if}}
-                        <span class="label label-info">Season {{seasonCount}}</span>
                     {{else}}
                         <span class="label label-important">Ended</span>
-                        <span class="label label-info">{{seasonCount}} Seasons</span>
                     {{/if_eq}}
 
+                    {{seasonCountHelper}}
+
                     {{qualityProfile qualityProfileId}}
                 </div>
                 <div class="span2">
-                    <div class="progress">
-                        <span class="progressbar-back-text">{{episodeFileCount}} / {{episodeCount}}</span>
-
-                        <div class="bar" style="width:{{percentOfEpisodes}}%"><span class="progressbar-front-text">{{episodeFileCount}} / {{episodeCount}}</span></div>
-                    </div>
+                    {{> EpisodeProgressPartial }}
                 </div>
             </div>
         </div>
diff --git a/UI/Series/Index/Posters/ItemTemplate.html b/UI/Series/Index/Posters/ItemTemplate.html
index 591e7c065..f65592125 100644
--- a/UI/Series/Index/Posters/ItemTemplate.html
+++ b/UI/Series/Index/Posters/ItemTemplate.html
@@ -24,10 +24,9 @@
                         {{#if nextAiring}}
                             <span class="label label-inverse">{{NextAiring nextAiring}}</span>
                         {{/if}}
-                        <span class="label label-info">Season {{seasonCount}}</span>
-                    {{else}}
-                        <span class="label label-info">{{seasonCount}} Seasons</span>
                     {{/if_eq}}
+                    {{seasonCountHelper}}
+                    {{> EpisodeProgressPartial }}
                 </div>
             </div>
         </div>
diff --git a/UI/Series/series.less b/UI/Series/series.less
index 96cff2035..aaa7865ac 100644
--- a/UI/Series/series.less
+++ b/UI/Series/series.less
@@ -66,13 +66,23 @@
     .card;
     .clickable;
     margin-bottom : 20px;
-    height        : 295px;
+    height        : 320px;
 
     .center {
       display      : block;
       margin-left  : auto;
       margin-right : auto;
       text-align   : center;
+
+      .progress {
+        text-align: left;
+        left: 0px;
+        width: 171px;
+
+        .progressbar-front-text {
+          width: 171px;
+        }
+      }
     }
 
     .progress {
@@ -146,7 +156,6 @@
       width : 168px;
     }
   }
-
 }
 
 .series-detail-overview {