@model SeriesDetailsModel

@using NzbDrone.Web.Helpers
@using NzbDrone.Web.Models

@section HeaderContent
{
    @Html.IncludeCss("Settings.css")
    <style>
        .seasonToggleTopGroup
        {
            overflow: hidden;
        }
    
        .seasonToggleTop
        {
            background-color: #F0F5FF;
            background-position: 5px center;
            background-repeat: no-repeat;
            display: inline-block;
            font-size: 15px;
            margin: 2px;
            padding: 2px 5px;
            width: 100px;
        }
    
        .seasonToggleLabel
        {
            margin-left: 5px;
            color: black;
            text-decoration: none;
        }
        
        .seasonToggleLabel:hover {
            color: #065EFE;
        }
        
        .seasonToggleTop .ignoredEpisodesMaster
        {
            padding-left: 0px;
            padding-right: 0px;
            border-style: none;
        }
    
        #banner-container
        {
            width: 758px;
            height: 140px;
            padding: 0px;
            margin-top: 10px;
            margin-bottom: 15px;
            margin-left: auto;
            margin-right: auto;
        }
   
        .seasonSection
        {
            margin-top: 50px;
        }
        
        .ui-dialog-buttonpane .ui-dialog-buttonset .ui-delete-button
        {
            margin-right: 445px;
        }
    </style>
}
@{ ViewBag.Title = Model.Title; }

@section ActionMenu
{
    <ul class="sub-menu">
        <li><a class="editButton" value="@Model.SeriesId" rel="@Model.Title" title="Edit series">Edit</a></li>
        <li>@Ajax.ActionLink("Force Refresh", "ForceRefresh", "Command", new { seriesId = Model.SeriesId }, null, new { Title = "Refresh episode and series information and scan for new episodes" })</li>
        <li>@Ajax.ActionLink("Search for missing episodes", "BacklogSeries", "Episode", new { seriesId = Model.SeriesId }, null, new { Title = "Search for episodes missing from this series" })</li>
        <li>@Ajax.ActionLink("Rename Episode Files", "RenameSeries", "Episode", new { seriesId = Model.SeriesId }, null, new { Title = "Rename all episode files to match your preferred naming" })</li>
    </ul>
}

@if (Model.HasBanner)
{
    var  bannerUrl = "../../MediaCover/Banners/" + Model.SeriesId + ".jpg";
    <div id="banner-container">
        <img src="@bannerUrl" alt="Banner"/>
    </div>
}

<div class="seasonToggleTopGroup">
    @foreach (var season in Model.Seasons.OrderBy(s => s.SeasonNumber))
    {
        var ignoreSeason = "ignoreSeason_" + season.SeasonNumber;
        <div class="seasonToggleTop">
            <img src='../../Content/Images/@(season.Ignored ? "ignored" : "notIgnored").png'
                 class='ignoredEpisodesMaster ignoreEpisode @ignoreSeason@(season.Ignored ? " ignored" : " ") gridAction'
                 title='Click to toggle season ignore status' />
            <a href="@string.Format("#SeasonSection_{0}", season.SeasonNumber)" class="seasonToggleLabel">@(season.SeasonNumber == 0 ? "Specials" : "Season " + season.SeasonNumber)</a>
        </div>
    }
</div>
@foreach (var s in Model.Seasons.OrderByDescending(a => a.SeasonNumber))
{
    <div class="seasonSection" id="@string.Format("SeasonSection_{0}", s.SeasonNumber)">
        @{
    var season = s;
    Html.RenderPartial("Season", season);
        }
    </div>
}

<div style="visibility: hidden">
    <div id="seriesEditor" title="Edit Series">
    </div>
</div>

<div style="visibility: hidden">
    <div id="qualityChanger" title="Change Quality">
        <label for="NewQuality">New Quality</label>
        @Html.DropDownList("NewQuality", Model.QualitySelectList)
    </div>
</div>

@section Scripts{
    @Html.IncludeScript("NzbDrone/seriesDetails.js")
    @Html.IncludeScript("NzbDrone/series.js")
    
    <script type="text/javascript">
        seriesId = @Model.SeriesId;

        //Used when we delete this series
        function afterDelete(seriesId) {
            window.location = "/";
        }
        
        //After we save do this...
        function afterSave() {
            //Do nothing
        }        
    </script>
}