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

componentImageWithBaskets = function(name)
{
	//inherited
	this.__componentText = __componentText;
	this.__componentText(name);
	
	this.texts = new Array();
	this.baskets = new Array();
	this.dropAudioComp = null;
	
	this.interactions = true;
	this.interactionsType = "matching";			
};

componentImageWithBaskets.prototype = new __componentText();
componentImageWithBaskets.prototype.type = "componentImageWithBaskets";

componentImageWithBaskets.prototype.onCreate = function()
{
	this.captureMouseEvents();
	if ( PageInterface.GetValue("state") != psDesigning && lms && this.disableOnlineOfflineMix != false ) 
	{
		this.resourcesStatus 	= lms.resourcesStatus();
		this.resourcesURL 		= lms.resourcesURL();
	} else this.resourcesURL = resourcesURL;

	if (this.enableFlashPlayer) {
		var e = new componentFlashAudioPlayer;
		e.myParent = this;
		e.id = this.id + 'dropAudioComp';
		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.dropAudioComp = page.addChild(e);
	} else {	
		var audioElement = new componentAudio;
		audioElement.myParent = this;
		audioElement.id = this.id+'dropAudioComp'; 
		audioElement.src = this.src;
		audioElement.pvWMP64 = false;
		audioElement.pvWMP7up = false;
		audioElement.step = -1;
		audioElement.editorPaint = this.editorPaint;
		this.dropAudioComp = page.addChild(audioElement);		
	}
	
	var baksets = this.content.split('||');
	var sizeDiv = '<span id="'+this.id+'sizeDiv" style="visibility: hidden; position: absolute; font-family: Arial; font-size:13px; color: #000000;"></span>';
	
	var ob = document.getElementById(this.id);
	ob.innerHTML += sizeDiv;	
	
	var ddelementHeight = 25;
	var ddelementWidth = 100;
	
	for(var i=0; i < baksets.length; i++){
		var elemValue = baksets[i].split('#!#');
		if (document.getElementById(this.id+"sizeDiv")) {
			document.getElementById(this.id+"sizeDiv").innerHTML = elemValue[0];
			width = document.getElementById(this.id+"sizeDiv").offsetWidth;
			height = document.getElementById(this.id+"sizeDiv").offsetHeight;
		};
		if ( height > ddelementHeight ) ddelementHeight = height;		
		if ( width > ddelementWidth ) ddelementWidth = width;		
	};
	
	var tempX = this.x;
	var tempY = this.y;
	var ddelemX = this.x;
	var ddelemY = this.y;
	
	var maxCount = parseInt(this.w/ddelementWidth);
	
	this.spaceBetween = parseInt((this.w-maxCount*ddelementWidth)/(maxCount-1));
	var index = 0;
	for(var i=0; i < baksets.length; i++){
		var elemValue = baksets[i].split('#!#');
		
		if (elemValue[3] == 1){
			var ddBasketText = new __componentText;
			ddBasketText.myParent = this; 
			ddBasketText.id = this.id+'_DDB_'+index; 
			ddBasketText.x = tempX + parseInt(elemValue[1]);
			ddBasketText.y = tempY + parseInt(elemValue[2]);
			ddBasketText.w = ddelementWidth;
			ddBasketText.h = ddelementHeight;
			ddBasketText.borderWidth = 1;
			ddBasketText.text = "";
			ddBasketText.borderColor = this.elementBorderColor;
			ddBasketText.bgColor = this.bckgColor;
			ddBasketText.z = this.z;
			
			ddBasketText.onCreate = this.onCreateBasket;
			
			page.addChild(ddBasketText);		
			this.baskets.push( ddBasketText );
			index++;
		};
		
		var ddElementText = new __componentText;
		ddElementText.myParent = this; 
		ddElementText.id = this.id+'_DDE_'+i; 
		ddElementText.x = ddelemX+(this.spaceBetween*(i % maxCount))+(ddelementWidth*(i % maxCount));
		ddElementText.y = ddelemY;
		ddElementText.startX = ddElementText.x;
		ddElementText.startY = ddElementText.y;		
		ddElementText.w = ddelementWidth;
		ddElementText.h = ddelementHeight;
		ddElementText.destinationBasketId = this.id+'_DDB_'+i;
		ddElementText.insideBasketId = "";
		ddElementText.text = elemValue[0];
		ddElementText.align = "center";
		ddElementText.valign = 'middle';		
		ddElementText.borderWidth = 1;
		ddElementText.borderColor = this.elementBorderColor;
		ddElementText.padding = 0;
		ddElementText.bgColor = this.elementBckColor;		
		ddElementText.cursor = this.elementCursor;		
		ddElementText.canDragging = true;
		ddElementText.dropAudio = elemValue[4];
		if (elemValue[3] == 1){
			ddElementText.solved = false;
			ddElementText.isCorrect = true;
		}else{
			ddElementText.solved = true;
			ddElementText.isCorrect = false;
		};
		
		ddElementText.onCreate = this.onCreateText;
		ddElementText.beginDrag = this.beginDragText;
		ddElementText.endDrag = this.endDragText;
		ddElementText.onMove = this.mouseMoveText;
		ddElementText.orgZ = ddElementText.z = this.z + eval(i + 1);
		ddElementText.baseOnPaint = ddElementText.onPaint;
		ddElementText.onPaint = this._onPaint;							
		
		page.addChild(ddElementText);		
		this.texts.push( ddElementText );
		
		if (i != 0 && eval(i+1) % maxCount == 0) {
			ddelemY += ddelementHeight + 3;
		};
	};
	
	if (PageInterface.GetValue("state") != psDesigning) this.randomDDElements();	
};

