var list = new Array;
var dd = 0, tdd=0;
var SEARCH_URL = WebSpyPro_UrlRoot + 'projects/keywords/';
var TAG_URL    = WebSpyPro_UrlRoot + 'projects/tags/';
var MAX_ELEMS = 39;
var GROUP_COUNT = 13;
//var MAX_ELEMS = 6;
//var GROUP_COUNT = 3;

function main() {
	$("#ProjectProjects").change(refresh_all);
	$("#ProjectEngines").change(refresh_all);

	$(".keywords_closer").click(close_keywords);
	show_hide_keywords_closer();
	refresh_tags();
	refresh_keywords();
}

function refresh_all() {
	refresh_keywords();
	refresh_tags();
}

function refresh_keywords() {
	var dt = new Date;
	var url = SEARCH_URL;
	if ($("#ProjectProjects")[0].value > 0)
		url += $("#ProjectProjects")[0].value + '/';
	else
		url += '0/';

	if ($("#ProjectEngines")[0].value != 'all')
		url += $("#ProjectEngines")[0].value + '/';

	$("#keywords").html("<img src='" + WebSpyPro_UrlRoot + 'img/indicator.gif' + "'/>");
	$.getJSON(url + '?t=' + dt.getTime(), {}, function(data, status) {
 	    if (data && data.length > 1) {
			dd = createDropDown($("#keywords"), data, MAX_ELEMS, selection_changed, 
								dropdown_active, dropdown_inactive); 
			update_value();
		} else {
			$("#keywords").html("No keywords");
			dd = 0;
		}
	});
}

function refresh_tags() {
	var dt = new Date;
	var url = TAG_URL;
	if ($("#ProjectProjects")[0].value > 0)
		url += $("#ProjectProjects")[0].value + '/';

	$("#tags").html("<img src='" + WebSpyPro_UrlRoot + 'img/indicator.gif' + "'/>");
	$.getJSON(url + '?t=' + dt.getTime(), {}, function(data, status) {
 	    if (data && data.length > 1) {
			tdd = createDropDown($("#tags"), data, MAX_ELEMS, tags_selection_changed, null, null, {selectText: "Select Tags"}); 
			tag_update_value();
		} else {
			$("#tags").html("No tags");
			tdd = 0;
		}
	});
}

function close_keywords(e) {
	$("#ProjectKeywords")[0].value = '';
	
	dd.deselect();
	show_hide_keywords_closer();
}

function show_hide_keywords_closer() {
	if($("#ProjectKeywords")[0].value)
		$(".keywords_closer").show();
	else
		$(".keywords_closer").hide();
}

function tags_selection_changed(value, text) {
	var ret = true;

	if (value == 0) {
		tdd.multiSelectAll();
		ret = false;
	}

	setTimeout(function() {
		var value = tdd.getSelectedValue();
		$("#ProjectTags")[0].value = value;
	}, 500);
	return ret;
}

function selection_changed(value, text) {
	$("#ProjectEngines").show();
	$("#ProjectKeywords")[0].value = value;
	show_hide_keywords_closer();
	return true;
}

function tag_update_value() {
	if ($("#ProjectTags")[0].value) {
		tdd.setSelectedValue($("#ProjectTags")[0].value);
	}
}

function update_value() {
	if ($("#ProjectKeywords")[0].value) {
		dd.setSelectedValue($("#ProjectKeywords")[0].value);
	}
}

function dropdown_active() {
	tdd.hideDropdown();
	$("#ProjectEngines").hide();
}

function dropdown_inactive() {
	$("#ProjectEngines").show();
	update_value();
}


function createDropDown($elem, list, nmax, onChange, onActive, onInactive, options) {
	var settings = {id:$elem[0].id,zIndex:1,viewWidth:'360px',viewHeight:'auto',selectText:'Select Keywords',
		onActive: onActive, onInactive: onInactive, closeImg : WebSpyPro_UrlRoot + 'img/icons/cross.png'};
    if (typeof(options)!='undefined') {
		jQuery.extend(settings, options);
	}

	var dd = $elem.finalselect(settings);

	dd.selectionChanged = function(value,text) {
		if (value < 0) {
			var index = -1 - value;
			dd.removeAll();
			populateDropdown(dd, list, index, nmax);
			dd.showDropdown();
			return false;
		} else {
			if(onChange) {
				return onChange(value, text);
			}
		}
		return true; 
	}

	populateDropdown(dd, list, 0, nmax);
	return dd;
}

function populateDropdown(dd, list, index, nmax) {
	var addlist = [];
	var cnt = 0;
	if (index > 0) {
		var prev = index - nmax;
		if (prev < 0)
			prev = 0;
		addlist[cnt] = {text: "&laquo; Prev", value: (-1 - prev), 'class': 'selectnav'};
		cnt++;
		nmax--;
	}

	if (index + nmax < list.length)
		nmax--;

	for (var i=index; i < index+nmax && i < list.length; i++) {
		if (list[i].value == 0)
			list[i].className = 'selectall';

		addlist[cnt] = list[i];
		cnt++;
	}

	if (i < list.length && addlist.length>0) {
		addlist[cnt] = {text:"Next &raquo;", value:-i-1, 'class': 'selectnav'};
		cnt++;
	}

	if (addlist.length > 0)
		dd.addItems(addlist, 0, cnt);

	return dd;
}

$(document).ready(main);