bxb.nxe = function(){
	ignoreNext = false;
	  return{
		init: function(){
			this.reflexHeight = 40;
			//if(Ext.isIE){
			//	addIEReflex();
			//} else {
			//	addReflex();
			//}
			this.box = Ext.get('dash');
			this.els = this.box.select('div.channel', true);
			this.boxTL = this.box.getXY();
			this.pbox = Ext.get('staff-profile');
			this.profiles = this.pbox.select('div.profile', true);
			this.profiles.enableDisplayMode();
			this.profiles.hide();
			//if(Ext.isIE){
//				addRoundedIECorners();
			//} else {
//				addRoundedCorners();
			//}
				
			this.box.on('click', this.handleBoxClick, this);
				
			this.controls = this.box.down('div.controls').show();
			this.controls.setXY([this.boxTL[0]+400, this.boxTL[1]+280], false);
			this.controls.on('click', this.handleControlClick, this);
			
			this.els.each(function(el, ar, idx){
				el.show();
			}, this);

			this.doDisplay(false);
		},
		calcPos: function(idx){
		    this.boxTL = this.box.getXY();
		    this.sizes = {'0' : {'width': 150, 'height': 300, 'x': this.boxTL[0],     'y': this.boxTL[1]},
				 		  '1' : {'width': 120, 'height': 249, 'x': this.boxTL[0]+155, 'y': this.boxTL[1]+25},
				 		  '2' : {'width': 90, 'height': 181, 'x': this.boxTL[0]+290, 'y': this.boxTL[1]+55},
				 		  '3' : {'width': 63, 'height': 123,  'x': this.boxTL[0]+400, 'y': this.boxTL[1]+75}
			};
			return this.sizes[idx];
				
				
		},
		handleControlClick: function(ev,el){
		    if(el.alt){
			    this[el.alt]();
			}
		},
		handleBoxClick: function(ev, el){
			if(this.ignoreNext){
				return false;
			}
			var p =	Ext.get(el).up('div.channel');
			if(p){
				// get the idx of the clicked item, first one (main) is 0.
				var idx = this.els.indexOf(p);
				if(idx > 0){
					this.focusOn(idx);
				} /*else {
					//they have clicked on the main channel, go to it's linked article
					window.location.href = 'viewarticle.php?id=' + p.dom.getAttribute('link');
				}*/
			}
		},
		focusOn: function(idx){
			for(f=idx; f>0; f--){
				var first = this.els.first();
				this.els.removeElement(first, false);
				this.els.add(first);
				
				var firstProfile = this.profiles.first();
				this.profiles.removeElement(firstProfile, false);
				this.profiles.add(firstProfile);
			}
			this.doDisplay(true);
		},
		animOver: function(el, anim){
			el.child('div').show();
			var p =	Ext.get(el).up('div.channel');
			if(anim == 0){
			    el.child('div.subheadline').show();
				this.profiles.elements[anim].show();
			}
			// hide all profiles, show current  one
			this.ignoreNext = false;
		},
		next: function(){
			// pop off the first el in the array and put it on the end.
			// animate the first one off the screen, then unanimate to the end of the list.
			if(this.ignoreNext){
				return false;
			}
			this.ignoreNext = true;
			//animate the first one off the page to the left
			var first = this.els.first();
			this.els.removeElement(first, false);
			
			var firstProfile = this.profiles.first();
			this.profiles.removeElement(firstProfile, false);
			this.profiles.add(firstProfile);
			
			this.doDisplay(true);
			this.els.add(first);
			this.setPos(first, 3, true);
		},
		previous: function(){
			if(this.ignoreNext){
				return false;
			}
			this.ignoreNext = true;
			var last = this.els.last();
			this.els.removeElement(last, false);
			this.els.elements.splice(0,0,last);
			
			var lastProfile = this.profiles.last();
			this.profiles.removeElement(lastProfile, false);
			this.profiles.elements.splice(0,0,lastProfile);
			
			this.doDisplay(true);
		},
		doDisplay: function(anim){
			this.profiles.hide();
			this.els.each(function(el, ar, idx){
				this.setPos(el, idx, anim);
			}, this);
		},
		setPos: function(el, idx, anim){
			
		   // this.boxTL = this.box.getXY();
			var anim = (anim) ? {easing: 'easeOut', duration: .4} : false;
			var animL = (anim) ? {easing: 'easeOut', duration: .4, callback: function(el){this.animOver(el,idx)}, scope: this} : {duration:0, callback: function(el){this.animOver(el,idx)}, scope: this};

			el.child('div').hide();  // hide text while it resizes, looks much neater.
			el.child('div.subheadline').hide();
			el.syncFx().scale(this.calcPos(idx).width, this.calcPos(idx).height, anim).moveTo(this.calcPos(idx).x, this.calcPos(idx).y, animL).removeClass(['p1','p2','p3','p4']).addClass('p'+(idx+1));
			el.first().scale(this.calcPos(idx).width, this.calcPos(idx).height, anim);
		}
	  };
}();