/*
*	HTMLArea Class
*	Requires jQuery
*	Born Interactive 2008
*/

function HTMLArea(params_obj)
{
	this.id = params_obj.id;
	this.params_obj = params_obj;
	
	this.createTag();
	this.showContent();
}

HTMLArea.prototype.createTag = function()
{
	// id same div ID exists update the content (no need to create the tag again)
	if($("#"+this.id).length) {
		this.div = $("#"+this.id);
		this.updateSizeAndPos();
		return;
	}
	this.relhost = addRelativeDiv();
	$(this.relhost).append('<div id="'+this.id+'"></div>')
	this.div = $("#"+this.id);
	this.div.css("position", "absolute");
	this.div.css("overflow", "hidden");
	if(typeof this.params_obj.scrollclass != "undefined") this.div.addClass(this.params_obj.scrollclass);	//custom scrollbars class
	this.updateSizeAndPos();
	this.saveReference();
}

HTMLArea.prototype.updateSizeAndPos = function()
{
	$(this.div).css("top", this.params_obj.top);
	$(this.div).css("left", this.params_obj.left);
	$(this.div).css("width", this.params_obj.width);
	$(this.div).css("height", this.params_obj.height);
}

HTMLArea.prototype.fillContent = function(str)
{
	this.showLoader(false);
	$(this.div).append('<div class="scrollable-content">' + str + '</div>');
	if(str.indexOf("<form") != -1) this.setFormTarget();
	this.addScrollers();
}

HTMLArea.prototype.setFormTarget = function()
{
	$(this.div).find("form").attr("target", "formiframe");
}

HTMLArea.prototype.addScrollers = function()
{
	var scr_div = "div.scrollable-content"; 
	var custom_scroll_class = ".scrollable";
	if($(this.div).find(custom_scroll_class).length > 0) {
		scr_div = custom_scroll_class;
	}
	if(this.params_obj.scroll == "v"){
		$(this.div).find(scr_div).css("height", this.params_obj.height);
		if(scr_div == custom_scroll_class) {
			$(this.div).find(scr_div).css({height: this.params_obj.height - 30 });
		}
		$(this.div).find(scr_div).css("overflow", "hidden");
		$(this.div).find(scr_div).jScrollPane({showArrows:true, scrollbarWidth: 14 });
		
		// extra top margin to accomodate for to pand bottom scrollbars (special case for Raha Beach)
		if(scr_div == custom_scroll_class) {
			$(this.div).find(".jScrollPaneContainer").css("margin-top", "15px");
			// remove the scroll arrows outside the "jScrollPaneContainer"
			$(this.div).append('<div class="floating-arrows"></div>');
			$(".jScrollArrowUp").clone().appendTo(".floating-arrows");
			$(".jScrollArrowDown").clone().appendTo(".floating-arrows");
			$(".floating-arrows .jScrollArrowDown").mouseover(function(){$(".jScrollPaneContainer .jScrollArrowDown").each(function(){ $(this).mouseover(); })});
			$(".floating-arrows .jScrollArrowUp").mouseover(function(){$(".jScrollPaneContainer .jScrollArrowUp").each(function(){ $(this).mouseover(); })});
			$(".jScrollPaneContainer .jScrollArrowUp").hide();
			$(".jScrollPaneContainer .jScrollArrowDown").hide();
		}
		
		
	} else if(this.params_obj.scroll == "h") {
		/*
		$(this.div).addClass("horzpane");
		$(this.div).css("width", "auto");
		$(this.div).find("div.scrollable-content").css("float", "left");
		$(this.div).find("div.scrollable-content").css("width", this.params_obj.width);
		$(this.div).find("div.scrollable-content").jScrollHorizontalPane({showArrows:true, scrollbarHeight: 15 });
		*/
	}
}

HTMLArea.prototype.updateContent = function(newurl, istext)		// update content of same area with new page
{
	this.params_obj.content = newurl;
	if(istext) this.params_obj.content_type = "text";
	this.showContent();
}

HTMLArea.prototype.showContent = function()
{
	// hide existing content and show loader
	this.empty();
	this.showLoader(true);
	
	// check type of content (url or text)
	if(this.params_obj.content_type == "text") {
		this.fillContent(this.params_obj.content);
	} else {
		this.loadURLContent(this.params_obj.content);	// Expecting a URL by default
	}
}

HTMLArea.prototype.empty = function()
{
	$(this.div).empty();
}

HTMLArea.prototype.showLoader = function(show)
{
	if(show){
		var loading_txt = "Loading...";
		if(this.params_obj.content.toLowerCase().indexOf("search") != -1)  loading_txt = "Searching...";		// special case added to show "Searching..." when loading search resilts 
		$(this.div).append('<div class="arealoader">'+loading_txt+'</div>');
		$(this.div).find(".arealoader").css("position", "absolute");
		$(this.div).find(".arealoader").css("left", Math.round(this.params_obj.width/2 - 20)+"px");
		$(this.div).find(".arealoader").css("top", Math.round(this.params_obj.height/2 - 30));
	} else {
		$(this.div).empty()
	}
}

HTMLArea.prototype.loadURLContent = function(url)
{
	var me = this;
	
	// Using jQuery AJAX capabilities, 
	// getting the HTML contents from a page
	$.get(url, function(data){
  		me.fillContent(data);
	});
}

HTMLArea.prototype.updatePosition = function(x, y)
{
	this.params_obj.left = x;
	this.params_obj.top = y;
	this.updateSizeAndPos();
}

HTMLArea.prototype.remove = function()
{
	$(this.div).remove();
	// remove from array
	all_areas.deleteItem(this);
}

HTMLArea.prototype.saveReference = function()
{
	all_areas.push(this);
}


/******************************************************************************** 
	Related utitlities and helpers 
********************************************************************************/
var all_areas = [];		// array used to save reference IDs of all areas on stage

Array.prototype.deleteItem = function(item)
{
	for(var i=0; i<this.length; i++)
	{
		if(this[i] == item) {
			this.splice(i, 1);
			return true;
		}
	}
	return false;
}

function addRelativeDiv()
{
	// if a relative div already exists do nothing
	if($("#areashost").length > 0) return $("#areashost");
	
	$("body").prepend('<div id="areashost"></div>');
	$("#areashost").css("position", "relative");
	return $("#areashost");
}

function hideALlAreas()
{
	while(all_areas.length) all_areas.pop().remove();
}

function getAreaById(id_str)
{
	for(area in all_areas) {
		if(all_areas[area].id == id_str) return all_areas[area];
	}
	return null;
}

function updateArea(area_id, newurl, istext) 
{
	var area = getAreaById(area_id);
	
	if(area != null) {
		area.updateContent(newurl, istext);
	}	
}

function updateAreaPosition(area_id, posobj) 
{
	var area = getAreaById(area_id);
	
	if(area != null) {
		area.updatePosition(posobj.x, posobj.y);
	}	
}