/*
 * Copyright (C) 1995-2011 by 4system Polska Sp. z o.o.
 * All Rights Reserved. v4
 */

componentMarkSyllable = function(name) {
	this.componentElement = componentElement;
	this.componentElement(name);
	
	this.answersSyllabe = new Array();	
	this.buttons = new Array();	
	this.compAudio = null;
	
	this.interactions = true;
	this.interactionsType = "choice";	
};

componentMarkSyllable.prototype = new componentElement;
componentMarkSyllable.prototype.type = "componentMarkSyllable";

componentMarkSyllable.prototype.onBaseCreate = function(obj) {
	this.captureMouseEvents();
};

componentMarkSyllable.prototype.onCreate = function(obj) 
{	
	if ( PageInterface.GetValue("state") != psDesigning && lms && this.disableOnlineOfflineMix != false ) 
	{
		this.resourcesStatus 	= lms.resourcesStatus();
		this.resourcesURL 		= lms.resourcesURL();
	} else this.resourcesURL = resourcesURL;
	
	var sizeDiv = '<span id="'+this.id+'sizeDiv" style="visibility: hidden; position: absolute; font-family:' + this.fontFamily
	+ '; font-size:' + this.fontSize + 'px; color:' + this.fontColor + ';"></span>';
	
	var ob = document.getElementById(this.id);
	ob.innerHTML += sizeDiv;		
	
	var contentUnesc = unescape(this.content)
	var wordAudio = contentUnesc.split('||');
	
	overColor = this.mouseOverColor;
	selectedColor = this.selectedColor;
	bgColor = this.bgColor;
	var s = '';
	var temp = '';
	var imgH = 0;
	
	var sizeDiv = document.getElementById(this.id+'sizeDiv');
	
	for (var i=0; i < wordAudio.length; i++) {
		var wordArr = wordAudio[i].split('#!#');
		var sylalableArr = wordArr[0].split('-');
		var stress = -1;
		temp = '';
		
		for (var j=0; j < sylalableArr.length; j++) {
			if (sylalableArr[j].indexOf('+') != -1) {
				sylalableArr[j] = sylalableArr[j].replace('+', '');
				stress = j;
			};
			
			s += "<span id='"+this.id+"_span_"+i+"_"+j+"' style='background-color:transparent; font-size:" + 
				this.getFontSize(this.fontSize, "px")+"px; color:"+this.fontColor+"; font-family:"+this.fontFamily+";' "+
				
				" onclick = \'pc."+this.id+".clickSPAN(this, "+i+", "+j+", \""+bgColor+"\", \""+selectedColor+"\", \""+wordArr[0]+"\");\'"+
				" onMouseover= \'pc."+this.id+".mouseOverSPAN(this, \""+overColor+"\");\'"+
				" onMouseout= \'pc."+this.id+".mouseOutSPAN(this, "+j+", \""+bgColor+"\", \""+selectedColor+"\", \""+wordArr[0]+"\");\'>" +
				sylalableArr[j] + "</span>";
			
			temp += "<span style='font-size:"+this.getFontSize(this.fontSize, "px")+"px; color:"+
					this.fontColor+"; font-family:"+this.fontFamily+";'>" +	sylalableArr[j] + "</span>";
		};
		this.answersSyllabe[wordArr[0]] = new Array();
		this.answersSyllabe[wordArr[0]][0] = stress;
		this.answersSyllabe[wordArr[0]][1] = -1;
		this.answersSyllabe[wordArr[0]][2] = i;
		s += '<br><br>';
		temp += '<br><br><br>';
		
		this.generateAudio();
		
		sizeDiv.innerHTML = temp;
		height = sizeDiv.offsetHeight;
		imgH = this.generateAudioButtons(wordArr[1], i, height+10) + 10;
	};
	
	this.setHTML(s);
};

componentMarkSyllable.prototype.generateAudio = function()
{
	if (this.enableFlashPlayer) {
		var e = new componentFlashAudioPlayer;
		e.myParent = this;
		e.id = this.id + 'Audio';
		e.step = -1;
		e.src = this.flashAudioPlayerSrc;
		e.x = 0;
		e.y = 0;
		e.w = 1;
		e.h = 1;
		e.loop = false;
		e.flashVars = "";
		this.compAudio = page.addChild(e);
	} else {	
		var audioElement = new componentAudio;
		audioElement.myParent = this;
		audioElement.id = this.id+'Audio'; 
		audioElement.src = this.src;
		audioElement.pvWMP64 = false;
		audioElement.pvWMP7up = false;
		audioElement.step = -1;
		audioElement.editorPaint = this.editorPaint;
		this.compAudio = page.addChild(audioElement);
	}
};

