From 95a6dfc34e55cd1bba73796e10c5340b12ad54fb Mon Sep 17 00:00:00 2001 From: "kay.one" Date: Mon, 20 May 2013 17:17:33 -0700 Subject: [PATCH] added episode detail modal summary tab is working. --- Gruntfile.js | 6 +-- UI/Content/Bootstrap/modals.less | 4 +- UI/Episode/Layout.js | 58 ++++++++++++++++++++++++-- UI/Episode/LayoutTemplate.html | 21 ++++++++++ UI/Episode/Search/LayoutTemplate.html | 13 +----- UI/Episode/Summary/View.js | 8 ++++ UI/Episode/Summary/ViewTemplate.html | 29 +++++++++++++ UI/Index.html | 2 +- UI/Series/Details/EpisodeStatusCell.js | 8 ---- UI/Series/Details/EpisodeTitleCell.js | 17 ++++++++ UI/Series/Details/SeasonLayout.js | 4 +- UI/Series/details.less | 30 +++++++++++++ UI/Series/series.less | 15 +------ UI/app.js | 6 ++- 14 files changed, 174 insertions(+), 47 deletions(-) create mode 100644 UI/Episode/LayoutTemplate.html create mode 100644 UI/Episode/Summary/View.js create mode 100644 UI/Episode/Summary/ViewTemplate.html create mode 100644 UI/Series/Details/EpisodeTitleCell.js create mode 100644 UI/Series/details.less diff --git a/Gruntfile.js b/Gruntfile.js index 5c1cfd0a0..2d2076623 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -91,8 +91,8 @@ module.exports = function (grunt) { copy: { index : { - src : 'UI/index.html', - dest: '_output/UI/index.html' + src : 'UI/**/index.html', + dest: '_output/' }, scripts: { src : 'UI/**/*.js', @@ -114,7 +114,7 @@ module.exports = function (grunt) { watch: { bootstrap : { - files: ['<%= less.bootstrap.src %>', 'UI/**/FontAwesome/**'], + files: ['UI/**/Bootstrap/**', 'UI/**/FontAwesome/**'], tasks: ['less:bootstrap'] }, generalLess: { diff --git a/UI/Content/Bootstrap/modals.less b/UI/Content/Bootstrap/modals.less index 8e272d409..f264fe15f 100644 --- a/UI/Content/Bootstrap/modals.less +++ b/UI/Content/Bootstrap/modals.less @@ -26,8 +26,8 @@ top: 10%; left: 50%; z-index: @zindexModal; - width: 560px; - margin-left: -280px; + width: 750px; + margin-left: -375px; background-color: @white; border: 1px solid #999; border: 1px solid rgba(0,0,0,.3); diff --git a/UI/Episode/Layout.js b/UI/Episode/Layout.js index b12afc538..80cb8cef1 100644 --- a/UI/Episode/Layout.js +++ b/UI/Episode/Layout.js @@ -1,8 +1,60 @@ "use strict"; -define(['app'], function () { +define(['app', 'Episode/Summary/View'], function () { - NzbDrone.Episode.Layout = Backbone.Marionette.ItemView.extend({ - template: 'Episode/Search/LayoutTemplate' + NzbDrone.Episode.Layout = Backbone.Marionette.Layout.extend({ + template: 'Episode/LayoutTemplate', + + + regions: { + summary : '#episode-summary', + activity: '#episode-activity', + search : '#episode-search' + }, + + ui: { + summary : '.x-episode-summary', + activity: '.x-episode-activity', + search : '.x-episode-search' + }, + + events: { + + 'click .x-episode-summary' : 'showSummary', + 'click .x-episode-activity': 'showActivity', + 'click .x-episode-search' : 'showSearch' + }, + + + onShow: function () { + this.showSummary(); + }, + + + showSummary: function (e) { + if (e) { + e.preventDefault(); + } + + this.ui.summary.tab('show'); + this.summary.show(new NzbDrone.Episode.Summary.View({model: this.model})); + + }, + + showActivity: function (e) { + if (e) { + e.preventDefault(); + } + + this.ui.activity.tab('show'); + }, + + showSearch: function (e) { + if (e) { + e.preventDefault(); + } + + this.ui.search.tab('show'); + } }); diff --git a/UI/Episode/LayoutTemplate.html b/UI/Episode/LayoutTemplate.html new file mode 100644 index 000000000..91c903cf5 --- /dev/null +++ b/UI/Episode/LayoutTemplate.html @@ -0,0 +1,21 @@ +
+
+ +

{{title}}

+
+
+ +
+
+
+ +
+
+ +
+
diff --git a/UI/Episode/Search/LayoutTemplate.html b/UI/Episode/Search/LayoutTemplate.html index ddcf6d049..5f282702b 100644 --- a/UI/Episode/Search/LayoutTemplate.html +++ b/UI/Episode/Search/LayoutTemplate.html @@ -1,12 +1 @@ -
- -

Delete: {{title}}

-
-
-

Searching for episodes!!!

-
-
- - -
- + \ No newline at end of file diff --git a/UI/Episode/Summary/View.js b/UI/Episode/Summary/View.js new file mode 100644 index 000000000..4403c0a0b --- /dev/null +++ b/UI/Episode/Summary/View.js @@ -0,0 +1,8 @@ +"use strict"; +define(['app'], function () { + + NzbDrone.Episode.Summary.View = Backbone.Marionette.ItemView.extend({ + template: 'Episode/Summary/ViewTemplate' + }); + +}); \ No newline at end of file diff --git a/UI/Episode/Summary/ViewTemplate.html b/UI/Episode/Summary/ViewTemplate.html new file mode 100644 index 000000000..45edc578c --- /dev/null +++ b/UI/Episode/Summary/ViewTemplate.html @@ -0,0 +1,29 @@ +
+ {{overview}} +
+
+ {{#if episodeFile}} + {{#with episodeFile}} + + + + + + + + + + + + + + + +
PathSizeQuality
{{path}}{{size}}{{quality.quality.name}}
+ {{/with}} + {{else}} +

+ No file available for this episode. +

+ {{/if}} +
diff --git a/UI/Index.html b/UI/Index.html index cae35c5a2..82b50d3e7 100644 --- a/UI/Index.html +++ b/UI/Index.html @@ -19,7 +19,7 @@ - + diff --git a/UI/Series/Details/EpisodeStatusCell.js b/UI/Series/Details/EpisodeStatusCell.js index 05e698614..478326345 100644 --- a/UI/Series/Details/EpisodeStatusCell.js +++ b/UI/Series/Details/EpisodeStatusCell.js @@ -5,9 +5,6 @@ define(['app', 'Episode/Layout'], function () { className: 'episode-status-cell', - events: { - 'click': 'showDetails' - }, render: function () { this.$el.empty(); @@ -32,11 +29,6 @@ define(['app', 'Episode/Layout'], function () { } return this; - }, - - showDetails: function () { - var view = new NzbDrone.Episode.Layout({ model: this.model }); - NzbDrone.modalRegion.show(view); } }); }); diff --git a/UI/Series/Details/EpisodeTitleCell.js b/UI/Series/Details/EpisodeTitleCell.js new file mode 100644 index 000000000..5e2983ee8 --- /dev/null +++ b/UI/Series/Details/EpisodeTitleCell.js @@ -0,0 +1,17 @@ +"use strict"; + +define(['app', 'Episode/Layout'], function () { + NzbDrone.Series.Details.EpisodeTitleCell = Backgrid.StringCell.extend({ + + className: 'episode-title-cell', + + events: { + 'click': 'showDetails' + }, + + showDetails: function () { + var view = new NzbDrone.Episode.Layout({ model: this.model }); + NzbDrone.modalRegion.show(view); + } + }); +}); diff --git a/UI/Series/Details/SeasonLayout.js b/UI/Series/Details/SeasonLayout.js index a781b28f3..79a6125d2 100644 --- a/UI/Series/Details/SeasonLayout.js +++ b/UI/Series/Details/SeasonLayout.js @@ -1,5 +1,5 @@ 'use strict'; -define(['app', 'Series/Details/EpisodeStatusCell'], function () { +define(['app', 'Series/Details/EpisodeStatusCell', 'Series/Details/EpisodeTitleCell'], function () { NzbDrone.Series.Details.SeasonLayout = Backbone.Marionette.Layout.extend({ template: 'Series/Details/SeasonLayoutTemplate', @@ -20,7 +20,7 @@ define(['app', 'Series/Details/EpisodeStatusCell'], function () { { name : 'title', label: 'Title', - cell : 'string' + cell : NzbDrone.Series.Details.EpisodeTitleCell }, { name : 'airDate', diff --git a/UI/Series/details.less b/UI/Series/details.less new file mode 100644 index 000000000..bb4dd863c --- /dev/null +++ b/UI/Series/details.less @@ -0,0 +1,30 @@ +.series-season { + .episode-number-cell { + width: 20px; + } + .episode-air-date-cell { + width: 150px; + } + + .episode-status-cell { + width: 100px; + } + + .episode-title-cell { + cursor: pointer; + } +} + +.episode-detail-modal { + + .episode-overview { + + font-style: italic; + } + + .episode-file-info { + + margin-top: 30px; + font-size: 12px; + } +} diff --git a/UI/Series/series.less b/UI/Series/series.less index 51f44c943..4d682a4b7 100644 --- a/UI/Series/series.less +++ b/UI/Series/series.less @@ -106,17 +106,4 @@ display: none; } } -} - -.series-season { - .episode-number-cell { - width: 20px; - } - .episode-air-date-cell { - width: 150px; - } - - .episode-status-cell { - width: 100px; - } -} +} \ No newline at end of file diff --git a/UI/app.js b/UI/app.js index d2265164f..95fe3dd79 100644 --- a/UI/app.js +++ b/UI/app.js @@ -50,7 +50,9 @@ define('app', ['shared/modal/region'], function (ModalRegion) { }; window.NzbDrone.Episode = { - Search: {} + Search : {}, + Summary : {}, + Activity: {} }; @@ -81,7 +83,7 @@ define('app', ['shared/modal/region'], function (ModalRegion) { window.NzbDrone.History = {}; window.NzbDrone.Events = { - SeriesAdded : 'seriesAdded' + SeriesAdded: 'seriesAdded' }; window.NzbDrone.Commands = {