componentImageWithBaskets.prototype.onCreateBasket = function(text) 
{
	this.setZIndex(this.myParent.z);
}

componentImageWithBaskets.prototype._onPaint = function() 
{
	if (this.locked) {
		if (this.solved) {
			this.setBgColor(this.myParent.elementCorrectBckColor);
		}else { 
			this.setBgColor(this.myParent.elementInCorrectBckColor);
		}
		return;
	}
	this.baseOnPaint();
}

componentImageWithBaskets.prototype.componentImageWithBasketsBaseResetElement = componentImageWithBaskets.prototype.resetElement;
componentImageWithBaskets.prototype.resetElement = function()
{
	for (var i=0; i < this.texts.length; i++) {
		this.texts[i].setBorder(this.elementBorderColor, 1);
		if (this.texts[i].isCorrect){		
			this.texts[i].solved = false;
		}else{
			this.texts[i].solved = true;			
		}
		this.texts[i].setBorder(this.elementBorderColor, 1);
		this.texts[i].insideBasketId = "";
	}
	
	this.componentImageWithBasketsBaseResetElement();
};

componentImageWithBaskets.prototype.componentImageWithBasketsBaseOnPaint = componentImageWithBaskets.prototype.onPaint;
componentImageWithBaskets.prototype.onPaint = function() 
{
	if (this.locked) return;
	
	this.componentImageWithBasketsBaseOnPaint();	
};
	
componentImageWithBaskets.prototype.onPaint = function() 
{
	this._getHTMLDef();
}

componentImageWithBaskets.prototype._getHTMLDef = function() 
{
	var s = '';
	s += '<img id="' + this.id + '_contentObj" src="' + this.resourcesURL + this.src + '" width="100%" height="100%" border="0" />';
	this.setHTML(s);
}

componentImageWithBaskets.prototype.onCreateText = function(text) 
{
	this.captureMouseEvents();
};

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

componentImageWithBaskets.prototype.onRepaint = function() 
{
	if (PageInterface.GetValue("allowCAI") && this.showCorrectAnswerIndicator)
	{
		for (var i=0; i < this.texts.length; i++) {
			if (!this.texts[i].solved) {
				if (this.showCorrectAnswerIndicator == true) {
					this.texts[i].obj.style.border = this.elementInCorrectBorderColor + " solid 1px";
					this.texts[i].obj.style.background = this.elementInCorrectBckColor;
				}
			}
			else if (this.showCorrectAnswerIndicator == true) { 
				this.texts[i].obj.style.border = this.elementCorrectBorderColor + " solid 1px";
				this.texts[i].obj.style.background = this.elementCorrectBckColor;
			}
		}
	}
};

componentImageWithBaskets.prototype.mouseMoveText = function(e) 
{
	return;
};

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

componentImageWithBaskets.prototype.playDropAudio = function(audioFile) 
{	
	if (this.enableFlashPlayer) {
		this.dropAudioComp.flashVars = "playIdx="
		+ this.getDropAudioIndex(audioFile) + "&autoStart=true&playOnce=true";
		this.dropAudioComp.show();
	} else {
		this.dropAudioComp.setUrl(this.resourcesURL + audioFile);
		this.dropAudioComp.actionMediaPlay();
	};	
};