componentMarkSyllable.prototype.editorPaint = function()
{
	return '';
};

componentMarkSyllable.prototype.generateAudioButtons = function(audioName, ind, imageG)
{
	var audioButtonsArr = new Array(this.audioStop, this.audioPlay, '_stop_', '_play_', 'Stop', 'Play');
	var tempX = 5;
	var tempY = imageG*ind + 5;
	
	for (var i=0; i < 2; i++){
		var image = new componentImage;
		image.myParent = this; 
		image.id = this.id + audioButtonsArr[i+3] + i; 
		var imageTest = new Image();
		imageTest.src = this.resourcesURL + audioButtonsArr[i];
		image.w = imageTest.width;
		image.x = this.x + this.w - tempX - image.w;
		image.h = imageTest.height;
		image.y = this.y + tempY;
		image.src = audioButtonsArr[i];
		image.cursor = 'hand';
		image.audio = audioName;
		
		image.captureMouseEvents = this.captureMouseEvents;
		var funct = 'this.onMouseClickImage'+audioButtonsArr[i+4];
		
		image.eventClick = eval(funct);
		
		page.addChild(image);
		this.buttons.push(image);
		
		tempX +=  image.w + 5;
	};
	return image.h;
};

componentMarkSyllable.prototype.getAudioIndex = function(audioFile)
{
	var result = -1;
	var contentUnesc = unescape(this.content)
	var contentArr = contentUnesc.split('||');
	for(var i=0; i < contentArr.length; i++){
		var oneArr = contentArr[i].split('#!#');
		if (oneArr[1] == audioFile) {
			result = i;
			break;
		}
	}
	return result;
};

componentMarkSyllable.prototype.onMouseClickImagePlay = function()
{
	if (this.audio == '' || this.audio == 'undefined' || typeof(this.audio) == 'undefined')
	return;
	
	if (this.myParent.enableFlashPlayer) {
		this.myParent.compAudio.flashVars = "playIdx="
		+ this.myParent.getAudioIndex(this.audio) + "&autoStart=true&playOnce=true";
		this.myParent.compAudio.show();
	} else {
		this.myParent.compAudio.setUrl(this.resourcesURL + this.audio);
		this.myParent.compAudio.actionMediaPlay();
	};	
};

componentMarkSyllable.prototype.onMouseClickImageStop = function()
{
	if (this.myParent.enableFlashPlayer) {
		this.myParent.compAudio.flashVars = "";
		this.myParent.compAudio.show();
	} else {
		this.myParent.compAudio.actionMediaStop();
	};	
};

componentMarkSyllable.prototype.onRepaint = function()
{
	if (PageInterface.GetValue("allowCAI") && this.showCorrectAnswerIndicator)
	{
		var contentUnesc = unescape(this.content)
		var wordAudio = contentUnesc.split('||');
		
		correct = this.elementCorrect;
		incorrect = this.elementInCorrect;
		var s = '';
		
		for (var i=0; i < wordAudio.length; i++) {
			var wordArr = wordAudio[i].split('#!#');
			var sylalableArr = wordArr[0].split('-');
			
			for (var j=0; j < sylalableArr.length; j++) {
				var obj = document.getElementById(this.id+"_span_"+i+"_"+j);
				if (this.answersSyllabe[wordArr[0]][0] == j){
					if (this.answersSyllabe[wordArr[0]][1] == j) obj.style.background = correct;
						else obj.style.background = incorrect;
				}else{
					if (this.answersSyllabe[wordArr[0]][1] == j) obj.style.background = incorrect;
						else obj.style.background = correct;			
				}
			};
		};
	};
};

componentMarkSyllable.prototype.mouseOverSPAN = function(obj, color)
{
	if (this.isLocked) return;
	
	obj.style.background = color;
};

componentMarkSyllable.prototype.mouseOutSPAN = function(obj, ind, color, selCol, word)
{
	if (this.isLocked) return;
	
	if(this.answersSyllabe[word][1] != ind){
		obj.style.background = color;
	}else{
		obj.style.background = selCol;
	};
};

componentMarkSyllable.prototype.clickSPAN = function(obj, indI, indJ, bgCol, selCol, word)
{
	if (this.isLocked) return;
	
	this.reColor(word, indI, bgCol);
	
	obj.style.background = selCol;
	this.answersSyllabe[word][1] = indJ;
};

componentMarkSyllable.prototype.reColor = function(word, ind, background )
{
	var j = -1;
	do{
		j++;
		var obj = document.getElementById(this.id+"_span_"+ind+"_"+j);
		if (obj){
			obj.style.background = background;
			this.answersSyllabe[word][1] = -1;
		};
	}while (obj)
};

