var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var tagsArray_arr = new Array();
var cfcProxyJSON;
var professionsAPI;
var t ;
var timedMethodArguments_obj;
var tagReferences_obj = new Object();

// This is to shorten the Dom.get to just get()
function get(str)
{
	return Dom.get(str);
}

Event.on("search", "submit", preventFormSubmit);

function preventFormSubmit(e)
{
	Event.preventDefault(e);
}

Event.onDOMReady(function(){
	
	Dom.addClass(document.body, 'js-on');
	Dom.removeClass(Dom.getElementsByClassName('show-on-js'), 'show-on-js');


	initJSONProxy();

	if(get('tagDescription')) { // zoek pagina
		// get('tagDescription').focus()
		setTagDescriptionFieldListener();
		initTagDescriptionInput();
		initCurrentTags();
		initButtons();
		showTranslateButton();
		initRelatedSuggestionsDisplay();
		addTagRemovelisteners();
		if(talent) {
			initWithSuggestion(talent);
		}
	}

	if(get('results')) {
		initProfessionReader();
		initTalentDisplay();
	}
});

function initTagDescriptionInput() {
	var input = get('tagDescription');

	Event.on(input, 'focus', function() {
		if(this.value == this.alt) {
			this.value = '';
			Dom.removeClass(this, 'tagDescriptionDefault');
		}
	});

	Event.on(input, 'blur', function() {
		if(this.value == '') {
			this.value = this.alt;
			Dom.addClass(this,'tagDescriptionDefault');
		}
	});
}

function initProfessionReader() {
	var professions = Dom.getElementsByClassName('profession');
	var scrollContent = Dom.get('scrollContent');
	
	Event.on(professions, 'click', showProfessionContent);

	var documentScrollTop, 
		scrollContentTop = Dom.getRegion(scrollContent).top;
	
	Event.on('hideProfession', 'click', hideProfessionContent);
	Event.on(window, 'scroll', function() {
		documentScrollTop = Dom.getDocumentScrollTop();
		if(documentScrollTop >= scrollContentTop) {
			var myAnim = new YAHOO.util.Anim(scrollContent, { top: {to: (documentScrollTop - scrollContentTop) } }, .2, YAHOO.util.Easing.easeOutStrong); 
		} else {
			var myAnim = new YAHOO.util.Anim(scrollContent, { top: {to: 0 } }, .2, YAHOO.util.Easing.easeOutStrong); 
		}
		myAnim.animate();
	});
}

function showProfessionContent() {
	if(Dom.hasClass(this, 'selected')) {
		hideProfessionContent();
	} else {
		Dom.removeClass('detailHolderContainer', 'hidden');
		Dom.removeClass(Dom.getElementsByClassName('selected'), 'selected');

		Dom.addClass(this, 'selected');	
		// Dom.addClass('external-links', 'hidden');
		
		var detailHolder = get('detailHolder');
		detailHolder.innerHTML = this.innerHTML;

		// align close button
		var resultDescriptionContainer = Dom.getElementsByClassName('resultlist')[1]; // resultlist[1] is resultlist on the right
		var containerTop_int = Dom.getRegion(resultDescriptionContainer).top; // 
		var descriptionTop_int = Dom.getRegion(Dom.getElementsByClassName('description', null, resultDescriptionContainer )[0]).top; // 
		var titleHeight =  descriptionTop_int - containerTop_int;

		Dom.setStyle('hideProfession', 'top', (titleHeight / 2) - 13-6.5 + 'px')
		
	}
}

function hideProfessionContent() {
	Dom.addClass('detailHolderContainer', 'hidden');
	Dom.removeClass(Dom.getElementsByClassName('selected'), 'selected');
	// Dom.removeClass('external-links', 'hidden');
	Dom.removeClass(this, 'selected');
}

// IE geeft een opmaak aan elementen die disabled zijn, dit is niet gewenst
// In het geval van IE het disabled attribuut dus verwijderen en het default event voorkomen
function initButtons() {
		if(BrowserDetect.browser == 'Explorer') {	
			var el = get('resetDiv').getElementsByTagName("button");
			for(var i = 0; i < el.length; i++)
			{
					el[i].removeAttribute('disabled');
					disableButton(el[i].id);
			}
		}
}

