txtStep1="Выберите интересующую Вас программу из списка программ";
txtStep2="Выберите одного из тренеров компании Advance Group";
txtStep3="Выберите удобные для Вас даты проведения тренингов";
txtStep4="Заполните заявку на проведение тренинга";
maskContent = "Загружаю";



//mask = "<img alt=\"загружаю\" src=\"../../Content/Items/advance-loading.png\" />"
window.onload = $(function() {
    pageTracker = _gat._getTracker('UA-8394364-3');



    $('#slidesContainer').css('overflow', 'hidden')
    $('td[id^=Program]').click(function() {
    $("#Picker").mask(maskContent);
        programID = this.id.replace('Program-', '');
        $.post("/Booking/GetProgramDescription", { 'programID': programID, 'full': true }, programDescriptionSuccessed);
    })
    .css('cursor', 'pointer');



    $("#panelAbout").dialog({
        autoOpen: false,
        height: 400,
        width: 950,
        modal: true,
        
        buttons: {
            Назад: function() {
                $(this).dialog('close');
            }
        }
    });

    $('#navAbout').click(function() {
        $("#panelAbout").dialog('open');
    });

    $("#panelFAQ").dialog({
        autoOpen: false,
        height: 400,
        width: 950,
        modal: true,

        buttons: {
            Назад: function() {
                $(this).dialog('close');
            }
        }
    });

    $('#navFAQ').click(function() {
        $("#panelFAQ").dialog('open');
    });


});


function programsPickerSuccessed(result) {
    UpdatePicker(result);
    $('td[id^=Program]').click(function() {
        $("#Picker").mask(maskContent);
        programID = this.id.replace('Program-', '');
        $.post("/Booking/GetProgramDescription", { 'programID': programID, 'full': true }, programDescriptionSuccessed);
    })
    .css('cursor', 'pointer');
    pageTracker._trackPageview("/Programs/List"); 
    $("#Picker").mask;

};

function programDescriptionSuccessed(result) {
    UpdatePicker(result);
    $('span[id^=btnDuration-]').click(function() {
        $("#Picker").mask(maskContent);
        duration = this.id.replace('btnDuration-', '');
        $("#StepsTable").mask(maskContent);
        $.post("/Booking/GetProgramDescription", { 'programID': programID, 'duration': duration,'full': false }, UpdateStep1);
        $.post("/Booking/GetTrainers", { 'programID': programID }, trainersPickerSuccessed);
    })
    .css('cursor', 'pointer')
    .hover(
        function() { $(this).css({ 'text-decoration': 'underline' }); },
        function() { $(this).css({ 'text-decoration': 'none' });
    });

    $('#btnBackProgramsLbl, #btnBackProgramsImg').click(function() {
        $('#btnBackProgramsLbl, #btnBackProgramsImg').unbind();
        $("#Picker").mask(maskContent);
        $.post("/Booking/GetPrograms", {}, programsPickerSuccessed);
    })
    .css('cursor', 'pointer')
    .hover(
        function() { $(this).css({ 'text-decoration': 'underline' }); },
        function() { $(this).css({ 'text-decoration': 'none' });
     });
     pageTracker._trackPageview("/Programs/" + programID);
     $("#Picker").mask;
    
};


function trainersPickerSuccessed(result) {
    UpdatePicker(result);
    
    
    $('td[id^=Trainer]').click(function() {
        $("#Picker").mask(maskContent);
        trainerID = this.id.replace('Trainer-', '');
        $.post("/Booking/GetTrainerDescription", { 'trainerID': trainerID, 'full': true }, trainersDescriptionSuccessed);
    })
    .css('cursor', 'pointer');
    
    $('.TrainerCell > img').animate({ opacity: "0.3" }, "0");
    $('td[id^=Trainer] > img').animate({ opacity: "1.0" }, "slow");

    pageTracker._trackPageview("/Trainers/List");
    $("#Picker").mask;

}

function trainersDescriptionSuccessed(result) {
    UpdatePicker(result);
    $('#btnSelectTrainerImg, #btnSelectTrainerLbl ').click(function() {
        $("#Picker").mask(maskContent);
        $("#StepsTable").mask(maskContent);
        $.post("/Booking/GetTrainerDescription", { 'trainerID': trainerID, 'full': false }, UpdateStep2);
        $.post("/Booking/GetDatePicker", { 'trainerID': trainerID, 'duration': duration }, datePickerSuccessed);
    })
    .css('cursor', 'pointer')
    .hover(
        function() {$(this).css({ 'text-decoration': 'underline' });},
        function() {$(this).css({ 'text-decoration': 'none' });
    });
    
    
    
    $('#btnBackTrainersImg, #btnBackTrainersLbl').click(function() {
    $('#btnBackTrainersImg, #btnBackTrainersLbl').unbind();
        $("#Picker").mask(maskContent);
        $.post("/Booking/GetTrainers", { 'programID': programID }, trainersPickerSuccessed);
    })
    .css('cursor', 'pointer')
    .hover(
        function() {$(this).css({ 'text-decoration': 'underline' });},
        function() {$(this).css({ 'text-decoration': 'none' });
    });
    pageTracker._trackPageview("/Trainers/" + trainerID);
    $("#Picker").mask;
};

