From be95311471c1f8c3b5a17b3a668e1f9a9ae6c93e Mon Sep 17 00:00:00 2001 From: Leonardo Galli Date: Thu, 5 Jan 2017 23:03:34 +0100 Subject: [PATCH] Updated index page for movies. --- src/UI/Cells/EpisodeProgressCell.js | 2 +- src/UI/Cells/InCinemasCell.js | 16 +++++ src/UI/Cells/MovieActionCell.js | 45 ++++++++++++++ src/UI/Cells/MovieLinksCell.js | 6 ++ src/UI/Cells/MovieLinksTemplate.hbs | 11 ++++ src/UI/Cells/MovieStatusCell.js | 46 +++++++++++++++ src/UI/Cells/MovieTitleCell2.js | 6 ++ src/UI/Cells/TemplatedCell.js | 2 +- src/UI/Content/icons.less | 12 ++++ src/UI/Handlebars/Helpers/Series.js | 59 +++++++++++++++++++ src/UI/Movies/Index/MoviesIndexLayout.js | 40 +++++-------- .../SeriesOverviewItemViewTemplate.hbs | 26 ++++---- .../Posters/SeriesPostersItemViewTemplate.hbs | 16 ++--- src/UI/Movies/movies.less | 36 ++++++++++- 14 files changed, 276 insertions(+), 47 deletions(-) create mode 100644 src/UI/Cells/InCinemasCell.js create mode 100644 src/UI/Cells/MovieActionCell.js create mode 100644 src/UI/Cells/MovieLinksCell.js create mode 100644 src/UI/Cells/MovieLinksTemplate.hbs create mode 100644 src/UI/Cells/MovieStatusCell.js create mode 100644 src/UI/Cells/MovieTitleCell2.js diff --git a/src/UI/Cells/EpisodeProgressCell.js b/src/UI/Cells/EpisodeProgressCell.js index 6208040c4..84f39cb8a 100644 --- a/src/UI/Cells/EpisodeProgressCell.js +++ b/src/UI/Cells/EpisodeProgressCell.js @@ -25,4 +25,4 @@ module.exports = NzbDroneCell.extend({ return this; } -}); \ No newline at end of file +}); diff --git a/src/UI/Cells/InCinemasCell.js b/src/UI/Cells/InCinemasCell.js new file mode 100644 index 000000000..a49690f61 --- /dev/null +++ b/src/UI/Cells/InCinemasCell.js @@ -0,0 +1,16 @@ +var TemplatedCell = require('./TemplatedCell'); + +module.exports = TemplatedCell.extend({ + className : 'in-cinemas-cell', + + render : function() { + var monthNames = ["January", "February", "March", "April", "May", "June", + "July", "August", "September", "October", "November", "December" + ]; + var cinemasDate = new Date(this.model.get("inCinemas")); + var year = cinemasDate.getFullYear(); + var month = monthNames[cinemasDate.getMonth()]; + this.$el.html(month + " " + year); //Hack, but somehow handlebar helper does not work. + return this; + } +}); diff --git a/src/UI/Cells/MovieActionCell.js b/src/UI/Cells/MovieActionCell.js new file mode 100644 index 000000000..7f11e0ef5 --- /dev/null +++ b/src/UI/Cells/MovieActionCell.js @@ -0,0 +1,45 @@ +var vent = require('vent'); +var NzbDroneCell = require('./NzbDroneCell'); +var CommandController = require('../Commands/CommandController'); + +module.exports = NzbDroneCell.extend({ + className : 'series-actions-cell', + + ui : { + refresh : '.x-refresh' + }, + + events : { + 'click .x-edit' : '_editSeries', + 'click .x-refresh' : '_refreshSeries' + }, + + render : function() { + this.$el.empty(); + + this.$el.html(' ' + + ''); + + CommandController.bindToCommand({ + element : this.$el.find('.x-refresh'), + command : { + name : 'refreshMovie', + movieId : this.model.get('id') + } + }); + + this.delegateEvents(); + return this; + }, + + _editSeries : function() { + vent.trigger(vent.Commands.EditSeriesCommand, { series : this.model }); + }, + + _refreshSeries : function() { + CommandController.Execute('refreshMovie', { + name : 'refreshMovie', + movieId : this.model.id + }); + } +}); diff --git a/src/UI/Cells/MovieLinksCell.js b/src/UI/Cells/MovieLinksCell.js new file mode 100644 index 000000000..ff8643d1a --- /dev/null +++ b/src/UI/Cells/MovieLinksCell.js @@ -0,0 +1,6 @@ +var TemplatedCell = require('./TemplatedCell'); + +module.exports = TemplatedCell.extend({ + className : 'movie-links-cell', + template : 'Cells/MovieLinksTemplate' +}); diff --git a/src/UI/Cells/MovieLinksTemplate.hbs b/src/UI/Cells/MovieLinksTemplate.hbs new file mode 100644 index 000000000..01a3f52e2 --- /dev/null +++ b/src/UI/Cells/MovieLinksTemplate.hbs @@ -0,0 +1,11 @@ + + + {{#if website}} + Homepage + {{/if}} + The Movie DB + + {{#if imdbId}} + IMDB + {{/if}} + diff --git a/src/UI/Cells/MovieStatusCell.js b/src/UI/Cells/MovieStatusCell.js new file mode 100644 index 000000000..126afeb98 --- /dev/null +++ b/src/UI/Cells/MovieStatusCell.js @@ -0,0 +1,46 @@ +var NzbDroneCell = require('./NzbDroneCell'); + +module.exports = NzbDroneCell.extend({ + className : 'movie-status-cell', + + render : function() { + this.$el.empty(); + var monitored = this.model.get('monitored'); + var status = this.model.get('status'); + var inCinemas = this.model.get("inCinemas"); + var date = new Date(inCinemas); + var timeSince = new Date().getTime() - date.getTime(); + var numOfMonths = timeSince / 1000 / 60 / 60 / 24 / 30; + + if (status === 'released') { + this.$el.html(''); + this._setStatusWeight(3); + } + + if (numOfMonths > 3) { + this.$el.html('');//TODO: Update for PreDB.me + this._setStatusWeight(2); + } + + if (numOfMonths < 3) { + this.$el.html(''); + this._setStatusWeight(2); + } + + if (status === "announced") { + this.$el.html(''); + this._setStatusWeight(1); + } + + else if (!monitored) { + this.$el.html(''); + this._setStatusWeight(0); + } + + return this; + }, + + _setStatusWeight : function(weight) { + this.model.set('statusWeight', weight, { silent : true }); + } +}); diff --git a/src/UI/Cells/MovieTitleCell2.js b/src/UI/Cells/MovieTitleCell2.js new file mode 100644 index 000000000..f6fec3a35 --- /dev/null +++ b/src/UI/Cells/MovieTitleCell2.js @@ -0,0 +1,6 @@ +var TemplatedCell = require('./TemplatedCell'); + +module.exports = TemplatedCell.extend({ + className : 'series-title-cell', + template : 'Cells/SeriesTitleTemplate', +}); diff --git a/src/UI/Cells/TemplatedCell.js b/src/UI/Cells/TemplatedCell.js index 1299d4e36..eaf8d348e 100644 --- a/src/UI/Cells/TemplatedCell.js +++ b/src/UI/Cells/TemplatedCell.js @@ -18,4 +18,4 @@ module.exports = NzbDroneCell.extend({ this.delegateEvents(); return this; } -}); \ No newline at end of file +}); diff --git a/src/UI/Content/icons.less b/src/UI/Content/icons.less index 78f78a408..e06a481c0 100644 --- a/src/UI/Content/icons.less +++ b/src/UI/Content/icons.less @@ -207,6 +207,18 @@ .fa-icon-content(@fa-var-bookmark-o); } +.icon-sonarr-movie-announced { + .fa-icon-content(@fa-var-bullhorn); +} + +.icon-sonarr-movie-released { + .fa-icon-content(@fa-var-file-video-o); +} + +.icon-sonarr-movie-cinemas { + .fa-icon-content(@fa-var-ticket); +} + .icon-sonarr-log-info { .fa-icon-content(@fa-var-info-circle); .fa-icon-color(dodgerblue); diff --git a/src/UI/Handlebars/Helpers/Series.js b/src/UI/Handlebars/Helpers/Series.js index 09aa17dfc..2e8611e56 100644 --- a/src/UI/Handlebars/Helpers/Series.js +++ b/src/UI/Handlebars/Helpers/Series.js @@ -66,6 +66,65 @@ Handlebars.registerHelper('alternativeTitlesString', function() { return titles.slice(0,titles.length-1).join(", ") + " and " + titles[titles.length-1]; }); +Handlebars.registerHelper('GetStatus', function() { + var monitored = this.monitored; + var status = this.status; + var inCinemas = this.inCinemas; + var date = new Date(inCinemas); + var timeSince = new Date().getTime() - date.getTime(); + var numOfMonths = timeSince / 1000 / 60 / 60 / 24 / 30; + + if (status === 'released') { + return new Handlebars.SafeString(' Released'); + } + + if (numOfMonths > 3) { + return new Handlebars.SafeString(' Released');//TODO: Update for PreDB.me + } + + if (numOfMonths < 3) { + return new Handlebars.SafeString(' In Cinemas'); + } + + if (status === "announced") { + return new Handlebars.SafeString(' Announced'); + } + + else if (!monitored) { + return new Handlebars.SafeString(' Not Monitored'); + } +}) + +Handlebars.registerHelper('GetBannerStatus', function() { + var monitored = this.monitored; + var status = this.status; + var inCinemas = this.inCinemas; + var date = new Date(inCinemas); + var timeSince = new Date().getTime() - date.getTime(); + var numOfMonths = timeSince / 1000 / 60 / 60 / 24 / 30; + + if (status === 'released') { + return new Handlebars.SafeString('
 Released
'); + } + + if (numOfMonths > 3) { + return new Handlebars.SafeString('
 Released
');//TODO: Update for PreDB.me + } + + if (numOfMonths < 3) { + return new Handlebars.SafeString('
 In Cinemas
'); + } + + if (status === "announced") { + return new Handlebars.SafeString('
 Announced
'); + } + + else if (!monitored) { + return new Handlebars.SafeString('
 Not Monitored
'); + } +}) + + Handlebars.registerHelper('inCinemas', function() { var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" diff --git a/src/UI/Movies/Index/MoviesIndexLayout.js b/src/UI/Movies/Index/MoviesIndexLayout.js index 68fc34bc5..3e16a7eb7 100644 --- a/src/UI/Movies/Index/MoviesIndexLayout.js +++ b/src/UI/Movies/Index/MoviesIndexLayout.js @@ -5,13 +5,13 @@ var PosterCollectionView = require('./Posters/SeriesPostersCollectionView'); var ListCollectionView = require('./Overview/SeriesOverviewCollectionView'); var EmptyView = require('./EmptyView'); var MoviesCollection = require('../MoviesCollection'); -var RelativeDateCell = require('../../Cells/RelativeDateCell'); -var SeriesTitleCell = require('../../Cells/SeriesTitleCell'); +var InCinemasCell = require('../../Cells/InCinemasCell'); +var MovieTitleCell = require('../../Cells/MovieTitleCell2'); var TemplatedCell = require('../../Cells/TemplatedCell'); var ProfileCell = require('../../Cells/ProfileCell'); -var EpisodeProgressCell = require('../../Cells/EpisodeProgressCell'); -var SeriesActionsCell = require('../../Cells/SeriesActionsCell'); -var SeriesStatusCell = require('../../Cells/SeriesStatusCell'); +var MovieLinksCell = require('../../Cells/MovieLinksCell'); +var MovieActionCell = require('../../Cells/MovieActionCell'); +var MovieStatusCell = require('../../Cells/MovieStatusCell'); var FooterView = require('./FooterView'); var FooterModel = require('./FooterModel'); var ToolbarLayout = require('../../Shared/Toolbar/ToolbarLayout'); @@ -31,46 +31,36 @@ module.exports = Marionette.Layout.extend({ { name : 'statusWeight', label : '', - cell : SeriesStatusCell + cell : MovieStatusCell }, { name : 'title', label : 'Title', - cell : SeriesTitleCell, + cell : MovieTitleCell, cellValue : 'this', sortValue : 'sortTitle' }, - { - name : 'seasonCount', - label : 'Seasons', - cell : 'integer' - }, { name : 'profileId', label : 'Profile', cell : ProfileCell }, { - name : 'network', - label : 'Network', - cell : 'string' - }, - { - name : 'nextAiring', - label : 'Next Airing', - cell : RelativeDateCell + name : 'inCinemas', + label : 'In Cinemas', + cell : InCinemasCell }, { - name : 'percentOfEpisodes', - label : 'Episodes', - cell : EpisodeProgressCell, - className : 'episode-progress-cell' + name : 'this', + label : 'Links', + cell : MovieLinksCell, + className : "movie-links-cell" }, { name : 'this', label : '', sortable : false, - cell : SeriesActionsCell + cell : MovieActionCell } ], diff --git a/src/UI/Movies/Index/Overview/SeriesOverviewItemViewTemplate.hbs b/src/UI/Movies/Index/Overview/SeriesOverviewItemViewTemplate.hbs index ee6ddddee..716dd51cd 100644 --- a/src/UI/Movies/Index/Overview/SeriesOverviewItemViewTemplate.hbs +++ b/src/UI/Movies/Index/Overview/SeriesOverviewItemViewTemplate.hbs @@ -34,21 +34,25 @@
-
- {{#if_eq status compare="ended"}} - Ended - {{/if_eq}} +
+ {{GetStatus}} - {{#if nextAiring}} - {{RelativeDate nextAiring}} - {{/if}} - - {{seasonCountHelper}} + {{inCinemas}} {{profile profileId}}
-
- {{> EpisodeProgressPartial }} +
+ + + {{#if website}} + Homepage + {{/if}} + The Movie DB + + {{#if imdbId}} + IMDB + {{/if}} +
diff --git a/src/UI/Movies/Index/Posters/SeriesPostersItemViewTemplate.hbs b/src/UI/Movies/Index/Posters/SeriesPostersItemViewTemplate.hbs index 9ba5c0dfb..92e6e3298 100644 --- a/src/UI/Movies/Index/Posters/SeriesPostersItemViewTemplate.hbs +++ b/src/UI/Movies/Index/Posters/SeriesPostersItemViewTemplate.hbs @@ -5,9 +5,7 @@
- {{#unless_eq status compare="released"}} -
Released
- {{/unless_eq}} + {{GetBannerStatus}} {{poster}}
{{title}}
@@ -20,11 +18,15 @@
- {{> EpisodeProgressPartial }} - {{#if nextAiring}} - {{RelativeDate nextAiring}} - {{/if}} + {{#if website}} + Homepage + {{/if}} + The Movie DB + {{#if imdbId}} + IMDB + {{/if}} +
diff --git a/src/UI/Movies/movies.less b/src/UI/Movies/movies.less index 95c7b87ea..ce164bc14 100644 --- a/src/UI/Movies/movies.less +++ b/src/UI/Movies/movies.less @@ -120,7 +120,7 @@ .card; .clickable; margin-bottom : 20px; - height : 315px; + height : 324px; .center { display : block; @@ -200,7 +200,39 @@ font-weight: 100; } - .ended-banner { + .announced-banner { + color : #eeeeee; + background-color : #777; + .box-shadow(2px 2px 20px #888888); + -moz-transform-origin : 50% 50%; + -webkit-transform-origin : 50% 50%; + position : absolute; + width : 320px; + top : 200px; + left : -122px; + text-align : center; + .opacity(0.9); + + .transform(rotate(45deg)); + } + + .released-banner { + color : #eeeeee; + background-color : #5cb85c; + .box-shadow(2px 2px 20px #888888); + -moz-transform-origin : 50% 50%; + -webkit-transform-origin : 50% 50%; + position : absolute; + width : 320px; + top : 200px; + left : -122px; + text-align : center; + .opacity(0.9); + + .transform(rotate(45deg)); + } + + .cinemas-banner { color : #eeeeee; background-color : #b94a48; .box-shadow(2px 2px 20px #888888);