/// <reference path="jquery-1.3.2-vsdoc2.js" />

var CarMinOutDate;
var CarMaxOutDate;
var CarMinInDate;
var CarMaxInDate;

$(function() {

});

function InitCars() {
    //Get the branches
    BeginBuildCarOutBranches();
    BeginBuildCarInBranches();

    //Get the provinces
    BeginBuildProviceDropdowns();

    //Get the upper and lower bounds for collecting a car.
    ajaxJsonPost('GetCarOutDateRange', null, SetCarOutDateRange, handleError);

    $('#DeliverCarCheckbox').click(DeliverCarToggle);
    $('#CollectCarCheckbox').click(CollectCarToggle);
    $('#CarPickupBranch').change(BeginBuildCarOutTimes);
    $('#CarDropoffBranch').change(BeginBuildCarInTime);
    $('#CarOutDay').change(BeginBuildCarOutTimes);
    $('#CarInDay').change(BeginBuildCarInTime);
    $('#CarCollectionProvince').change(CollectionProvinceChanged);
    $('#CarDeliveryProvince').change(DeliveryProvinceChanged);
    $('#fCar').submit(ValidateCarSearch);
}

function SetCarOutDateRange(result) {
    CarMinOutDate = new Date(result.d[0]);
    CarMaxOutDate = new Date(result.d[1]);

    //Set up the datepicker plugins with the correct dates and bounds.
    $('#CalendarOut').datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: 'yy/mm/dd',
        minDate: CarMinOutDate, //DateAdd('d', 1, d),
        maxDate: CarMaxOutDate,
        showOn: 'both',
        buttonImage: 'images/calendar.gif',
        buttonImageOnly: true,
        onClose: function(selectedDate) {
            if (selectedDate != '') {
                var dt = new Date(selectedDate);
                $('#CalendarIn').datepicker('option', 'minDate', DateAdd('d', 1, dt));
                CarMinOutDate = DateAdd('d', 1, dt);
                CarMinInDate = DateAdd('d', 3, dt);
                CarMaxInDate = DateAdd('d', 30, dt);
                $('#CalendarIn').datepicker('option', 'maxDate', CarMaxInDate);
                BeginBuildCarOutTimes();
            }
        },
        defaultDate: CarMinOutDate
    });

    var data = '{ "CarOutDate": "\\\/Date(' + Date.parse(CarMinOutDate) + ')\\\/" }';
    ajaxJsonPost('GetCarInDateRange', data, SetCarInDateRange, handleError);
}

function SetCarInDateRange(result) {
    CarMinInDate = new Date(result.d[0]);
    CarMaxInDate = new Date(result.d[1]);

    $('#CalendarIn').datepicker({
        changeMonth: true,
        changeYear: true,
        dateFormat: 'yy/mm/dd',
        minDate: CarMinInDate, //DateAdd('d', 1, d),
        maxDate: CarMaxInDate,
        showOn: 'both',
        buttonImage: 'images/calendar.gif',
        buttonImageOnly: true,
        onClose: function(selectedDate) {
            if (selectedDate != '') {
                var dt = new Date(selectedDate);
                $('#CalendarOut').datepicker('option', 'maxDate', DateAdd('d', -1, dt));
                BeginBuildCarInTime();
            }
        },
        defaultDate: CarMinInDate
    });
}

function GetCarOutDate() {
    return $('#CalendarOut').datepicker('getDate');
}

function GetCarInDate() {
    return $('#CalendarIn').datepicker('getDate');
}

function BeginBuildCarOutBranches() {
    $('#CarPickupBranch')
        .append('<option value="0" class="hint">Getting branches...</option>')
        .after($('#Spinner').clone().show())
        .attr('disabled','disabled')
    ajaxJsonPost('GetEuropcarBranches', "{junk: 0}", EndBuildCarOutBranches, handleError);
}

function BeginBuildCarInBranches() {
    $('#CarDropoffBranch')
        .append('<option value="0" class="hint">Getting branches...</option>')
        .after($('#Spinner').clone().show())
        .attr('disabled', 'disabled')
    ajaxJsonPost('GetEuropcarBranches', "{junk: 0}", EndBuildCarInBranches, handleError);
}

function BeginBuildCarOutTimes() {
    var outdate = GetCarOutDate();
    var selectedBranch = $('#CarPickupBranch').find('option:selected').val();
    if (outdate != null && selectedBranch != 0) {
        var data = '{ "branchCode": "' + selectedBranch + '", "selectedDate": "\\\/Date(' + Date.parse(outdate) + ')\\\/" }';
        ajaxJsonPost('GetBranchOperationHours', data, EndBuildCarOutTimes, handleError);
    }
}

function BeginBuildCarInTime() {
    var indate = GetCarInDate();
    var selectedBranch = $('#CarDropoffBranch').find('option:selected').val();
    if (indate != null && selectedBranch != 0) {
        var data = '{ "branchCode": "' + selectedBranch + '", "selectedDate": "\\\/Date(' + Date.parse(indate) + ')\\\/" }';
        ajaxJsonPost('GetBranchOperationHours', data, EndBuildCarInTimes, handleError);
    }
}

