var resortPanel;

// Resort panel subclass
ResortPanel = function(el, userConfig) {
	if (arguments.length > 0) {
		ResortPanel.superclass.constructor.call(this, el, userConfig);
	}
}

// Inherit from YAHOO.widget.Panel
YAHOO.extend(ResortPanel, YAHOO.widget.Panel);

// Initialize the ResortPanel
ResortPanel.prototype.init = function(el, userConfig) {
	ResortPanel.superclass.init.call(this, el);
	
	this.beforeInitEvent.fire(ResortPanel);
	
	if (userConfig) {
		this.cfg.applyConfig(userConfig, true);
	}
	
	this.renderEvent.subscribe(this.onRender);
	
	this.initEvent.fire(ResortPanel);
}

// Set up the default values for the properties
ResortPanel.prototype.initDefaultConfig = function() {
	ResortPanel.superclass.initDefaultConfig.call(this);
	this.cfg.addProperty("resortcontentserviceurl", {value: ""});
	this.cfg.addProperty("resortid", {value: 0});
	this.cfg.addProperty("tabviewheight", {value: 218});
	this.cfg.addProperty("windowtitle", {handler: this.configTitle, supressEvent:true, value: "RESORT DETAILS"});
	this.cfg.addProperty("contenttitle", {handler: this.configHeader, supressEvent:true, value: ""});
	this.cfg.addProperty("contentsubtitle", {handler: this.configSubtitle, supressEvent:true, value: ""});
}

ResortPanel.prototype.configTitle = function(type, args, obj) {
	var title = args[0];
	if (!title) {
		title = "";
	}
	var titleSpan =	YAHOO.util.Dom.getElementsByClassName("resorttitle", "span", this.header)[0];
	titleSpan.innerHTML = title;
}

ResortPanel.prototype.configHeader = function(type, args, obj) {
	var headerText = args[0];
	if (!headerText) {
		headerText = "";
	}
	var headerDiv = YAHOO.util.Dom.getElementsByClassName("resortpanelheader", "div", this.body)[0];
	YAHOO.util.Dom.setStyle(headerDiv, "width", "364px");
	YAHOO.util.Dom.setStyle(headerDiv, "height", "0px");
	YAHOO.util.Dom.setStyle(headerDiv, "text-align", "left");
	headerDiv.innerHTML = headerText;
}

ResortPanel.prototype.configSubtitle = function(type, args, obj) {
	var text = args[0];
	if (!text) {
		text = "";
	}
	var subtitleDiv = YAHOO.util.Dom.getElementsByClassName("subtitle", "div", this.body)[0];
	YAHOO.util.Dom.setStyle(subtitleDiv, "width", "364px");
	YAHOO.util.Dom.setStyle(subtitleDiv, "text-align", "left");
	subtitleDiv.innerHTML = text;
}

ResortPanel.prototype.resetContentHeight = function() {
	var tabViewContentDiv = this.resortPanelTabView._contentParent;
	YAHOO.util.Dom.setStyle(tabViewContentDiv, "width", "267px");
	var sw = Math.max(tabViewContentDiv.scrollWidth, 267);
	var sh = tabViewContentDiv.scrollHeight;
	if (sh > tabViewContentDiv.clientHeight) {
		sw += 11;
		YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "block");
	} else {
		YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "none");
	}
	YAHOO.util.Dom.setStyle(tabViewContentDiv, "width", "" + sw + "px");
	this.cfg.setProperty("width", "" + (sw + 133) + "px");
}

