/**
 * Date	: April 24, 2009
 * Author: Paul Warelis
 * Copyright (c) 2009 Dine.TO
 */

var movAutoComplete = {
	textBox		: null,
	phrase		: "",
	hasFocus		: false,			// textbox has focus
	
	popup			: null,
	visible		: null,			// Popup is visible
	rowCount		: 0,
	cursorRow	: null,			// Row that the cursor is on
	selectedRow	: null,			// Clicked row
	
	init : function ( htmlId ) {
		this.textBox = $("#"+htmlId);
		this.popup = $("#acResults");
		
		var textBox = this.textBox;
		this.textBox.get(0).acObj = this;
		this.popup.get(0).acObj = this;
		
		// Setup the popup dialog
		var popup = this.popup;
		this.updateStyle(false);

		textBox.bind("focus", this.textBoxFocus);
		textBox.bind("keydown", this.textBoxKeyDown);
		textBox.bind("keyup", this.textBoxKeyUp);
	},

	updateStyle : function (hasFocus) {
		if (this.phrase == "") {
			if (hasFocus) {
				this.textBox.val("").css("color", "black");
			} else {
//				this.textBox.val("Start typing").css("color", "gray");
			}
		}
	},
	
	getMoviesByAutoComplete : function() {
		if (callInProgress || this.phrase == "") return;
		callInProgress = true;
		$(this.textBox).addClass("acTextBox");
		$.post(ajaxFile, {
				action	: "getMoviesByAutoComplete",
				argument	: this.phrase
			}, function (data) {
				$(movAutoComplete.textBox).removeClass("acTextBox");
				if (errorDetected(data)) return;
				movAutoComplete.updatePopup(data);
			},
		"json");
	},

	enterPressed : function () {
		if (this.phrase == "") return;
		if (this.visible && this.cursorRow != null) {

			// Check if the selected entry was a movie person's name. That's a special case
			if ($(this.cursorRow).hasClass("moviePeople")) {
				movList.getMoviesByPerson(this.textBox.val());
			} else {
				// fetch movie under cursor
				movList.getMoviesByPhrase(this.textBox.val());
			}
			this.textBox.val(this.phrase);
			
		} else {
			// Auto complete not selected, search database with the phrase in the text box
			movList.getMoviesByPhrase(this.textBox.val());
		}
		this.phrase = this.textBox.val();
		this.displayPopup(false);
	},
	
	displayPopup : function (showNow) {
		if (this.visible == null) {
			this.popup.css("left", this.textBox.position().left)
				.css("top", this.textBox.position().top+this.textBox.outerHeight());
			this.visible = false;
		}
		if (showNow == this.visible) return;
		if (showNow) {
			if (this.phrase == "") return;
			$(document).bind("click", movAutoComplete.removePopup);
			this.popup.show();
		} else {
			$(document).unbind("click", movAutoComplete.removePopup);
			this.popup.hide();
		}
		this.visible = showNow;
	},

	updatePopup : function (data) {
		// If the textbox doesn't have focus, bail
		if (this.hasFocus == false) return;
		// here we check if the textbox value changed when we were getting stuff from the server
		// If that's the case, do it again
		if (this.phrase != data.originalPhrase) {
			this.getMoviesByAutoComplete();
			return;
		}
		
		this.popup.html(data.movieList)
			.children("div")
				.bind("mousemove", this.popupMouseMove)
				.bind("click", this.popupClick);
		this.rowCount = data.rowCount;
		this.displayPopup(data.rowCount > 0);
		this.cursorRow = null;
		$(".acSelected").removeClass("acSelected");
	},

	removePopup : function (event) {
		movAutoComplete.textBoxBlur();
	},

	moveCursor : function (moveUp) {
		if (this.rowCount == 0 || this.textBox.val() == "") return;
		var popup = this.popup;
		
		if (!this.visible) { // Just show the popup
			this.displayPopup(true);
			return;
		} else if (this.cursorRow == null) { // Set cursor on the first entry
			// Select the first row
			var firstIndex = (moveUp) ? popup.children().length-1 : 0;
			this.cursorRow = popup.children().eq(firstIndex).addClass("acSelected");
		} else {
			var curRow = this.cursorRow.removeClass("acSelected");
			// The only difference between up and down, right here
			if (moveUp) this.cursorRow = curRow.prevAll("div").eq(0);
			else this.cursorRow = curRow.nextAll("div").eq(0);
			
			if (this.cursorRow.eq(0).length == 0) {
				this.cursorRow = null;
			} else {
				this.cursorRow.addClass("acSelected");
			}
		}
		
		if (this.cursorRow == null) {
			this.textBox.val(this.phrase);
		} else {
			this.textBox.val(stripTags(this.cursorRow.html().replace("&", "&")));
		}
	},
	
	popupMouseMove : function () {
		var ac = $(this).parent().get(0).acObj;
		if (ac.cursorRow == null) {
			ac.cursorRow = $(this);
		} else {
			if (ac.cursorRow == $(this)) return;
			ac.cursorRow.removeClass("acSelected");
		}
		ac.cursorRow = $(this).addClass("acSelected");
	},

	popupClick : function () {
		var ac = $(this).parent().get(0).acObj;
		ac.textBox.val(stripTags(ac.cursorRow.html().replace("&", "&")));
		ac.enterPressed();
	},

	textBoxFocus : function () {
		this.acObj.hasFocus = true;
		this.acObj.updateStyle(true);
	},
	
	textBoxBlur : function () {
		this.hasFocus = false;
		this.updateStyle(false);
		this.displayPopup(false);
//		$(this.textBox).val(this.phrase);
	},

	textBoxKeyUp : function (event) {
		var ac = this.acObj;

		if (this.value == "") {
			ac.displayPopup(false);
		}
		switch (event.keyCode) {
			case 13:		// enter
				ac.enterPressed();
				break;
			default:		// Fetch list of search results
				if (ac.phrase == this.value) break; // if text didn't change, bail
				if (event.keyCode < 45) return;
			case 8:		// backspace
			case 32:		// space
				ac.phrase = this.value;
				ac.getMoviesByAutoComplete();
				break;
		}
	},
	
	textBoxKeyDown : function (event) {
		var ac = this.acObj;

		if (this.value == "") {
			ac.displayPopup(false);
		}
		
		switch (event.keyCode) {
			case 9:		// tab
				ac.textBoxBlur();
				break;
			case 40:		// down arrow
				ac.moveCursor(false);
				break;
			case 38:		// up arrow
				ac.moveCursor(true);
				break;
			case 27:		// esc
				ac.displayPopup(false);
				this.value = ac.phrase;
				break;
		}
	}
	
}

function stripTags(text) {
	return text.replace(/(<([^>]+)>)/ig, "");
}