function EndBuildCarOutTimes(result) {
    if (result.d.IsOpen) {
        $('#CarOutHour').empty();
        for (var i = result.d.OpeningTime; i < result.d.ClosingTime; i++) {
            $('#CarOutHour').append($('<option value=' + i + '>' + i + '</option>'));
        }
        $('#CarOutMinute').empty();
        $('#CarOutMinute').append($('<option value=' + 0 + '>00</option>'));
        if (result.d.MinuteInterval > 0) {
            for (var j = result.d.MinuteInterval; j < 60; j = j + result.d.MinuteInterval) {
                $('#CarOutMinute').append($('<option value=' + j + '>' + j + '</option>'));
            }
        }
    }
    else {
        $('#CarOutHour').empty();
        alert(result.d.Message);
    }
}

function EndBuildCarInTimes(result) {
    if (result.d.IsOpen) {
        $('#CarInHour').empty();
        for (var i = result.d.OpeningTime; i < result.d.ClosingTime; i++) {
            $('#CarInHour').append($('<option value=' + i + '>' + i + '</option>'));
        }
        $('#CarInMinute').empty();
        $('#CarInMinute').append($('<option value=' + 0 + '>00</option>'));
        if (result.d.MinuteInterval > 0) {
            for (var j = result.d.MinuteInterval; j < 60; j = j + result.d.MinuteInterval) {
                $('#CarInMinute').append($('<option value=' + j + '>' + j + '</option>'));
            }
        }
    }
    else {
        $('#CarInHour').empty();
        alert(result.d.Message);
    }
}

function EndBuildCarOutBranches(result) {
    $('#CarPickupBranch')
        .html(result.d)
        .after($('.BusyIndicator').hide())
        .attr('disabled', '')
}

function EndBuildCarInBranches(result) {
    $('#CarDropoffBranch')
        .html(result.d)
        .after($('.BusyIndicator').hide())
        .attr('disabled', '')
}

function DeliverCarToggle() {
    $('#CarOutHour').empty();
    $('#CarOutMinute').empty();
    if ($(this).attr('checked')) {
        $('#CarPickupFields').css('display', 'none');
        $('#CarDeliveryFields').css('display', 'block');
        $('#CarOutLabel').text('Deliver car to');
        for (var i = 0; i <= 23; i++) {
            $('#CarOutHour').append('<option value="' + i + '">' + i + '</option>');
        }

        for (var j = 0; j < 60; j = j + 15) {
            $('#CarOutMinute').append('<option value="' + j + '">' + j + '</option>');
        }
    }
    else {
        $('#CarPickupFields').css('display', 'block');
        $('#CarDeliveryFields').css('display', 'none');
        $('#CarOutLabel').text('Pick-up point');
        BeginBuildCarOutTimes();
    }
}

function CollectCarToggle() {
    $('#CarInHour').empty();
    $('#CarInMinute').empty();
    if ($(this).attr('checked')) {
        $('#CarDropoffFields').css('display', 'none');
        $('#CarCollectionFields').css('display', 'block');
        $('#CarInLabel').text('Collect car from');
        for (var i = 0; i <= 23; i++) {
            $('#CarInHour').append('<option value="' + i + '">' + i + '</option>');
        }

        for (var j = 0; j < 60; j = j + 15) {
            $('#CarInMinute').append('<option value="' + j + '">' + j + '</option>');
        }
    }
    else {
        $('#CarDropoffFields').css('display', 'block');
        $('#CarCollectionFields').css('display', 'none');
        $('#CarInLabel').text('Drop-off point');
        BeginBuildCarInTime();
    }
}

function BeginBuildProviceDropdowns() {
    $('#CarCollectionProvince').append('<option value="0" class="hint">Getting provinces...</option>');
    $('#CarDeliveryProvince').append('<option value="0" class="hint">Getting provinces...</option>');
    $('#CarCollectionProvince').after($('#Spinner').clone().show());
    $('#CarDeliveryProvince').after($('#Spinner').clone().show());
    ajaxJsonPost('GetProvinces', "{junk: 0}", EndBuildProvinceDropDowns, handleError);
}

function EndBuildProvinceDropDowns(result) {
    $('#CarCollectionProvince').html(result.d);
    $('#CarCollectionProvince').after($('.BusyIndicator').hide());

    $('#CarDeliveryProvince').html(result.d);
    $('#CarDeliveryProvince').after($('.BusyIndicator').hide());
}

function CollectionProvinceChanged(e) {
    BeginBuildCollectionBranchInProvince();
}

function DeliveryProvinceChanged(e) {
    BeginBuildDeliveryBranchInProvince();
}

function BeginBuildCollectionBranchInProvince() {
    $('#CarCollectionSuburb').attr('disabled', 'disabled');
    $('#CarCollectionSuburb').append('<option value="0" class="hint">Getting suburbs...</option>');
    $('#CarCollectionSuburb').after($('#Spinner').clone().show());
    var selectedProvince = $('#CarCollectionProvince').find('option:selected').val();
    var data = '{"provinceId": ' + selectedProvince + ' }';
    ajaxJsonPost('GetBranchesInProvince', data, EndBuildCollectionBranchInProvince, handleError);
}