function disableButton(obj) {
	btn_obj = get(obj);
	Dom.addClass(btn_obj,'disabled');
	if(BrowserDetect.browser == 'Explorer') {
		Event.addListener(btn_obj,'click',preventDefault);
	}
	else {
		btn_obj.setAttribute('disabled','disabled');
	}
}

function enableButton(obj) {
	btn_obj = get(obj);
	Dom.removeClass(btn_obj,'disabled');
	btn_obj.disabled = "";
	if(BrowserDetect.browser == 'Explorer') {
		Event.removeListener(btn_obj,'click',preventDefault);
	}
	else {
		btn_obj.removeAttribute('disabled');
	}
}

function preventDefault(e) {
	Event.preventDefault(e);
}



function showTranslateButton() {
	if(get("tagBoxList")){
		var arr = get("tagBoxList").getElementsByTagName("input");
		if(arr.length) {
			enableButton('btnTranslate');
		}
	}
}

function setTagDescriptionFieldListener()
{
	Event.addListener("tagDescription", "keyup", tagDescriptionKeyUpHandler);
	Event.addListener("tagDescription", "keydown", tagDescriptionKeyDownHandler);
	Event.addListener("bodyContainer", "click", hideSuggestionBox);
}

function hideSuggestionBox(e) {
	//Verberg met timeout, anders is de suggestielijst al weg voor dat de onclick uitgevoerd kan worden
	if(get("suggestionBox")){
		setTimeout('get("suggestionBox").style.display = "none"',250)
		Dom.removeClass("tagDescriptionContainer","rf-shadow-new");
	}
}

function quickHideSuggestionBox(e) {
	if(get("suggestionBox")){
		get("suggestionBox").style.display = "none";
		Dom.removeClass("tagDescriptionContainer","rf-shadow-new");
	}
}

var currentSearchValue = '';
function tagDescriptionKeyUpHandler(e)
{
	if(e.keyCode == 27) // escape
	{
		quickHideSuggestionBox();
	} 
	else if (this.value.length > 1)
	{
		if (e.keyCode == 13){ // enter
			selectSuggestion();
		}
		else if(e.keyCode != 38 && e.keyCode != 40 && currentSearchValue != this.value) {
			clearTimeout(t);
			timedMethodArguments_obj = new Object();
			var uniqueKey_str = new Date().getTime().toString();
			timedMethodArguments_obj[uniqueKey_str] = {method: getAutoCompleteTags,
			arguments: [this.value]};
			
			// timeout verhoogd van 300ms naar 800ms om server-flood te voorkomen - Jorijn
			t = setTimeout("handleTimer('" + uniqueKey_str + "')", 800);
		}
	} else if(e.keyCode != 38 && e.keyCode != 40) {
		quickHideSuggestionBox();
	}

	currentSearchValue = this.value;
}

function tagDescriptionKeyDownHandler(e) {
	if(e.keyCode == 38) { // up arrow
		handleArrowUp();
	}
	else if (e.keyCode == 40){ // down arrow
		handleArrowDown();
	}
}

function selectSuggestion() {
	var node = Dom.getElementsByClassName('ac_selected');
	if(node.length == 1) {
		ahref = node[0].getElementsByTagName('a')[0];
		
		var suggestionContainer_obj = get("tagBoxContainer");
		var btnTranslate_obj = get("btnTranslate");
		suggestionContainer_obj.className = "wizard-step2";
		
		displayExplanation(false);
		
		enableButton('btnTranslate');
	
		var professionId_str = ahref.className;
		var professionDescription_str = ahref.innerHTML;
		var tagsItem_obj = {
			id :professionId_str,
			description :professionDescription_str
		};
		tagsArray_arr.push(tagsItem_obj);
		tagAdded();
		setTagBox();
		Dom.removeClass("tagDescriptionContainer","rf-shadow-new");
	}
}


