Posters view added for series

UI/Series/Index/List/ItemView.js

@@ -10,7 +10,6 @@ define([
 ], function () {
 
     NzbDrone.Series.Index.List.ItemView = Backbone.Marionette.ItemView.extend({
-        tagName : 'tr',
         template: 'Series/Index/List/ItemTemplate',
 
         ui: {

UI/Series/Index/Posters/CollectionTemplate.html

@@ -0,0 +1,5 @@
+<div class="row">
+    <div class="span12">
+        <ul id="x-series-posters" class="series-posters"></ul>
+    </div>
+</div>

UI/Series/Index/Posters/CollectionView.js

@@ -0,0 +1,17 @@
+'use strict';
+
+define(['app', 'Quality/QualityProfileCollection', 'Series/Index/Posters/ItemView', 'Config'], function (app, qualityProfileCollection) {
+
+    NzbDrone.Series.Index.Posters.CollectionView = Backbone.Marionette.CompositeView.extend({
+        itemView                : NzbDrone.Series.Index.Posters.ItemView,
+        itemViewContainer       : '#x-series-posters',
+        template                : 'Series/Index/Posters/CollectionTemplate',
+        qualityProfileCollection: qualityProfileCollection,
+
+        initialize: function () {
+            this.qualityProfileCollection.fetch();
+
+            this.itemViewOptions = { qualityProfiles: this.qualityProfileCollection };
+        }
+    });
+});

UI/Series/Index/Posters/ItemTemplate.html

@@ -0,0 +1,29 @@
+<div class="series-posters-item">
+    <div class="row">
+        <div class="span2">
+            <a href="/series/details/{{titleSlug}}" target="_blank" class="center">
+                <img class="series-poster img-polaroid" src="{{poster}}">
+            </a>
+
+            <div class="center">{{title}}</div>
+
+            <div class="center">
+                {{#if isContinuing}}
+                    {{#if bestDateString}}
+                        <span class="label">{{bestDateString}}</span>
+                    {{else}}
+                        <span class="label label-inverse">{{statusText}}</span>
+                    {{/if}}
+                    <span class="label label-info">Season {{seasonCount}}</span>
+                {{else}}
+                    <span class="label label-info">{{seasonCount}} Seasons</span>
+                {{/if}}
+            </div>
+
+            <!--<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>-->
+        </div>
+    </div>
+</div>

UI/Series/Index/Posters/ItemView.js

@@ -0,0 +1,45 @@
+'use strict';
+
+define([
+    'app',
+    'Quality/QualityProfileCollection',
+    'Series/SeriesCollection',
+    'Series/Edit/EditSeriesView',
+    'Series/Delete/DeleteSeriesView'
+
+], function () {
+
+    NzbDrone.Series.Index.Posters.ItemView = Backbone.Marionette.ItemView.extend({
+        tagName : 'li',
+        template: 'Series/Index/Posters/ItemTemplate',
+
+
+        ui: {
+            'progressbar': '.progress .bar'
+        },
+
+        events: {
+            'click .x-edit'  : 'editSeries',
+            'click .x-remove': 'removeSeries'
+        },
+
+        initialize: function (options) {
+            this.qualityProfileCollection = options.qualityProfiles;
+        },
+
+        editSeries: function () {
+            var view = new NzbDrone.Series.Edit.EditSeriesView({ model: this.model});
+
+            NzbDrone.vent.trigger(NzbDrone.Events.OpenModalDialog, {
+                view: view
+            });
+        },
+
+        removeSeries: function () {
+            var view = new NzbDrone.Series.Delete.DeleteSeriesView({ model: this.model });
+            NzbDrone.vent.trigger(NzbDrone.Events.OpenModalDialog, {
+                view: view
+            });
+        }
+    });
+});

UI/Series/Index/SeriesIndexLayout.js

@@ -2,6 +2,7 @@
 define([
     'app',
     'Series/Index/List/CollectionView',
+    'Series/Index/Posters/CollectionView',
     'Series/Index/EmptyView',
     'Config',
     'Series/Index/Table/AirDateCell',
@@ -100,6 +101,10 @@ define([
                 this.series.show(new NzbDrone.Series.Index.List.CollectionView({ collection: this.seriesCollection }));
             },
 
+            showPosters: function () {
+                this.series.show(new NzbDrone.Series.Index.Posters.CollectionView({ collection: this.seriesCollection }));
+            },
+
             showEmpty: function () {
                 this.series.show(new NzbDrone.Series.Index.EmptyView());
             },
@@ -120,6 +125,9 @@ define([
                     case 1:
                         this.showList();
                         break;
+                    case 2:
+                        this.showPosters();
+                        break;
                     default:
                         this.showTable();
                 }
@@ -143,6 +151,11 @@ define([
                     this.showList();
                 }
 
+                else if (view === 2) {
+                    NzbDrone.Config.SeriesViewStyle(2);
+                    this.showPosters();
+                }
+
                 else {
                     NzbDrone.Config.SeriesViewStyle(0);
                     this.showTable();

UI/Series/Index/SeriesIndexLayoutTemplate.html

@@ -6,6 +6,7 @@
                 <div class="btn-group">
                     <a class="btn x-series-change-view x-series-show-table" href="#" title="Table" data-target="0"><i class="icon-table"></i></a>
                     <a class="btn x-series-change-view x-series-show-list" href="#" title="List" data-target="1"><i class="icon-list"></i></a>
+                    <a class="btn x-series-change-view x-series-show-posters" href="#" title="Posters" data-target="2"><i class="icon-picture"></i></a>
                 </div>
             </div>
         </div>

UI/Series/series.less

@@ -4,4 +4,29 @@
   h2 {
     margin-top: 0px;
   }
+}
+
+.series-posters {
+  list-style-type: none;
+
+  li {
+    display: inline-block;
+    vertical-align: top;
+  }
+}
+
+.series-posters-item {
+  margin-bottom: 20px;
+
+  .center {
+    display: block;
+    margin-left:auto;
+    margin-right:auto;
+    text-align: center;
+  }
+
+  .progress {
+    left: 22px;
+    margin-top: 5px;
+  }
 }

UI/app.js

@@ -32,7 +32,9 @@ define('app', function () {
     window.NzbDrone.Config = {};
     window.NzbDrone.Series = {};
     window.NzbDrone.Series.Index = {};
+    window.NzbDrone.Series.Index.Table = {};
     window.NzbDrone.Series.Index.List = {};
+    window.NzbDrone.Series.Index.Posters = {};
     window.NzbDrone.Series.Edit = {};
     window.NzbDrone.Series.Delete = {};
     window.NzbDrone.Series.Details = {};