function EndBuildCollectionBranchInProvince(result) {
    $('#CarCollectionSuburb')
        .html(result.d)
        .after($('.BusyIndicator').hide())
        .attr('disabled', '');

}

function BeginBuildDeliveryBranchInProvince() {
    $('#CarDeliverySuburb').attr('disabled', 'disabled');
    $('#CarDeliverySuburb').append('<option value="0" class="hint">Getting suburbs...</option>');
    $('#CarDeliverySuburb').after($('#Spinner').clone().show());
    var selectedProvince = $('#CarDeliveryProvince').find('option:selected').val();
    var data = '{"provinceId": ' + selectedProvince + ' }';
    ajaxJsonPost('GetBranchesInProvince', data, EndBuildDeliveryBranchInProvince, handleError);
}

function EndBuildDeliveryBranchInProvince(result) {
    $('#CarDeliverySuburb')
        .html(result.d)
        .after($('.BusyIndicator').hide())
        .attr('disabled', '');
}

function SubmitCarData() {
    var outdate = new Date($('#CalendarOut').datepicker('getDate'));
    var indate = new Date($('#CalendarIn').datepicker('getDate'));
    var _outBranch;
    var _inBranch;

    if ($('#DeliverCarCheckbox').attr('checked')) {
        _outBranch = $('#CarDeliverySuburb').find('option:selected').val();
    }
    else {
        _outBranch = $('#CarPickupBranch').find('option:selected').val();
    }

    if ($('#CollectCarCheckbox').attr('checked')) {
        _inBranch = $('#CarCollectionSuburb').find('option:selected').val();
    }
    else {
        _inBranch = $('#CarDropoffBranch').find('option:selected').val();
    }

    var data = {
        cardata: {
            source: "kulula.com",
            Url: "www.kulula.com",
            PickupProvince: $('#CarDeliveryProvince').find('option:selected').text(),
            PickupBranch: _outBranch, //$('#CarDeliverySuburb').find('option:selected').val(),
            PickupDay: outdate.getDate(),
            PickupMonthYear: outdate.getFullYear() + "-" + (outdate.getMonth() + 1),
            PickupHour: $('#CarOutHour').find('option:selected').val(),
            PickupMinute: $('#CarOutMinute').find('option:selected').val(),
            Deliver: $('#DeliverCarCheckbox').attr('checked'),
            DropoffProvince: $('#CarCollectionProvince').find('option:selected').text(),
            DropoffBranch: _inBranch, //$('#CarCollectionSuburb').find('option:selected').val(),
            DropoffDay: indate.getDate(),
            DropoffMonthYear: indate.getFullYear() + "-" + (indate.getMonth() + 1),
            DropoffHour: $('#CarInHour').find('option:selected').val(),
            DropoffMinute: $('#CarInMinute').find('option:selected').val(),
            Collect: $('#CollectCarCheckbox').attr('checked'),
            ArrivalFlightNo: $('#CarArrivalFlightNumber').val(),
            DepartureFlightNo: $('#CarDepartureFlightNumber').val()
        }
    };
    var json = JSON2.stringify(data);
    ajaxJsonPost('BuildRequestForm', json, EndSubmitCarData, handleError);
}

function EndSubmitCarData(result) {
    $('#fCar').html(result.d);
    $('#fCar').submit();
}

function ValidateCarSearch(e) {
    if ($('#CarPickupBranch').find('option:selected').val() == "0" && !$('#DeliverCarCheckbox').attr('checked')) {
        //$('#CarPickupBranch').animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100).animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100).animate({ left: "0px" }, 100);
        $('#CarPickupBranch').after($('#ValidationMessage').html("<p>Please select a branch</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }

    if ($('#CarDeliverySuburb').find('option:selected').val() == "0" && $('#DeliverCarCheckbox').attr('checked')) {
        $('#CarDeliverySuburb')
            .after($('#ValidationMessage')
            .html("<p>Please select a branch</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }


    if ($('#CarCollectionSuburb').find('option:selected').val() == "0" && $('#CollectCarCheckbox').attr('checked')) {
        $('#CarCollectionSuburb')
            .after($('#ValidationMessage')
            .html("<p>Please select a branch</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }
    
    if ($('#CarDropoffBranch').find('option:selected').val() == "0") {
        //$('#CarPickupBranch').animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100).animate({ left: "-10px" }, 100).animate({ left: "10px" }, 100).animate({ left: "0px" }, 100);
        $('#CarDropoffBranch').after($('#ValidationMessage').html("<p>Please select a branch</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }
    if ($('#CalendarOut').val() == "") {
        $('#CalendarOut').after($('#ValidationMessage').html("<p>Please select a date</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }
    if ($('#CalendarIn').val() == "") {
        $('#CalendarIn').after($('#ValidationMessage').html("<p>Please select a date</p>").fadeIn().animate({ opacity: 1.0 }, 1000).fadeOut());
        return false;
    }

    return true;
}