function datePickerSuccessed(result) {
    UpdatePicker(result);

    $('td[id^=BkDay-]')
    .click(function() {
        $("#Picker").mask(maskContent);
        startDateID = this.id.replace('BkDay-', '');
        $("#StepsTable").mask(maskContent);
        $.post("/Booking/GetDaysForReserveDescription", { 'bkDayID': startDateID, 'duration': duration }, UpdateStep3);
        $.get("/Booking/GetRequestForm", { 'programID': programID, 'startDateID': startDateID, 'trainerID': trainerID, 'duration': duration }, requestFormSuccessed);
    })
    .css('cursor', 'pointer')
    .hover(
        function() {
            $(this).css({ 'background-color': '#FFD7B3' });
        },
        function() {
            $(this).css({ 'background-color': '#FFFFFF' });
     });


    Slider();
    pageTracker._trackPageview("/DatePicker");
    $("#Picker").mask

};

function requestFormSuccessed(result) {
    UpdatePicker(result);
    $('#btnReserve').click(function() {
        $("#Picker").mask(maskContent);
        $.post("/Booking/GetRequestForm", $("#RequestForm").serialize(), requestFormSuccessed);
    })
    .css('cursor', 'pointer');
    $("#Picker").mask
    pageTracker._trackPageview("/RequestForm");
};





function UpdatePicker(result) {
    $('#Picker').html(result);
};
function UpdateInfo(result) {
    $('#Info').html(result);
};







function UpdateStep1(result) {
        $('#step1').html(result);
        $('#tdStep1').click(function() {
            $("#Picker").mask(maskContent);
            $(UnbindStep1);
            $.get("/Booking/GetPrograms", {}, programsPickerSuccessed);
        })
        .css('cursor', 'pointer');
        $("#StepsTable").unmask();
    };
function UnbindStep1() {
    $('#tdStep1, #tdStep2, #tdStep3').unbind().css('cursor', 'default');
    $('#step1').html(txtStep1);
    $('#step2').html(txtStep2);
    $('#step3').html(txtStep3);
};

function UpdateStep2(result) {
    $('#step2').html(result);
    $('#tdStep2').click(function() {
        $("#Picker").mask(maskContent);
        $(UnbindStep2);
        $.post("/Booking/GetTrainers", { 'programID': programID }, trainersPickerSuccessed);
    })
    .css('cursor', 'pointer');
    $("#StepsTable").unmask();
};
function UnbindStep2() {
    $('#tdStep2, #tdStep3').unbind().css('cursor', 'default');
    $('#step2').html(txtStep2);
    $('#step3').html(txtStep3);
};





function UpdateStep3(result) {
    $('#step3').html(result);
    $('#tdStep3').click(function() {
        $("#Picker").mask(maskContent);
        $(UnbindStep3);
        $.post("/Booking/GetDatePicker", { 'trainerID': trainerID, 'duration': duration }, datePickerSuccessed);
    })
    .css('cursor', 'pointer');
    $("#StepsTable").unmask();
};
function UnbindStep3() {
    $('#tdStep3').unbind().css('cursor', 'default');
    $('#step3').html(txtStep3);
};

function Slider() {
    var currentPosition = 0;
    var slideWidth = 1100;
    var slides = $('.slide');
    var numberOfSlides = slides.length;

    // Remove scrollbar in JS
    $('#slidesContainer').css('overflow', 'hidden');

    // Wrap all .slides with #slideInner div
    slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
	    'float': 'left',
	    'width': slideWidth
	});

    // Set #slideInner width equal to total width of all slides
    $('#slideInner').css('width', slideWidth * numberOfSlides);

    // Insert controls in the DOM
    $('#slideshow')
    .append('<span class="control" id="leftControl">Назад</span>')
    .append('<span class="control" id="rightControl">Вперед</span>');

    // Hide left arrow control on first load
    manageControls(currentPosition);

    // Create event listeners for .controls clicks
    $('.control')
    .bind('click', function() {
        // Determine new position
        currentPosition = ($(this).attr('id') == 'rightControl') ? currentPosition + 1 : currentPosition - 1;

        // Hide / show controls
        manageControls(currentPosition);
        // Move slideInner using margin-left
        $('#slideInner').animate({
            'marginLeft': slideWidth * (-currentPosition)
        });
    });

    // manageControls: Hides and Shows controls depending on currentPosition
    function manageControls(position) {
        // Hide left arrow if position is first slide
        if (position == 0) { $('#leftControl').hide() } else { $('#leftControl').show() }
        // Hide right arrow if position is last slide
        if (position == numberOfSlides - 1) { $('#rightControl').hide() } else { $('#rightControl').show() }
    }
};