MileageTraker/Web/Scripts/Shared/Site.js

$(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").append('&nbsp;<span class="muted">&#9652;</span>').each(function () {
        var content = $(this).next('.report-calculation');
        $(this).qtip({
            content: content,
            hide: {
                fixed: true,
                delay: 1000
            },
            style: {
                width: 520,
                classes: "qtip-light"
            },
            position: {
                my: "top right",
                at: "bottom left"
            },
        });
    });

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

    if ($("input#EmployeeName").length > 0) {

        $("input#EmployeeName")
            .after('<span id="icon-employee-history" class="add-on"><i class="icon-search" /></span>')
            .add('#icon-employee-history')
            .wrapAll('<div class="input-append"></div>');

        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);

        employeeHistoryIconUpdate($("input#EmployeeName"), $("#icon-employee-history"));

        $("#icon-employee-history").qtip({
            content: {
                text: "<p class=\"loading\">Recent Logs...</p>",
            },
            style: {
                width: 320,
                classes: 'qtip-light'
            },
            position: {
                my: "top right",
                at: "bottom left"
            },
            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);
                        }
                    });
                }
            }
        });
    }
});

$(function() {
    // Add active class to nav
    var idNavActiveRegex = { 'log-nav': /\/log/i, 'vehicle-nav': /\/vehicle/i };
    $.each(idNavActiveRegex, function (id, regex) {
        if (regex.test(document.URL)) {
            $("#" + id).addClass('active');
        }
    });
});

$(function () {
    var textToIcon = {
        'Edit': 'edit', 
        'Filter': 'filter',
        'Details' : 'zoom-in',
        'Delete': 'trash',
        'Add': 'plus',
        'Export': 'download',
        'Employee Mileage': 'user',
        'Vehicle Mileage': 'car'
    };
    $.each(textToIcon, function(text, icon) {
        $("a:contains('" + text + "')")
            .prepend('<i class="icon-' + icon + '" /> ');
    });
});

$(function() {
    // Convert MVC3 WebGrid paging to Bootstrap
    var $paging = $('table.table tfoot tr td');

    var $currentPage =
        $paging.contents()
            .filter(function () { return this.nodeType == 3 && this.length != 1; });
    var $otherPages = $('a', $paging);

    if ($paging.length == 1 && $otherPages.length > 0) {
        $currentPage.wrap('<li class="active"><a href="#">');
        $otherPages.wrap('<li>');
        $('li', $paging).wrapAll('<div class="pagination"><ul>');
    }
});

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

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

        element.append('&nbsp;<span class="muted">&#9652;</span>');

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

/*
 * Form Validation
 * This script will set Bootstrap error classes when form.submit is called.
 * The errors are produced by the MVC unobtrusive validation.
 */
$(function () {
    $('form').submit(function () {
        $(this).find('div.control-group').each(function () {
            if ($(this).find('span.field-validation-error').length == 0) {
                $(this).removeClass('error');
            }
        });

        if (!$(this).valid()) {
            $(this).find('div.control-group').each(function () {
                if ($(this).find('span.field-validation-error').length > 0) {
                    $(this).addClass('error');
                }
            });
        }
    });
    $('form').each(function () {
        $(this).find('div.control-group').each(function () {
            if ($(this).find('span.field-validation-error').length > 0) {
                $(this).addClass('error');
            }
        });
    });

    //Update that validator
    if ($.validator === undefined)
        return;
    $.validator.setDefaults({
        highlight: function (element) {
            $(element).closest(".control-group").addClass("error");
        },
        unhighlight: function (element) {
            $(element).closest(".control-group").removeClass("error");
        }
    });
});

/* End Form Validation */