Hello. I need to create a Quiz. This Quiz consists of 40 questions worth 1 to 6 points. After voting on the 40 questions is listed all 40 questions and the respective scores made by the user in order from highest to lowest score. Shortly thereafter, the user selects 3 of the 5 or 6 value answer questions he liked best. After that 4 points are added to each one of these answers that he liked best and then is listed the same for the user. Each response belongs to a group (TF, GG, AI, EV) and where the number of points fits, generates a graph with each of these groups.
As far as I can get with the very little javascript experience I have this one down. I know it's hard, but if anyone can help me.
(function() {
var perguntasTotal = [{
idPergunta: 1,
pergunta: ") Eu sonho ser tão bom no que faço que serei constantemente consultado como um especialista.",
escolhas: [1, 2, 3, 4, 5, 6],
respostaUser: 0,
pesoPergunta: 'TF'
}, {
idPergunta: 2,
pergunta: ") Sinto-me mais realizado quando sou capaz de integrar e gerenciar os esforços dos outros.",
escolhas: [1, 2, 3, 4, 5, 6],
respostaUser: 0,
pesoPergunta: 'GG'
}, {
idPergunta: 3,
pergunta: ") Eu sonho em ter uma carreira que me dê a liberdade para realizar o trabalho à minha maneira e fazer meus próprios horários.",
escolhas: [1, 2, 3, 4, 5, 6],
respostaUser: 0,
pesoPergunta: 'AI'
}, {
idPergunta: 4,
pergunta: ") Segurança e estabilidade são mais importantes para mim do que liberdade e autonomia.",
escolhas: [1, 2, 3, 4, 5, 6],
respostaUser: 0,
pesoPergunta: 'SE'
}, {
idPergunta: 40,
pergunta: ") Eu sempre procuro oportunidades que minimizem a interferência na minha vida pessoal e familiar.",
escolhas: [1, 2, 3, 4, 5, 6],
respostaUser: 0,
pesoPergunta: 'EV'
}];
var contadorPergunta = 0; //Tracks question number
var selecoes = []; //Array containing user choices
var quiz = $('#quiz'); //Quiz div object
// Display initial question
proximaExibicao();
// Click handler for the 'next' button
$('#proxima').on('click', function (e) {
e.preventDefault();
// Suspend click listener during fade animation
if(quiz.is(':animated')) {
return false;
}
escolha();
// If no user selection, progress is stopped
if (isNaN(selecoes[contadorPergunta])) {
alert('Por favor selecione uma resposta!');
} else {
contadorPergunta++;
proximaExibicao();
}
});
// Click handler for the 'prev' button
$('#anterior').on('click', function (e) {
e.preventDefault();
if(quiz.is(':animated')) {
return false;
}
escolha();
contadorPergunta--;
proximaExibicao();
});
// Click handler for the 'Start Over' button
$('#inicio').on('click', function (e) {
e.preventDefault();
if(quiz.is(':animated')) {
return false;
}
contadorPergunta = 0;
selecoes = [];
proximaExibicao();
$('#inicio').show();
});
// Animates buttons on hover
$('.button').on('mouseenter', function () {
$(this).addClass('active');
});
$('.button').on('mouseleave', function () {
$(this).removeClass('active');
});
// Creates and returns the div that contains the questions and
// the answer selections
function criaElementoPergunta(index) {
var elementoQ = $('<div>', {
id: 'pergunta'
});
var header = $('<h2>Pergunta ' + (index + 1) + ':</h2>');
elementoQ.append(header);
//var pergunta = $('<p>').append(perguntasTotal[index].pergunta);
var pergunta = $('<p><span id="idPergunta">' + perguntasTotal[index].idPergunta + '</span>' + perguntasTotal[index].pergunta + '</p>');
elementoQ.append(pergunta);
var botaoRadio = criaRadio(index);
elementoQ.append(botaoRadio);
return elementoQ;
}
// Creates a list of the answer choices as radio inputs
function criaRadio(index) {
var listaRadio = $('<div class="questoes-3-itens">');
var item;
var input = '';
for (var i = 0; i < perguntasTotal[index].escolhas.length; i++) {
item = $('<li class="metodo-exibicao metodo-exibicao'+ perguntasTotal[index].escolhas[i] +' resposta resposta'+ perguntasTotal[index].escolhas[i] +'">');
input = '<input type="radio" name="resposta" id="resposta' + perguntasTotal[index].escolhas[i] + '" value=' + perguntasTotal[index].escolhas[i] + ' /><label for="resposta' + perguntasTotal[index].escolhas[i] + '"></label>';
input += perguntasTotal[index].escolhas[i];
item.append(input);
listaRadio.append(item);
}
return listaRadio;
}
// Reads the user selection and pushes the value to an array
function escolha() {
selecoes[contadorPergunta] = +$('input[name="resposta"]:checked').val();
}
// Displays next requested element
function proximaExibicao() {
quiz.fadeOut(function() {
$('#pergunta').remove();
if(contadorPergunta < perguntasTotal.length){
var proximaPergunta = criaElementoPergunta(contadorPergunta);
quiz.append(proximaPergunta).fadeIn();
if (!(isNaN(selecoes[contadorPergunta]))) {
$('input[value='+selecoes[contadorPergunta]+']').prop('checked', true);
}
// Controls display of 'prev' button
if(contadorPergunta === 1){
$('#anterior').show();
} else if(contadorPergunta === 0){
$('#anterior').hide();
$('#proxima').show();
}
}else {
var elementoPontuacao = manage(selecoes, perguntasTotal);
quiz.append(elementoPontuacao).fadeIn();
$('#proxima').hide();
$('#anterior').hide();
$('#inicio').show();
}
});
}
function manage(selecoes, perguntasTotal) {
var out = new Array();
var done = false;
for ( i = 0; i < selecoes.length; i++) {
if (selecoes[i] != perguntasTotal[i].respostaCorreta) {
perguntasTotal[i].respostaCorreta = parseInt(selecoes[i]);
out.push(selecoes[i]);
out.push(perguntasTotal[i]);
} else {
done = true;
}
}
if (done == false) {
out.push(perguntasTotal);
}
console.log(out);
return out;
}
var pergunt = [];
$('input[type=checkbox]').change(function(){
var id = jQuery(this).attr('pergunta');
pergunta = manage(pergunta,id);
});
jQuery('.envia').click(function(){
alert(pergunta);
})
})();