var keyWordGlobals = {
	searchInFocus: false,
	kWContainer: null
};
var keyWordConfig = {
	keyWordsUrl: "http://"+window.location.host+"/keywords",
	searchUrl: "http://search.ofcom.org.uk/search?site=AllofOfcom&proxystylesheet=default_frontend&output=xml_no_dtd&client=default_frontend&oe=UTF-8&ie=UTF-8&q=",
	maxKeyWords: 20
};
Event.observe(window, 'load', function() {
	
	if(document.getElementById('searchField')){
		keyWordGlobals.kWContainer = new KeyWordContainer(document.getElementById('searchField'));

		Event.observe('searchField', 'keyup', function(e){
			keyWordGlobals.searchInFocus = true;
			e = e || window.event;
			var key = (e.which) ? e.which : e.keyCode;
			switch(key){
				case Event.KEY_DOWN: break;
				case Event.KEY_UP: break;
				case Event.KEY_RETURN: break;
				case Event.KEY_TAB: break;
				case Event.KEY_ESC: keyWordGlobals.kWContainer.clear();
						break;
				default: if(!keyWordGlobals.kWContainer.globals.inFocus) keyWordGlobals.kWContainer.getKeyWords();
			}


		});
		Event.observe('searchForm', 'submit', function(){
			if (keyWordGlobals.kWContainer.getCurrKeyWord()>=0) keyWordGlobals.kWContainer.selectKeyWord();
			return true;
		});

		Event.observe('searchField', 'focus', function() {
			keyWordGlobals.searchInFocus = true;
		});

		Event.observe('searchField', 'blur', function() {
			keyWordGlobals.searchInFocus = false;
		});
	}
	
});



addElement = function(elementType, attrbs, text, id){
	var newEl = document.createElement(elementType);
	newEl.id = id;
	for(j in attrbs){
		newEl.style[j] = attrbs[j];
	}
	if(text!=null && text!=''){
		var newElText = document.createTextNode(text);
		newEl.appendChild(newElText);
	}
	return newEl;
}


function KeyWordContainer(inputField) {
	
	this.globals = {
		keyWords: [],
		keywordContainerEl: null,
		inputFieldEl: null,
		searchStr: "",
		currKeyWord: -1,
		getKeyWordsRequest: null,
		inFocus: false
	};
	
	return this.initialize(inputField);
}
KeyWordContainer.prototype.initialize = function (inputField) {
	var g = this.globals;
	var me = this;
	
	g.inputFieldEl = inputField;
	g.searchStr = inputField.value;
	
		
	Event.observe(document, 'keydown', function(e){
			
		e = e || window.event;
		var key = (e.which!=null) ? e.which : event.keyCode;
		if (keyWordGlobals.searchInFocus){
			switch(key){
				case Event.KEY_DOWN: 	if (g.currKeyWord<g.keyWords.length-1){
							me.setCurrKeyWord(g.currKeyWord+1);
						} else{
							me.setCurrKeyWord(0);
						}
				break;
				case Event.KEY_UP: 	if (g.currKeyWord>0){
							me.setCurrKeyWord(g.currKeyWord-1);
						} else{
							me.setCurrKeyWord(g.keyWords.length-1);
						}
				break;
			}
		}
			
	});	
	Event.observe(document, 'mousedown', function(e){
		if(!keyWordGlobals.kWContainer.globals.inFocus){
			me.upDateKeyWords([]);
		}
	});
	
}

KeyWordContainer.prototype.getKeyWords = function(){
	var g = this.globals;
	var me = this;
	
	g.searchStr = g.inputFieldEl.value;
	
	
	if (window.XMLHttpRequest) { // Mozilla, Safari, ...
			g.getKeyWordsRequest = new XMLHttpRequest();
			g.getKeyWordsRequest.overrideMimeType('text/xml');
		} else if (window.ActiveXObject) { // IE
		    g.getKeyWordsRequest = new ActiveXObject("Microsoft.XMLHTTP");
		}
		g.getKeyWordsRequest.onreadystatechange = function(){
			try{
				//alert("ready state change..."+g.getKeyWordsRequest.readyState);
				if (g.getKeyWordsRequest.readyState == 4) {
					if (g.getKeyWordsRequest.status == 200) {
						g.currKeyWord = -1;
						me.upDateKeyWords(g.getKeyWordsRequest.responseXML.getElementsByTagName("keyword"));
					} else {
						//alert("got a "+g.getKeyWordsRequest.status+" - BOO!");
					}
				}
			} catch(e){ 
				//alert(e);
			}
	};
	
	g.getKeyWordsRequest.open('GET', keyWordConfig.keyWordsUrl+'?query='+g.searchStr, true);
	g.getKeyWordsRequest.send(null);
	
}	

