/**
 * @author Brian
 * $description: create accordian display for nested elements
 */

/*
 * Requires - 
 * 		bblib.js
 * 		prototype.js
 * 
 * Constructor - creates new accordian given:
 * 		@el: 	root [DOM element] representing the root element in the page that contains the nesting
 * 		@opts	options [object] optional object containing any of the following attributes
 * 			@speed:  	[positive integer] defaults to 1 -  represents thespeed of the animation, Higher numbers are faster
 * 			@height:	[positive integer] defaults to 200 - represents the inner height of the display of each "page" of the widget.
 * 			@opentab:	[0 based positive integer] defaults to 0 - represents the initial tab to be open when loaded.
 */
if(typeof bblib == 'undefined'){bblib = {};}

		bblib.accordianDisplay = function (el,opts){
			this.targetElement = el;
			this.targetElement.style.position = 'relative';
			this.targetElement.style.overflow = 'hidden';
			this.pageHeight = (opts && opts.height)?opts.height:200;
			this.setPageHeight = function(h){
				this.pageHeight = h;
				
				this.reset();
			}
			this.speed = (opts && opts.speed)?opts.speed:1;
			this.setSpeed = function(s){
				this.speed = s;
				this.pages = this.initPages();
			}
			this.openTab = (opts && opts.opentab)?opts.opentab:0;
			this.pages = [];
			var self = this;
			this.setOverallHeight();
		}
		bblib.accordianDisplay.prototype.setOpenTab = function (t){
			if(t != this.openTab){
				
				for(var e=0; e<this.pages.length; e++){
					if(e<=t){
						//console.info('raise '+e)
						this.pages[e].raise(t);
					} else {
						//console.info('lower '+e)
						this.pages[e].lower(t);
					}
				}
			}
			Element.removeClassName(this.pages[this.openTab].el,'open');
			Element.addClassName(this.pages[t].el,'open');
			this.openTab = t;
		}
		bblib.accordianDisplay.prototype.setOverallHeight = function (){
			if(this.pages.length > 0){
				this.targetElement.style.height = ((this.pages.length*this.tbHeight)+this.pageHeight)+'px';
			} else {
				this.targetElement.style.height = '1px';
			}
		}
		bblib.accordianDisplay.prototype.reset = function (){
			for(var p=0; p<this.pages.length; p++){
				this.pages[p].el.style.height = (this.pageHeight+this.tbHeight)+'px';
			}
			this.setOverallHeight();
		}

		// Method for creating pagesets objects within the accordianDisplay object.
		bblib.accordianDisplay.prototype.createPage = function (title, content){
				var p = this.pages.length+1;
				var self = this;
				var title = (title && title != '')?title:'&#160;';
				var newpage = document.createElement('span');
				newpage.className = 'tabel';
				var tb = document.createElement('div');
				var inner = document.createElement('div');
				tb.posit = p-1;
				tb.master = self;
				tb.className = 'tb';
				tb.innerHTML = title;
				inner.className= 'inner';
				newpage.appendChild(tb);
				newpage.appendChild(inner);
				newpage.style.position='absolute';
				this.titlebar = tb;
				this.targetElement.appendChild(newpage);
				this.tbHeight = tb.offsetHeight;
				
				this.pages.push(new this.page(newpage, tb, self, p));
			
				newpage.style.top = ((this.pages.length-1)*this.tbHeight)+'px';
				newpage.style.height = (this.pageHeight+this.tbHeight)+'px';
				this.targetElement.style.height = (this.pageHeight+(this.pages.length*this.tbHeight))+'px';
				Event.observe(tb, 'click', function(e){
					var trgt = (e.target)?e.target.posit:e.srcElement.posit;
					var master = (e.target)?e.target.master:e.srcElement.master;
					master.setOpenTab(trgt);
				});
				Event.observe(tb, 'mouseover', function(e){
					var trgt = (e.target)?e.target:e.srcElement;
					Element.addClassName(trgt,'over');
				});
				Event.observe(tb, 'mouseout', function(e){
					var trgt = (e.target)?e.target:e.srcElement;
					Element.removeClassName(trgt,'over');
				});
				this.setOpenTab(this.pages.length-1);
				return this.pages[this.pages.length-1];
			}
		bblib.accordianDisplay.prototype.page = function(newpage, tb, self, p){
			this.p = p;
			this.el = newpage;
			this.upY = function(){
				return ((p - 1) * self.tbHeight);
			}
			this.downY = function(){
				return ((p - 1) * self.tbHeight + self.pageHeight);
			}
			this.el = newpage;
			this.titlebar = tb;
			this.speed = self.speed;
			this.setTitle = function(title){tb.innerHTML = title;};
			this.contentElement = this.el.childNodes[1];
			this.lower = function(t){
				bblib.transitions.yPos(this.el,{finish:this.downY(), speed:this.speed});
			};
			this.raise = function(t){
				bblib.transitions.yPos(this.el,{finish:this.upY(), speed:this.speed});
			};
			this.replaceContent = function(content){
				this.contentElement.innerHTML = '';
				if(content && typeof content == 'string') this.contentElement.innerHTML = content;
				else if(content && typeof content == 'object') this.contentElement.appendChild(content);
			};
			this.appendContent = function(content){
				if(content && typeof content == 'string') this.contentElement.innerHTML = this.contentElement.innerHTML+content;
				else if(content && typeof content == 'object') this.contentElement.appendChild(content);
			};
			return this;
		};


