From 96810c489c235911ee4d5980506e469c027c67ab Mon Sep 17 00:00:00 2001 From: "kay.one" Date: Sun, 30 Jun 2013 12:57:26 -0700 Subject: [PATCH] fully working add series --- UI/.idea/NzbDrone.UI.iml | 1 + UI/.idea/jsLibraryMappings.xml | 6 +- .../libraries/backbone_backgrid_filter_js.xml | 67 ++++++++ UI/.idea/libraries/libraries.xml | 12 +- UI/AddSeries/AddSeriesLayout.js | 12 +- UI/AddSeries/AddSeriesTemplate.html | 16 +- UI/AddSeries/AddSeriesView.js | 62 +++++-- UI/AddSeries/Collection.js | 13 +- UI/AddSeries/Existing/CollectionView.js | 8 +- UI/AddSeries/Existing/CompositeView.js | 104 ------------ .../UnmappedFolderCompositeViewTemplate.html | 23 --- UI/AddSeries/RootFolders/LayoutTemplate.html | 2 +- UI/AddSeries/SearchResultCollectionView.js | 24 +-- UI/AddSeries/SearchResultTemplate.html | 14 +- UI/AddSeries/SearchResultView.js | 41 ++--- UI/AddSeries/addSeries.less | 153 +++++++++--------- UI/AddSeries/addSeriesLayoutTemplate.html | 8 +- UI/Handlebars/debug.js | 19 +-- UI/Series/Delete/DeleteSeriesTemplate.html | 3 +- UI/Series/SeriesCollection.js | 7 +- UI/Shared/NotFoundView.js | 2 +- 21 files changed, 289 insertions(+), 308 deletions(-) create mode 100644 UI/.idea/libraries/backbone_backgrid_filter_js.xml delete mode 100644 UI/AddSeries/Existing/CompositeView.js delete mode 100644 UI/AddSeries/Existing/UnmappedFolderCompositeViewTemplate.html diff --git a/UI/.idea/NzbDrone.UI.iml b/UI/.idea/NzbDrone.UI.iml index 9ffbb36a1..2184ad470 100644 --- a/UI/.idea/NzbDrone.UI.iml +++ b/UI/.idea/NzbDrone.UI.iml @@ -5,6 +5,7 @@ + diff --git a/UI/.idea/jsLibraryMappings.xml b/UI/.idea/jsLibraryMappings.xml index f6e673adc..03911505b 100644 --- a/UI/.idea/jsLibraryMappings.xml +++ b/UI/.idea/jsLibraryMappings.xml @@ -1,3 +1,7 @@ - + + + + + diff --git a/UI/.idea/libraries/backbone_backgrid_filter_js.xml b/UI/.idea/libraries/backbone_backgrid_filter_js.xml new file mode 100644 index 000000000..f7bf089af --- /dev/null +++ b/UI/.idea/libraries/backbone_backgrid_filter_js.xml @@ -0,0 +1,67 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/UI/.idea/libraries/libraries.xml b/UI/.idea/libraries/libraries.xml index ddc15483e..621295489 100644 --- a/UI/.idea/libraries/libraries.xml +++ b/UI/.idea/libraries/libraries.xml @@ -7,16 +7,12 @@ - - - - @@ -26,21 +22,21 @@ + + + + - - - - diff --git a/UI/AddSeries/AddSeriesLayout.js b/UI/AddSeries/AddSeriesLayout.js index a15bec513..656fe814b 100644 --- a/UI/AddSeries/AddSeriesLayout.js +++ b/UI/AddSeries/AddSeriesLayout.js @@ -7,8 +7,9 @@ define( 'AddSeries/Existing/CollectionView', 'AddSeries/AddSeriesView', 'Quality/QualityProfileCollection', - 'AddSeries/RootFolders/Collection' - ], function (App, Marionette, RootFolderLayout, ExistingSeriesCollectionView, AddSeriesView, qualityProfileCollection, rootFolderCollection) { + 'AddSeries/RootFolders/Collection', + 'Series/SeriesCollection', + ], function (App, Marionette, RootFolderLayout, ExistingSeriesCollectionView, AddSeriesView, qualityProfileCollection, rootFolderCollection, SeriesCollection) { return Marionette.Layout.extend({ template: 'AddSeries/AddSeriesLayoutTemplate', @@ -21,7 +22,14 @@ define( 'click .x-import': '_importSeries' }, + attributes: { + id: 'add-series-screen' + }, + initialize: function () { + + SeriesCollection.fetch(); + this.rootFolderLayout = new RootFolderLayout(); this.rootFolderLayout.on('folderSelected', this._folderSelected, this); diff --git a/UI/AddSeries/AddSeriesTemplate.html b/UI/AddSeries/AddSeriesTemplate.html index fabcb7b98..51bd1ac32 100644 --- a/UI/AddSeries/AddSeriesTemplate.html +++ b/UI/AddSeries/AddSeriesTemplate.html @@ -1,5 +1,12 @@ -
-
+
+
+ {{#if folder.path}} + {{folder.path}} + {{/if}} +
+
+
+
@@ -8,5 +15,6 @@
+ + more +
{{debug}} diff --git a/UI/AddSeries/AddSeriesView.js b/UI/AddSeries/AddSeriesView.js index c21602aed..933e964eb 100644 --- a/UI/AddSeries/AddSeriesView.js +++ b/UI/AddSeries/AddSeriesView.js @@ -1,32 +1,62 @@ 'use strict'; define( [ + 'app', 'marionette', 'AddSeries/Collection', 'AddSeries/SearchResultCollectionView', 'Shared/SpinnerView' - ], function (Marionette, AddSeriesCollection, SearchResultCollectionView, SpinnerView) { + ], function (App, Marionette, AddSeriesCollection, SearchResultCollectionView, SpinnerView) { return Marionette.Layout.extend({ template: 'AddSeries/AddSeriesTemplate', + regions: { + searchResult: '#search-result' + }, + ui: { seriesSearch: '.x-series-search', searchBar : '.x-search-bar', loadMore : '.x-load-more' }, - regions: { - searchResult: '#search-result' + events: { + 'click .x-load-more': '_onLoadMore' }, + _onLoadMore: function () { + this.ui.loadMore.hide(); + this.ui.searchBar.show(); + this.resultCollectionView.showAll(); + }, + + initialize: function (options) { - this.collection = new AddSeriesCollection(); + this.collection = new AddSeriesCollection({unmappedFolderModel: this.model}); this.isExisting = options.isExisting; + + if (this.isExisting) { + this.className = 'existing-series'; + this.listenTo(App.vent, App.Events.SeriesAdded, this._onSeriesAdded); + } + else { + this.className = 'new-series'; + } + }, + + + _onSeriesAdded: function (options) { + if (options.series.get('path') === this.model.get('folder').path) { + this.close(); + } }, onRender: function () { var self = this; + + this.$el.addClass(this.className); + this.ui.seriesSearch.data('timeout', null).keyup(function () { window.clearTimeout(self.$el.data('timeout')); self.$el.data('timeout', window.setTimeout(function () { @@ -40,8 +70,8 @@ define( this.ui.searchBar.hide(); } - this.resultView = new SearchResultCollectionView({ - fullResult: this.collection, + this.resultCollectionView = new SearchResultCollectionView({ + collection: this.collection, isExisting: this.isExisting }); }, @@ -50,7 +80,7 @@ define( var self = this; - this.abortExistingRequest(); + this.abortExistingSearch(); this.collection.reset(); @@ -59,22 +89,24 @@ define( } else { this.searchResult.show(new SpinnerView()); - this.currentSearchRequest = this.collection.fetch({ + this.currentSearchPromise = this.collection.fetch({ data: { term: options.term } }).done(function () { - self.searchResult.show(self.resultView); - - if (!self.showingAll && self.isExisting) { - self.ui.loadMore.show(); + if (!self.isClosed) { + self.searchResult.show(self.resultCollectionView); + if (!self.showingAll && self.isExisting) { + self.ui.loadMore.show(); + } } }); } + return this.currentSearchPromise; }, - abortExistingRequest: function () { - if (this.currentSearchRequest && this.currentSearchRequest.readyState > 0 && this.currentSearchRequest.readyState < 4) { + abortExistingSearch: function () { + if (this.currentSearchPromise && this.currentSearchPromise.readyState > 0 && this.currentSearchPromise.readyState < 4) { console.log('aborting previous pending search request.'); - this.currentSearchRequest.abort(); + this.currentSearchPromise.abort(); } } }); diff --git a/UI/AddSeries/Collection.js b/UI/AddSeries/Collection.js index 36e71b397..04101920b 100644 --- a/UI/AddSeries/Collection.js +++ b/UI/AddSeries/Collection.js @@ -1,4 +1,4 @@ -'use strict'; +'use strict'; define( [ 'backbone', @@ -8,10 +8,21 @@ define( url : window.ApiRoot + '/series/lookup', model: SeriesModel, + initialize: function (options) { + this.unmappedFolderModel = options.unmappedFolderModel; + }, + + parse: function (response) { + var self = this; + _.each(response, function (model) { model.id = undefined; + + if (self.unmappedFolderModel) { + model.path = self.unmappedFolderModel.get('folder').path; + } }); return response; diff --git a/UI/AddSeries/Existing/CollectionView.js b/UI/AddSeries/Existing/CollectionView.js index a933fe8f8..e5added59 100644 --- a/UI/AddSeries/Existing/CollectionView.js +++ b/UI/AddSeries/Existing/CollectionView.js @@ -12,10 +12,6 @@ define( initialize: function () { this.collection = new UnmappedFolderCollection(); - this.refreshItems(); - }, - - refreshItems: function () { this.collection.importItems(this.model); }, @@ -28,12 +24,12 @@ define( var model = this.collection.at(index); if (model) { - var that = this; + var self = this; var currentIndex = index; var folderName = model.get('folder').name; this.addItemView(model, this.getItemView(), index); $.when(this.children.findByModel(model).search({term: folderName})).then(function () { - that._showAndSearch(currentIndex + 1); + self._showAndSearch(currentIndex + 1); }); } }, diff --git a/UI/AddSeries/Existing/CompositeView.js b/UI/AddSeries/Existing/CompositeView.js deleted file mode 100644 index 600e5f21d..000000000 --- a/UI/AddSeries/Existing/CompositeView.js +++ /dev/null @@ -1,104 +0,0 @@ -'use strict'; -define( - [ - 'marionette', - 'AddSeries/Collection', - 'AddSeries/SearchResultView' - ], function (Marionette, AddSeriesCollection, SearchResultView) { - - return Marionette.CompositeView.extend({ - - template : 'AddSeries/Existing/UnmappedFolderCompositeViewTemplate', - itemViewContainer: '.x-folder-name-match-results', - itemView : SearchResultView, - - events: { - 'click .x-btn-search' : 'search', - 'click .x-load-more' : '_loadMore', - 'keydown .x-txt-search': 'keyDown' - }, - - ui: { - searchButton: '.x-btn-search', - searchText : '.x-txt-search', - searchBar : '.x-search-bar', - loadMore : '.x-load-more' - }, - - initialize: function () { - this.collection = new AddSeriesCollection(); - - this.on('item:removed', function () { - this.close(); - }, this); - }, - - onRender: function () { - this.ui.loadMore.show(); - }, - - search: function () { - var icon = this.ui.searchButton.find('icon'); - icon.removeClass('icon-search').addClass('icon-spin icon-spinner disabled'); - - var self = this; - var deferred = $.Deferred(); - - this.collection.reset(); - - this.searchCollection = new AddSeriesCollection(); - - this.searchCollection.fetch({ - data: { term: this.ui.searchText.val() } - }).done(function () { - icon.removeClass('icon-spin icon-spinner disabled').addClass('icon-search'); - deferred.resolve(); - self.collection.add(self.searchCollection.shift()); - - if (self.showall) { - self._showAll(); - } - - }).fail(function () { - icon.removeClass('icon-spin icon-spinner disabled').addClass('icon-search'); - deferred.reject(); - }); - - return deferred.promise(); - }, - - - keyDown: function (e) { - //Check for enter being pressed - var code = (e.keyCode ? e.keyCode :e.which); - if (code === 13) { - this.search(); - } - }, - - _loadMore: function () { - this.showall = true; - - this.ui.searchBar.fadeIn(); - this.ui.loadMore.fadeOut(); - - this._showAll(); - }, - - _showAll: function () { - var self = this; - this.searchCollection.each(function (searchResult) { - self.collection.add(searchResult); - }); - }, - - itemViewOptions: function () { - return { - rootFolder: this.model.get('rootFolder'), - folder : this.model.get('folder').path, - isExisting: true - }; - } - }); - - }); diff --git a/UI/AddSeries/Existing/UnmappedFolderCompositeViewTemplate.html b/UI/AddSeries/Existing/UnmappedFolderCompositeViewTemplate.html deleted file mode 100644 index ba6d0432d..000000000 --- a/UI/AddSeries/Existing/UnmappedFolderCompositeViewTemplate.html +++ /dev/null @@ -1,23 +0,0 @@ -
-
-

- - {{folder.path}} -

-
- -
-
-
-
diff --git a/UI/AddSeries/RootFolders/LayoutTemplate.html b/UI/AddSeries/RootFolders/LayoutTemplate.html index fc387d9df..a60ef9142 100644 --- a/UI/AddSeries/RootFolders/LayoutTemplate.html +++ b/UI/AddSeries/RootFolders/LayoutTemplate.html @@ -8,7 +8,7 @@
-
+
diff --git a/UI/AddSeries/SearchResultCollectionView.js b/UI/AddSeries/SearchResultCollectionView.js index 1cad1f138..26799c782 100644 --- a/UI/AddSeries/SearchResultCollectionView.js +++ b/UI/AddSeries/SearchResultCollectionView.js @@ -3,9 +3,8 @@ define( [ 'marionette', 'AddSeries/SearchResultView', - 'AddSeries/Collection' - ], function (Marionette, SearchResultView, SearchResultCollection) { + ], function (Marionette, SearchResultView) { return Marionette.CollectionView.extend({ @@ -13,34 +12,19 @@ define( initialize: function (options) { - this.isExisting = options.isExisting; - this.fullResult = options.fullResult; - - this.listenTo(this.fullResult, 'sync', this._processResultCollection); }, - showAll: function () { - this.showingAll = true; - this.fullResult.each(function (searchResult) { - this.collection.add(searchResult); - }); - this.render(); }, - _processResultCollection: function () { - if (!this.showingAll && this.isExisting) { - this.collection = new SearchResultCollection(); - this.collection.add(this.fullResult.shift()); - } - else { - this.collection = this.fullResult; + appendHtml: function (collectionView, itemView, index) { + if (!this.isExisting || this.showingAll || index === 0) { + collectionView.$el.append(itemView.el); } } - }); }); diff --git a/UI/AddSeries/SearchResultTemplate.html b/UI/AddSeries/SearchResultTemplate.html index 752ab0301..0b5792540 100644 --- a/UI/AddSeries/SearchResultTemplate.html +++ b/UI/AddSeries/SearchResultTemplate.html @@ -2,7 +2,8 @@
- +
@@ -14,16 +15,23 @@ {{overview}}
-
+ {{#if existing}} +
+ Already Exists +
+ {{else}} +
Add
- {{#unless isExisting}} + {{#unless path}} {{> RootFolderSelectionPartial rootFolders}} {{/unless}}
{{> QualityProfileSelectionPartial qualityProfiles}}
+ {{/if}} +
diff --git a/UI/AddSeries/SearchResultView.js b/UI/AddSeries/SearchResultView.js index ee19912c0..14a4b8176 100644 --- a/UI/AddSeries/SearchResultView.js +++ b/UI/AddSeries/SearchResultView.js @@ -22,7 +22,7 @@ define( }, events: { - 'click .x-add' : 'addSeries', + 'click .x-add' : '_addSeries', 'change .x-quality-profile': '_qualityProfileChanged' }, @@ -32,10 +32,8 @@ define( throw 'model is required'; } - this.model.set('isExisting', this.options.isExisting); - this.model.set('path', this.options.folder); - - App.vent.on(Config.Events.ConfigUpdatedEvent, this._onConfigUpdated, this); + this.listenTo(App.vent, Config.Events.ConfigUpdatedEvent, this._onConfigUpdated); + this.listenTo(this.model, 'change', this.render); }, @@ -51,7 +49,6 @@ define( }, onRender: function () { - this.listenTo(this.model, 'change', this.render); var defaultQuality = Config.GetValue(Config.Keys.DefaultQualityProfileId); @@ -60,7 +57,6 @@ define( } }, - addSeries: function () { var icon = this.ui.addButton.find('icon'); icon.removeClass('icon-plus').addClass('icon-spin icon-spinner disabled'); @@ -76,26 +72,35 @@ define( SeriesCollection.add(this.model); - this.model.save() - .done(function () { - self.close(); - icon.removeClass('icon-spin icon-spinner disabled').addClass('icon-search'); - Messenger.show({ - message: 'Added: ' + self.model.get('title') - }); + this.model.save().done(function () { + self.close(); + icon.removeClass('icon-spin icon-spinner disabled').addClass('icon-search'); + Messenger.show({ + message: 'Added: ' + self.model.get('title') + }); - App.vent.trigger(App.Events.SeriesAdded, { series: self.model }); - }) - .fail(function () { + App.vent.trigger(App.Events.SeriesAdded, { series: self.model }); + }).fail(function () { icon.removeClass('icon-spin icon-spinner disabled').addClass('icon-search'); }); + }, serializeData: function () { var data = this.model.toJSON(); - data.rootFolders = RootFolders.toJSON(); + + var existingSeries = SeriesCollection.where({tvdbId: this.model.get('tvdbId')}); + + if (existingSeries.length > 0) { + data.existing = existingSeries[0].toJSON(); + } + data.qualityProfiles = QualityProfiles.toJSON(); + if (!data.isExisting) { + data.rootFolders = RootFolders.toJSON(); + } + return data; } }); diff --git a/UI/AddSeries/addSeries.less b/UI/AddSeries/addSeries.less index 711276b64..0d212e877 100644 --- a/UI/AddSeries/addSeries.less +++ b/UI/AddSeries/addSeries.less @@ -1,105 +1,96 @@ @import "../shared/Styles/card.less"; @import "../shared/Styles/clickable.less"; -.result-list { - font-size : 14px; - text-align : left; - padding-bottom : 30px; +#add-series-screen { - .folder-path, .folder-free-space { - .clickable; + .operations-row { + margin-left : 0px; } -} -.existing-root-folder-view { - h1 { - padding : 10px 0 20px 0; - } -} + .existing-series { -.add-series-import-btn { - margin : 0px 40px; - width : 1080px; -} + @highLight : rgb(134, 129, 130); -.add-series-search { - margin-top : 20px; - margin-bottom : 20px; - padding-left : 20px; + .card(); + margin : 20px 0px; - *[class*='icon-'] { - font-size : 28px; - height : 30px; - width : 40px; - padding-top : 14px; - } - input { - height : 50px; - } + .add-series-search { + width : 970px; + } -} + .unmapped-folder-path { + padding: 20px; + margin-left : 0px; + font-weight : 100; + font-size : 25px; + text-align : center; + background : @highLight; + } -.folder-name-matches { - padding-left : 20px; - padding-top : 10px; -} + .new-series-loadmore { + .clickable; + font-size : 30px; + font-weight : 300; + padding-top : 10px; + padding-bottom : 10px; + background : @highLight; + } + } -.add-series-poster { - min-width : 138px; - min-height : 203px; - max-width : 138px; - max-height : 203px; -} + .new-series { + .search-item { + .card(); + margin : 40px 0px; + } + } -.unmapped-folder-view { - .card; - margin-top : 20px; - padding : 20px; - .folder-header { - font-weight : 300; - select { - margin-bottom : 0; - font-size : 16px; + .add-series-search { + margin-top : 20px; + margin-bottom : 20px; + padding-left : 20px; + + *[class*='icon-'] { + font-size : 28px; + height : 30px; + width : 40px; + padding-top : 14px; } input { - margin-bottom : 0; + height : 50px; } } -} -.search-item { + .search-item { - padding-bottom : 20px; - a { - color : #343434; - } - a:hover { - text-decoration : none; - } - select { - font-size : 16px; - } -} + .new-series-overview { + text-overflow : ellipsis; + white-space : pre-line; + overflow : hidden; + height : 125px; + } -.search-item-new { - .card; -} + .new-series-poster { + min-width : 138px; + min-height : 203px; + max-width : 138px; + max-height : 203px; + margin : 10px; + } -.new-series-overview { - text-overflow : ellipsis; - white-space : pre-line; - overflow : hidden; - height : 125px; -} + padding-bottom : 20px; + a { + color : #343434; + } + a:hover { + text-decoration : none; + } + select { + font-size : 16px; + } -.new-series-add { - margin-left : 20px; -} + .add-series { + margin-left : 20px; + } + } -.loadmore { - .clickable; - font-size : 30px; - font-weight : 300; - padding-top : 10px; - padding-bottom : 10px; } diff --git a/UI/AddSeries/addSeriesLayoutTemplate.html b/UI/AddSeries/addSeriesLayoutTemplate.html index 05b57fcdc..4d4e55f5b 100644 --- a/UI/AddSeries/addSeriesLayoutTemplate.html +++ b/UI/AddSeries/addSeriesLayoutTemplate.html @@ -1,7 +1,7 @@ -
+
- Import existing series on disk + + Import existing series on disk
- -
\ No newline at end of file +
diff --git a/UI/Handlebars/debug.js b/UI/Handlebars/debug.js index 4d052a1a9..b01d548ac 100644 --- a/UI/Handlebars/debug.js +++ b/UI/Handlebars/debug.js @@ -1,18 +1,11 @@ 'use strict'; -define({ - register: function (Handlebars) { - Handlebars.registerHelper("debug", function (optionalValue) { - +define( + [ + 'handlebars' + ], function (Handlebars) { + Handlebars.registerHelper("debug", function () { console.group('Handlebar context'); - console.log(this); - if (optionalValue) { - - console.group('optional values'); - console.log('optinal values'); - console.groupEnd(); - } console.groupEnd(); }); - } -}); + }); diff --git a/UI/Series/Delete/DeleteSeriesTemplate.html b/UI/Series/Delete/DeleteSeriesTemplate.html index 5654f088a..b0217df6f 100644 --- a/UI/Series/Delete/DeleteSeriesTemplate.html +++ b/UI/Series/Delete/DeleteSeriesTemplate.html @@ -4,6 +4,7 @@

Are you sure you want to delete '{{title}}'?

+

{{path}}

diff --git a/UI/Series/SeriesCollection.js b/UI/Series/SeriesCollection.js index fa56d4f9d..9128ea883 100644 --- a/UI/Series/SeriesCollection.js +++ b/UI/Series/SeriesCollection.js @@ -4,7 +4,7 @@ define( 'backbone', 'Series/SeriesModel' ], function (Backbone, SeriesModel) { - var collection = Backbone.Collection.extend({ + var Collection = Backbone.Collection.extend({ url : window.ApiRoot + '/series', model: SeriesModel, @@ -18,5 +18,8 @@ define( } }); - return new collection(); + var collection = new Collection(); + collection.fetch(); + + return collection; }); diff --git a/UI/Shared/NotFoundView.js b/UI/Shared/NotFoundView.js index 211f21151..2d570d19c 100644 --- a/UI/Shared/NotFoundView.js +++ b/UI/Shared/NotFoundView.js @@ -1,4 +1,4 @@ -'use strict'; +'use strict'; define( [ 'marionette'