function handleArrowUp() {
	var node = Dom.getElementsByClassName('ac_selected');
	var list = get('suggestionBoxList');

	if(!list) return false;

	var arr = list.getElementsByTagName('li');
	var setPrevious = false;

	if(node.length == 0) {
		arr[arr.length-1].className = 'ac_selected';
	}
	else {
		node = node[0];
		node.className = '';
		var prevNode = Dom.getPreviousSibling(node) || Dom.getLastChild(list);
		prevNode.className = 'ac_selected';
		
		var item_int = prevNode.getAttribute('alt');
		var selectedTop = list.getAttribute('alt') * 32;
		var scrollTop = list.scrollTop;

		if((selectedTop - scrollTop - 32) < 32) {
			var myAnim = new YAHOO.util.Scroll(list, {
				scroll: {
					to: [ 0, (item_int * 32) ]
				} 
			},.1).animate();
		}

		list.setAttribute('alt', item_int);
	}
}

function handleArrowDown() {
	var node = Dom.getElementsByClassName('ac_selected');
	var list = get('suggestionBoxList');
	
	if(!list) return false;

	var arr = list.getElementsByTagName('li');
	var setNext = false;
	
	if(node.length == 0) {
		arr[0].className = 'ac_selected';
	}
	else {
		node = node[0];
		node.className = '';
		var nextNode = Dom.getNextSibling(node) || Dom.getFirstChild(list);
		nextNode.className = 'ac_selected';
		
		var item_int = nextNode.getAttribute('alt');
		var selectedTop = list.getAttribute('alt') * 32;
		var scrollTop = list.scrollTop;

		if( (item_int * 32) >= (scrollTop + (5 * 32)) ) {
			var myAnim = new YAHOO.util.Scroll(list, {
				scroll: {
					to: [ 0, (item_int * 32 - (5 * 32) ) ]
				} 
			},.1).animate();
		} else if(item_int == 0) {
			var myAnim = new YAHOO.util.Scroll(list, {
				scroll: {
					to: [ 0, 0 ]
				} 
			},.1).animate();
		}

		list.setAttribute('alt', item_int);
	}
}

function scrollListTo(scrollTop) {
	
}

function handleTimer(uniqueKey_str) {
	var info_obj = timedMethodArguments_obj[uniqueKey_str];
	info_obj.method.apply(this, info_obj.arguments);
}

function activateTextField() {
	if (get("tagDescription"))
	{
		get("tagDescription").style.display = "inline";
	}
}

function getActualResult(o)
{
	return eval("(" + o.responseText + ")");
}

function initJSONProxy()
{
	cfcProxyJSON = new fly.CFCProxyJSON();
	cfcProxyJSON.init("none", {
		success :handleSettingsSuccess,
		failure :handleFailure
	}, "/");
}

function handleFailure(o)
{
	alert("Error occurred while calling cfcProxyJSON.init()");
}

function handleSettingsSuccess(o)
{
	professionsAPI = cfcProxyJSON
			.getService("fly.TICC2.modules.professions.ProfessionsAPI");
	activateTextField();
}

function getAutoCompleteTags(searchString)
{
	setLoader();
	
	var callback_obj = {
		success :getAutoCompleteTagsResult,
		failure :handleFailure,
		scope :this
	}
	var suggestionVO = new Object();
	suggestionVO.__type__ = "fly.TICC2.modules.professions.VOs.SuggestionVO";
	suggestionVO.suggestionSearchString = searchString;
	suggestionVO.approved = 1;
	
	var queryVO = new Object();
	queryVO.__type__ = "fly.DAOs.VOs.QueryVO";
	queryVO.OrderBy = "LEN(Tags_description) ASC";
	
	var arguments_obj = {
		suggestionVO :suggestionVO,
		queryVO :queryVO
	}

	if(typeof(professionsAPI) != "undefined") {
		professionsAPI.callMethod("getAutoCompleteTagsAsArray", callback_obj, arguments_obj);
	} else {
		setTimeout(function(){getAutoCompleteTags(searchString)}, 500);
	}
}

