UI Cleanup - Updated Activity subtree.

src/UI/Activity/Queue/ProgressCell.js

@@ -2,15 +2,22 @@ var NzbDroneCell = require('../../Cells/NzbDroneCell');
 
 module.exports = NzbDroneCell.extend({
     className : 'progress-cell',
-    render    : function(){
+
+    render : function() {
         this.$el.empty();
-        if(this.cellValue) {
+
+        if (this.cellValue) {
+
             var status = this.model.get('status').toLowerCase();
-            if(status === 'downloading') {
-                var progress = 100 - this.model.get('sizeleft') / this.model.get('size') * 100;
-                this.$el.html('<div class="progress" title="{0}%">'.format(progress.toFixed(1)) + '<div class="progress-bar progress-bar-purple" style="width: {0}%;"></div></div>'.format(progress));
+
+            if (status === 'downloading') {
+                var progress = 100 - (this.model.get('sizeleft') / this.model.get('size') * 100);
+
+                this.$el.html('<div class="progress" title="{0}%">'.format(progress.toFixed(1)) +
+                              '<div class="progress-bar progress-bar-purple" style="width: {0}%;"></div></div>'.format(progress));
             }
         }
+
         return this;
     }
-});
+});

src/UI/Activity/Queue/QueueActionsCell.js

@@ -1,68 +1,67 @@
 'use strict';
 
-define(
-    [
-        'jquery',
-        'marionette',
-        'Cells/TemplatedCell',
-        'Activity/Queue/RemoveFromQueueView',
-        'vent'
-    ], function ($, Marionette, TemplatedCell, RemoveFromQueueView, vent) {
-        return TemplatedCell.extend({
+var $ = require('jquery');
+var vent = require('../../vent');
+var Marionette = require('marionette');
+var TemplatedCell = require('../../Cells/TemplatedCell');
+var RemoveFromQueueView = require('./RemoveFromQueueView');
 
-            template  : 'Activity/Queue/QueueActionsCellTemplate',
-            className : 'queue-actions-cell',
+module.exports = TemplatedCell.extend({
 
-            events: {
-                'click .x-remove' : '_remove',
-                'click .x-import' : '_import',
-                'click .x-grab'   : '_grab'
-            },
+    template  : 'Activity/Queue/QueueActionsCellTemplate',
+    className : 'queue-actions-cell',
 
-            ui: {
-                import : '.x-import',
-                grab   : '.x-grab'
-            },
+    events : {
+        'click .x-remove' : '_remove',
+        'click .x-import' : '_import',
+        'click .x-grab'   : '_grab'
+    },
 
-            _remove : function () {
+    ui : {
+        import : '.x-import',
+        grab   : '.x-grab'
+    },
 
-                var showBlacklist = this.model.get('status') !== 'Pending';
+    _remove : function() {
+        var showBlacklist = this.model.get('status') !== 'Pending';
 
-                vent.trigger(vent.Commands.OpenModalCommand, new RemoveFromQueueView({ model: this.model, showBlacklist: showBlacklist }));
-            },
+        vent.trigger(vent.Commands.OpenModalCommand, new RemoveFromQueueView({
+            model         : this.model,
+            showBlacklist : showBlacklist
+        }));
+    },
 
-            _import : function () {
-                var self = this;
+    _import : function() {
+        var self = this;
 
-                var promise = $.ajax({
-                    url: window.NzbDrone.ApiRoot + '/queue/import',
-                    type: 'POST',
-                    data: JSON.stringify(this.model.toJSON())
-                });
-
-                $(this.ui.import).spinForPromise(promise);
-
-                promise.success(function () {
-                    //find models that have the same series id and episode ids and remove them
-                    self.model.trigger('destroy', self.model);
-                });
-            },
-
-            _grab : function () {
-                var self = this;
-
-                var promise = $.ajax({
-                    url: window.NzbDrone.ApiRoot + '/queue/grab',
-                    type: 'POST',
-                    data: JSON.stringify(this.model.toJSON())
-                });
-
-                $(this.ui.grab).spinForPromise(promise);
-
-                promise.success(function () {
-                    //find models that have the same series id and episode ids and remove them
-                    self.model.trigger('destroy', self.model);
-                });
-            }
+        var promise = $.ajax({
+            url  : window.NzbDrone.ApiRoot + '/queue/import',
+            type : 'POST',
+            data : JSON.stringify(this.model.toJSON())
         });
-    });
+
+        $(this.ui.import).spinForPromise(promise);
+
+        promise.success(function() {
+            //find models that have the same series id and episode ids and remove them
+            self.model.trigger('destroy', self.model);
+        });
+    },
+
+    _grab : function() {
+        var self = this;
+
+        var promise = $.ajax({
+            url  : window.NzbDrone.ApiRoot + '/queue/grab',
+            type : 'POST',
+            data : JSON.stringify(this.model.toJSON())
+        });
+
+        $(this.ui.grab).spinForPromise(promise);
+
+        promise.success(function() {
+            //find models that have the same series id and episode ids and remove them
+            self.model.trigger('destroy', self.model);
+        });
+    }
+});

src/UI/Activity/Queue/QueueActionsCellTemplate.hbs

@@ -1,4 +1,4 @@
-{{#if_eq status compare="Completed"}}
+{{#if_eq status compare="Completed"}}
     {{#if_eq trackedDownloadStatus compare="Warning"}}
         <i class="icon-inbox x-import" title="Force import"></i>
     {{/if_eq}}

src/UI/Activity/Queue/QueueCollection.js

@@ -4,19 +4,24 @@ var PageableCollection = require('backbone.pageable');
 var QueueModel = require('./QueueModel');
 require('../../Mixins/backbone.signalr.mixin');
 
-module.exports = (function(){
-    var QueueCollection = PageableCollection.extend({
-        url         : window.NzbDrone.ApiRoot + '/queue',
-        model       : QueueModel,
-        state       : {pageSize : 15},
-        mode        : 'client',
-        findEpisode : function(episodeId){
-            return _.find(this.fullCollection.models, function(queueModel){
-                return queueModel.get('episode').id === episodeId;
-            });
-        }
-    });
-    var collection = new QueueCollection().bindSignalR();
-    collection.fetch();
-    return collection;
-}).call(this);
+var QueueCollection = PageableCollection.extend({
+    url   : window.NzbDrone.ApiRoot + '/queue',
+    model : QueueModel,
+
+    state : {
+        pageSize : 15
+    },
+
+    mode : 'client',
+
+    findEpisode : function(episodeId) {
+        return _.find(this.fullCollection.models, function(queueModel) {
+            return queueModel.get('episode').id === episodeId;
+        });
+    }
+});
+
+var collection = new QueueCollection().bindSignalR();
+collection.fetch();
+
+module.exports = collection;

src/UI/Activity/Queue/QueueLayout.js

@@ -1,116 +1,99 @@
-'use strict';
-define(
-    [
-        'marionette',
-        'backgrid',
-        'Activity/Queue/QueueCollection',
-        'Cells/SeriesTitleCell',
-        'Cells/EpisodeNumberCell',
-        'Cells/EpisodeTitleCell',
-        'Cells/QualityCell',
-        'Activity/Queue/QueueStatusCell',
-        'Activity/Queue/QueueActionsCell',
-        'Activity/Queue/TimeleftCell',
-        'Activity/Queue/ProgressCell',
-        'Release/ProtocolCell',
-        'Shared/Grid/Pager'
-    ], function (Marionette,
-                 Backgrid,
-                 QueueCollection,
-                 SeriesTitleCell,
-                 EpisodeNumberCell,
-                 EpisodeTitleCell,
-                 QualityCell,
-                 QueueStatusCell,
-                 QueueActionsCell,
-                 TimeleftCell,
-                 ProgressCell,
-                 ProtocolCell,
-                 GridPager) {
-        return Marionette.Layout.extend({
-            template: 'Activity/Queue/QueueLayoutTemplate',
+var Marionette = require('marionette');
+var Backgrid = require('backgrid');
+var QueueCollection = require('./QueueCollection');
+var SeriesTitleCell = require('../../Cells/SeriesTitleCell');
+var EpisodeNumberCell = require('../../Cells/EpisodeNumberCell');
+var EpisodeTitleCell = require('../../Cells/EpisodeTitleCell');
+var QualityCell = require('../../Cells/QualityCell');
+var QueueStatusCell = require('./QueueStatusCell');
+var QueueActionsCell = require('./QueueActionsCell');
+var TimeleftCell = require('./TimeleftCell');
+var ProgressCell = require('./ProgressCell');
+var ProtocolCell = require('../../Release/ProtocolCell');
+var GridPager = require('../../Shared/Grid/Pager');
 
-            regions: {
-                table: '#x-queue',
-                pager: '#x-queue-pager'
-            },
+module.exports = Marionette.Layout.extend({
+    template : 'Activity/Queue/QueueLayoutTemplate',
 
-            columns:
-                [
-                    {
-                        name      : 'status',
-                        label     : '',
-                        cell      : QueueStatusCell,
-                        cellValue : 'this'
-                    },
-                    {
-                        name      : 'series',
-                        label     : 'Series',
-                        cell      : SeriesTitleCell,
-                        sortable  : false
-                    },
-                    {
-                        name      : 'episode',
-                        label     : 'Episode',
-                        cell      : EpisodeNumberCell,
-                        sortable  : false
-                    },
-                    {
-                        name      : 'episode',
-                        label     : 'Episode Title',
-                        cell      : EpisodeTitleCell,
-                        sortable  : false
-                    },
-                    {
-                        name      : 'quality',
-                        label     : 'Quality',
-                        cell      : QualityCell,
-                        sortable  : false
-                    },
-                    {
-                        name      : 'protocol',
-                        label     : 'Protocol',
-                        cell      : ProtocolCell
-                    },
-                    {
-                        name      : 'timeleft',
-                        label     : 'Timeleft',
-                        cell      : TimeleftCell,
-                        cellValue : 'this'
-                    },
-                    {
-                        name      : 'episode',
-                        label     : 'Progress',
-                        cell      : ProgressCell,
-                        cellValue : 'this'
-                    },
-                    {
-                        name      : 'status',
-                        label     : '',
-                        cell      : QueueActionsCell,
-                        cellValue : 'this'
-                    }
-                ],
+    regions : {
+        table : '#x-queue',
+        pager : '#x-queue-pager'
+    },
 
-            initialize: function () {
-                this.listenTo(QueueCollection, 'sync', this._showTable);
-            },
+    columns : [
+        {
+            name      : 'status',
+            label     : '',
+            cell      : QueueStatusCell,
+            cellValue : 'this'
+        },
+        {
+            name     : 'series',
+            label    : 'Series',
+            cell     : SeriesTitleCell,
+            sortable : false
+        },
+        {
+            name     : 'episode',
+            label    : 'Episode',
+            cell     : EpisodeNumberCell,
+            sortable : false
+        },
+        {
+            name     : 'episode',
+            label    : 'Episode Title',
+            cell     : EpisodeTitleCell,
+            sortable : false
+        },
+        {
+            name     : 'quality',
+            label    : 'Quality',
+            cell     : QualityCell,
+            sortable : false
+        },
+        {
+            name  : 'protocol',
+            label : 'Protocol',
+            cell  : ProtocolCell
+        },
+        {
+            name      : 'timeleft',
+            label     : 'Timeleft',
+            cell      : TimeleftCell,
+            cellValue : 'this'
+        },
+        {
+            name      : 'episode',
+            label     : 'Progress',
+            cell      : ProgressCell,
+            cellValue : 'this'
+        },
+        {
+            name      : 'status',
+            label     : '',
+            cell      : QueueActionsCell,
+            cellValue : 'this'
+        }
+    ],
 
-            onShow: function () {
-                this._showTable();
-            },
+    initialize : function() {
+        this.listenTo(QueueCollection, 'sync', this._showTable);
+    },
 
-            _showTable: function () {
-                this.table.show(new Backgrid.Grid({
-                    columns   : this.columns,
-                    collection: QueueCollection,
-                    className : 'table table-hover'
-                }));
+    onShow : function() {
+        this._showTable();
+    },
 
-                this.pager.show(new GridPager({
-                    columns   : this.columns,
-                    collection: QueueCollection
-                }));
-            }
-        });
-    });
+    _showTable : function() {
+        this.table.show(new Backgrid.Grid({
+            columns    : this.columns,
+            collection : QueueCollection,
+            className  : 'table table-hover'
+        }));
+
+        this.pager.show(new GridPager({
+            columns    : this.columns,
+            collection : QueueCollection
+        }));
+    }
+});

src/UI/Activity/Queue/QueueLayoutTemplate.hbs

@@ -1,4 +1,4 @@
-<div class="row">
+<div class="row">
     <div class="col-md-12 table-responsive">
         <div id="x-queue" class="queue"/>
     </div>

src/UI/Activity/Queue/QueueModel.js

@@ -3,7 +3,7 @@ var SeriesModel = require('../../Series/SeriesModel');
 var EpisodeModel = require('../../Series/EpisodeModel');
 
 module.exports = Backbone.Model.extend({
-    parse : function(model){
+    parse : function(model) {
         model.series = new SeriesModel(model.series);
         model.episode = new EpisodeModel(model.episode);
         model.episode.set('series', model.series);

src/UI/Activity/Queue/QueueStatusCell.js

@@ -4,56 +4,68 @@ var NzbDroneCell = require('../../Cells/NzbDroneCell');
 module.exports = NzbDroneCell.extend({
     className : 'queue-status-cell',
     template  : 'Activity/Queue/QueueStatusCellTemplate',
-    render    : function(){
+
+    render : function() {
         this.$el.empty();
-        if(this.cellValue) {
+
+        if (this.cellValue) {
             var status = this.cellValue.get('status').toLowerCase();
             var trackedDownloadStatus = this.cellValue.has('trackedDownloadStatus') ? this.cellValue.get('trackedDownloadStatus').toLowerCase() : 'ok';
             var icon = 'icon-nd-downloading';
             var title = 'Downloading';
             var itemTitle = this.cellValue.get('title');
             var content = itemTitle;
-            if(status === 'paused') {
+
+            if (status === 'paused') {
                 icon = 'icon-pause';
                 title = 'Paused';
             }
-            if(status === 'queued') {
+
+            if (status === 'queued') {
                 icon = 'icon-cloud';
                 title = 'Queued';
             }
-            if(status === 'completed') {
+
+            if (status === 'completed') {
                 icon = 'icon-inbox';
                 title = 'Downloaded';
             }
-            if(status === 'pending') {
+
+            if (status === 'pending') {
                 icon = 'icon-time';
                 title = 'Pending';
             }
-            if(status === 'failed') {
+
+            if (status === 'failed') {
                 icon = 'icon-nd-download-failed';
                 title = 'Download failed';
             }
-            if(status === 'warning') {
+
+            if (status === 'warning') {
                 icon = 'icon-nd-download-warning';
                 title = 'Download warning: check download client for more details';
             }
-            if(trackedDownloadStatus === 'warning') {
+
+            if (trackedDownloadStatus === 'warning') {
                 icon += ' icon-nd-warning';
+
                 this.templateFunction = Marionette.TemplateCache.get(this.template);
                 content = this.templateFunction(this.cellValue.toJSON());
             }
-            if(trackedDownloadStatus === 'error') {
-                if(status === 'completed') {
+
+            if (trackedDownloadStatus === 'error') {
+                if (status === 'completed') {
                     icon = 'icon-nd-import-failed';
                     title = 'Import failed: ' + itemTitle;
-                }
-                else {
+                } else {
                     icon = 'icon-nd-download-failed';
                     title = 'Download failed';
                 }
+
                 this.templateFunction = Marionette.TemplateCache.get(this.template);
                 content = this.templateFunction(this.cellValue.toJSON());
             }
+
             this.$el.html('<i class="{0}"></i>'.format(icon));
             this.$el.popover({
                 content   : content,

src/UI/Activity/Queue/QueueView.js

@@ -3,30 +3,37 @@ var Marionette = require('marionette');
 var QueueCollection = require('./QueueCollection');
 
 module.exports = Marionette.ItemView.extend({
-    tagName    : 'span',
-    initialize : function(){
+    tagName : 'span',
+
+    initialize : function() {
         this.listenTo(QueueCollection, 'sync', this.render);
         QueueCollection.fetch();
     },
-    render     : function(){
+
+    render : function() {
         this.$el.empty();
-        if(QueueCollection.length === 0) {
+
+        if (QueueCollection.length === 0) {
             return this;
         }
+
         var count = QueueCollection.fullCollection.length;
         var label = 'label-info';
-        var errors = QueueCollection.fullCollection.some(function(model){
+
+        var errors = QueueCollection.fullCollection.some(function(model) {
             return model.has('trackedDownloadStatus') && model.get('trackedDownloadStatus').toLowerCase() === 'error';
         });
-        var warnings = QueueCollection.fullCollection.some(function(model){
+
+        var warnings = QueueCollection.fullCollection.some(function(model) {
             return model.has('trackedDownloadStatus') && model.get('trackedDownloadStatus').toLowerCase() === 'warning';
         });
-        if(errors) {
+
+        if (errors) {
             label = 'label-danger';
-        }
-        else if(warnings) {
+        } else if (warnings) {
             label = 'label-warning';
         }
+
         this.$el.html('<span class="label {0}">{1}</span>'.format(label, count));
         return this;
     }

src/UI/Activity/Queue/RemoveFromQueueView.js

@@ -1,39 +1,34 @@
-'use strict';
-define(
-    [
-        'vent',
-        'marionette'
-    ], function (vent, Marionette) {
+var vent = require('../../vent');
+var Marionette = require('marionette');
 
-        return  Marionette.ItemView.extend({
-            template: 'Activity/Queue/RemoveFromQueueViewTemplate',
+module.exports = Marionette.ItemView.extend({
+    template : 'Activity/Queue/RemoveFromQueueViewTemplate',
 
-            events: {
-                'click .x-confirm-remove' : 'removeItem'
-            },
+    events : {
+        'click .x-confirm-remove' : 'removeItem'
+    },
 
-            ui: {
-                blacklist : '.x-blacklist',
-                indicator : '.x-indicator'
-            },
+    ui : {
+        blacklist : '.x-blacklist',
+        indicator : '.x-indicator'
+    },
 
-            initialize: function (options) {
-                this.templateHelpers = {
-                    showBlacklist: options.showBlacklist
-                };
-            },
+    initialize : function(options) {
+        this.templateHelpers = {
+            showBlacklist : options.showBlacklist
+        };
+    },
 
-            removeItem: function () {
-                var blacklist = this.ui.blacklist.prop('checked') || false;
+    removeItem : function() {
+        var blacklist = this.ui.blacklist.prop('checked') || false;
 
-                this.ui.indicator.show();
+        this.ui.indicator.show();
 
-                this.model.destroy({
-                    data: { 'blacklist': blacklist },
-                    wait: true
-                }).done(function () {
-                        vent.trigger(vent.Commands.CloseModalCommand);
-                    });
-            }
+        this.model.destroy({
+            data : { 'blacklist' : blacklist },
+            wait : true
+        }).done(function() {
+            vent.trigger(vent.Commands.CloseModalCommand);
         });
-    });
+    }
+});

src/UI/Activity/Queue/TimeleftCell.js

@@ -6,26 +6,31 @@ var FormatHelpers = require('../../Shared/FormatHelpers');
 
 module.exports = NzbDroneCell.extend({
     className : 'timeleft-cell',
-    render    : function(){
+
+    render : function() {
         this.$el.empty();
-        if(this.cellValue) {
-            if(this.cellValue.get('status').toLowerCase() === 'pending') {
+
+        if (this.cellValue) {
+            if (this.cellValue.get('status').toLowerCase() === 'pending') {
                 var ect = this.cellValue.get('estimatedCompletionTime');
                 var time = '{0} at {1}'.format(FormatHelpers.relativeDate(ect), moment(ect).format(UiSettingsModel.time(true, false)));
                 this.$el.html('-');
                 this.$el.attr('title', 'Will be processed during the first RSS Sync after {0}'.format(time));
+
                 return this;
             }
+
             var timeleft = this.cellValue.get('timeleft');
             var totalSize = fileSize(this.cellValue.get('size'), 1, false);
             var remainingSize = fileSize(this.cellValue.get('sizeleft'), 1, false);
-            if(timeleft === undefined) {
+
+            if (timeleft === undefined) {
                 this.$el.html('-');
-            }
-            else {
+            } else {
                 this.$el.html('<span title="{1} / {2}">{0}</span>'.format(timeleft, remainingSize, totalSize));
             }
         }
+
         return this;
     }
 });