
Quizz = {

	// call Quizz.init(
	// 	'id of element to contain words',
	//	'id of element to contain sentences',
	//	[ 'sentence and [word] to skip', '', '', ... ]
	// );

	word_wrapper           : 'LI',
	sentence_wrapper       : 'LI',
	sentence_hovered_class : 'hovered',
	gap_filler             : '               ',
	
	word_pattern           : /\[([^\]]+)\]/,

	init : function (words_id, sentences_id, sentences) {
		var wcont = document.getElementById(words_id);
		var scont = document.getElementById(sentences_id);
		var words = [];
		// fill sentences container
		for (var i = 0; i < sentences.length; i++) {
			var t = Quizz.splitSentence(sentences[i]);
			var sent = document.createElement(Quizz.sentence_wrapper);
			var word = document.createElement('SPAN');

			word.className = 'gap';
			var gap = document.createElement('SPAN');
			gap.appendChild(document.createTextNode(Quizz.gap_filler));
			word.appendChild(gap);
			sent.appendChild(document.createTextNode(t[0]));
			sent.appendChild(word);
			sent.appendChild(document.createTextNode(t[2]));
			scont.appendChild(sent);
			sent.setAttribute('answer', t[1]);
	
			Droppables.add(sent, {
			  hoverclass: Quizz.sentence_hovered_class,
			  overlap: 'vertical',
			  onDrop: Quizz.on_drop
			});
	
			words.push(t[1]);
		}
		// shuffle words
		for (var i = 0; i < words.length - 1; i++) {
			var p = Math.floor(Math.random()*(words.length - i - 1) + i + 1);
			var t = words[i];
			words[i] = words[p];
			words[p] = t;
		}
		// fill words contaier
		for (var i = 0; i < words.length; i++) {
			var word = document.createElement(Quizz.word_wrapper);
			word.appendChild(document.createTextNode(words[i]));
			wcont.appendChild(word);
			
			new Draggable(word, { 
				revert: true,
				scroll: window
			});
		}
	},
	
	splitSentence : function (sentence) {
		var t = Quizz.word_pattern.exec(sentence);
		return [
			sentence.substr(0, t.index),
			t[1],
			sentence.substr(t.index + t[0].length, sentence.length)
		];
	},
	
	on_drop : function (word,sent) {
		var gap = sent.getElementsByTagName('SPAN')[0];
		if (gap.className == 'gap right' || gap == word.parentNode)	return;
		if (gap.word) {
			gap.word.style.display = 'block';
			new Effect.Highlight(gap.word);
		}
		gap.firstChild.firstChild.nodeValue = word.innerHTML;
		if (word.innerHTML == sent.getAttribute('answer')) {
			gap.className = 'gap right';
			if (gap.draggable) {
				gap.draggable.destroy();
				gap.draggable = null;
			}
		}
		else {
			gap.className = 'gap wrong';
			gap.draggable = new Draggable(gap.firstChild, { 
				revert: true,
				scroll: window
			});
		}
		if (word.parentNode.className != 'gap wrong') {
			gap.word = word;
			gap.word.style.display = 'none';
		}
		else {
			var oldgap = word.parentNode;
			gap.word = oldgap.word;
			if (oldgap.draggable) {
				oldgap.draggable.destroy();
				oldgap.draggable = null;
			}
			oldgap.word = null;
			oldgap.firstChild.firstChild.nodeValue = Quizz.gap_filler;
			oldgap.className = 'gap';
		}
	},
	
	clear_gap : function() {
		this.word.style.display = 'block';
		new Effect.Highlight(this.word);
		this.word = null;
		this.style.cursor = '';
		this.firstChild.nodeValue = Quizz.gap_filler;
		this.className = 'gap';
		this.onclick = function(){};
	}
};
