/* 2a-T2 test template
 * requires:
 * jquery.js
 * jquery.ui.js draggable
 */
console.log('> template2a.js is iniciated;');

function template2ascript() {	
	console.log("function template2ascript(); sectionName=" +sectionName + "; slideName=" +slideName);
	
         tObj = getObject();
    
        var mainVars = initMainVars(tObj,sectionName,slideName);
        var tO = mainVars.tO;         	
        var f_items = tO['f_items'];			console.log("f_items:");	console.log(f_items);
        var m_items = tO['m_items'];			console.log("m_items:");	console.log(m_items);
        //var tO = tObj[sectionName][slideName]; 	console.log("tObj:"); 		console.log(tObj);
	
	// count items
	var itemsCount = Object.keys(f_items).length; 	console.log('items count: ' +itemsCount);
	
	// depending on items number, f background and text widths are different
	var back_widths ={
		3: 354,
		4: 260,
		5: 204
	}
	var text_widths ={
		3: 318,
		4: 224,
		5: 168
	}
	
	// select background image width according images number
	var backWidth = back_widths[itemsCount];			console.log('back_width:' + backWidth);
	var textWidth = text_widths[itemsCount];			console.log('textWidth:' + textWidth);
	
	// write background images according items number itemsCount
	tO['f_background_image'] = "img/test_f"+itemsCount+".png";
	tO['m_background_image'] = "img/test_m"+itemsCount+".png";
	tO['f_background_image_white'] = "img/test_f"+itemsCount+"_w.png";
	tO['m_background_image_white'] = "img/test_m"+itemsCount+"_w.png";
	
	var i = 0;
	var zIndexChange =20;
	
        if (tO['background']) {
		loadSlideBackground();
	}
        
        
	// randomise images order
	var randPlaces = randomArray(itemsCount);
	function rand_m_items() {
		var newOrder = {};
		randPlaces.forEach(function(e){
			newOrder['m_item_'+i] = m_items['m_item_'+e]; // get images in new places by randPlaces set
			i++;
		});
		console.log(newOrder);
		// change real items with random
		m_items = newOrder;
	};
	rand_m_items();
	
	var f_p = {
		name	: 'f',	// name of item
		end :{
			top : 131,
			left : 30,
		},
		image:{
			css	:{
				"position":"absolute",
				'width': backWidth+'px',
				'height':'454px',
				"background": "",
				'top':'0px',
				'left':'0px',
				//"cursor": "move",
				"z-index": "6"
			}
		},
		text:{
			css	:{
				main	:{
					"position":"absolute",
					'width': backWidth+'px',
					'height':'454px',
					'top':'0px',
					'left':'0px',
					//"cursor": "move",
					"z-index": "6"
				},
				background	:{
					"position":"absolute",
					'width': backWidth+'px',
					'height':'240px',
					"background":"url(" + tO['f_background_image_white'] + ") no-repeat 0px 0px",
					'top':'0px',
					'left':'0px',
					"z-index": "6"
				},
				text:{
					"position":"absolute",
					'padding':"16px 16px",
					'width': textWidth+'px',
					'height':'174px',
					'top':'2px',
					'left':'2px',
					"z-index": "6",
					'text-indent':'0px',
					'font-family':'Arial',
					'font-size': '17px',
					'line-height': '23px'
				},
			}
		}
	}
	
	f_p.image.css.background = function(){
		return "  url("+ f_items['f_item_'+i] +") no-repeat 2px 2px, url(" + tO['f_background_image'] + ") no-repeat 0px 0px";
	}
	
	var m_p = {
		name	: 'm',	// name of item
		end :{
			top : 380,
			left : 30,
		},
		image:{
			css	:{
				"position":"absolute",
				'width': backWidth+'px',
				'height':'240px',
				"background": "",
				'top':'140px',
				'left':'30px',
				"cursor": "move",
				"z-index": "6"
			}
		},
		text:{
			css	:{
				main	:{
					"position":"absolute",
					'width': backWidth+'px',
					'height':'240px',
					'top':'140px',
					'left':'30px',
					"cursor": "move",
					"z-index": "10"
				},
				background	:{
					"position":"absolute",
					'width': backWidth+'px',
					'height':'240px',
					"background":"url(" + tO['m_background_image_white'] + ") no-repeat 0px 0px",
					'top':'0px',
					'left':'0px',
					//"cursor": "move",
					"z-index": "6"
				},
				text:{
					"position":"absolute",
					'padding':"16px 16px",
					'width': textWidth+'px',
					'height':'174px',
					'top':'33px',
					'left':'2px',
					"z-index": "7",
					'text-indent':'0px',
					'font-family':'Arial',
					'font-size': '17px',
					'line-height': '23px'
				},
				wrong:{
					"position":"absolute",
					'padding':"16px 16px",
					'width': +textWidth -6 +'px',
					'height':'169px',
					'top':'32px',
					'left':'2px',
					"z-index": "7"
				},
			}
		}
	}
	
	m_p.image.css.background = function(){
		return "  url("+ m_items['m_item_'+i] +") no-repeat 2px 32px, url(" + tO['m_background_image'] + ") no-repeat 0px 0px";
	}

	//  get true - correct ; or falls - incorrect
	this.checkAnswer = checkTestAnswer_2a;
	// check buttton and function to check
	checkTestButton(this.checkAnswer,tO,null,randPlaces,backWidth,itemsCount);
	
	loadSlideBackground();
	appendQuestion(ssId, ss, tO, 2);
	i = 0;
	append_items_2a('f',f_items,f_p,m_p,backWidth);
	i = 0;
	append_items_2a('m',m_items,f_p,m_p,backWidth);
	
        var clname = "."+sectionName+slideName + "m_items_2a";
        image_mDraggable(clname,ssId,zIndexChange,2);
	
	        
    function append_items_2a(f_or_m,items,f_p,m_p,backWidth) {			// level 1 function		// append f or m all items
		for (item in items) {
			console.log(f_or_m+" item: " +item +'; ' + items[item] +'; i:' +i);
			append_one_item(f_or_m,item,items,f_p,m_p,backWidth);//f_or_m,item,items,f_p,m_p,backWidth
			i++;// needed for background images
		}
		
	}	
}