function setLoader() {
	//Region itagDescription input bepalen
	var inputRegion = Dom.getRegion('tagDescription');
	var y = inputRegion.bottom;
	var x = inputRegion.left;
	
	
	
	var suggestionContainer_obj = get("suggestionBox");
	Dom.setStyle(suggestionContainer_obj,'top',y-74+'px');	// nu nog maar even zo, wachten op definitieve design
	var innerHtmlSting_str = "";

	// suggestionContainer_obj.style.display = "block";
	Dom.addClass("tagDescriptionContainer","rf-shadow-new");

	innerHtmlSting_str = innerHtmlSting_str + "<div class='rf-shadow-new'></div>"; 
	innerHtmlSting_str = innerHtmlSting_str + "<div class='loader'><img src='assets/images/ajax-loader.gif' /></div>";
	
	suggestionContainer_obj.innerHTML = innerHtmlSting_str;
}

function getAutoCompleteTagsResult(o)
{
	var result_obj = getActualResult(o);
	if (result_obj.error)
	{
		alert("Het is momenteel niet mogelijk suggesties op te halen, probeert u het later nog eens.");
		return;
	}
	var items_arr = result_obj.data;
	
	if(get("tagDescription").value.length > 1) {
		setSuggestionBox(items_arr);
	} else {
		quickHideSuggestionBox();
	}
}

function checkIfAdded(modus, items, items_arr_index)
{
	if(modus == "objectMode") {
		
		for ( var j = 0; tagsArray_arr.length > j; j++)
		{
			if (!items[items_arr_index].ID.indexOf(tagsArray_arr[j].id))
			{
				return true;
				break;
			}
		}
		return false;

	} else if(modus == "stringMode") {
		for ( var j = 0; tagsArray_arr.length > j; j++)
		{
			if (!items.indexOf(tagsArray_arr[j].id))
			{
				return true;
				break;
			}
		}
		return false;
	}
}

function setSuggestionBox(items_arr)
{
	//Region itagDescription input bepalen
	var inputRegion = Dom.getRegion('tagDescription');
	var y = inputRegion.bottom;
	var x = inputRegion.left;
	
	var suggestionContainer_obj = get("suggestionBox");
	Dom.setStyle(suggestionContainer_obj,'top',(y-74)+'px');	// nu nog maar even zo, wachten op definitieve design 408 
	var innerHtmlSting_str = "";
	
	if (items_arr.length > 0)
	{
		innerHtmlSting_str = innerHtmlSting_str + "<div class='rf-shadow-new'></div><ul id='suggestionBoxList'>";
		Dom.addClass("tagDescriptionContainer","rf-shadow-new");
		suggestionContainer_obj.style.display = "block";
		for ( var i = 0; items_arr.length > i; i++)
		{
			var compareBool_bool = checkIfAdded("objectMode", items_arr, i);
			if (!compareBool_bool)
			{
				innerHtmlSting_str = innerHtmlSting_str
						+ "<li alt=" + i + "><a href='/' class='"
						+ items_arr[i].ID
						+ "'><em>"
						+ items_arr[i].description + "</em></a></li>";
			}
		}
		innerHtmlSting_str = innerHtmlSting_str + "</ul>";
		suggestionContainer_obj.innerHTML = innerHtmlSting_str;
		setAddSuggestionHandler();
	} else
	{
		suggestionContainer_obj.style.display = "block";
		Dom.addClass("tagDescriptionContainer","rf-shadow-new");

		innerHtmlSting_str = innerHtmlSting_str + "<div class='rf-shadow-new'></div>"; 
		innerHtmlSting_str = innerHtmlSting_str + "<div class='nodata'><h1>De <span class='text-color-red'>Talentenvertaler</span> kan ";
		innerHtmlSting_str = innerHtmlSting_str + "dit talent nog niet vinden in de database</h1>";
		innerHtmlSting_str = innerHtmlSting_str + "<ul>";
		innerHtmlSting_str = innerHtmlSting_str + "<li><span class='number'>1</span> Probeer een deel van het woord dat je bedoelt. Kijk bij de suggestie eronder.</li>"
		innerHtmlSting_str = innerHtmlSting_str + "<li><span class='number'>2</span> Probeer een andere omschrijving van je talent.</li>"
		innerHtmlSting_str = innerHtmlSting_str + "<li><span class='number'>3</span> Controleer de spelling.</li>"
		innerHtmlSting_str = innerHtmlSting_str + "</ul>"
		innerHtmlSting_str = innerHtmlSting_str + "</div>";
		
		suggestionContainer_obj.innerHTML = innerHtmlSting_str;
	}
}

