/*******************************************************************************/

var Quiz = {

  init: function(){
    this.getQuizQuestions();
  },
  
  getQuizQuestions: function(){
    if(!this.called){
      var me = this;
      quizService.getQuizQuestionsRandom10(handleResponse);  
    }
    else{
      this.showQuestion();
    }
    
    function handleResponse(response){
      me.called = true;
      me.questions = me.shuffleArray(response);
      me.showQuestion();
    }
  },
  
  showQuestion: function(){
    this.setCurrentQuestion();
    if(!this.currentQuestion){
      this.displayFinished();
    }
    else{
      this.createQuestionHTML();
      this.displayHTML();
    }
  },
  
  createQuestionHTML: function(){
    var ul = cE('ul');
    var me = this;
    for(var i = 0; i < 3; i++){
      var sp = cE('span', this.currentQuestion.answers[i]);
      var li = cE('li', this.letters[i], sp);
      li.onclick = clickHandler(i);
      ul.appendChild(li);
    }
    this.html = cE('div', this.currentQuestion.question, ul);
    
    function clickHandler(i){
      return function(){
        var correct = i+1 == me.currentQuestion.correctAnswer ? true : false;
        me.displayAnswer(correct);
      }
    }

  },
  
  createIcon: function(icon){
    var img = cE('img');
    img.src = '/pix/iconen/'+icon+'.gif';
		img.style.width = '20px';
		img.style.height = '20px';
    return img;    
  },
  
  setCurrentQuestion: function(){
    this.currentQuestion = this.questions.shift() || false;
  },
  
  displayAnswer: function(correct){
    var me = this;
    var sp = cE('span');
    sp.innerHTML = correct ? 'Goed' : 'Fout';
    sp.className = correct ? 'goed' : 'fout';
    var txt = 'Het juiste antwoord was: '+this.currentQuestion.answers[this.currentQuestion.correctAnswer-1];
    var p = cE('p', txt); 
    var img = this.createIcon('opnieuw');   
    var opnieuw = cE('a', img, 'Opnieuw<br />');
    opnieuw.className = 'link';
    opnieuw.onclick = function(){me.showQuestion();};
    var speelQuiz = this.getQuizLink();
    this.html = cE('div', sp, p, opnieuw, speelQuiz);
    this.displayHTML();
  },
  
  getQuizLink: function(){
    var img = this.createIcon('volgende');
    var speelQuiz = cE('a', img, 'Speel de 3VOOR12 quiz');
    speelQuiz.className = 'link'; 
    speelQuiz.onclick = function(){makeframebox("http://quiz.vpro.nl/quiz/3voor12/", 648, 500, "quiz");
                                   return false;};
    return speelQuiz;    
  },
  
  displayFinished: function(){
    var link = this.getQuizLink();
    this.html = cE('div', 'Er zijn vandaag geen nieuwe vragen meer in deze mini quiz. Ga naar de 3VOOR12 quiz voor meer vragen<br />', link);
    this.displayHTML();
  },
  
  displayHTML: function(){
    if(typeof this.html == 'string'){
      document.getElementById('quizDiv').innerHTML = this.html;
    }
    else {
      document.getElementById('quizDiv').innerHTML = '';
      document.getElementById('quizDiv').appendChild(this.html);
    }
  },
  
  // Fisher-Yates shuffle
  shuffleArray: function(o){
	  for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
	  return o;
  },

  letters: ['A','B','C']
  
}

// init - start the quiz
function init(){
  Quiz.init();
  AjaxNumComments.init();

  AjaxTags.init();
  AjaxTags.showTags();
}