//-------------------------------------------------------------------------------------------------------//
//----------- js configuration on load => every main functionalities are devlopped here -----------------//
//-------------------------------------------------------------------------------------------------------//
$(document).ready(function() {
    activeListeners() ;
});
// active all the system listeners based on click event notally
var activeListeners = function()
{
    //---------------------------------------------------------------------------------------------------//
    //---------------------ajax function to manage user account in the basket----------------------------//
    //---------------------------------------------------------------------------------------------------//
    activeLoginUserListener() ;
    activeLogoutUserListener() ;
    activeLogoutUserHeaderListener() ;
    activePasswordUserListener() ;
    activeRegisterUserListener() ;
    activeEditUserListener() ;
    //---------------------------------------------------------------------------------------------------//
    //------------- Gestion des scripts clients pour le content object attribute Adresse ----------------//
    //---------------------------------------------------------------------------------------------------//
    activePublishAddressListener() ;
    activeEditAddressListener() ;
    //---------------------------------------------------------------------------------------------------//
    //---------------------ajax function to manage product in the basket---------------------------------//
    //---------------------------------------------------------------------------------------------------//
    activeBasketListener() ;
    //---------------------------------------------------------------------------------------------------//
    //-------------------------- AJAX Function to order -------------------------------------------------//
    //---------------------------------------------------------------------------------------------------//
    activeCheckoutListener() ;
}
//bind of the LoginButton button to log in the current user
var activeLoginUserListener = function()
{
    $('#LoginButton').unbind('click') ;
    $('#LoginButton').bind('click', function() {
        // enable to start a session and initiate some session variables
        cookie = ( $('#Cookie').is(':checked') ) ? '&Cookie=true' : '' ;
        var reqData = 'LoginButton=true&UserLogin='+$('#Login').val()+'&UserPassword='+$('#Password').val()+$('#RedirectURI').val()+cookie;
        var currentButton = $(this);
        var boolHasAddress = false ;// variable used for the next step of the ajax basket system ( to display or not the address.tpl )
        $('#basic-modal-content').modal({
            autoResize : true,
            onOpen: function (dialog) {
                    // according ajax function
                    loginAjax( reqData, currentButton, boolHasAddress ) ;
                    dialog.overlay.fadeIn('slow', function () {
                        dialog.data.hide();
                        dialog.container.fadeIn('slow', function () {
                            dialog.data.slideDown('slow');
                        });
                    });
            },
            onClose: function( dialog )
            {
                $.modal.close() ;
                redirectToQuizz() ;
            }
        });
        return false;
    });
}
// run the ajax request fot the login use case
var loginAjax = function( reqData, currentButton, boolHasAddress )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/login/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                msg = jQuery.trim( msg.toString() );
                var response = getArrayFromSeparator(msg,'|');
                var key = getResponseKey(response);
                var param = new Array( 'login', key );
                var option = new Array() ;
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                switch( key )
                {
                    case 'success':
                        var userNames = getUserNames( response ) ;
                        var userNamesArray = userNames.split( ' ' ) ;
                        option['userName'] = userNamesArray[0] ;
                        displayElement( $('#LogoutButton'), true );
                        displayElement( $(currentButton), false );
                        displayElement( $('#loginText'), false );
                        refreshUserHeaderLogout() ;// refresh the current logoutButtonheader.tpl
                        var arrayData = getArrayResponse(response);
                        //~~~~~~~~ Register Interaction ~~~~~~~~~~~~~
                        var boolHasMail = hasMail( arrayData ) ;
                        if( boolHasMail )
                        {
                            setInteraction( $('#formRegister :input'), arrayData ) ;
                            var actionSentence = 'html' ;
                            var paramSentence = new Array( 'sentence', 'success' ) ;
                            var containerSentence = $('#sentence') ;
                            var optionSentence = new Array() ;
                            optionSentence['toTraduce'] = 'Modifier votre compte' ;
                            responseOperationEshop( actionSentence, paramSentence, containerSentence, optionSentence );
                            displayElement( $('#PublishButton'), false );
                            displayElement( $('#EditUserButton'), true );
                            option['mail'] = 'hasMail' ;
                        }
                        else
                        {
                            option['mail'] = 'noMail' ;
                        }
                        //~~~~~~~~~ Address Ajax Interaction ~~~~~~~~~~~~~~
                        boolHasAddress = hasAddress( arrayData ) ;
                        option['address'] = ( boolHasAddress ) ? 'hasAddress' : 'noAddress' ;
                        // is user is logged, known, and has an address
                        if( boolHasMail && boolHasAddress )
                        {
                            displayElement( $('.payment'), true ) ;
                            displayElement( $('.finalize'), true ) ;
                        }
                        displayElement( $('.blockLogin'), false ) ;
                        displayElement( $('.register'), true ) ;
                        //~~~~~~~~~~~ Manage the redirect case ~~~~~~~~~~~~
                        var isRedirect = $('#redirectToQuizz').length ;
                        if( isRedirect )
                        {
                            option['isRedirect'] = true ;
                        }
                    break;
                    case 'already':
                    break;
                    case 'error':
                        $('#Login').val( null );
                        $('#Password').val( null );
                        displayElement( $('.register'), true ) ;
                    break;
                }
                // call ajax function to inject tpl from response
                responseOperationEshop( action, param, container, option );
                // reload address attributes for any case ( for anonymous to synchronize ids )
                if( key == 'success' )
                {
                    if( isRedirect )
                    {
                        setTimeout(function() {$('.simplemodal-close').each(function() {$('.simplemodal-close').click();});} , 9000);
                    }
                    else
                    {
                        generateTemplate( 'address', boolHasAddress ) ;
                        if( $('#inBasket').length )
                        {
                            $('#inBasket').removeClass('hide') ;
                            $('#inBasket').addClass('show') ;
                        }
                    }
                }
            }
        }
    });
}
// bind of the LogoutButton button to logout the current user
var activeLogoutUserListener = function()
{
    var reqData = '' ;
    $('#LogoutButton').unbind('click') ;
    $('#LogoutButton').bind('click', function(){
        if( $('#Login').length && $('#Password').length &&  $('#RedirectURI').length )
        {
            reqData = 'LogoutButton=true&UserLogin='+$('#Login').val()+'&UserPassword='+$('#Password').val()+$('#RedirectURI').val();
        }
        else
        {
            reqData = 'LogoutButton=true' ;
        }
        var currentButton = $(this);
        $('#basic-modal-content').modal({
            autoResize : true,
            onOpen: function (dialog) {
                    logoutAjax( reqData, currentButton ) ;
                    dialog.overlay.fadeIn('slow', function () {
                    dialog.data.hide();
                    dialog.container.fadeIn('slow', function () {
                    dialog.data.slideDown('slow');
                });
            });
        }});
        return false;
    });
}
// run the ajax request for the logout request
var logoutAjax = function( reqData, currentButton )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/login/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                var response = getArrayFromSeparator(msg,'|');
                var key = getResponseKey(response);;
                var param = new Array( 'logout', key );
                var option = new Array() ;
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                switch( key )
                {
                    case 'success':
                        var userNames = getUserNames( response ) ;
                        var userNamesArray = userNames.split( ' ' ) ;
                        option['userName'] = userNamesArray[0] ;
                        // ajax request to deal with current operation response
                        responseOperationEshop( action, param, container, option );
                        refreshUserHeaderLogin() ;
                        // refresh css
                        displayElement( $(currentButton), false );
                        displayElement( $('#LoginButton'), true );
                        clearForm($('#formRegister :input'));
                        displayElement( $('#EditUserButton'), false );
                        displayElement( $('#PublishButton'), true );
                        clearForm($('#formAddress :input'));
                        displayElement( $('#PublishAddressButton'), true );
                        displayElement( $('#EditAddressButton'), false );
                        $('#Login').val( null );
                        $('#Password').val( null );
                        displayElement( $('.blockLogin'), true ) ;
                        displayElement( $('.register'), true ) ;
                        displayElement( $('.address'), false ) ;
                        displayElement( $('.payment'), false ) ;
                        displayElement( $('.finalize'), false ) ;
                    break;
                }
            }
        }
    });
}
// active the LogoutButtonHeader listener
var activeLogoutUserHeaderListener = function()
{
    $('#LogoutButtonHeader').unbind('click') ;
    $('#LogoutButtonHeader').bind('click', function()
    {
        var reqData = '' ;
        if( $('#Login').length && $('#Password').length &&  $('#RedirectURI').length )
        {
            reqData = 'LogoutButton=true&UserLogin='+$('#Login').val()+'&UserPassword='+$('#Password').val()+$('#RedirectURI').val();
        }
        else
        {
            reqData = 'LogoutButton=true' ;
        }
        var currentButton = $(this);
        $('#basic-modal-content').modal({
            autoResize : true,
            onOpen: function (dialog) {
                    logoutHeaderAjax( reqData, currentButton ) ;
                    dialog.overlay.fadeIn('slow', function () {
                    dialog.data.hide();
                    dialog.container.fadeIn('slow', function () {
                    dialog.data.slideDown('slow');
                });
            });
        }});
        return false;
    });
}
// run the logout header ajax request
var logoutHeaderAjax = function( reqData, currentButton )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/login/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                var response = getArrayFromSeparator(msg,'|');
                var key = getResponseKey(response);
                param = new Array( 'logout', key );
                option = new Array() ;
                container = $('#basic-modal-content') ;
                action = 'append' ;
                switch( key )
                {
                    case 'success':
                        var userNames = getUserNames( response ) ;
                        var userNamesArray = userNames.split( ' ' ) ;
                        option['userName'] = userNamesArray[0] ;
                        refreshUserHeaderLogin() ;
                        responseOperationEshop( action, param, container, option ) ;
                        if( $('#formRegister').length && $('#formAddress').length )
                        {
                            displayElement( $(currentButton), false ); // hide the current element

                            displayElement( $('.blockLogin'), true ) ; // show the blockLogin classed element
                            $('#LoginButton').toggleClass( 'hide', false ) ; // suppress hide class
                            $('#LoginButton').toggleClass('show') ; // add class show
                            displayElement( $('#LoginButton'), true ); // to force
                            $('#LogoutButton').toggleClass( 'show', false ) ; // suppress hide class
                            $('#LogoutButton').toggleClass('hide') ; // add class show
                            displayElement( $('#LogoutButton'), false ); // to force
                            $('#Login').val( null );
                            $('#Password').val( null );
                            clearForm($('#formRegister :input'));
                            displayElement( $('#EditUserButton'), false );
                            displayElement( $('#PublishButton'), true );
                            var actionSentence = 'html' ;
                            var paramSentence = new Array( 'sentence', 'success' ) ;
                            var containerSentence = $('#sentence') ;
                            var optionSentence = new Array() ;
                            optionSentence['toTraduce'] = 'Enregistrez-vous pour créer un compte' ;
                            responseOperationEshop( actionSentence, paramSentence, containerSentence, optionSentence );
                            displayElement( $('.address'), false ) ;
                            displayElement( $('.payment'), false ) ;
                            displayElement( $('.finalize'), false ) ;
                        }
                    break;
                }
            }
        }
    });
}
// bind du bouton EditUserButton to update the current user
var activeEditUserListener = function()
{
    if( $('#formRegister').length )
    {
        $('#formRegister').validate() ;
        $('#EditUserButton').unbind('click') ;
        $('#EditUserButton').bind('click', function() {
            if( $('#formRegister').valid() )
            {
                var reqData = 'EditUserButton=true'+getRequestParams($('#formRegister :input'));
                $('#basic-modal-content').modal({
                    autoResize : true,
                    onOpen: function (dialog) {
                            editUserAjax( reqData ) ;
                            dialog.overlay.fadeIn('slow', function () {
                            dialog.data.hide();
                            dialog.container.fadeIn('slow', function () {
                            dialog.data.slideDown('slow');
                        });
                    });
                }});
                return false;
            }
        });
    }
}
// var the edit user ajax request
var editUserAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/register/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if ( msg )
            {
                var arrayMsg = msg.split('|') ;
                var option = new Array() ;
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                var param = new Array( 'registerUpdateUser', 'noMessage' );
                if( arrayMsg.length > 0)
                {
                    var response = jQuery.trim( arrayMsg[0].toString() );
                    param = new Array( 'registerUpdateUser', response );
                    switch( response )
                    {
                        case 'success':
                            displayElement( $('#LogoutButton'), true );
                            displayElement( $('#LoginButton'), false );
                            displayElement( $('.address'), true ) ;
                            displayElement( $('.payment'), false ) ;
                            displayElement( $('.finalize'), false ) ;
                            displayElement( $('.blockLogin'), false ) ;
                        break;
                        case 'error':
                            displayElement( $('.blockLogin'), true ) ;
                            displayElement( $('.address'), false ) ;
                            displayElement( $('.payment'), false ) ;
                            displayElement( $('.finalize'), false ) ;
                            option['errorMessage'] = arrayMsg[1] ;
                        break;
                    }
                }
                responseOperationEshop( action, param, container, option ) ;
            }
        }
    });
}
// bind du bouton EditAddressButton to update address element in the current page
var activeEditAddressListener = function()
{
    if( $('#formAddress').length )
    {
        $('#formAddress').validate() ;
        $('#EditAddressButton').unbind('click') ;
        $('#EditAddressButton').bind('click', function() {
            if( $('#formAddress').valid() )
            {
                var reqData = 'EditAddressButton=true'+getRequestParams($('#formAddress :input'));
                $('#basic-modal-content').modal({
                    autoResize : true,
                    onOpen: function (dialog) {
                        editAddressAjax( reqData ) ;
                        dialog.overlay.fadeIn('slow', function () {
                            dialog.data.hide();
                            dialog.container.fadeIn('slow', function () {
                                dialog.data.slideDown('slow');
                            });
                        });
                    }
                });
                return false;
            }
        });
    }
}
// run the adit address ajax request
var editAddressAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/address/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                var option = new Array() ;
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                var param = new Array( 'registerUpdateAddress', msg );
                responseOperationEshop( action, param, container, option ) ;
                displayElement( $('.register'), true ) ;
                displayElement( $('.payment'), true ) ;
                displayElement( $('.finalize'), true ) ;
            }
        }
    });
}
// bind of the GenerateButton button to get new password if the user already exists
var activePasswordUserListener = function()
{
    if( $('#forgotpassword' ).length )
    {
        $('#forgotpassword' ).validate({
            success: function() {
                $('#GenerateButton').unbind('click') ;
                $('#GenerateButton').bind('click', function() {
                    var reqData = 'GenerateButton=true&UserEmail=' + $('#UserEmail').val();
                    $('#basic-modal-content').modal({
                        autoResize : true,
                        onOpen: function (dialog) {
                                    passwordUserAjax( reqData ) ;
                                    dialog.overlay.fadeIn('slow', function () {
                                    dialog.data.hide();
                                    dialog.container.fadeIn('slow', function () {
                                    dialog.data.slideDown('slow');
                                });
                            });
                        }
                    });
                });
            }
        }) ;
    }
}
// run the password user ajax request
var passwordUserAjax = function( reqData )
{
    jQuery.ajax({
        type: 'POST',
        url : '/layout/set/eshopLayout/eshop/password/',
        data : reqData,
        dataType: "html",
        success: function(msg){
            if (msg)
            {
                var arrayMsg = msg.split('|') ;
                if( arrayMsg.length > 0)
                {
                    var response = jQuery.trim( arrayMsg[0].toString() );
                    var param = new Array( 'generatePassword', response );
                    var option = new Array() ;
                    option['messageContent'] = arrayMsg[1] ;
                    var container = $('#basic-modal-content') ;
                    var action = 'append' ;
                    if( response == 'success' )
                    {
                        $('#forgotPass').css('display','none');
                    }
                    // ajax request to deal with current operation response
                    responseOperationEshop( action, param, container, option );
                    displayElement( $('.register'), true ) ;
                    displayElement( $('.address'), true ) ;
                }
            }
        }
    });
}
// bind of the RegisterButton button  to create new user
var activeRegisterUserListener = function()
{
    if( $('#formRegister').length )
    {
        $('#formRegister').validate({
            success: function() {
                $('#PublishButton').unbind('click') ;
                $('#PublishButton').bind('click', function() {
                    var currentButton = $(this);
                    var reqData = 'PublishButton=true'+getRequestParams($('#formRegister :input'));
                    $('#basic-modal-content').modal({
                        autoResize : true,
                        onOpen: function (dialog) {
                            registerUserAjax( reqData, currentButton ) ;
                            dialog.overlay.fadeIn('slow', function () {
                                dialog.data.hide();
                                dialog.container.fadeIn('slow', function () {
                                    dialog.data.slideDown('slow');
                                });
                            });
                        },
                        onClose: function( dialog )
                        {
                            $.modal.close() ;
                            redirectToQuizz() ; // redirect to quizz if user come from the quizz link
                        }
                    });
                    return false;
                });
            }
        });
    }
}
// run the register user ajax request
var registerUserAjax = function( reqData, currentButton )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/register/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if ( msg )
            {
                var arrayMsg = msg.split('|') ;
                var option = new Array() ;
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                var param = new Array( 'registerCreateUser', 'noMessage' );
                if( arrayMsg.length > 0)
                {
                    var response = jQuery.trim( arrayMsg[0].toString() );
                    param = new Array( 'registerCreateUser', response );
                    switch( response )
                    {
                        case 'success':
                            $('#Login').val( arrayMsg[1] );
                            $('#Password').val( arrayMsg[2] );
                            displayElement( $('#LogoutButton'), true );
                            displayElement( $('#LoginButton'), false );
                            displayElement( $(currentButton), false );
                            displayElement( $('#EditUserButton'), true );
                            refreshUserHeaderLogout() ;
                            displayElement( $('.blockLogin'), false ) ;
                            displayElement( $('.address'), true ) ;
                            displayElement( $('.payment'), false ) ;
                            displayElement( $('.finalize'), false ) ;
                            generateTemplate( 'address' );
                            if( $('#inBasket').length )
                            {
                                $('#inBasket').removeClass('hide') ;
                                $('#inBasket').addClass('show') ;
                            }
                        break;
                        case 'error':
                            option['errorMessage'] = arrayMsg[1] ;
                        break;
                    }
                }
                responseOperationEshop( action, param, container, option );
            }
        }
    });
}
// bind du bouton PublishAddressButton to create address for the current user
var activePublishAddressListener = function()
{
    if( $('#formAddress').length )
    {
        $('#formAddress').validate({
            success: function() {
                $('#PublishAddressButton').unbind('click') ;
                $('#PublishAddressButton').bind('click', function() {
                    if( $('#LoginButton').css('display') == 'block' )
                    {
                        needToLogin() ;
                    }
                    else
                    {
                        var reqData = 'PublishAddressButton=true'+getRequestParams($('#formAddress :input'));
                        $('#basic-modal-content').modal({
                        autoResize : true,
                        onOpen: function (dialog) {
                                    publishAddressAjax( reqData ) ;
                                    dialog.overlay.fadeIn('slow', function () {
                                    dialog.data.hide();
                                    dialog.container.fadeIn('slow', function () {
                                    dialog.data.slideDown('slow');
                                });
                            });
                        }});
                    }
                    return false;
                });
            }
        }) ;
    }
}
// run the puvblish address ajax request
var publishAddressAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/address/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                var option = new Array() ;
                if( msg == 'success' )
                {
                    var containerAddress = $( '#formAddress' );
                    var actionAddress = 'html' ;
                    var paramAddress = new Array( 'injectAddress', msg ) ;
                    responseOperationEshop( actionAddress, paramAddress, containerAddress, option ) ;
                }
                var container = $('#basic-modal-content') ;
                var action = 'append' ;
                var param = new Array( 'registerCreateAddress', msg );
                responseOperationEshop( action, param, container, option ) ;
                displayElement( $('.register'), true ) ;
                displayElement( $('.payment'), true ) ;
                displayElement( $('.finalize'), true ) ;
                displayElement( $('#EditAddressButton'), true ) ;
                displayElement( $('#PublishAddressButton'), false ) ;
            }
        }
    });
}
// bind of the  checkout button
var activeCheckoutListener = function()
{
    $('#CheckoutButton').unbind('click') ;
    $('#CheckoutButton').bind('click', function() {
        if( $('#LoginButton').css('display') == 'block' )
        {
            needToLogin() ;
        }
        else
        {
            var reqData = 'CheckoutButton=true';
            $('#checkout').css('display','block') ;
            $('#basic-modal-content').modal({
                autoResize : true,
                onOpen: function (dialog) {
                    checkoutAjax( reqData ) ;
                    dialog.overlay.fadeIn('slow', function () {
                        dialog.data.hide();
                        dialog.container.fadeIn('slow', function () {
                            dialog.data.slideDown('slow');
                        });
                    });
                }
            });
        }
        return false;
    });
}
// run the checkout ajax request
var checkoutAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/checkout/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                $('#basic-modal-content').append(msg);
                payOrder() ;
            }
        }
    });
}
// bind all interactive element for the basket
var activeBasketListener = function()
{
    activeToBasketListener() ;
    activeRemoveProductListener() ;
    activeChangeQuantityListener() ;
    activeContinueShoppingListener() ;
}
// bind of RemoveProductItemButton button to remove item from the current basket
var activeRemoveProductListener = function()
{
    $('#RemoveProductItemButton').unbind('click') ;
    $('#RemoveProductItemButton').bind('click', function() {
        var reqData = 'RemoveProductItemButton=true';
        $('input[name=\'ProductItemCountList[]\']').each(function() {
            reqData += '&ProductItemCountList[]='+$(this).val();
        });
        $("input[name=\'ProductItemIDList[]\']").each(function() {
            reqData += '&ProductItemIDList[]='+$(this).val();
        });
        $("input[name=\'RemoveProductItemDeleteList[]\']").each(function() {
          if( $( this ).is(':checked') )
          {
              reqData += '&RemoveProductItemDeleteList[]='+$(this).val();
              $(this).parent().parent().remove();
          }
        });
        removeProductAjax( reqData ) ;
        return false;
    });
}
// run the remove product ajax requestion
var removeProductAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/basket/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                if( msg == "isEmpty" )
                {
                    var param = new Array( 'removeLine', 'isEmpty' );// set appropriate operation name and current message
                    var container = $('.basket') ;// container where to inject tpl
                    var action = 'html' ;//set the action asserted by jquery lib ( html append are used you can optimze your own function system, to do that report you to responseOperationEshop function )
                    // call ajax function to inject tpl from response
                    responseOperationEshop( action, param, container, null );
                }
                else
                {
                    var total = msg.split('|');
                    $('#orderTotal .ht').html( '<td>'+total[0]+'</td>' );
                    $('#orderTotal .ttc').html( '<td>'+total[1]+'</td>' );
                }

            }
        }
    });
}
//bind du changement de quantité dans les lignes de commande basket.tpl
var activeChangeQuantityListener = function()
{
    $("input[name=\'ProductItemCountList[]\']").each(function() {
        $(this).unbind('change' ) ;
        $(this).bind('change', function() {
            var newQuantity = parseInt( $(this).val() );//nouvelle quantité saisie dans l'input type text réservé au quantité
            if( newQuantity > 0 )
            {
                var line = $(this).parent().parent().get(0);//ligne de commande où la quantité a été saisie
                var HtLine = line.getElementsByClassName('ht').item(0).value;
                var TtcLine = line.getElementsByClassName('ttc').item(0).value;
                var totalHtLine = line.getElementsByClassName('totalExVat').item(0);
                var totalTtcLine = line.getElementsByClassName('totalInVat').item(0);
                var reqData = 'StoreChangesButton=true';
                $('input[name=\'ProductItemCountList[]\']').each(function() {
                    reqData += '&ProductItemCountList[]='+$(this).val();
                });
                $("input[name=\'ProductItemIDList[]\']").each(function() {
                    reqData += '&ProductItemIDList[]='+$(this).val();
                });
                changeQuantityAjax( reqData, newQuantity, HtLine, TtcLine, totalHtLine, totalTtcLine ) ;
                return false;
            }
        });
        //changement de quantité dans les lignes de commande basket.tpl avec les touches flèche haut et flèche bas
        var tick, diff;
        changeQuantityKeyPress( $(this ), tick, diff ) ;
    });
}
// run the change quantity ajax request
var changeQuantityAjax = function( reqData, newQuantity, HtLine, TtcLine, totalHtLine, totalTtcLine )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/basket/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                var newHT = newQuantity * HtLine;
                var newTTC = newQuantity * TtcLine;
                $(totalHtLine).html( number_format( parseFloat( newHT ).toFixed(2), 2, ',', ' ') + ' € '  );
                $(totalTtcLine).html( number_format( parseFloat( newTTC ).toFixed(2), 2, ',', ' ') + ' € ' );
                var total = msg.split('|');
                $('#orderTotal .ht').html( '<td>'+total[0]+'</td>' );
                $('#orderTotal .ttc').html( '<td>'+total[1]+'</td>' );
            }
        }
    });
}
// listen the key press to change quantity
var changeQuantityKeyPress = function( element, tick, diff )
{
    element.keypress(function(event) {
        if( parseInt( $(element).val() ) > 1 )
        {
            if( tick ){
                date = new Date();
                diff = date.getTime() - tick;
            }
            if( !diff || diff == null || diff > 500 )
            {
                //arrow up
                if (event.keyCode == '38') {

                    element.val( parseInt( element.val() )+1 );
                }
                //arrow down
                if (event.keyCode == '40' ) {
                    element.val( parseInt( element.val() )-1 );
                }
                element.change();
            }
            tick = event.timeStamp;
        }
    });
}
// bind of the to_basket_button button to load the basket view from full product view
var activeToBasketListener = function()
{
    $('.to_basket_button').unbind('click') ;
    $('.to_basket_button').bind('click', function() {
        $('#basic-modal-content').modal({
            autoResize : true,
            onOpen: function (dialog) {
                    toBasketAjax() ;
                    dialog.overlay.fadeIn('slow', function () {
                    dialog.data.hide();
                    dialog.container.fadeIn('slow', function () {
                    dialog.data.slideDown('slow');
                });
            });
        }});
        return false;
    });
}
// run the to basket ajax request
var toBasketAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/basket/',
            data : 'ActionAddToBasket=true&ContentNodeID='+$('#ContentNodeID').val()+'&ContentObjectID='+$('#ContentObjectID').val()+'&ViewMode='+$('#ViewMode').val(),
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                $('#basic-modal-content').append(msg);

            }
        }
    });
}
// active the continue shopping listener
var activeContinueShoppingListener = function()
{
    $('#ContinueShoppingButton').unbind('click') ;
    //bind de l'élément ContinueShoppingButton basket.tpl & popin.tpl
    $('#ContinueShoppingButton').bind('click', function() {
        var reqData = 'ContinueShoppingButton=true';
        $('input[name=\'ProductItemCountList[]\']').each(function() {
            reqData += '&ProductItemCountList[]='+$(this).val();
        });
        $("input[name=\'ProductItemIDList[]\']").each(function() {
            reqData += '&ProductItemIDList[]='+$(this).val();
        });
        continueShoppingAjax( reqData ) ;
        return false;
    });
}
// run the continue shopping ajax request
var continueShoppingAjax = function( reqData )
{
    jQuery.ajax({
            type: 'POST',
            url : '/layout/set/eshopLayout/eshop/basket/',
            data : reqData,
            dataType: "html",
            success: function(msg){
            if (msg)
            {
                if( msg != null )
                {
                    window.location.href = msg;
                }
                else
                {
                    window.history.go(-2) ;
                }
            }
        }
    });
}
//----------------------------------------------------------------------------
//---------------------------- Generic tools ---------------------------------
//----------------------------------------------------------------------------
// Tool to Format number
function number_format(number, decimals, dec_point, thousands_sep) {
    number = (number+'').replace(',', '').replace(' ', '');
    var n = !isFinite(+number) ? 0 : +number,
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
        s = '',
        toFixedFix = function (n, prec) {
            var k = Math.pow(10, prec);
            return '' + Math.round(n * k) / k;        };
    // Fix for IE parseFloat(0.55).toFixed(0) = 0;
    s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
    if (s[0].length > 3) {
        s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);    }
    if ((s[1] || '').length < prec) {
        s[1] = s[1] || '';
        s[1] += new Array(prec - s[1].length + 1).join('0');
    }    return s.join(dec);
}
// Tool to check array, equivalent array_keys php in javascript language
function array_keys (input, search_value, argStrict) {
    var search = typeof search_value !== 'undefined',
        tmp_arr = [],
        strict = !!argStrict,
        include = true,
        key = '';
    for (key in input) {
        if (input.hasOwnProperty(key)) {
            include = true;
            if (search) {
                if (strict && input[key] !== search_value) {
                    include = false;
                }
                else if (input[key] != search_value) {
                    include = false;
                }
            }

            if (include) {
                tmp_arr[tmp_arr.length] = key;
            }
        }
    }

    return tmp_arr;
}
// Tool for array, to know if data is in an array
function in_array (needle, haystack, argStrict) {
    var key = '',
        strict = !! argStrict;
    if (strict) {
        for (key in haystack) {
            if (haystack[key] === needle) {
                return true;
            }
        }
    } else {
        for (key in haystack) {
            if (haystack[key] == needle) {
                return true;
            }
        }
    }
    return false;
}
//--------------------------------------------------------------------------------------------------------
//----------------ajax function to deal with the according message for each operation---------------------
//--------------------------------------------------------------------------------------------------------
//--------------------string action used to select the approprited jquery action--------------------------
//----array param used to get the current operation and the message received from another ajax request----
//-------------jquery object container used to select the element where to inject template----------------
//---------------array option used to build the option's post parameters for each message-----------------
//--------------------------------------------------------------------------------------------------------
var responseOperationEshop = function( action, param, container, option )
{
    // be aware that when you use this function to fill the param array with at least two element ( operation and message )
    var reqData = getData( param, option ) ;
    if( reqData != null )
    {
        jQuery.ajax({
                type: 'POST',
                url : '/layout/set/eshopLayout/eshop/response/',
                data : reqData,
                dataType: "html",
                success: function(mess){
                if (mess)
                {
                    switch( action )
                    {
                        case 'html':
                            container.html(mess);
                        break;
                        case 'append':
                            container.append(mess) ;
                        break;
                    }
                    // foreach operation re active all listeners to check the good id's attribute's elements
                    activeListeners() ;
                }
            }
        });
    }
}
// get datas from para array which has to contain operation and message informations, return string reqData
var getData = function( param, option )
{
    var reqData = null ;
    if( param.length == 2 )
    {
        var operation = param[0] ;
        var message = param[1] ;
        reqData = 'operation=' + operation + '&message=' + message ;
        if( option != null )
        {
            for ( key in option )
            {
                reqData += '&' + key + '=' + option[key] ;
            }
        }
    }
    return reqData ;
}
//----------------------------------------------------------------------
//--some tools to manage the quantity of product ordered in tha basket--
//----------------------------------------------------------------------
//function de behave the quantity in the baket lines with buttons
var getQuantity = function( element )
{
    var parent = $(element).parent().get(0);
    var quantity = parent.getElementsByTagName('input').item(0);
    return $(quantity).val();
}
var setQuantity = function( element, newQuantity )
{
    var parent = $(element).parent().get(0);
    var quantity = parent.getElementsByTagName('input').item(0);
    $(quantity).val( newQuantity );
    $(quantity).change();
}
var subQuantity = function( element )
{
    var quantity = getQuantity( element );
    var newQuantity = parseInt(quantity) - 1;
    if( newQuantity > 0 )
    {
        setQuantity( element, newQuantity );
    }
}
var addQuantity = function( element )
{
    var quantity = getQuantity( element );
    var newQuantity = parseInt(quantity) + 1;
    setQuantity( element, newQuantity );
}
//----------------------------------------------------
//---some tools to manage user account and payment way in the basket--
//----------------------------------------------------
// refresh user header template
var refreshUserHeaderLogout = function()
{
    if( $('#loginText').length )
    {
        var action = 'html' ;
        var param = new Array( 'loginText', 'success' ) ;
        var container = $('#loginText').parent() ;
        var option = null ;
        responseOperationEshop( action, param, container, option ) ;
    }
}
// refresh header user template for login
var refreshUserHeaderLogin = function()
{
    if( $('#LogoutButtonHeader').length )
    {
        var action = 'html' ;
        var param = new Array( 'logoutButtonHeader', 'success' ) ;
        var container = $('#LogoutButtonHeader').parent() ;
        var option = null ;
        responseOperationEshop( action, param, container, option ) ;
    }
}
// specify user to login or register
var needToLogin = function()
{
    $('#basic-modal-content').modal({
        autoResize : true,
        onOpen: function (dialog) {
                var action = 'append' ;
                var param = new Array( 'needLogin', 'success' ) ;
                var container = $('#basic-modal-content') ;
                var option = null ;
                responseOperationEshop( action, param, container, option ) ;
                dialog.overlay.fadeIn('slow', function () {
                dialog.data.hide();
                dialog.container.fadeIn('slow', function () {
                dialog.data.slideDown('slow');
            });
        });
    }});
}
// get user names
var getUserNames = function( loginSuccessArray )
{
    var userNames = '' ;
    // get user datas from the sent php string
    for( var i = 0; i < loginSuccessArray.length; i++ )
    {
        // split data to get the user information keys
        var loginResponsesArray = loginSuccessArray[i].split( '=' ) ;
        // if current data is informed
        if( loginResponsesArray.length == 2 )
        {
            // if current is first name or last name
            if( loginResponsesArray[0] == 'first_name' || loginResponsesArray[0] == 'last_name' )
            {
                userNames += loginResponsesArray[1] + ' ' ;
            }
        }
    }
    return userNames ;
}
// get http request parameters
var getRequestParams = function( inputArray )
{
    var reqData = '';
    for( var i = 0 ;i < inputArray.length ; i++ )
    {
        if( inputArray[i].value != '' )
        {
            reqData += '&'+inputArray[i].name+'='+inputArray[i].value;
        }
    }
    return reqData;
}
// generate tpl from php dialog
var generateTemplate = function( object, option )
{
    switch( object )
    {
        case 'address':
            displayElement( $('.address'), true ) ;
            var boolHasAddress = option ;
            var actionRealoadAddress = 'html' ;
            var paramReloadAddress = new Array( 'injectAddress', 'success' ) ;
            var containerReloadAddress = $('.address') ;
            var optionReloadAddress =  new Array() ;
            optionReloadAddress['hasAddress'] = boolHasAddress ;
            responseOperationEshop( actionRealoadAddress, paramReloadAddress, containerReloadAddress, optionReloadAddress );
        break;
    }
}
// active listener according to ezuser address attribute
var activeAddressListener = function( boolHasAddress )
{
    if( boolHasAddress )
    {
       activeEditAddressListener() ;
    }
    else
    {
       activePublishAddressListener() ;
    }
}
// function to access to the pyment gateway
var payOrder = function()
{
    if( $('#SelectPaymentButton').length )
    {
        $('#SelectPaymentButton').unbind('click') ;
        $('#SelectPaymentButton').bind('click', function() {
            reqData = 'SelectPaymentButton=true';
            reqData += '&SelectedGateway='+getSelectedPayment();
            //confimOrder();
            payOrderAjax( reqData ) ;
        });
    }
}
// run the pay order ajax request
var confimOrder = function()
{
    jQuery.ajax({
        type: 'POST',
        url : '/eshop/basket',
        data : "ConfirmOrderButton=true",
        success: function(msg){
            if (msg)
            {
                //$('#basic-modal-content').append(msg);
            }
        }
    });
}
// run the pay order ajax request
var payOrderAjax = function( reqData )
{
    jQuery.ajax({
        type: 'POST',
        url : '/layout/set/eshopLayout/eshop/payment/',
        data : reqData,
        dataType: "html",
        success: function(msg){
            if (msg)
            {
                $('#basic-modal-content').append(msg);
            }
        }
    });
}
// get the payment gateway into the system
var redirectToPaymentGatewayUI = function( url )
{
    window.location.href = url ;
}
// get the selected payment way
var getSelectedPayment = function()
{
    if( $('#paymentForm').length )
    {
        return $("#paymentForm input[type='radio']:checked").val();
    }
}
// get an array from separator, if no separator return a string from the target
var getArrayFromSeparator = function( strTarget, separator )
{
    return (strTarget.search(separator)!=-1)?strTarget.split(separator):strTarget;
}
// get the response key from the ajax request ( the response key is the first cell of the array ), if target is not an array the response key is the target as string
var getResponseKey = function( responseArray )
{
    return (responseArray instanceof Array)?responseArray[0]:responseArray;
}
// get the reponse informations
var getArrayResponse = function(response)
{
    var dataArray = new Array();
    // on parcourt la reponse fournie par le php contenant toutes les informations transmises ( à partir de 1, 0 contenant la reponse success )
    for( var j = 1; j < response.length; j++ )
    {
        // pour chaque bloc réponse on construit un tableau clé valeur du type login => julien, on applique pour ce faire un split =
        var tmpDataArray = response[j].split('=');
        dataArray[tmpDataArray[0]] = ( tmpDataArray.length > 1 )?tmpDataArray[1]:null;
    }
    return dataArray ;
}
// if response contains hasAdress return true
var hasAddress = function( dataArray )
{
    var keys = array_keys( dataArray ) ;
    return in_array( 'hasAddress', keys ) ;
}
// if response contains email user
var hasMail = function( dataArray )
{
    var keys = array_keys( dataArray ) ;
    return in_array( 'email', keys ) ;
}
// inject data from a target to another one
var setInteraction = function(inputArray,dataArray)
{
    // on parcourt les input du formulaire
    for( var i = 0 ;i < inputArray.length ; i++ )
    {
        // on parcourt les clés du tableau dataArray
        for(dataKey in dataArray)
        {
            // si une clé correspond à un des id d'input du formulaire
            if(inputArray[i].id.search(dataKey)!=-1)
            {
                // on injecte dans l'input concerné la valeur envoyée par le php
                $( inputArray[i] ).val(dataArray[dataKey]);
            }
        }
    }
}
// clear form inputs
var clearForm = function(inputArray)
{
    //on parcourt les input du formulaire
    for( var i = 0 ;i < inputArray.length ; i++ )
    {
        // on vide les champs qui ne sont pas des boutons ou submit
        if( $( inputArray[i] ).attr( 'type' ) != 'button' || $( inputArray[i] ).attr( 'type' ) != 'submit' )
        {
            $( inputArray[i] ).val( null );
        }
    }
}
// switch buttons with display rule property
var displayElement = function( element, on )
{
    switch( on )
    {
        case true:
            element.css("display","block");
        break;
        case false:
            element.css("display","none");
        break;
    }
}
// redirect to quizz
var redirectToQuizz = function()
{
    if( $('#redirectToQuizz').length )
    {
        $protocol = window.location.protocol ;
        $hostname = window.location.host ;
        $quizz = $('#redirectToQuizz').val() ;
        window.location.replace( $protocol + '//' + $hostname + '/' + $quizz ) ;
    }
    else
    {
        return false ;
    }
}