From 78e5209cfd3edd99da2a648f4d8a4fc7ada1ec29 Mon Sep 17 00:00:00 2001 From: Mark McDowall Date: Sun, 10 Aug 2014 21:13:28 -0700 Subject: [PATCH] New: Details for import/grab on Episode Activity tab --- src/UI/Cells/cells.less | 10 ++ .../Activity/EpisodeActivityDetailsCell.js | 35 +++++ .../Episode/Activity/EpisodeActivityLayout.js | 8 + .../History/Details/HistoryDetailsLayout.js | 40 +++++ .../Details/HistoryDetailsLayoutTemplate.html | 23 +++ src/UI/History/Details/HistoryDetailsView.js | 25 +--- .../Details/HistoryDetailsViewTemplate.html | 140 ++++++++---------- src/UI/Series/series.less | 4 + src/UI/Shared/Modal/ModalController.js | 6 +- 9 files changed, 184 insertions(+), 107 deletions(-) create mode 100644 src/UI/Episode/Activity/EpisodeActivityDetailsCell.js create mode 100644 src/UI/History/Details/HistoryDetailsLayout.js create mode 100644 src/UI/History/Details/HistoryDetailsLayoutTemplate.html diff --git a/src/UI/Cells/cells.less b/src/UI/Cells/cells.less index 67c567269..e7cc528c0 100644 --- a/src/UI/Cells/cells.less +++ b/src/UI/Cells/cells.less @@ -129,6 +129,16 @@ td.episode-status-cell, td.quality-cell { } } +.episode-activity-details-cell { + width : 18px; +} + +.episode-detail-modal { + .episode-actions-cell { + width : 18px; + } +} + .series-actions-cell { width : 56px; min-width : 56px; diff --git a/src/UI/Episode/Activity/EpisodeActivityDetailsCell.js b/src/UI/Episode/Activity/EpisodeActivityDetailsCell.js new file mode 100644 index 000000000..d4b7c5452 --- /dev/null +++ b/src/UI/Episode/Activity/EpisodeActivityDetailsCell.js @@ -0,0 +1,35 @@ +'use strict'; + +define( + [ + 'jquery', + 'vent', + 'marionette', + 'Cells/NzbDroneCell', + 'History/Details/HistoryDetailsView', + 'bootstrap' + ], function ($, vent, Marionette, NzbDroneCell, HistoryDetailsView) { + return NzbDroneCell.extend({ + + className: 'episode-activity-details-cell', + + + render: function () { + this.$el.empty(); + this.$el.html(''); + + var html = new HistoryDetailsView({ model: this.model }).render().$el; + + this.$el.popover({ + content : html, + html : true, + trigger : 'hover', + title : 'Details', + placement: 'left', + container: this.$el + }); + + return this; + } + }); + }); diff --git a/src/UI/Episode/Activity/EpisodeActivityLayout.js b/src/UI/Episode/Activity/EpisodeActivityLayout.js index b9c9582d6..519a7d283 100644 --- a/src/UI/Episode/Activity/EpisodeActivityLayout.js +++ b/src/UI/Episode/Activity/EpisodeActivityLayout.js @@ -8,6 +8,7 @@ define( 'Cells/QualityCell', 'Cells/RelativeDateCell', 'Episode/Activity/EpisodeActivityActionsCell', + 'Episode/Activity/EpisodeActivityDetailsCell', 'Episode/Activity/NoActivityView', 'Shared/LoadingView' ], function (Marionette, @@ -17,6 +18,7 @@ define( QualityCell, RelativeDateCell, EpisodeActivityActionsCell, + EpisodeActivityDetailsCell, NoActivityView, LoadingView) { @@ -50,6 +52,12 @@ define( label: 'Date', cell : RelativeDateCell }, + { + name : 'this', + label : '', + cell : EpisodeActivityDetailsCell, + sortable: false + }, { name : 'this', label : '', diff --git a/src/UI/History/Details/HistoryDetailsLayout.js b/src/UI/History/Details/HistoryDetailsLayout.js new file mode 100644 index 000000000..0545aefee --- /dev/null +++ b/src/UI/History/Details/HistoryDetailsLayout.js @@ -0,0 +1,40 @@ +'use strict'; +define( + [ + 'jquery', + 'vent', + 'marionette', + 'History/Details/HistoryDetailsView' + ], function ($, vent, Marionette, HistoryDetailsView) { + + return Marionette.Layout.extend({ + template: 'History/Details/HistoryDetailsLayoutTemplate', + + regions: { + bodyRegion: '.modal-body' + }, + + events: { + 'click .x-mark-as-failed': '_markAsFailed' + }, + + onShow: function () { + this.bodyRegion.show(new HistoryDetailsView({ model: this.model })); + }, + + _markAsFailed: function () { + var url = window.NzbDrone.ApiRoot + '/history/failed'; + var data = { + id: this.model.get('id') + }; + + $.ajax({ + url: url, + type: 'POST', + data: data + }); + + vent.trigger(vent.Commands.CloseModalCommand); + } + }); + }); diff --git a/src/UI/History/Details/HistoryDetailsLayoutTemplate.html b/src/UI/History/Details/HistoryDetailsLayoutTemplate.html new file mode 100644 index 000000000..897ff0549 --- /dev/null +++ b/src/UI/History/Details/HistoryDetailsLayoutTemplate.html @@ -0,0 +1,23 @@ +
+
+
+
+ + +

+ {{#if_eq eventType compare="grabbed"}}Grabbed{{/if_eq}} + {{#if_eq eventType compare="downloadFailed"}}Download Failed{{/if_eq}} + {{#if_eq eventType compare="downloadFolderImported"}}Episode Imported{{/if_eq}} +

+ +
+
+ +
+
+ {{#if_eq eventType compare="grabbed"}}{{/if_eq}} + +
+
+
+
diff --git a/src/UI/History/Details/HistoryDetailsView.js b/src/UI/History/Details/HistoryDetailsView.js index 045189137..c7be5ad23 100644 --- a/src/UI/History/Details/HistoryDetailsView.js +++ b/src/UI/History/Details/HistoryDetailsView.js @@ -1,32 +1,11 @@ 'use strict'; define( [ - 'jquery', - 'vent', 'marionette', 'History/Details/HistoryDetailsAge' - ], function ($, vent, Marionette) { + ], function (Marionette) { return Marionette.ItemView.extend({ - template: 'History/Details/HistoryDetailsViewTemplate', - - events: { - 'click .x-mark-as-failed': '_markAsFailed' - }, - - _markAsFailed: function () { - var url = window.NzbDrone.ApiRoot + '/history/failed'; - var data = { - id: this.model.get('id') - }; - - $.ajax({ - url: url, - type: 'POST', - data: data - }); - - vent.trigger(vent.Commands.CloseModalCommand); - } + template: 'History/Details/HistoryDetailsViewTemplate' }); }); diff --git a/src/UI/History/Details/HistoryDetailsViewTemplate.html b/src/UI/History/Details/HistoryDetailsViewTemplate.html index 19b6d3794..0a17b5161 100644 --- a/src/UI/History/Details/HistoryDetailsViewTemplate.html +++ b/src/UI/History/Details/HistoryDetailsViewTemplate.html @@ -1,93 +1,71 @@ -
-
-
-
- +{{#if_eq eventType compare="grabbed"}} +
-

- {{#if_eq eventType compare="grabbed"}}Grabbed{{/if_eq}} - {{#if_eq eventType compare="downloadFailed"}}Download Failed{{/if_eq}} - {{#if_eq eventType compare="downloadFolderImported"}}Episode Imported{{/if_eq}} -

+
Name:
+
{{sourceTitle}}
-
-
- {{#if_eq eventType compare="grabbed"}} -
+ {{#with data}} + {{#if indexer}} +
Indexer:
+
{{indexer}}
+ {{/if}} -
Name:
-
{{sourceTitle}}
+ {{#if releaseGroup}} +
Release Group:
+
{{releaseGroup}}
+ {{/if}} - {{#with data}} - {{#if indexer}} -
Indexer:
-
{{indexer}}
- {{/if}} + {{#if nzbInfoUrl}} +
Info:
+
{{nzbInfoUrl}}
+ {{/if}} - {{#if releaseGroup}} -
Release Group:
-
{{releaseGroup}}
- {{/if}} + {{#if downloadClient}} +
Download Client:
+
{{downloadClient}}
+ {{/if}} - {{#if nzbInfoUrl}} -
Info:
-
{{nzbInfoUrl}}
- {{/if}} + {{#if downloadClientId}} +
Download Client ID:
+
{{downloadClientId}}
+ {{/if}} - {{#if downloadClient}} -
Download Client:
-
{{downloadClient}}
- {{/if}} + {{#if age}} + {{historyAge}} + {{/if}} + {{/with}} +
+{{/if_eq}} +{{#if_eq eventType compare="downloadFailed"}} +
- {{#if downloadClientId}} -
Download Client ID:
-
{{downloadClientId}}
- {{/if}} +
Name:
+
{{sourceTitle}}
- {{#if age}} - {{historyAge}} - {{/if}} - {{/with}} -
- {{/if_eq}} - {{#if_eq eventType compare="downloadFailed"}} -
+ {{#with data}} +
Message:
+
{{message}}
+ {{/with}} +
+{{/if_eq}} +{{#if_eq eventType compare="downloadFolderImported"}} +
-
Name:
-
{{sourceTitle}}
+ {{#if sourceTitle}} +
Name:
+
{{sourceTitle}}
+ {{/if}} - {{#with data}} -
Message:
-
{{message}}
- {{/with}} -
- {{/if_eq}} - {{#if_eq eventType compare="downloadFolderImported"}} -
+ {{#with data}} + {{#if droppedPath}} +
Source:
+
{{droppedPath}}
+ {{/if}} - {{#if sourceTitle}} -
Name:
-
{{sourceTitle}}
- {{/if}} - - {{#with data}} - {{#if droppedPath}} -
Source:
-
{{droppedPath}}
- {{/if}} - - {{#if importedPath}} -
Imported To:
-
{{importedPath}}
- {{/if}} - {{/with}} -
- {{/if_eq}} -
-
- {{#if_eq eventType compare="grabbed"}}{{/if_eq}} - -
-
-
-
+ {{#if importedPath}} +
Imported To:
+
{{importedPath}}
+ {{/if}} + {{/with}} + +{{/if_eq}} \ No newline at end of file diff --git a/src/UI/Series/series.less b/src/UI/Series/series.less index e4e05f63d..c69a1f7a5 100644 --- a/src/UI/Series/series.less +++ b/src/UI/Series/series.less @@ -266,6 +266,10 @@ margin-top : 30px; font-size : 12px; } + + .episode-activity-details-cell .popover { + max-width: 800px; + } } .season-grid { diff --git a/src/UI/Shared/Modal/ModalController.js b/src/UI/Shared/Modal/ModalController.js index 177092de3..b62aaf64b 100644 --- a/src/UI/Shared/Modal/ModalController.js +++ b/src/UI/Shared/Modal/ModalController.js @@ -7,10 +7,10 @@ define( 'Series/Edit/EditSeriesView', 'Series/Delete/DeleteSeriesView', 'Episode/EpisodeDetailsLayout', - 'History/Details/HistoryDetailsView', + 'History/Details/HistoryDetailsLayout', 'System/Logs/Table/Details/LogDetailsView', 'Rename/RenamePreviewLayout' - ], function (vent, AppLayout, Marionette, EditSeriesView, DeleteSeriesView, EpisodeDetailsLayout, HistoryDetailsView, LogDetailsView, RenamePreviewLayout) { + ], function (vent, AppLayout, Marionette, EditSeriesView, DeleteSeriesView, EpisodeDetailsLayout, HistoryDetailsLayout, LogDetailsView, RenamePreviewLayout) { return Marionette.AppRouter.extend({ @@ -49,7 +49,7 @@ define( }, _showHistory: function (options) { - var view = new HistoryDetailsView({ model: options.model }); + var view = new HistoryDetailsLayout({ model: options.model }); AppLayout.modalRegion.show(view); },