Lidarr/NzbDrone.Web/Views/Series/Index.cshtml

255 lines
12 KiB
Plaintext

@using NzbDrone.Web.Helpers
@{ViewBag.Title = "NzbDrone";}
@section HeaderContent
{
@Html.IncludeCss("Settings.css")
}
<style>
.progressbar {
position:relative;
width: 125px;
height: 20px;
background-color: transparent;
border: 1px solid #065EFE;
margin: 2px;
}
.progressbar-text {
position: absolute;
display: block;
width: 100%;
text-align: center;
}
.ui-progressbar-value {
overflow: hidden;
border: 1px solid #065EFE;
}
.ui-progressbar-value .progressbar-text {
position: relative;
font-weight: normal;
color: white;
}
/* Set the row height so it won't resize when the progress bar is created */
.seriesTable tr
{
height: 28px;
}
.commandsColumn, .statusColumn
{
text-align: center;
white-space: nowrap;
}
.ui-dialog-buttonpane .ui-dialog-buttonset .ui-delete-button
{
margin-right: 445px;
}
</style>
@section ActionMenu{
<ul class="sub-menu">
<li>@Html.ActionLink("Add Series", "Index", "AddSeries", null, new { Title = "Add a new or existing series" })</li>
<li>@Ajax.ActionLink("Start RSS Sync", "RssSync", "Command", null, null, new { Title = "Check for newly released downloads" })</li>
<li>@Html.ActionLink("Series Editor", "Editor", "Series", null, new { Title = "Edit multiple series" })</li>
</ul>
}
<table id="seriesGrid" class="dataTablesGrid hidden-grid">
<thead>
<tr>
<th style="width: 10px">Status</th>
<th style="width: auto">Title</th>
<th style="width: 100px">Seasons</th>
<th style="width: 100px">Quality</th>
<th style="width: 100px">Network</th>
<th style="width: 140px">Next Airing</th>
<th style="width: 100px">Episodes</th>
@*Commands Column*@
<th style="width: 80px"></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<div style="visibility: hidden">
<div id="seriesEditor" title="Edit Series">
</div>
<div id="seriesDelete" title="Delete Series">
<input class="seriesId" type="hidden" value="" />
Are you sure you want to delete '<span class="seriesTitle"></span>'?
<div class="series-delete-files">
@Html.CheckBox("DeleteFromDisk")
<label for="DeleteFromDisk">Delete all files from disk?</label>
</div>
</div>
</div>
@section Scripts{
@Html.IncludeScript("NzbDrone/series.js")
<script type="text/javascript">
var pauseImage = '<i class="icon-pause grid-icon" title="Not Monitored"></i>';
var stopImage = '<i class="icon-stop grid-icon" title="Ended"></i>';
var playImage = '<i class="icon-play grid-icon" title="Continuing"></i>';
$(document).ready(function () {
$('#seriesGrid').removeClass('hidden-grid');
oTable = $('.dataTablesGrid').dataTable({
"sAjaxSource": "/series/series",
"bServerSide": false,
"bShowAll": false,
"bPaginate": false,
"bLengthChange": false,
"bFilter": false,
"bSort": true,
"bInfo": false,
"bAutoWidth": false,
"bStateSave": true,
"iCookieDuration": 60 * 60 *24 * 365, //1 year
"aoColumns": [
{ sWidth: '70px',
"sClass": "statusColumn",
"mDataProp": function (source, type, val) {
// 'display' and 'filter' use our fancy naming
if (type === 'display' || type === 'filter') {
var monitored = source["Monitored"];
var status = source["Status"];
if (!monitored) {
return pauseImage;
}
else {
if (status === "Ended"){
return stopImage;
}
else {
return playImage;
}
}
}
// 'sort' and 'type' both just use the raw data
return source["Status"];
}
}, //Status
{ sWidth: 'auto', "mDataProp": function (source, type, val) {
// 'display' and 'filter' use our fancy naming
if (type === 'display' || type === 'filter') {
return "<a href='/series/details/" + source["SeriesId"] + "'>" + source["Title"] + "</a>";
}
// 'sort' and 'type' both just use the raw data
return source["TitleSorter"];
}
}, //Title
{ sWidth: '100px', "mDataProp": "SeasonsCount" }, //Seasons
{ sWidth: '100px', "mDataProp": "QualityProfileName", sClass: "qualityColumn" }, //Quality
{ sWidth: '120px', "mDataProp": "Network" }, //Network
{ sWidth: '120px', "mDataProp": function (source, type, val) {
// 'display' and 'filter' use our fancy naming
if (type === 'display' || type === 'filter') {
return source["NextAiring"];
}
// 'sort' and 'type' both just use the raw data
return source["NextAiringSorter"];
}
}, //Next Airing
{ sWidth: '140px', "mDataProp": "Episodes", "bSortable": false, "fnRender": function (row) {
var progress = 100;
if (row.aData["EpisodeCount"] > 0)
progress = row.aData["EpisodeFileCount"] / row.aData["EpisodeCount"] * 100;
var roundedProgress = Math.round(progress);
var progressbar =
'<div class="progressbar ui-progressbar ui-widget ui-widget-content ui-corner-all" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="' + roundedProgress + '" data-value="' + progress + '">' +
'<span class="progressbar-text">' + row.aData["EpisodeFileCount"] + ' / ' + row.aData["EpisodeCount"] + '</span>' +
'<div class="ui-progressbar-value ui-widget-header ui-corner-left" style="width: ' + roundedProgress + '%">' +
'<span class="progressbar-text" style="width: 125px">' + row.aData["EpisodeFileCount"] + ' / ' + row.aData["EpisodeCount"] + '</span>' +
'</div>' +
'</div>';
return progressbar;
}
}, //Episodes
{
sClass: "commandsColumn",
sWidth: '50px', "mDataProp": "HasBanner", "bSortable": false, "fnRender": function (row) {
return "<i class='icon-cog editButton gridAction' title = 'Edit Series' data-series-id='" + row.aData["SeriesId"] + "' data-series-title='" + row.aData["Title"] + "' ></i> " +
"<i class='icon-remove deleteButton gridAction' title = 'Delete Series' data-series-id='" + row.aData["SeriesId"] + "' data-series-title='" + row.aData["Title"] + "'></i>";
}
}, //Commands
{ sWidth: '60px', "mDataProp": "Details", "bSortable": false, "bVisible": false, "fnRender": function (row) {
var result = "<b>Airs Day of Week: </b>" + row.aData["AirsDayOfWeek"] + "<br/>" +
"<b>Air Time: </b>" + row.aData["AirTime"] + "<br/>" +
"<b>Overview: </b>" + row.aData["Overview"] + "<br/>";
return result;
}
} //Details
],
"aaSorting": [[1, 'asc']],
"fnCreatedRow": function( nRow, aData, iDataIndex ) {
$(nRow).attr('data-series-id', aData["SeriesId"].toString());
},
"oLanguage": {
"sEmptyTable": "No series have been added"
}
});
});
//After we delete a series do this...
function afterDelete(seriesId) {
var row = $('[data-series-id="' + seriesId + '"]');
if ($(row).hasClass('details-opened')) {
var nextRow = $(row).next('tr');
if($(nextRow).children('.Details').length > 0) {
$(nextRow).hide();
}
}
$(row).hide();
}
//After we save do this...
function afterSave() {
updateStatus();
//Update Quality
var seriesId = $('#SeriesId').val();
var quality = $('#QualityProfileId :selected').text();
$('.' + seriesId).children('.qualityColumn').text(quality);
}
function updateStatus() {
var monitored = $('#Monitored').attr('checked');
var seriesId = $('#SeriesId').val();
var status = $('#Status').val();
var imgContainer = $('.' + seriesId).children('.statusColumn');
if (!monitored) {
imgContainer.html(pauseImage);
}
else {
if (status === "Ended") {
imgContainer.html(stopImage);
}
else {
imgContainer.html(playImage);
}
}
}
</script>
}