componentImageWithBaskets.prototype.beginDragText = function() 
{
	if (this.myParent.showAnswerIndicatorAnyTime){
		this.obj.style.border = this.myParent.elementBorderColor + " solid 1px";
		this.obj.style.background = this.myParent.elementBckColor;
	};

	this.setZIndex(1000);	
};

componentImageWithBaskets.prototype.endDragText = function(e) 
{
	this.setZIndex(this.orgZ);

	var ddbasket = document.getElementById(this.destinationBasketId);
	var ddelement = document.getElementById(this.id);
	/** ddbasket.style.borderColor = "black"; */
	
	this.myParent.playDropAudio(this.dropAudio);
	
	var middlePoint = { 
		x: (ddelement.offsetLeft + ddelement.offsetWidth/2), 
		y: (ddelement.offsetTop + ddelement.offsetHeight/2)
	};
	
	//var baksets = this.myParent.content.split('||');
	var baksets = this.myParent.baskets.length;
	
	for(var i=0; i < baksets; i++){
		var ddbasket = document.getElementById(this.myParent.id+'_DDB_'+i);
		
		var left = this.myParent.findPosX(ddbasket);
		var right = left + ddbasket.offsetWidth;
		var top = this.myParent.findPosY(ddbasket);
		var bottom = top + ddbasket.offsetHeight;
		
		if ( middlePoint.x > left && middlePoint.x < right && middlePoint.y > top && middlePoint.y < bottom ) {
			this.inArea = ddbasket;
			break;
		}else this.inArea = null; 
	};
	
	if (this.inArea && !this.myParent.checkIsFilled(this, this.inArea.id)){
		this.myParent.setIntoBasket(this, ddelement, this.inArea)
	}else {
		this.myParent.moveToStart(this, ddelement);
	};
};

componentImageWithBaskets.prototype.findPosX = function (obj) {
	var curleft = 0;
	if (obj.offsetParent) {
		while (obj.offsetParent) {
			curleft += obj.offsetLeft
			obj = obj.offsetParent;
		}
	}
	else if (obj.x) {
		curleft += obj.x;
	}
	return curleft;
};

componentImageWithBaskets.prototype.findPosY = function(obj) {
	var curtop = 0;
	if (obj.offsetParent) {
		while (obj.offsetParent) {
			curtop += obj.offsetTop
			obj = obj.offsetParent;
		}
	}
	else if (obj.y) {
		curtop += obj.y;
	}
	return curtop;
};

componentImageWithBaskets.prototype.moveToStart = function(sender, elem) 
{
	if (sender.isCorrect){
		sender.solved = false;
	}else{
		sender.solved = true;
	};
	
	sender.x = sender.startX;
	sender.y = sender.startY;
	elem.style.left = sender.startX;
	elem.style.top = sender.startY;
	sender.insideBasketId = '';
};

componentImageWithBaskets.prototype.setIntoBasket = function(sender, dde, obj) 
{
	var x = sender.myParent.findPosX(obj);
	var y = sender.myParent.findPosY(obj);

	dde.style.left = x;
	dde.style.top = y;
	
	sender.x = x;
	sender.y = y;
	sender.insideBasketId = obj.id;
	sender.solved = (obj.id == sender.destinationBasketId);
};

componentImageWithBaskets.prototype.checkIsFilled = function(obj, destBasket) 
{
	for (var i=0; i < this.texts.length; i++) {
		if (this.texts[i].id != obj.id && this.texts[i].insideBasketId == destBasket){
			this.moveToStart(obj, obj);	
			return true;
		};
	};
	return false;
};

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

componentImageWithBaskets.prototype.get_random = function(from, to) {
    var ranNum = Math.floor( Math.random() * (to-from+1) ) + from;
    return ranNum;
};

