@using PlexRequests.UI.Helpers
@Html.Partial("_Sidebar")

<div class="col-sm-8 col-sm-push-1">
    <form class="form-horizontal" method="POST" id="mainForm">
        <fieldset>
            <legend>Slack Notifications</legend>

            <div class="form-group">
                <div class="checkbox">
             
                        @if (Model.Enabled)
                        {
                            <input type="checkbox" id="Enabled" name="Enabled" checked="checked"><label for="Enabled">Enabled</label>
                        }
                        else
                        {
                            <input type="checkbox" id="Enabled" name="Enabled"><label for="Enabled">Enabled</label>
                        }
                   
                </div>
            </div>
            
            <div class="form-group">
                <label for="WebhookUrl" class="control-label">Incoming Webhook Url</label>
                <small class="control-label">This is the full webhook url.</small>
                <small class="control-label"> Slack > Settings > Add app or integration > Build > Make a Custom Integration > Incoming Webhooks > Add Incoming Webhook. You will then have a Webhook Url</small>
                <div class="">
                    <input type="text" class="form-control form-control-custom " id="WebhookUrl" name="WebhookUrl"  value="@Model.WebhookUrl">
                </div>
            </div>

            <div class="form-group">
                <label for="Channel" class="control-label">Channel Override</label>
                <small class="control-label">You can override the default channel here</small>
                <div class="">
                    <input type="text" class="form-control form-control-custom " id="Channel" name="Channel" value="@Model.Channel">
                </div>
            </div>

            <div class="form-group">
                <label for="Username" class="control-label">Username Override</label>
                <small class="control-label">You can override the default username (Plex Requests) here</small>
                <div class="">
                    <input type="text" class="form-control form-control-custom " id="Username" name="Username" value="@Model.Username">
                </div>
            </div>

            <div class="form-group">
                <div>
                    <button id="testSlack" type="submit" class="btn btn-primary-outline">Test <div id="spinner"></div></button>
                </div>
            </div>

            <div class="form-group">
                <div>
                    <button id="save" type="submit" class="btn btn-primary-outline">Submit</button>
                </div>
            </div>
        </fieldset>
    </form>
</div>

<script>
    $(function () {

        var base = '@Html.GetBaseUrl()';
        $('#save').click(function (e) {
            e.preventDefault();

            $('#spinner').attr("class", "fa fa-spinner fa-spin");
            var $form = $("#mainForm");
            $.ajax({
                type: $form.prop("method"),
                data: $form.serialize(),
                url: $form.prop("action"),
                dataType: "json",
                success: function (response) {
                    if (response.result === true) {
                        generateNotify(response.message, "success");
        				$('#spinner').attr("class", "fa fa-check");
                    } else {
                        generateNotify(response.message, "warning");
        				$('#spinner').attr("class", "fa fa-times");
                    }
                },
                error: function (e) {
                    console.log(e);
                    generateNotify("Something went wrong!", "danger");
        				$('#spinner').attr("class", "fa fa-times");
                }
            });
        });

        $('#testSlack').click(function (e) {
            e.preventDefault();

            var url = createBaseUrl(base, '/admin/testslacknotification');
            var $form = $("#mainForm");
            $.ajax({
                type: $form.prop("method"),
                data: $form.serialize(),
                url: url,
                dataType: "json",
                success: function (response) {
                    if (response.result === true) {
                        generateNotify(response.message, "success");
                    } else {
                        generateNotify(response.message, "warning");
                    }
                },
                error: function (e) {
                    console.log(e);
                    generateNotify("Something went wrong!", "danger");
                }
            });
        });
    });
</script>