var groupsStatus = {};

Event.observe(window, 'load', function() {

    document.getElementById('confirmation').style.display = 'none';
    document.getElementById('coordonnees-container').style.display = 'none';
    
    Event.observe(document.getElementById('confirmation').getElementsByTagName('input')[0], 'click', function() {
        document.getElementById('confirmation').hide();
        document.getElementById('coordonnees-container').show();
    });

    // Creation de la liste des groupes de question

    // On liste les groupes de questions
    var groups = $$('.group');

    // Pour chaque groupe, on liste les questions
    groups.each( function( group ) {
    
        // On masque le groupe
        group.hide();
    
        // Récupération du titre du groupe
        var title = group.getElementsByTagName('h3')[0];

        Event.observe(document.getElementById('a-' + group.getAttribute('id')), 'click', function( event ) {
		
            $$('#nav-needs a.selected').each( function( a ) { a.removeClassName('selected'); } );
            document.getElementById('a-' + group.getAttribute('id')).addClassName('selected');
            Event.stop(event);

            groups.each( function( group ) { group.hide(); });
            document.getElementById('introduction').hide();
            document.getElementById('confirmation').hide();
            document.getElementById('coordonnees-container').hide();
            group.show();
			
            if ( groupsStatus[group.getAttribute('id')][1] == 2 ) $(group.getAttribute('id') + '-buttons-1').show();
 
		});
        
        // Création du message permettant de spécifier une autre demande ou de remplir les coordonnées
        var div = document.createElement('div');
        var p = document.createElement('p');
        p.innerHTML = '';
    
        // Liste des questions
        var questions = $(group).getElementsBySelector('.question'), label, number;
        
        questions.each( function( question, i ) {
        
            // On masque les questions autre que la premiere question
            if ( i > 0 ) question.toggle();
			
            question.getElementsByTagName('legend')[0].innerHTML = '<span>' + ( i + 1 ) + ' / ' + questions.length + '</span> ' + question.getElementsByTagName('legend')[0].innerHTML;
			var pageNumber = document.createElement('span');
			pageNumber.className = 'number';
			pageNumber.innerHTML = ( i + 1 ) + ' / ' + questions.length;
			question.appendChild(pageNumber);

            // On cree les boutons de navigation
            var buttonsArea = document.createElement('ul');
            buttonsArea.className = 'buttons';
            buttonsArea.setAttribute('id', group.getAttribute('id') + '-buttons-' + (i + 1));
            buttonsArea.style.display = 'none';
            
            // Bouton "Précédent"
            if ( i > 0 ) {
                var liPrevious = document.createElement('li');
                var buttonPrevious = document.createElement('input');
                buttonPrevious.setAttribute('type', 'button');
                buttonPrevious.setAttribute('value', ( lang == 'fr' ? 'Précédent' : 'Previous' ));
                buttonPrevious.className = 'previous';
                Event.observe(buttonPrevious, 'click', function() { previousQuestion(group.getAttribute('id')); });
                liPrevious.appendChild(buttonPrevious);
                buttonsArea.appendChild(liPrevious);
            }

            // Bouton "Suivant"
            if ( i < questions.length - 1 ) {
                var liNext = document.createElement('li');
                var buttonNext = document.createElement('input');
                buttonNext.setAttribute('type', 'button');
                buttonNext.setAttribute('value', ( lang == 'fr' ? 'Suivant' : 'Next' ));
                buttonNext.className = 'next';
                Event.observe(buttonNext, 'click', function() { nextQuestion(group.getAttribute('id')); });
                liNext.appendChild(buttonNext);
                buttonsArea.appendChild(liNext);
            }
            
            // Bouton "Terminer"
            if ( i == questions.length - 1 ) {
                var liEnd = document.createElement('li');
                var buttonEnd = document.createElement('input');
                buttonEnd.setAttribute('type', 'button');
                buttonEnd.setAttribute('value', ( lang == 'fr' ? 'Terminer' : 'Finish' ));
                buttonEnd.className = 'submit';
                Event.observe(buttonEnd, 'click', function() {
                    $$('#nav-needs a.selected').each( function( a ) { a.removeClassName('selected'); } );
                    group.hide();
                    document.getElementById('confirmation').show();
                });
                liEnd.appendChild(buttonEnd);
                buttonsArea.appendChild(liEnd);
            }

            insertAfter(buttonsArea, question);

        });

        groupsStatus[group.getAttribute('id')] = [questions.length, 2];

    });
	
	// Lien direct sur le pavé "coordonnées"
	Event.observe($('shortcut-coordonnees'), 'click', function(event) {
		groups.each( function( group ) { group.hide(); });
		document.getElementById('introduction').hide();
		document.getElementById('confirmation').hide();
		document.getElementById('coordonnees-container').show();
		Event.stop(event);
	});

}); // end of 'Event.observe()'

function insertAfter( newEl, el ) {

    return el.nextSibling
        ? el.nextSibling.parentNode.insertBefore(newEl, el.nextSibling)
        : el.parentNode.appendChild(newEl);

} // end of 'insertAfter()'

function previousQuestion( groupId ) {

    var index = groupsStatus[groupId][1] - 1;

    var id = groupId + '-' + index;
    document.getElementById(id).hide();
    if ( $(groupId + '-buttons-' + ( index )) ) $(groupId + '-buttons-' + ( index )).hide();
    document.getElementById(id).previous().previous().show();
    if ( groupsStatus[groupId][1] > 1 ) $(groupId + '-buttons-' + (index - 1)).show();

    groupsStatus[groupId][1]--;
    
} // end of 'nextQuestion()'

function nextQuestion( groupId ) {

    var index = groupsStatus[groupId][1];

    var id = groupId + '-' + index;
    if ( groupsStatus[groupId][1] > 1 ) {
        document.getElementById(id).previous().previous().hide();
        $(groupId + '-buttons-' + ( index - 1 )).hide();
    }
    document.getElementById(id).show();
    $(groupId + '-buttons-' + index).show();

    groupsStatus[groupId][1]++;
    
} // end of 'nextQuestion()'