componentMarkSyllable.prototype.onShow = function() 
{
	for (var i=0; i < this.buttons.length; i++) {
		this.buttons[i].show();
	};
};

componentMarkSyllable.prototype.getFontSize = function(value, format)
{
	var fontSizesPX = new Array(0,10,13,16,18,24,32,48);
	var fontSizesPT = new Array(0, 8,10,12,14,18,24,36);
	var pxSize = fontSizesPT[parseInt(value)];
	
	if (format == "px") {
		pxSize = fontSizesPX[parseInt(value)];
	};
	
	return pxSize;
};

componentMarkSyllable.prototype.checkAnswer = function() 
{
	return(this.parseCheckAnswer(this)); 
};

componentMarkSyllable.prototype.parseCheckAnswer = function(obj) 
{
	var result = true;
	for (k in this.answersSyllabe){
		if (this.answersSyllabe[k][0] != this.answersSyllabe[k][1]) {
			result = false;
		}else{
			if (this.showAnswerIndicatorAnyTime && this.showCorrectAnswerIndicator){
				var sylalableArr = k.split('-');
				var ind = this.answersSyllabe[k][2];
				
				for (var j=0; j < sylalableArr.length; j++) {
					var obj = document.getElementById(this.id+"_span_"+ind+"_"+j);
					if (this.answersSyllabe[k][0] == j){
						if (this.answersSyllabe[k][1] == j) obj.style.background = this.elementCorrect;
							else obj.style.background = this.elementInCorrect;
					}else{
						if (this.answersSyllabe[k][1] == j) obj.style.background = this.elementInCorrect;
							else obj.style.background = this.elementCorrect;			
					}
				};			
			};
		};
	};
	return result;
};


componentMarkSyllable.prototype.getAnswer = function() 
{
	var result = '';
	var sep = '';
	
	for (k in this.answersSyllabe){
		if (result != '') sep = '||';
		result += sep + k;
		result += '#!#' + this.answersSyllabe[k][1];
	};
	return(result);
};

componentMarkSyllable.prototype.setAnswer = function(valStr, showCorrect)
{
	if ((typeof(valStr) == 'undefined' || valStr == '') && !showCorrect) return;
	if (valStr == '' && (typeof(showCorrect) == 'undefined' || showCorrect.toString() == '')) showCorrect = true;
	
	if (showCorrect){
		for (k in this.answersSyllabe){
			var indI = this.answersSyllabe[k][2];
			var indJ = this.answersSyllabe[k][0];
			
			var obj = document.getElementById(this.id+"_span_"+indI+"_"+indJ);
			this.reColor(k, indI, this.bgColor );
			
			if (obj){
				obj.style.background = this.selectedColor;
				this.answersSyllabe[k][1] = indJ;
			};
		};
	}else{
		var valStrArr = valStr.split('||');
		for (var i=0; i < valStrArr.length; i++) {
			var objArr = valStrArr[i].split('#!#');		
			var indI = this.answersSyllabe[objArr[0]][2];
			var obj = document.getElementById(this.id+"_span_"+indI+"_"+objArr[1]);
			this.reColor(objArr[0], indI, this.bgColor );
			
			if (obj){
				obj.style.background = this.selectedColor;
				this.answersSyllabe[objArr[0]][1] = objArr[1];
			};
		};
	};
	this.onRepaint();		
};

componentMarkSyllable.prototype.onLock = function() 
{
	this.isLocked = true;
};

componentMarkSyllable.prototype.onUnLock = function() 
{
	this.isLocked = false;
};

componentMarkSyllable.prototype.interactionsCorrectResponsesCount = function()
{
	return length;
};

componentMarkSyllable.prototype.interactionsCorrectResponses = function()
{
	var result ="";
	var sep = "";
	for (k in this.answersSyllabe){
		if (result != '') sep = '||';
		result += sep + k;
		result += '#!#' + this.answersSyllabe[k][0];	
	};
	return result;
};

componentMarkSyllable.prototype.interactionsStudentResponse = function()
{
	return this.getAnswer();
};

componentMarkSyllable.prototype.interactionsCorrectResponsesAsText = function(index)
{
	var result ="";
	var sep = "";
	for (k in this.answersSyllabe){
		if (result != '') sep = '||';
		result += sep + k;
		result += '#!#' + this.answersSyllabe[k][0];	
	};
	return result;
};

componentMarkSyllable.prototype.interactionsStudentResponseAsText = function()
{	
	return this.getAnswer();
};




















