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

@{
    var baseUrl = Html.GetBaseUrl();
    var formAction = "/admin/loglevel";
    if (!string.IsNullOrEmpty(baseUrl.ToHtmlString()))
    {
        formAction = "/" + baseUrl.ToHtmlString() + formAction;
    }
}

<div class="col-sm-8 col-sm-push-1">
    <fieldset>
        <legend>Logs</legend>
        <form method="post" id="mainForm" action="@formAction">
            <div class="form-group">
                <label for="logLevel" class="control-label">Log Level</label>
                <div id="logLevel">
                    <select class="form-control" id="selected">
                        <option id="Trace" value="0">Trace</option>
                        <option id="Debug" value="1">Debug</option>
                        <option id="Info" value="2">Info</option>
                        <option id="Warn" value="3">Warn</option>
                        <option id="Error" value="4">Error</option>
                        <option id="Fatal" value="5">Fatal</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div>
                    <button id="save" type="submit" class="btn btn-primary-outline ">Submit</button>
                </div>
            </div>
        </form>

        <table id="example" class="table table-striped table-hover table-responsive">
            <thead>
                <tr>
                    <th>Message</th>
                    <th>Area</th>
                    <th>Log Level</th>
                    <th>Date</th>
                </tr>
            </thead>

        </table>
    </fieldset>
</div>



<script>
    $(function () {
        var baseUrl = '@Html.GetBaseUrl()';

        var logsUrl = "/admin/loadlogs";
        var url = createBaseUrl(baseUrl, logsUrl);
        $('#example').DataTable({
            "ajax": url,
            "columns": [
                { "data": "message" },
                { "data": "logger" },
                { "data": "level" },
                { "data": "dateString" }
            ],
            "order": [[3, "desc"]]
        });


        var logUrl = "/admin/loglevel";
        logUrl = createBaseUrl(baseUrl, logUrl);
        $.ajax({
            type: "get",
            url: logUrl,
            dataType: "json",
            success: function (response) {
                if (response && response.length > 0) {
                    $("#selected > option").each(function (level) {
                        var $opt = $(this);
                        if (response[0].ordinal == level) {
                            $opt.prop("selected", "selected");
                        }
                    });
                }
            },
            error: function (e) {
                console.log(e);
                generateNotify("Something went wrong!", "danger");
            }
        });

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

            var logLevel = $("#logLevel option:selected").val();

            var $form = $("#mainForm");
            var data = "level=" + logLevel;

            $.ajax({
                type: $form.prop("method"),
                data: data,
                url: $form.prop("action"),
                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>