function tagAdded()
{
	get("tagDescription").value = "";
	get("suggestionBox").innerHTML = "";

	updateRelatedSuggestions();
	updateProfessionCount();
}

function setAddSuggestionHandler()
{
	var elements_arr = Dom.get("suggestionBoxList").getElementsByTagName("a");
	Event.addListener(elements_arr, "click", addSuggestionToList);
	Event.addListener(elements_arr, "click", iwaTrigger.addTalentViaSearch);
	Event.addListener(elements_arr, "mouseover", selectedAutoComplete);
}

function selectedAutoComplete(e) {
	//huidige selectie verwijderen
	var node = Dom.getElementsByClassName('ac_selected');
	if(node.length == 1) node[0].className = '';
	//nieuwe toevoegen
	this.parentNode.className = 'ac_selected';
}

function addSuggestionToList(e)
{
	Event.preventDefault(e);

	var input_el = get('tagDescription');
	Dom.addClass(input_el,'tagDescriptionDefault');
	setTimeout(function(){input_el.value = input_el.alt;},0)


	var suggestionContainer_obj = get("tagBoxContainer");
	var btnTranslate_obj = get("btnTranslate");
	suggestionContainer_obj.className = "wizard-step2";
	
	displayExplanation(false);
	
	enableButton('btnTranslate');

	var professionId_str = this.className;
	var professionDescription_str = this.innerHTML;
	var tagsItem_obj = {
		id :professionId_str,
		description :professionDescription_str
	};
	
	stripHTML(tagsItem_obj.description)
	
	tagsArray_arr.push(tagsItem_obj);
	tagAdded();
	setTagBox();
	Dom.removeClass("tagDescriptionContainer","rf-shadow-new");
}

