(function($){ $.fn.extend({ jQuizler: function(questions) { // @todo избавиться от возможности двойного клика по кнопкам "cследующий", "предыдущий", "результат" // @todo добавить возможность выбора нескольких вариантов ответа // @todo добавить возможность внедрения названия теста на страницу результатов // @todo избавиться от зависимости Bootsrap CSS // @todo поработать над стилем элементов кнопок и прогресса // @todo добавить кнопки "поделиться" или "like" для разных соц сетей ("ВКонтакте", "Однолкассники", ...) // @todo разобраться с проблемой клика по элементу кнопки на странице результатов // @todo переписать код, сделать его более изящным и чистым // @todo сделать так, чтобы плагин можно было применять для 2х и более тестов на страницу // @todo создать online инструмент для формирования и редактирования вопросов if (questions == null) throw 'No questions was provided.'; var reviewQuiz = false; var percentage = 0; var percentPiece = 100 / questions.length; var rightAnswers = 0; $(this).html("
" + $(this).html() + "
"); $(this).click(function(){ $(this).off('click'); $(".intro").hide(); $(this).css("text-align", "left"); $('.progress').css("display", "block"); var question = $("#question-1"); question.css({opacity : '0', height : '0px'}); question.animate({ opacity : '1', height : '100%' }, 500, function(e){}); question.css('display', 'block'); percentage += percentPiece; $(".progress div").css("width", percentage + "%"); }); (function($){ $.shuffle = function(arr) { for( var j, x, i = arr.length; i; j = parseInt(Math.random() * i), x = arr[--i], arr[i] = arr[j], arr[j] = x ); return arr; } })(jQuery); String.prototype.replaceAll = function (find, replace) { var str = this; return str.replace(new RegExp(find, 'g'), replace); }; return this.each(function(){ var html = ""; html += "
"; $.each(questions, function(index, question){ html += "
"; //html += "
Вопрос " + (index + 1) + ' из ' + questions.length + "
"; html += question.question; var correctAnswers = []; for (var i = 0; i < question.correct.length; i++) correctAnswers.push(question.answers[question.correct[i] - 1]); question.answers = $.shuffle(question.answers); var correctAnswersNewIndexes = []; for (var i = 0; i < question.correct.length; i++) correctAnswersNewIndexes.push(question.answers.indexOf(correctAnswers[i])); question.correct = correctAnswersNewIndexes; /*for (var i = 0; i < question.correct.length; i++) console.log(question.answers[correctAnswersNewIndexes[i]]);*/ html += ""; html += "
"; html += "
Выберите ответ
"; if (index != 0) { html += ""; } if (index != questions.length-1) { html += ""; html += "
"; } else { html += ""; html += "
"; } html += "
"; html += ""; }); html += "
"; html += "
"; html += "
"; ///html += "
"; $(this).append(html); $("div[id*='question-'] li").click(function(){ if (!reviewQuiz) { /*$(this).siblings().removeClass("selected"); $(this).toggleClass("selected");*/ $(this).siblings().removeClass("btn-info"); $(this).toggleClass("btn-info"); } }); $(".final").click(function(e){ var div = $(e.target).closest("div[id*='question-']"); var userAnswer = div.find("li.btn-info"); if (userAnswer.index() == -1 && !reviewQuiz) { var notice = div.find(".notice"); notice.css('opacity', '0'); notice.animate({ opacity: 1 }, 500, function(){}); div.find(".notice").css('display', 'block'); } else if (!reviewQuiz) { div.find(".notice").css('display', 'none'); percentage += percentPiece; if (percentage > 100) percentage = 100; $("#percent").css("width", percentage + "%"); var resultHTML = "

РЕЗУЛЬТАТЫ

"; var buttonsHTML = ''; $.each(questions, function(index, question){ //console.log("Правильные ответы: " + question.correct); var element = $("#question-" + (index+1) + " ul li.btn-info"); //console.log("Ответ пользователя: " + element.index()); if (element.index() == question.correct) { element.removeClass("btn-info"); element.addClass("btn-success"); buttonsHTML += ""; rightAnswers++; } else { element.removeClass("btn-info"); element.addClass("btn-danger"); buttonsHTML += ""; for (var i=0; iВы ответили на " + Math.round(((rightAnswers * 100) / questions.length) * 100) / 100 + "% вопросов.

"; var colErr = questions.length - rightAnswers if(colErr==0){ rezTest="

Молодец!!! Вы настоящий юрист! Поздравляем!

"; } if(colErr <= 1 || colErr >= 4){ rezTest="

Так держать!!! Вы хорошо владеете знаниями права, продолжайте изучение и достигните совершенства.

"; } if(colErr > 4){ rezTest="

Подтянитесь!!! Ваме нужно совершенствовать знание своих прав, следует внимательно изучить Конституцию России.

"; } resultHTML += rezTest+"
"; resultHTML += buttonsHTML; resultHTML += "

"; div.animate({ opacity : '0' }, 500, function(e){ div.css('display', 'none'); div.find(".notice").css('display', 'none'); $(".results").append(resultHTML); $(".results").css("opacity", "0"); $(".results").css("display", "block"); $(".results").animate({ opacity : '1' }, 500, function(e){ }); }); $(".progress").animate({ opacity : '0' }, 100, function(e){}); reviewQuiz = true; } else { $(".results").animate({ opacity: "1", display: "block" }, 100, function(e){}); div.animate({ opacity : '0' }, 500, function(e){ div.css('display', 'none'); div.find(".notice").css('display', 'none'); $(".results").append(resultHTML); $(".results").css("opacity", "0"); $(".results").css("display", "block"); $(".results").animate({ opacity : '1' }, 500, function(e){ }); }); $(".progress").animate({ opacity : '0' }, 100, function(e){}); } return false; }); $(".next").click(function(e){ var div = $(e.target).closest("div[id*='question-']"); var userAnswer = div.find("li.btn-info"); if (userAnswer.index() == -1 && !reviewQuiz) { var notice = div.find(".notice"); notice.css('opacity', '0'); notice.animate({ opacity: 1 }, 500, function(){}); div.find(".notice").css('display', 'block'); } else { var nextId = parseInt(div.attr('id').replace('question-', '')) + 1; //console.log(nextId); var newQuestion = $("#question-" + nextId); div.animate({ opacity : '0' }, 500, function(e){ div.css('display', 'none'); div.find(".notice").css('display', 'none'); newQuestion.css({opacity : '0', height : '0px'}); newQuestion.animate({ opacity : '1', height : '100%' }, 500, function(e){}); newQuestion.css('display', 'block'); }); percentage += percentPiece; $(".progress div").css("width", percentage + "%"); } return false; }); $(".prev").click(function(e){ var div = $(e.target).closest("div[id*='question-']"); var prevId = parseInt(div.attr('id').replace('question-', '')) - 1; var newQuestion = $("#question-" + prevId); div.animate({ opacity : '0' }, 500, function(e){ div.css('display', 'none'); //div.find(".notice").css('display', 'none'); newQuestion.css({opacity : '0', height : '0px'}); newQuestion.animate({ opacity : '1', height : '100%' }, 500, function(e){}); newQuestion.css('display', 'block'); }); percentage -= percentPiece; $(".progress div").css("width", percentage + "%"); return false; }); $(".results").click(function(e){ $(".results").animate({opacity: 0}, 500, function(e){ $(".results").css("display", "none"); var question = $("#question-1"); question.css({opacity : '0', height : '0px'}); question.animate({ opacity : '1', height : '100%' }, 500, function(e){}); question.css('display', 'block'); $(".progress div").css("width", "0"); $(".progress div").css("display", "block"); $(".progress").animate({ opacity : '1' }, 300, function(e){ percentage = 0; percentage += percentPiece; $(".progress div").css("width", percentage + "%"); }); }); }); }); } }); })(jQuery);