$(function () {
    $("tbody > tr:odd").addClass("odd");
    $("input:submit, .ui-button").button();
    $("input#Date").datepicker({ maxDate: '+0d' });
    $(".display-field-container")
        .filter(".source,.userHostAddress,.userAgent")
        .children(".display-label")
        .css('text-decoration', 'underline')
        .click(function () {
            $(this).parent().children('.display-field').toggle();
        })
        .end()
        .children('.display-field').hide();
    $("input#CityName").autocomplete({
        source: "/City/Autocomplete",
        minLength: 2
    });
    $("input#EmployeeName, input#Assigned").autocomplete({
        source: "/Employee/Autocomplete",
        minLength: 2
    });
    $("form select#Year").change(function () {
        $.getJSON('/Log/GetValidLogMonths', { year: $(this).val() }, function (months) {
            var options = '<option>Select Month</option>';
            for (var i = 0; i < months.length; i++) {
                options += '<option>' + months[i] + '</option>';
            }
            $("form select#Month").html(options);
        });
    });
    $("input#ModelYear,input#Price,input#VehicleId,input#EndOdometer,input#GasPurchased").numeric();
    $(".report-miles").each(function () {
        var content = $(this).next('.report-calculation');
        $(this).qtip({
            content: content,
            hide: {
                fixed: true,
                delay: 1000
            },
            style: {
                width: 400,
                classes: "qtip-light"
            }
        });
    });

    $(".miles-unknown").addClass('ui-state-error').append('<span class="ui-icon ui-icon-triangle-1-n"/>')
        .each(function () {
            $(this).qtip({
                content: "No previous log for this vehicle",
                style: {
                    classes: "qtip-red"
                }
            });
        });

    $("a.qtip-modal").each(function () { bindQtipModal($(this)); });

    $("input#EmployeeName").after('<span id="icon-employee-history" class="ui-icon ui-icon-search transparent"/>');

    function employeeHistoryKeydownHandler(data) {
        employeeHistoryIconUpdate($(data.target), $("#icon-employee-history"));
    }

    function employeeHistoryIconUpdate($input, $icon) {
        if (!$input.hasClass("input-validation-error") // not invalid
                && $input.attr("value").length > 0) // has text
            $icon.removeClass("transparent");
        else
            $icon.addClass("transparent");
    }

    $("input#EmployeeName").change(employeeHistoryKeydownHandler).keydown(employeeHistoryKeydownHandler);

    if ($("input#EmployeeName").length > 0)
        employeeHistoryIconUpdate($("input#EmployeeName"), $("#icon-employee-history"));

    $("#icon-employee-history").qtip({
            content: {
                text: "<p class=\"loading\">Recent Logs...</p>",
            },
            style: {
                width: 320,
                classes: 'qtip-light'
            },
            hide: {
                fixed: true,
                delay: 500
            },
            events: {
                show: function (event, api) {
                    $.ajax({
                        url: "CreateLog/RecentLogs",
                        data: {
                             employeeName: $("input#EmployeeName").val()
                        },
                        success: function(data) {
                            api.set("content.text", data);
                        }
                    });
                }
            }
        });

    if ($('input#VehicleId').length > 0) {
        //        var settings = $('form').validate().settings;

        //        settings.onkeyup = false;
        //        settings.onfocusout = function (element) { $(element).valid(); };

        //        var oldSuccessFunction = settings.success;

        //        settings.success = function (label) {
        //            alert("success");

        //            oldSuccessFunction(label);
        //        };
    }
});

function bindQtipModal(element) {
    var corner = {
        target: 'top left',
        tooltip: 'bottom center'
    };
    var tip = 'bottom left';
    if (element.hasClass("below")) {
        corner = {
            target: 'bottom middle',
            tooltip: 'top right'
        };
        tip = 'top right';
    }

    element.click(function () { return false; });

    element.append('<span class="ui-icon ui-icon-triangle-1-n"/>');

    element.qtip({
        content: {
            ajax: {
                url: element.attr('href')
            },
            text: "<p class=\"loading\">Recent Logs...</p>"
        },
        hide: {
            fixed: true,
            delay: 500
        },
        position: {
            corner: corner
        },
        style: {
            classes: 'qtip-light',
            tip: tip,
            width: 300
        }
    });
}