added episode detail modal

summary tab is working.
pull/4/head
kay.one 12 years ago
parent 80759f923e
commit 95a6dfc34e

@ -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: {

@ -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);

@ -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');
}
});

@ -0,0 +1,21 @@
<div class="episode-detail-modal">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>{{title}}</h3>
</div>
<div class="modal-body">
<ul class="nav nav-tabs" id="myTab">
<li><a href="#episode-summary" class="x-episode-summary">Summary</a></li>
<li><a href="#episode-activity" class="x-episode-activity">Activity</a></li>
<li><a href="#episode-search" class="x-episode-search">Search Indexers</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane" id="episode-summary"/>
<div class="tab-pane" id="episode-activity"/>
<div class="tab-pane" id="episode-search"/>
</div>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal">close</button>
</div>
</div>

@ -1,12 +1 @@
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Delete: {{title}}</h3>
</div>
<div class="modal-body">
<h1>Searching for episodes!!!</h1>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal">cancel</button>
<button class="btn btn-danger x-confirm-delete">delete</button>
</div>


@ -0,0 +1,8 @@
"use strict";
define(['app'], function () {
NzbDrone.Episode.Summary.View = Backbone.Marionette.ItemView.extend({
template: 'Episode/Summary/ViewTemplate'
});
});

@ -0,0 +1,29 @@
<div class="episode-overview">
{{overview}}
</div>
<div class="episode-file-info">
{{#if episodeFile}}
{{#with episodeFile}}
<table class="table table-bordered">
<thead>
<tr>
<th>Path</th>
<th>Size</th>
<th>Quality</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{path}}</td>
<td>{{size}}</td>
<td>{{quality.quality.name}}</td>
</tr>
</tbody>
</table>
{{/with}}
{{else}}
<p class="text-warning">
No file available for this episode.
</p>
{{/if}}
</div>

@ -19,7 +19,7 @@
<link href="/content/menu.css" rel='stylesheet' type='text/css'/>
<link href="/content/form.css" rel='stylesheet' type='text/css'/>
<link href="/series/series.css" rel='stylesheet' type='text/css'/>
<link href="/series/details.css" rel='stylesheet' type='text/css'/>
<link href="/content/base.css" rel='stylesheet' type='text/css'/>
</head>
<body>

@ -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);
}
});
});

@ -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);
}
});
});

@ -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',

@ -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;
}
}

@ -106,17 +106,4 @@
display: none;
}
}
}
.series-season {
.episode-number-cell {
width: 20px;
}
.episode-air-date-cell {
width: 150px;
}
.episode-status-cell {
width: 100px;
}
}
}

@ -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 = {

Loading…
Cancel
Save