var articlesPanel;

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

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

// Initialize the ArticlesPanel
ArticlesPanel.prototype.init = function(el, userConfig) {
	ArticlesPanel.superclass.init.call(this, el);
	
	this.beforeInitEvent.fire(ArticlesPanel);
	
	this.beforeRenderEvent.subscribe(function() {
			if (! this.footer) {
				this.setFooter("");
			}
		},
		this, true
	);

	this.renderEvent.subscribe(function() {
		var me = this;

		var headerHeight = me.header.offsetHeight;

		me.bodyContentDiv = YAHOO.util.Dom.getElementsByClassName("artcontent", "div", me.body)[0];
		var resortSliderDiv = YAHOO.util.Dom.getElementsByClassName("yui-slider", "div", me.body)[0];
		var resortSliderThumbDiv = YAHOO.util.Dom.getElementsByClassName("yui-sliderhandle", "div", me.body)[0];
		var resortSliderDivId = YAHOO.util.Dom.generateId(resortSliderDiv, "articlepanel");
		var resortSliderThumbDivId = YAHOO.util.Dom.generateId(resortSliderThumbDiv, "articlepanel");
		var contentDivId = YAHOO.util.Dom.generateId(me.bodyContentDiv, "articlepanel");
		resortSliderDiv.setAttribute("id", resortSliderDivId);
		resortSliderThumbDiv.setAttribute("id", resortSliderThumbDivId);
		me.bodyContentDiv.setAttribute("id", contentDivId);
		
		me.photoDiv = YAHOO.util.Dom.getElementsByClassName("photo", "div", me.body)[0];
		me.titleDiv = YAHOO.util.Dom.getElementsByClassName("title", "div", me.body)[0];
		me.subtitleDiv = YAHOO.util.Dom.getElementsByClassName("subtitle", "div", me.body)[0];
		me.linksDiv = YAHOO.util.Dom.getElementsByClassName("artlist", "div", me.body)[0];
		
		me.centerRailDiv = YAHOO.util.Dom.getElementsByClassName("centerrail", "div", me.body)[0];
		
		// create slider
		me.resortSlider = YAHOO.widget.Slider.getVertSlider(resortSliderDivId, resortSliderThumbDivId, 0, 200);
		me.resortSlider.subscribe("change", me.handleSliderChange, me, true);
	}, this, true);
	
	if (userConfig) {
		this.cfg.applyConfig(userConfig, true);
	}
	
	this.changeBodyEvent.subscribe(function() {
		var me = this;
		
		var scriptlets = me.body.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);
		}
		
	}, this, true);
	
	this.initEvent.fire(ArticlesPanel);
}

// Set up the default values for the properties
ArticlesPanel.prototype.initDefaultConfig = function() {
	ArticlesPanel.superclass.initDefaultConfig.call(this);
	this.cfg.addProperty("artid", {value: '0'});
	this.cfg.addProperty("getarticleserviceurl", {value: ""});
}

ArticlesPanel.prototype.configWidth = function(type, args, obj) {
	ArticlesPanel.superclass.configWidth.call(this, type, args, obj);
	var width = args[0];
	if (width) {
		var intWidth = parseInt(width);
		intWidth -= 210;
		if (this.bodyContentDiv && this.bodyContentDiv.firstChild && this.bodyContentDiv.firstChild.scrollHeight > this.bodyContentDiv.clientHeight) {
			YAHOO.util.Dom.setStyle(this.bodyContentDiv, "width", "" + (intWidth -11) + "px");
			YAHOO.util.Dom.setStyle(this.centerRailDiv, "width", "" + (intWidth -11) + "px");
			YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "block");
		} else {
			YAHOO.util.Dom.setStyle(this.bodyContentDiv, "width", "" + intWidth + "px");
			YAHOO.util.Dom.setStyle(this.centerRailDiv, "width", "" + intWidth + "px");
			if (this.resortSlider) {
				YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "none");
			}
		}
	}
}

ArticlesPanel.prototype.configHeight = function(type, args, obj) {
	var intHeight = 150; 
	if (this.bodyContentDiv && this.bodyContentDiv.firstChild) {
		if (this.autoHeight) {
			intHeight = Math.min(200, this.bodyContentDiv.firstChild.scrollHeight);
			intHeight = Math.max(120, intHeight);
		} else {
			intHeight = parseInt(args[0]);
			intHeight -= 230;
		}
	}
	args[0] = ""+(intHeight + 230)+"px";
	ArticlesPanel.superclass.configHeight.call(this, type, args, obj);

//	YAHOO.util.Dom.setStyle(this.body, "height", "" + (intHeight + 160) + "px");
	YAHOO.util.Dom.setStyle(this.bodyContentDiv, "height", "" + intHeight + "px");
	YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "height", "" + intHeight + "px");

	var intWidth = parseInt(this.cfg.getProperty("width")) - 210;
	if (this.bodyContentDiv && this.bodyContentDiv.firstChild && this.bodyContentDiv.firstChild.scrollHeight > this.bodyContentDiv.clientHeight) {
		YAHOO.util.Dom.setStyle(this.bodyContentDiv, "width", "" + (intWidth -11) + "px");
		YAHOO.util.Dom.setStyle(this.centerRailDiv, "width", "" + (intWidth -11) + "px");
		YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "block");
	} else {
		YAHOO.util.Dom.setStyle(this.bodyContentDiv, "width", "" + intWidth + "px");
		YAHOO.util.Dom.setStyle(this.centerRailDiv, "width", "" + intWidth + "px");
		if (this.resortSlider) {
			YAHOO.util.Dom.setStyle(this.resortSlider.getEl(), "display", "none");
		}
	}
	this.resortSlider.thumb.initSlider(0, 0, 0, (intHeight - 18));
}

