Reload series info on model sync (details)

UI/Series/Details/InfoView.js

@@ -0,0 +1,10 @@
+'use strict';
+define(
+    [
+        'marionette'
+    ], function (Marionette) {
+
+        return  Marionette.ItemView.extend({
+            template: 'Series/Details/InfoViewTemplate'
+        });
+    });

UI/Series/Details/InfoViewTemplate.html

@@ -0,0 +1,19 @@
+{{qualityProfile qualityProfileId}}
+<span class="label label-info">{{network}}</span>
+<span class="label label-info">{{runtime}} minutes</span>
+<span class="label label-info">{{path}}</span>
+<span class="pull-right">
+    <a href="{{traktUrl}}" class="label label-info">Trakt</a>
+
+    {{#if imdbId}}
+        <a href="{{imdbUrl}}" class="label label-info">IMDB</a>
+    {{/if}}
+
+    {{#if tvdbId}}
+        <a href="{{tvdbUrl}}" class="label label-info">TVDB</a>
+    {{/if}}
+
+    {{#if tvRageId}}
+        <a href="{{tvRageUrl}}" class="label label-info">TVRage</a>
+    {{/if}}
+</span>

UI/Series/Details/SeriesDetailsLayout.js

@@ -7,11 +7,12 @@ define(
         'Series/SeasonCollection',
         'Series/Details/SeasonCollectionView',
         'Series/Details/SeasonMenu/CollectionView',
+        'Series/Details/InfoView',
         'Shared/LoadingView',
         'Shared/Actioneer',
         'backstrech',
         'Mixins/backbone.signalr.mixin'
-    ], function (App, Marionette, EpisodeCollection, SeasonCollection, SeasonCollectionView, SeasonMenuCollectionView, LoadingView, Actioneer) {
+    ], function (App, Marionette, EpisodeCollection, SeasonCollection, SeasonCollectionView, SeasonMenuCollectionView, InfoView, LoadingView, Actioneer) {
         return Marionette.Layout.extend({
 
             itemViewContainer: '.x-series-seasons',
@@ -19,7 +20,8 @@ define(
 
             regions: {
                 seasonMenu: '#season-menu',
-                seasons   : '#seasons'
+                seasons   : '#seasons',
+                info      : '#info'
             },
 
             ui: {
@@ -43,7 +45,8 @@ define(
                 $('body').addClass('backdrop');
 
                 this.listenTo(this.model, 'sync', function () {
-                    this._setMonitoredState()
+                    this._setMonitoredState();
+                    this._showInfo();
                 }, this);
 
                 this.listenTo(App.vent, App.Events.SeriesDeleted, this._onSeriesDeleted);
@@ -61,6 +64,7 @@ define(
 
                 this._showSeasons();
                 this._setMonitoredState();
+                this._showInfo();
             },
 
             _getFanArt: function () {
@@ -178,6 +182,10 @@ define(
                         episodeCollection: self.episodeCollection
                     }));
                 });
+            },
+
+            _showInfo: function () {
+                this.info.show(new InfoView({ model: this.model }));
             }
         });
     });

UI/Series/Details/SeriesDetailsTemplate.html

@@ -12,29 +12,11 @@
                 </span>
             </h1>
         </div>
-        <div class="row  series-detail-overview">
+        <div class="row series-detail-overview">
             {{overview}}
         </div>
-        <div class="row">
+        <div id="info" class="row">
-            {{qualityProfile qualityProfileId}}
-            <span class="label label-info">{{network}}</span>
-            <span class="label label-info">{{runtime}} minutes</span>
-            <span class="label label-info">{{path}}</span>
-            <span class="pull-right">
-                <a href="{{traktUrl}}" class="label label-info">Trakt</a>
-
-                {{#if imdbId}}
-                    <a href="{{imdbUrl}}" class="label label-info">IMDB</a>
-                {{/if}}
-
-                {{#if tvdbId}}
-                    <a href="{{tvdbUrl}}" class="label label-info">TVDB</a>
-                {{/if}}
 
-                {{#if tvRageId}}
-                    <a href="{{tvRageUrl}}" class="label label-info">TVRage</a>
-                {{/if}}
-            </span>
         </div>
         <div class="row">
             <div id="season-menu" class="season-menu"></div>