KeyWordContainer.prototype.getCurrKeyWord = function(){
	var g = this.globals;
	return g.currKeyWord;
}	

KeyWordContainer.prototype.setCurrKeyWord = function(currKeyWord){
	var g = this.globals;
	g.currKeyWord = currKeyWord;
	for(i=0; i<g.keyWords.length; i++){
		g.keyWords[i].highlight();
	}
}

KeyWordContainer.prototype.selectKeyWord = function(){
	var g = this.globals;
	var me = this;
	if(g.keyWords.length>=g.currKeyWord){
		g.inputFieldEl.value = g.keyWords[g.currKeyWord].getKeyWordText();
		me.upDateKeyWords([]);
	}
}

KeyWordContainer.prototype.clear = function(){
	var g = this.globals;
	var me = this;
	g.inputFieldEl.value = "";
	me.upDateKeyWords([]);
}


KeyWordContainer.prototype.upDateKeyWords = function(newKeyWords) {
			
	var g = this.globals;
	var me = this;
		
	if (g.keywordContainerEl!=null && g.keywordContainerEl.parentNode!=null) {
		g.keywordContainerEl.parentNode.removeChild(g.keywordContainerEl);
		g.keywordContainerEl = null;
		g.inFocus = false;
	}
	
	if (g.keyWords.length>0) g.keyWords = [];
	
	if(newKeyWords.length>0 && newKeyWords.length<=keyWordConfig.maxKeyWords){
		
		var leftPos = g.inputFieldEl.offsetLeft;
		var topPos = g.inputFieldEl.offsetTop;
		
		try{
			if(g.inputFieldEl.getBoundingClientRect()){
				var inputFieldRectObj = g.inputFieldEl.getBoundingClientRect();
				leftPos = inputFieldRectObj.left;
				topPos = inputFieldRectObj.top;
			}
		} catch(e){}
		
		g.keywordContainerEl = addElement('div',
					{position: 'absolute',
					top: (topPos+g.inputFieldEl.clientHeight+2)+'px',
					left: leftPos+'px',
					width: g.inputFieldEl.clientWidth+'px',
					padding: '2px',
					backgroundColor: "#FAFAFA",
					zIndex: 100},
					'','keyWordContainer');
					
		g.keywordContainerEl.id = "keyWordContainer";
			
		for(i=0; i<newKeyWords.length; i++){
			g.keyWords.push(new KeyWord(g.keywordContainerEl, i, newKeyWords[i].firstChild.nodeValue));
		}
	}
			
	if (g.keywordContainerEl!=null){
		g.inputFieldEl.parentNode.appendChild(g.keywordContainerEl);
		Event.observe(g.keywordContainerEl,'mouseover',function(e){
			g.inFocus=true;
		});
		Event.observe(g.keywordContainerEl,'mouseout',function(e){
			g.inFocus=false;
		});
	}
}

function KeyWord(keyWordContainer, i, keyWordText) {
	
	this.globals = {
		keyWordNum: i,
		keyWordText: '',
		keyWordEl: null,
		keyWordURL: ''
	};
	return this.initialize(keyWordContainer, i, keyWordText) ;
}
	
KeyWord.prototype.initialize = function(keyWordContainer, i, keyWordText) {
	
	var g = this.globals;
	var me = this;
		
	g.keyWordText = keyWordText;
	
	g.keyWordEl = addElement('a',
				{paddingLeft: '4px',
				margin: '2px',
				display: 'block'},
				g.keyWordText,'keyword'+i);
				
	g.keyWordURL = keyWordConfig.searchUrl + g.keyWordText;

	g.keyWordEl.href = g.keyWordURL;
	g.keyWordEl.name = "keyWord";

	keyWordContainer.appendChild(g.keyWordEl);
	
	
	Event.observe(g.keyWordEl, 'mouseover', function(e) {
		keyWordGlobals.kWContainer.setCurrKeyWord(g.keyWordNum);
	});
	Event.observe(g.keyWordEl, 'mouseout', function(e) {
		keyWordGlobals.kWContainer.setCurrKeyWord(-1);
	});
	
	return this;
}	
KeyWord.prototype.highlight = function() {
	
	var g = this.globals;
	var me = this;
	if (keyWordGlobals.kWContainer.getCurrKeyWord() == g.keyWordNum){
		g.keyWordEl.style.borderLeft="2px solid #660066";
		g.keyWordEl.style.backgroundColor="#e4e4e4";
		return;
	} else {
		g.keyWordEl.style.borderLeft="none";
		g.keyWordEl.style.backgroundColor="#fafafa";
		return;
	}
	
}	
KeyWord.prototype.getKeyWordText = function() {
	var g = this.globals;
	return g.keyWordText;
}