ResortPanel.prototype.onRender = function() {
	var resortPhotoBoxViewDiv = YAHOO.util.Dom.getElementsByClassName("photobox", "div", this.element)[0];
	var resortPanelTabViewDiv = YAHOO.util.Dom.getElementsByClassName("resortpaneltabview", "div", this.element)[0];
	var resortSliderDiv = YAHOO.util.Dom.getElementsByClassName("yui-slider", "div", resortPanelTabViewDiv)[0];
	var resortSliderThumbDiv = YAHOO.util.Dom.getElementsByClassName("yui-sliderhandle", "div", resortPanelTabViewDiv)[0];

	var resortPhotoBoxViewId = YAHOO.util.Dom.generateId(resortPhotoBoxViewDiv, "resortpanel");	
	var resortPanelTabViewId = YAHOO.util.Dom.generateId(resortPanelTabViewDiv, "resortpanel");
	var resortSliderDivId = YAHOO.util.Dom.generateId(resortSliderDiv, "resortpanel");
	var resortSliderThumbDivId = YAHOO.util.Dom.generateId(resortSliderThumbDiv, "resortpanel");

	resortPhotoBoxViewDiv.setAttribute("id", resortPhotoBoxViewId);
	resortPanelTabViewDiv.setAttribute("id", resortPanelTabViewId);
	resortSliderDiv.setAttribute("id", resortSliderDivId);
	resortSliderThumbDiv.setAttribute("id", resortSliderThumbDivId);
	
	var me = this;
	this.handleTabContentChange = function(e, tab) {
		//add the scriptlets to the page
		me.resortSlider.setValue(0, true, true);
		var contentEl = tab.get("contentEl");
		YAHOO.util.Dom.setStyle(contentEl, "top", "0px");
		
		var scriptlets = contentEl.getElementsByTagName("script");
		for (var i = 0; i < scriptlets.length; i++) {
			var scriptElem = document.createElement("script");
			scriptElem.setAttribute("type", "text/javascript");
			if (scriptlets[i].attributes["src"] != null) {
				scriptElem.setAttribute("src", scriptlets[i].attributes["src"].value);
			}
			scriptElem.text = scriptlets[i].innerHTML;
			document.getElementsByTagName("head")[0].appendChild(scriptElem);
		}

		me.resetContentHeight();
	};
		
	
	// create tabview
	this.resortPanelTabView = new YAHOO.widget.TabView(resortPanelTabViewId, { orientation: "left" } );
	
	// register tabs to content changes
	var tabs = this.resortPanelTabView.get("tabs");
	for (var i = 0; i < tabs.length; i++) {
		var tab = this.resortPanelTabView.getTab(i);
		tab.addListener("contentChange", this.handleTabContentChange, tab);
		YAHOO.util.Dom.setStyle(tab.get("contentEl"), "position", "absolute");
	}
	
	// register tab click event
	this.resortPanelTabView.addListener("activeTabChange", this.handleTabClick, this, true);
	
	// create slider
	this.resortSlider = YAHOO.widget.Slider.getVertSlider(resortSliderDivId, resortSliderThumbDivId, 0, this.cfg.getProperty("tabviewheight") - 11);
	this.resortSlider.subscribe("change", this.handleSliderChange, this, true);
	
	// create photobox views
	this.resortPhotoBoxView = new PhotoBox(resortPhotoBoxViewId);
	this.resortPhotoBoxView.render();
	
	YAHOO.util.Dom.setStyle(resortSliderDiv, "height", "" + this.cfg.getProperty("tabviewheight") + "px");
	YAHOO.util.Dom.setStyle(this.resortPanelTabView._contentParent, "height", "" + this.cfg.getProperty("tabviewheight") + "px");
	
}

// called when a tab is clicked
ResortPanel.prototype.reloadTabContent = function(tab, contentCode) {
	var myContentCode = contentCode;
	var myTab = tab;
				
	if (tab == null) {
		var tabs = this.resortPanelTabView.get("tabs");
		for (var i = 0; i < tabs.length; i++) {
			if (tabs[i].get("id") == "ri_" + contentCode) {
				this.resortPanelTabView.set("activeTab", tabs[i]);
				return;
			}
		}
		myContentCode = contentCode;
		myTab = this.resortPanelTabView.get("activeTab");					
	} else {
		var tabId = myTab.get("id");
		myContentCode = tabId.substring(3);
	}

	if (this.resortPanelTabView.get("activeTab") != myTab) {
 		this.resortPanelTabView.set("activeTab", myTab);
 	}
 	
	var serviceUrl = this.cfg.getProperty("resortcontentserviceurl");
	var params = new SOAPClientParameters();
	params.add("resortId", this.cfg.getProperty("resortid"));
	params.add("contentCode", myContentCode);
	if (this.packageId) {
		params.add("packageId", this.packageId);
	} else {
		params.add("packageId", "");
	}
	var callContext = new Object();
	callContext["caller"] = this;
	callContext["tab"] = myTab;
	SOAPClient.invoke(serviceUrl, "getResortContentPhotos", params, true, this.handlePhotos_callback, this);
	SOAPClient.invoke(serviceUrl, "getResortContent", params, true, this.handleTabClick_callback, callContext);
}
			
ResortPanel.prototype.handleTabClick = function(e) {
	e.prevValue.set("content", "");
	
	this.reloadTabContent(e.newValue);
}
		
ResortPanel.prototype.handleTabClick_callback = function(result, xmlResponse, callContext) {
	var htmlContent = "";
	if (result.htmlContent instanceof Array) {
		for (var i = 0; i < result.htmlContent.length; i++) {
			htmlContent += result.htmlContent[i];
		}
	} else {
		htmlContent = result.htmlContent;
	}
	callContext.tab.set("content", htmlContent);
	callContext.caller.cfg.setProperty("contenttitle", result.contentTitle);
	callContext.caller.cfg.setProperty("contentsubtitle", result.contentSubtitle);
}

ResortPanel.prototype.handleStartupContent_callback = function(result, xmlResponse, callContext) {
	callContext.caller.cfg.setProperty("windowtitle", result.windowTitle);
}
			
ResortPanel.prototype.handlePhotos_callback = function(result, xmlResponse, me) {
	result = SOAPClient.getResultAsArray(result, "photos");
	me.resortPhotoBoxView.cfg.setProperty("photos", result);
}
			