componentImageWithBaskets.prototype.randomDDElements = function() 
{
	var indexes = new Array();
	var sizes = new Array();
	
	for (var i=0; i<this.texts.length; i++) {
		indexes.push(i);
		sizes.push( 
			{ 
				x: this.texts[i].x, 
				y: this.texts[i].y,
				startX: this.texts[i].startX,
				startY: this.texts[i].startY		
			}
		);
	};
	
	var randomIndexes = new Array();
	while( indexes.length != 0 ) {
		randomIndexes.push( indexes.splice( this.get_random(0, indexes.length-1),1 ) );
	};
	for (var i=0; i<this.texts.length; i++) {	
		this.texts[i].x = sizes[ randomIndexes[i] ].x;
		this.texts[i].y = sizes[ randomIndexes[i] ].y;
		this.texts[i].startX = sizes[ randomIndexes[i] ].startX;
		this.texts[i].startY = sizes[ randomIndexes[i] ].startY;
		
		this.texts[i].beginX = sizes[ randomIndexes[i] ].startX;
		this.texts[i].beginY = sizes[ randomIndexes[i] ].startY;
	};
};

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

componentImageWithBaskets.prototype.parseCheckAnswer = function(index)
{
	var result = true;
	for (var i=0; i < this.texts.length; i++) {
		if (!this.texts[i].solved) {
			if (this.returnWhenIncorrect && page.countAnswers != 0){
				this.moveToStart(this.texts[i], this.texts[i]);	
			};
			result = false;
		};
		if (this.showAnswerIndicatorAnyTime  && this.showCorrectAnswerIndicator){
			if (this.texts[i].solved){
				this.texts[i].obj.style.border = this.elementCorrectBorderColor + " solid 1px";
				this.texts[i].obj.style.background = this.elementCorrectBckColor;
			}else{
				this.texts[i].obj.style.border = this.elementInCorrectBorderColor + " solid 1px";
				this.texts[i].obj.style.background = this.elementInCorrectBckColor;
			}
		};		
	};
	return result;
};

componentImageWithBaskets.prototype.getAnswer = function()
{
	var result = '';
	var sep = '';
	for (var i=0; i < this.texts.length; i++) {
		if (result != '') sep = '#!#';
		result += sep + this.texts[i].id +'||'+this.texts[i].insideBasketId;
	}
	return(result);
};

componentImageWithBaskets.prototype.setAnswer = function(valStr, showCorrect)
{
	if ((typeof(valStr) == 'undefined' || valStr == '') && !showCorrect) return;
	if (valStr == '' && (typeof(showCorrect) == 'undefined' || showCorrect.toString() == '')) showCorrect = true;
	
	if (!showCorrect){
		var splited = valStr.split('#!#');
		for (var i=0; i < splited.length; i++){
			var elem = splited[i].split('||');
			var ddelement = document.getElementById(elem[0]);
			var ddbasket = document.getElementById(elem[1]);
			var j = -1;
			
			do{
				j++;
			}while (this.texts[j].id != elem[0] && j < this.texts.length)
			
			page.setOnTop(this.texts[j]);
			this.texts[j].setBorder(this.elementBorderColor, 1);	
			if (ddbasket) {
				this.setIntoBasket(this.texts[j], ddelement, ddbasket);		
			}
		};
	}else{
		var tempArr = new Array();
		for (var i=0; i < this.texts.length; i++) {
			var ddelement = document.getElementById(this.texts[i].id);
			var ddbasket = document.getElementById(this.texts[i].destinationBasketId);
			
			if (ddbasket && ddelement)
				this.setIntoBasket(this.texts[i], ddelement, ddbasket);
			
			this.texts[i].setBorder(this.elementBorderColor, 1);	
		};
	};
	this.onRepaint();		
};

componentImageWithBaskets.prototype.onLock = function() {
	for (var i=0; i < this.texts.length; i++) {
		this.texts[i].canDragging = false;
		this.texts[i].locked = true;
	};
};

componentImageWithBaskets.prototype.onUnLock = function() {
	for (var i=0; i < this.texts.length; i++) {
		this.texts[i].canDragging = true;
		this.texts[i].locked = false;
	};
};

componentImageWithBaskets.prototype.interactionsCorrectResponsesCount = function()
{
	return 1;
};

componentImageWithBaskets.prototype.interactionsCorrectResponses = function(index)
{
	var result = '';
	var sep = '';
	for (var i=0; i < this.texts.length; i++) {
		if (result != '') sep = '#!#';
		result += sep + this.texts[i].id +'||'+this.texts[i].destinationBasketId; 
	}
	return(result);
};

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

componentImageWithBaskets.prototype.interactionsCorrectResponsesAsText = function(index)
{
	var result = '';
	var sep = '';
	for (var i=0; i < this.texts.length; i++) {
		if (result != '') sep = '#!#';
		result += sep + this.texts[i].id +'||'+this.texts[i].destinationBasketId; 
	}
	return(result);
};

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