function setTagBox()
{
	var innerHtmlSting_str = "";
	innerHtmlSting_str = innerHtmlSting_str + "<ul class='talents' id='tagBoxList'>";
	for ( var i = 0; tagsArray_arr.length > i; i++)
	{
		innerHtmlSting_str = innerHtmlSting_str + "<li><input type='hidden' value='"+ tagsArray_arr[i].id + "' id='frmTagProfileIDs" + tagsArray_arr[i].id + "' name='frmTagProfileIDs' />";
		innerHtmlSting_str = innerHtmlSting_str + "<strong>" + stripHTML(tagsArray_arr[i].description) + "</strong>";
		innerHtmlSting_str = innerHtmlSting_str + "<a title='Verwijder dit talent' href='?fuseaction=removeTagFromProfile&Tag_ID=" + tagsArray_arr[i].id + "' class='remove'><span>Verwijder talent</span></a></li>";
		
	}
	
	//Aanvullen tot minimaal 4 items
	var fillItems = 4 - tagsArray_arr.length;
	for ( var i = 0; fillItems > i; i++)
	{
		innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li>";
	}
	//4 of meer items dan extra blok toevoegen
	if(tagsArray_arr.length >= 4) { innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li>"; } 
	innerHtmlSting_str = innerHtmlSting_str + "</ul>";
	get("tagBox").innerHTML = innerHtmlSting_str;
	addTagRemovelisteners();
}

function addTagRemovelisteners()
{
	var elements_arr = Dom.get("tagBoxList").getElementsByTagName("a");
	Event.addListener(elements_arr, "click", removeTagFromList);
	Event.addListener(elements_arr, "click", iwaTrigger.onRemoveTalentClick);
}

function removeTagFromList(e)
{

	Event.preventDefault(e);
	for ( var k = 0; tagsArray_arr.length > k; k++)
	{
		if (!tagsArray_arr[k].id.indexOf(this.parentNode.getElementsByTagName("input")[0].value))
		{
			tagsArray_arr.splice(k, 1);
		}
	}
	if (tagsArray_arr.length == 0)
	{
		var innerHtmlSting_str = "<ul class='talents' id='tagBoxList'>";
		innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li>";
		innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li>";
		innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li>";
		innerHtmlSting_str = innerHtmlSting_str + "<li class='dummy'><span>&nbsp;</span></li></ul>";
		
		get("tagBox").innerHTML = innerHtmlSting_str;
		var suggestionContainer_obj = get("tagBoxContainer");
		suggestionContainer_obj.className = "wizard-step2 disabled hidden";
		
		displayExplanation(true);

		disableButton('btnTranslate');
	} else
	{
		setTagBox();
	}
	if (get("suggestionBoxList"))
	{
		getAutoCompleteTags(get("tagDescription").value);
	}
	
	updateRelatedSuggestions();
	updateProfessionCount();
}

function initCurrentTags()
{
	if (get("professionsList"))
	{
		currentItems_arr = get("professionsList").getElementsByTagName("li");
		for ( var i = 0; currentItems_arr.length > i; i++)
		{
			if (currentItems_arr[i].className.indexOf("divider"))
			{
				var professionId_str = currentItems_arr[i]
						.getElementsByTagName("input")[0].value;
				var professionDescription_str = currentItems_arr[i]
						.getElementsByTagName("span")[0].innerHTML;
				var tagsItem_obj = {
					id :professionId_str,
					description :professionDescription_str
				};
				tagsArray_arr.push(tagsItem_obj);
			}
		}
		setTagBox();
	}
}

//Vanuit een banner gelijk starten met een talent
function initWithSuggestion(suggestion) {
	var descr = get('tagDescription');
	Dom.removeClass(descr,'tagDescriptionDefault');
	descr.value = suggestion;
	descr.focus();
	
	clearTimeout(t);
	timedMethodArguments_obj = new Object();
	var uniqueKey_str = new Date().getTime().toString();
	timedMethodArguments_obj[uniqueKey_str] = {
		method: getAutoCompleteTags,
		arguments: [suggestion]
	};
	t = setTimeout("handleTimer('" + uniqueKey_str + "')", 300);
}

function stripHTML(oldString) {

   var newString = "";
   var inTag = false;
   for(var i = 0; i < oldString.length; i++) {
   
        if(oldString.charAt(i) == '<') inTag = true;
        if(oldString.charAt(i) == '>') {
              if(oldString.charAt(i+1)=="<")
              {
              		//dont do anything
		}
		else
		{
			inTag = false;
			i++;
		}
        }
        if(!inTag) newString += oldString.charAt(i);
   }

   return newString;
}

function initRelatedSuggestionsDisplay()
{
	var relatedSuggestions = get("relatedSuggestions");
	
	var tagList = relatedSuggestions.getElementsByTagName("span")[0].getElementsByTagName("a");
	
	if (tagList.length)
	{
		Dom.removeClass(relatedSuggestions, "hidden");
	} else
	{
		Dom.addClass(relatedSuggestions, "hidden");
	}

	Event.on(relatedSuggestions.getElementsByTagName('a'), 'click', function(event) {
		Event.preventDefault(event);
		initWithSuggestion(this.innerHTML);
	});
}

function getTagIDString()
{
	var tagIDs = [];
	for (var i = 0; i < tagsArray_arr.length; i++)
	{
		tagIDs.push(tagsArray_arr[i].id);
	}
	
	return tagIDs.join(",");
}

function updateRelatedSuggestions()
{
	
	var VO = new Object();
	VO.__type__ = "fly.TICC2.modules.professions.VOs.FilterVO";
	VO.itemIDs = getTagIDString();                   
	var arguments_obj = {
	      VO: VO
	}

	var callback_obj = {
		success :updateRelatedSuggestionsResult,
		failure :handleFailure,
		scope :this
	}
	
	professionsAPI.callMethod("getSuggestedTagsAsArray", callback_obj, arguments_obj);
}

function updateRelatedSuggestionsResult(o)
{
	var result_obj = getActualResult(o);
	if (result_obj.error)
	{
		alert("Het is momenteel niet mogelijk suggesties op te halen, probeert u het later nog eens.");
		return;
	}
	
	var items_arr = result_obj.data;
	
	var relatedSuggestions = get("relatedSuggestions");
	
	var tagListContainer = relatedSuggestions.getElementsByTagName("span")[0];

	var innerHtml_str = "";
	for (var i = 0; i < items_arr.length; i++)
	{
		var item = items_arr[i];
		if (i)
		{
			innerHtml_str += ', ';
		}
		innerHtml_str += '<a href="index.cfm?fuseaction=searchTag&amp;tagDescription=' + item.description + '">' + item.description + '</a>';
	}
	innerHtml_str += '..';
	tagListContainer.innerHTML = innerHtml_str;

	initRelatedSuggestionsDisplay();
}

function updateProfessionCount()
{
	if (tagsArray_arr.length)
	{
		var VO = new Object();
		VO.__type__ = "fly.TICC2.modules.professions.VOs.FilterVO";
		VO.itemIDs = getTagIDString();                   
		var arguments_obj =     {
		      VO: VO
		}
	
	 	var callback_obj = {
			success :updateProfessionCountResult,
			failure :handleFailure,
			scope :this
		}
	
		professionsAPI.callMethod("getProfessionsForTagCount", callback_obj, arguments_obj);
	} else
	{
		Dom.addClass("professionCount", "hidden");
	}
}

function updateProfessionCountResult(o)
{
	var result_obj = getActualResult(o);
	if (result_obj.error)
	{
		alert("Het is momenteel niet mogelijk suggesties op te halen, probeert u het later nog eens.");
		return;
	}
	var item_obj = result_obj.data;
	
	Dom.removeClass("professionCount", "hidden");

	get("numberOfProfessions").innerHTML = item_obj.total || 0;
	get("numberOfProfessionsExact").innerHTML = item_obj.exact || 0;

	// define plural text
	var txtTalenten = Dom.getElementsByClassName('text-talenten');
	var txtLeveren = Dom.getElementsByClassName('text-leveren')[0];
	var txtBeroepenSuggesties = Dom.getElementsByClassName('text-beroepensuggesties')[0];
	var txtBeroepen = Dom.getElementsByClassName('text-beroepen')[0];
	var txtMatchen = Dom.getElementsByClassName('text-matchen')[0];
	var txtJouw = Dom.getElementsByClassName('text-jouw')[0];

	for(var i = 0; i < txtTalenten.length; i++) {
		txtTalenten[i].innerHTML = (tagsArray_arr.length  != 1) ? 'talenten' : 'talent';
	}

	var hideWhenNoExactMatches_elements = Dom.getElementsByClassName('hideWhenNoProfessionsFound');
	var showWhenNoExactMatches_elements = Dom.getElementsByClassName('showWhenNoProfessionsFound');
	if(item_obj.exact == 0) {
		Dom.addClass(hideWhenNoExactMatches_elements, 'hidden');
		Dom.removeClass(showWhenNoExactMatches_elements, 'hidden');
	} else {
		Dom.removeClass(hideWhenNoExactMatches_elements, 'hidden');
		Dom.addClass(showWhenNoExactMatches_elements, 'hidden');
	}

	txtLeveren.innerHTML = (tagsArray_arr.length  != 1) ? 'leveren' : 'levert';
	txtBeroepenSuggesties.innerHTML = (item_obj.total  != 1) ? 'beroepensuggesties' : 'beroepensuggestie';
	txtBeroepen.innerHTML = (item_obj.exact  != 1) ? 'beroepen' : 'beroep';
	txtMatchen.innerHTML = (item_obj.exact  != 1) ? 'matchen' : 'matcht';
	txtJouw.innerHTML = (tagsArray_arr.length  != 1) ? 'alle' : 'jouw';
}

function displayExplanation(show) {
	var explanation_obj = get("explanation");
	if (explanation_obj)
	{
		explanation_obj.className = show ? "" : "hidden";
	}
}

function initTalentDisplay() {
	var moreTalents_obj = get("moreTalents");
	if (moreTalents_obj)
	{
		Dom.removeClass(moreTalents_obj, "hidden");
		var allTalents_obj = get("allTalents");
		Dom.addClass(allTalents_obj, "hidden");
		
		Event.on("showAllTalents", "click", function(e) {
			Event.preventDefault(e);
			Dom.removeClass(allTalents_obj, "hidden");
			Dom.addClass(moreTalents_obj, "hidden");
		});
	}
}

