@using NzbDrone.Web.Helpers;
@model NzbDrone.Web.Models.DownloadClientSettingsModel

@{
    Layout = "_SettingsLayout.cshtml";
}

<style>
    .downloadClient
    {
        overflow: auto;
    }
    
    .downloadClient h4
    {
        font-weight: bold;
        margin-bottom: 0px;
        padding-left: 5px;
        padding-top: 3px;
    }
    
    #save_button
    {
        margin-top: 10px;
    }
    
    #downloadClient-top
    {
        overflow: auto;
    }
</style>
<div id="stylized">
    @using (Html.BeginForm("SaveDownloadClient", "Settings", FormMethod.Post, new { id = "DownloadClientForm", name = "DownloadClientForm", @class = "settingsForm" }))
    {
        <div id="downloadClient-top" class="settingsForm">
            <label class="labelClass">@Html.LabelFor(m => m.DownloadClient)
                <span class="small">@Html.DescriptionFor(m => m.DownloadClient)</span>
            </label>
            @Html.DropDownListFor(m => m.DownloadClient, Model.DownloadClientSelectList, new { @class = "inputClass selectClass" })

            <label class="labelClass">@Html.LabelFor(m => m.DownloadClientDropDirectory)
                <span class="small">@Html.DescriptionFor(m => m.DownloadClientDropDirectory)</span>
                <span class="small">@Html.ValidationMessageFor(m => m.DownloadClientDropDirectory)</span>
            </label>
            @Html.TextBoxFor(m => m.DownloadClientDropDirectory, new { @class = "inputClass folderLookup" })
            
            <label class="labelClass">@Html.LabelFor(m => m.UseSceneName)
                <span class="small">@Html.DescriptionFor(m => m.UseSceneName)</span>
            </label>
            @Html.CheckBoxFor(m => m.UseSceneName, new { @class = "inputClass checkClass" })
        </div>
        
        <div class="jquery-accordion" id="downloadClientAccordion">
            <h3><a href="#">Sabnzbd</a></h3>
            @{Html.RenderPartial("Sabnzbd", Model);}
            
            <h3><a href="#">Blackhole</a></h3>
            @{Html.RenderPartial("Blackhole", Model);}
            
            <h3><a href="#">Pneumatic</a></h3>
            @{Html.RenderPartial("Pneumatic", Model);}
            
            <h3><a href="#">Nzbget</a></h3>
            @{Html.RenderPartial("Nzbget", Model);}
        </div>
            
        <button type="submit" class="save_button" disabled="disabled">
            Save</button>
    }
</div>
<div id="result" class="hiddenResult">
</div>

@section Scripts{
    <script type="text/javascript">
        $(document).ready(function () {
            $('#downloadClientAccordion').accordion("activate", false);

            //Allow unobstrusive validation of the AJAX loaded form
            $.validator.unobtrusive.parse('#DownloadClientForm');

            //Validator Settings
            var settings = $.data($('#DownloadClientForm')[0], 'validator').settings;
            settings.ignore = [];
            settings.focusInvalid = false;
            settings.onfocusout = function (element) { $(element).valid(); };

            var oldHighlight = settings.highlight;
            var oldUnhighlight = settings.unhighlight;

            settings.highlight = function (element, errorClass, validClass) {
                oldHighlight(element, errorClass, validClass);
                $(element).parents('div.ui-accordion-content').prev('h3.ui-accordion-header').addClass('validation-error');
            };
            settings.unhighlight = function (element, errorClass, validClass) {
                oldUnhighlight(element, errorClass, validClass);

                var container = $(element).parents('div.ui-accordion-content');
                if ($(container).children('.' + errorClass).length == 0)
                    $(container).prev('h3.ui-accordion-header').removeClass('validation-error');
            };
        });

        $(document).on('change', '#DownloadClient', function () {
            $("#DownloadClientForm").validate().form();

            var container = $('div.ui-accordion-content');
            if ($(container).children('.input-validation-error').length == 0)
                $(container).prev('h3.ui-accordion-header').removeClass('validation-error');
        });

        var autoConfigureSabUrl = '@Url.Action("AutoConfigureSab", "Settings")';

        function autoConfigureSab() {
            $.ajax({
                type: "GET",
                url: autoConfigureSabUrl,
                error: function (req, status, error) {
                    alert("Sorry! We could not autoconfigure SABnzbd for you");
                },
                success: autoConfigureSuccess
            });

            function autoConfigureSuccess(data) {
                $('#SabHost').val(data.Host);
                $('#SabPort').val(data.Port);
                $('#SabApiKey').val(data.ApiKey);
            }
        }
        var sabCategoryUrl = '../Command/GetSabnzbdCategories';

        $('#SabTvCategory').focus(function () {
            var host = $('#SabHost').val();
            var port = $('#SabPort').val();
            var apiKey = $('#SabApiKey').val();
            var username = $('#SabUsername').val();
            var password = $('#SabPassword').val();

            $.ajax({
                type: "POST",
                url: sabCategoryUrl,
                data: jQuery.param({ host: host, port: port, apiKey: apiKey, username: username, password: password }),
                error: function (req, status, error) {
                    $.each($('#SabTvCategory option'), function () {
                        $(this).remove();
                    });

                    $('#SabTvCategory').append($('<option />').val('tv').text('Please check your SABnzbd Settings'));
                },
                success: function (data, textStatus, jqXHR) {
                    //Get the current value
                    var currentlySelected = $('#SabTvCategory').val();

                    //Remove all existing options
                    $.each($('#SabTvCategory option'), function () {
                        $(this).remove();
                    });

                    //Add the new ones
                    $.each(data.categories, function () {
                        $('#SabTvCategory').append($('<option />').val(this.toString()).text(this.toString()));
                    });

                    //Attempt to reset to the preiously selected value (change to lower-case)
                    $("#SabTvCategory").val(currentlySelected.toLowerCase());
                }
            });
        });
    </script>
}