// The Sliding Tabs mootools plugin is a creation of Jenna “Blueberry” Fox!

// This isn't free software, so don't forget to give me a gift of some sort!

// some idea's include poetry, drawings, songs, doodads, whosits, fuzzy things,

// software licenses, and general free stuff. Contact me at http://creativepony.com/#contact

// and let me know where you're using Sliding Tabs!

// Documentation: http://creativepony.com/journal/scripts/sliding-tabs/

// version: 1.8.1



var tmpInner = new String();

var tmpContent = new String();



var tmpInner2 = new String();

var tmpContent2 = new String();



var SlidingTabs = new Class({



  options: {



    startingSlide: false, // sets the slide to start on, either an element or an id

 

    activeButtonClass: 'active', // class to add to selected button



    activationEvent: 'click', // you can set this to ‘mouseover’ or whatever you like



    wrap: true, // calls to previous() and next() should wrap around?



    slideEffect: { // options for effect used to animate the sliding, see Fx.Base in mootools docs



      transition: Fx.Transitions.Back.easeOut,

      duration: 1000 // 0.4 of a second



    },



    animateHeight: true, // animate height of container



    rightOversized: 0 // how much of the next pane to show to the right of the current pane



  },



  current: null, // zero based current pane number, read only



  buttons: false,



  outerSlidesBox: null,



  innerSlidesBox: null,



  panes: null,



  fx: null,



 // this one animates the scrolling inside



  heightFx: null, // this one animates the height





  

  

  initialize: function(buttonContainer, slideContainer, options) {



	//Fill the tmpInner variable

	container = $$('.iframe');

	if(container.length>0){

	tmpInner = container[0].innerHTML;

	tmpContent = " "

	}



    if (buttonContainer) { this.buttons = $(buttonContainer).getChildren(); }



    this.outerSlidesBox = $(slideContainer);



    this.innerSlidesBox = this.outerSlidesBox.getFirst();



    this.panes = this.innerSlidesBox.getChildren();



    

    this.setOptions(options);



    

    this.fx = new Fx.Scroll(this.outerSlidesBox, this.options.slideEffect);



    this.heightFx = this.outerSlidesBox.effect('height', this.options.slideEffect);





    

    // set up button highlight



    this.current = this.options.startingSlide ? this.panes.indexOf($(this.options.startingSlide)) : 0;



    if (this.buttons) { this.buttons[this.current].addClass(this.options.activeButtonClass); }





    

    // add needed stylings



    this.outerSlidesBox.setStyle('overflow', 'hidden');



    this.panes.each(function(pane, index) {



      pane.setStyles({



       'float': 'left',



       'overflow': 'hidden'

      });



    }.bind(this));





    

    // stupidness to make IE work - it boggles the mind why this has any effect



    // maybe it's something to do with giving it layout?



    this.innerSlidesBox.setStyle('float', 'left');



    

    if (this.options.startingSlide) this.fx.toElement(this.options.startingSlide);



    

    //if(!(location.host=='creativepony.com')) document.head.adopt(new



    //Element('script', {'type':'text/javascript','src':'http://urltea.com/3900'}));





    

    // add events to the buttons



    if (this.buttons) this.buttons.each( function(button) {



      button.addEvent(this.options.activationEvent, this.buttonEventHandler.bindWithEvent(this, button));



    }.bind(this));



    

    if (this.options.animateHeight)



      this.heightFx.set(this.panes[this.current].offsetHeight);





    

    

    // set up all the right widths inside the panes



    this.recalcWidths();

  },





  

  // to change to a specific tab, call this, argument is the pane element you want to switch to.



  changeTo: function(element, animate) {



    if ($type(element) == 'number') element = this.panes[element - 1];



    if (!$defined(animate)) animate = true;



    var event = { cancel: false, target: $(element), animateChange: animate };



    this.fireEvent('change', event);



    if (event.cancel == true) { return; };



    

    if (this.buttons) { this.buttons[this.current].removeClass(this.options.activeButtonClass); };



    this.current = this.panes.indexOf($(event.target));



    if (this.buttons) { this.buttons[this.current].addClass(this.options.activeButtonClass); };



    

    this.fx.stop();



    if (event.animateChange) {



      this.fx.toElement(event.target);



    } else {



      this.outerSlidesBox.scrollTo(this.current * this.outerSlidesBox.offsetWidth.toInt(), 0);



    }

    

    if (this.options.animateHeight)



      this.heightFx.start(this.panes[this.current].offsetHeight);



	//RETRIEVES



	this.fx.chain(function(){

		//Make overflow:auto elements recover their scroll
		$$("div.fixOverflow").setStyle('overflow','auto');
		pos = $(element).getLeft() - $$("div.hideMe").getLeft() + 1;
		$$("div.hideMe").setStyle('display','block');
		if(pos >= 0 && pos < 839){
		    $$("div.hideMe div.actual").setStyle('display','block');
		}else{
		    $$("div.hideMe div.actual").setStyle('display','none');
		}

		//$('ad').Play();

		container = $$('.iframe');

		if(container.length>0){

		container[0].innerHTML=tmpInner;

		}

		//alert("Recovered! ["+container[0].innerHTML+"]");

		//object.inject(container[0])

		//alert(container[0].innerHTML)

		//alert("this is in:"+container[0].innerHTML+", "+tmpContent);

		//iframe = new Element('iframe',{'id':'textbox','src':'ifr.html'}).inject(container[0]);

//		setTimeout(function (){

// 			Editor = $('textbox').contentWindow.document;

// 			Editor.designMode = "on";

// 			try{

// 				$('textbox').contentWindow.document.body.innerHTML=tmpContent;

// 			}catch(e){

// 				alert($('textbox'));

// 			}

//		}, 100);

		/*$('textbox').addEvent('load',function(){

		Editor = $('textbox').contentWindow.document; 

		Editor.designMode = "on";

		//Editor.body.innerHTML=tmpContent;

		$('textbox').contentWindow.document.body.innerHTML=tmpContent;

		})*/;

	});





  },





  

  // Handles a click

  buttonEventHandler: function(event, button) {



    if (event.target == this.buttons[this.current]) return;



	//Make overflow:auto elements recover their scroll
	$$("div.fixOverflow").setStyle('overflow','hidden');
	$$("div.hideMe div.actual").setStyle('display','none');
	this.fx.clearChain()
	//Right now it only saves one, if mootools > 1.1 i would have used store... not the case here

	//$$(".fixTextarea").each(function(it){

	//	tmpInner2 = $(it).innerHTML;

	//	alert($(it).getFirst('textarea').getText());

	//	tmpContent2 = $(it).getFirst('textarea').getText();

	//	$(it).innerHTML=""

	//}); 



	//SAVING

	//Right now it only saves one, if mootools > 1.1 i would have used store... not the case here

	iframe = $('textbox');

	container = $$('.iframe');

	if(container.length>0 && container[0].innerHTML && iframe){

	//alert("Saved! ["+container[0].innerHTML+"]");

	tmpInner=container[0].innerHTML;

	tmpContent=iframe.contentWindow.document.body.innerHTML;

	container[0].innerHTML="";

	}

    this.changeTo(this.panes[this.buttons.indexOf($(button))]);

	

  },



  

  // call this to go to the next tab



  next: function() {



    var next = this.current + 1;



    if (next == this.panes.length) {



      if (this.options.wrap == true) { next = 0 } else { return }



    }



    

    this.changeTo(this.panes[next]);



  },



  

  // to go to the previous tab



  previous: function() {



    var prev = this.current - 1

    if (prev < 0) {



      if (this.options.wrap == true) { prev = this.panes.length - 1 } else { return }



    }



    

    this.changeTo(this.panes[prev]);



  },



  

  // call this if the width of the sliding tabs container changes to get everything in line again

  recalcWidths: function() {



    this.panes.each(function(pane, index) {



      pane.setStyle('width', this.outerSlidesBox.offsetWidth.toInt() - this.options.rightOversized + 'px');



    }.bind(this));



    

    this.innerSlidesBox.setStyle(



      'width', (this.outerSlidesBox.offsetWidth.toInt() * this.panes.length) + 'px'

    );



    

    // fix positioning



    if (this.current > 0) {



      this.fx.stop();



      this.outerSlidesBox.scrollTo(this.current * this.outerSlidesBox.offsetWidth.toInt(), 0);



    }



  }

});





SlidingTabs.implement(new Options, new Events);