ResortPanel.prototype.handleSliderChange = function(newOffset) {
	var tab = this.resortPanelTabView.get("activeTab");
	if (typeof tab == "undefined") {
		return;
	} 
	var contentEl = tab.get("contentEl");
	var newTop = newOffset * (contentEl.scrollHeight - this.resortPanelTabView._contentParent.clientHeight) / this.cfg.getProperty("tabviewheight");//this.resortSlider.thumb.maxY;
	var newTop = Math.min(-newTop, 0);
	YAHOO.util.Dom.setStyle(contentEl, "top", "" + newTop + "px");
}

ResortPanel.prototype.showPanel = function(resortId, resortContentService, packageId, contentCode) {
	this.packageId = packageId;
	this.cfg.setProperty("resortid", resortId);
	if (resortContentService && resortContentService != "") {
		this.cfg.setProperty("resortcontentserviceurl", resortContentService);
	}
	if (contentCode && contentCode !=  "") {
		this.reloadTabContent(null, contentCode);
	} else {
		this.reloadTabContent(this.resortPanelTabView.get("tabs")[0]);
	}
	
	var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
	if (scrollY > 0) {
		this.center();
	}
	
	this.show();
}

ResortPanel.prototype.getStartupContent = function() {
	var serviceUrl = this.cfg.getProperty("resortcontentserviceurl");
	var params = new SOAPClientParameters();
	params.add("resortId", this.cfg.getProperty("resortid"));
	params.add("contentCode", "");
	
	var callContext = new Object();
	callContext["caller"] = this;
	
	SOAPClient.invoke(serviceUrl, "getWindowTitle", params, true, this.handleStartupContent_callback, callContext);
}

YAHOO.util.Event.addListener(window, "load", function() {
	// create div structures
	var resortPanelDiv = document.createElement("DIV");
	resortPanelDiv.setAttribute("id", "resortPanel");
	document.body.appendChild(resortPanelDiv);
	resortPanelDiv.innerHTML = 
			'<div class="hd"><div class="tl"></div><span class="resorttitle">&nbsp;</span><div class="tr"></div></div>'
			+ '<div class="bd">'
			+ '	 <div align="center">'
			+ '	 <div class="resortpanelheader">&nbsp;</div>'
			+ '	</div>'				
			
			+ '	<div style="text-align: center;">'
			+ '		<div class="photobox" style="margin: 0px auto; ">'
			+ '			<div class="preview"></div><div class="thumblist"></div>'
			+ '			<div class="subtitle">&nbsp;</div>'
			+ '		</div>'
			+ '	</div>'				
			+ '	<div class="yui-navset resortpaneltabview" >'
			+ '		<ul class="yui-nav">'
			// + '			<li id="ri_pkg"><a href="#"><em>Package Info</em></a></li>'
			
			+ '			<li class="selected" id="ri_overview"><a href="#"><em>Overview</em></a></li>'
			
			+ '			<li id="ri_accomm"><a href="#"><em>Accommodations</em></a></li>'
			+ '			<li id="ri_amen"><a href="#"><em>Amenities</em></a></li>'
			+ '			<li id="ri_act1"><a href="#"><em>Activities</em></a></li>'
			//+ '			<li id="ri_dining1"><a href="#"><em>Dining</em></a></li>'
			+ '			<li id="ri_maps"><a href="#"><em>Map</em></a></li>'
			
			+ '			<li id="ri_igallery"><a href="#"><em>Image Gallery</em></a></li>'
			+ '		</ul>'
			+ '		<div class="yui-content">'
			+ '		</div>'
			+ '		<div class="yui-slider">'
			+ '			<div class="yui-sliderhandle">'
			+ '			 	<img src="/images/resortpanel/lthumb.gif" border="0" alt="-">'
			+ '			 </div>'
			+ '		</div>'
			+ '	</div>'

				
//			+ '	<div class="resortpanelfooter">'
//			+ '		<a href="#" onclick="resortPanel.hide();window.location=\'/GetCheckAvailabilityScreen.event?pid=\'+resortPanel.packageId;"><img width="122" height="22" border="0" alt="qualify now" src="/images/resortpanel/qualify_now.jpg"/></a>'
//			+ '	</div>'
				
			+ '</div>'
			+ '<div class="ft"><div class="bl"></div><div class="br"></div></div>'
			//+ '<span class="container-print" onclick="alert(\'TODO: print\');"></span>';
			//+ '<span class="container-send" onclick="resortPanel.reloadTabContent(null, \'sendcomm\');"></span>';

	resortPanel = new ResortPanel("resortPanel", { resortcontentserviceurl: gResortContentService, 
		fixedcenter:true,  visible:false, constraintoviewport:false, underlay: 'none', width: '450px', tabviewheight: 218 });
	resortPanel.render();
	resortPanel.center();
	YAHOO.util.Dom.setStyle(resortPanel.element, "top", "120px");
	resortPanel.getStartupContent();
	
	
});

function loadPhotoInResort(url) {
	resortPanel.resortPhotoBoxView.setImageByUrl(url);
}