ArticlesPanel.prototype.showArticle = function(artId, groupType, groupId, height, width, serviceUrl  ) {
	this.cfg.setProperty("artid", artId);
	
	if (serviceUrl && serviceUrl != "") {
		this.cfg.setProperty("getarticleserviceurl", serviceUrl);
	} else {
		serviceUrl = this.cfg.getProperty("getarticleserviceurl");
	}
	
	if (!width) { width = 800; }
	if (height && height != "") { 
		this.cfg.setProperty("height", "" + height + "px");
	} else {
		//this.autoHeight = true;
		this.cfg.setProperty("height", "500px");
	}

	
	this.cfg.setProperty("width", "" + width + "px");
	
	var params = new SOAPClientParameters();
	params.add("artID", artId);
	params.add("artGroupType", groupType);
	params.add("artGroupID", groupId);
	SOAPClient.invoke(serviceUrl, "getArticle", params, true, this.handleMessage_callback, this);
	
}

ArticlesPanel.prototype.handleMessage_callback = function(result, xmlResponse) {
	YAHOO.util.Event.onContentReady(articlesPanel.bodyContentDiv.id, function() {
		articlesPanel.cfg.setProperty("height", articlesPanel.cfg.getProperty("height"));
	}, articlesPanel, true);
	
	articlesPanel.photoDiv.innerHTML = "<img src='" + result.imgUrl + "' width='206' height='86'>";
	articlesPanel.titleDiv.innerHTML = result.title;

	if ( result.subtitle && result.subtitle != '' )
		articlesPanel.subtitleDiv.innerHTML = result.subtitle;
	
	var links = SOAPClient.getResultAsArray(result.links);
	var linksContent = "";
	if ( links && links != null ) {
		for (var i = 0; i < links.length; i++) {
			linksContent += "<div><a href='javascript:articlesPanel.showArticle(" + links[i].artID + ",\"" + links[i].artGroupType + "\",\"" + links[i].artGroupID + "\");'>" + links[i].text + "</a></div>";
		}
	}

	articlesPanel.linksDiv.innerHTML = linksContent;
	
	articlesPanel.bodyContentDiv.innerHTML = "<div style='position:absolute;padding-right:25px;'>" + result.text + "</div>";
	
	articlesPanel.center();
	YAHOO.util.Dom.setStyle(articlesPanel.element, "top", "150px");	
	articlesPanel.show();
}

ArticlesPanel.prototype.handleSliderChange = function(newOffset) {
	var newTop = newOffset;
	var contentEl = this.bodyContentDiv.firstChild;
	if (contentEl) { 
		var newTop = newOffset * (contentEl.scrollHeight - this.bodyContentDiv.clientHeight) / (this.bodyContentDiv.clientHeight -25);//this.resortSlider.thumb.maxY;
		var newTop = Math.min(-newTop, 0);
		YAHOO.util.Dom.setStyle(contentEl, "top", "" + newTop + "px");
	}
}

YAHOO.util.Event.addListener(window, "load", function() {
	// create div structures
	var articlesPanelDiv = document.createElement("DIV");
	articlesPanelDiv.setAttribute("id", "articlesPanel");
	document.body.appendChild(articlesPanelDiv);
	articlesPanelDiv.innerHTML = 
'			<div class="hd">'
+ '				<div class="logo"><img src="images/articlespanel/vc_logo_229x49.png" width="229" height="49" alt="Vacation Source.com"  style="behavior: url(\'scripts/pngbehavior.htc\');"></div>'
+ '				<span>'
+ '					<a class="print" href="javascript:;">PRINT</a>'
+ '					&nbsp;'
+ '					<a class="send" href="javascript:;">SEND</a>'
+ '					&nbsp;&nbsp;'
+ '					<a class="close" href="javascript:articlesPanel.hide();">CLOSE WINDOW</a>'
+ '				</span>'
+ '			</div>'
+ '			<div class="bd">'
+ '				<div class="yui-content">'
+ '					<div class="centerrail">'
+ '						<div class="photo"></div><div class="title"></div><div class="subtitle"></div>'
+ '						<div style="position:relative;">'
+ '							<div class="artcontent"></div>'
+ '					 		<div class="yui-slider">'
+ '								<div class="yui-sliderhandle">'
+ '									<img src="/images/resortpanel/lthumb.gif" border="0" alt="-">'
+ '								</div>'
+ '							</div>'
+ '						</div>'
+ '					</div>'
+ '					<div class="rightrail">'
+ '						<div class="box">'
+ '							<span class="boxtitle">Select from:</span>'
+ '							<div class="artlist"></div>'
+ '						</div>'
+ '						<div style="float:right;padding-top:20px;"><a class="returnbtn" href="javascript:articlesPanel.hide();">RETURN</a></div>'
+ '					</div>'
+ '					<div style="clear:both;"></div>'
+ '				</div>'
+ '			</div>'
	
	
	articlesPanel = new ArticlesPanel("articlesPanel", { getarticleserviceurl: gGetArticleServiceUrl,
		fixedcenter:false, visible:false,  constraintoviewport:false, underlay: 'none', close: false });
	articlesPanel.render();
});