/* +----------------------------------------------------------------------------+
 * | construct Web Toolkit v0.1						       	|
 * +----------------------------------------------------------------------------+
 * | File: scripts/web.js							|
 * +----------------------------------------------------------------------------+
 * | Copyright (C) 2008 - Ife Okwumabua construct			       	|
 * +----------------------------------------------------------------------------*/

//
// CodaEffects.js - (C) 2007 Panic, Inc.
//
// Used to scroll our tabbed view, display our download popup, and display the giant dialog.
// Requires: Effects.js
//
// Not for redistribution.

// Scroll: Setup Scrolling Stuff
/*
var currentSection = "sites-pane"; // The default loaded section on the page
var tabTag = "-tab";
var paneTag = "-pane";
*/
// Scroll the page manually to the position of element "link", passed to us.

function ScrollSection(link, scrollArea, offset) {
	var lastSection;
	if (link.indexOf("-") > 0) {
		// Store the last section, and update the current section
		if (currentSection == link) {
			return;
		}
		lastSection = currentSection;
		currentSection = link;
	   } else {
		// Store the last section, and update the current section
		if (activeTab == link) {
			return;
		}
		lastSection = activeTab;// = currentSection;
		currentSection = link;
	}

	// Change the section highlight.
	// Extract the root section name, and use that to change the background image to 'top', revealing the alt. state

    sectionTabEL = $(currentSection.split("-")[0] + tabTag);
    //sectionTab
    //alert("sectionTabEL = " + sectionTabEL);
    if (!sectionTabEL) {
    	sectionTabEL = $(currentSection + "Area");
    }
    sectionTabEL.toggleClass("active");
    if (lastSection) {
    	    var lastTabEL;
	    //alert("sectionTabEL.id.indexOf(\"Area\") = " + sectionTabEL.id.indexOf("Area"));
    	    if (sectionTabEL.id.indexOf("Area") > 0) {
	    //document.getElementById(lastTab).className = "inactive";
	    	lastTabEL = $(activeTab + "Area");
	    } else {
	    	lastTabEL = $(lastSection.split("-")[0] + tabTag);
	    }
	    lastTabEL.removeClass("active");
	}

	// Get the element we want to scroll, get the position of the element to scroll to
	theScroll = document.getElementById(scrollArea);
	position = sectionTabEL.offsetLeft; //findElementPos(document.getElementById(link));

	// Get the position of the offset div -- the div at the far left.
	// This is the amount we compensate for when scrolling

	if (offset != "") {
		offsetPos = findElementPos(document.getElementById(offset));
		//position[0] = position[0] - offsetPos[0];
		position = position - offsetPos[0];
	}

	multiplyBy = (scrollingTabArea.unit * scrollingTabArea.multiplier[sectionTabEL.id]);

	scrollStart(theScroll, theScroll.scrollLeft, multiplyBy/*position*/, "vert");
	// return false;
}

// Scroll the page using the arrows

function ScrollArrow(direction, toolbar, scrollArea, offset) {

	toolbarElem = document.getElementById(toolbar);
	toolbarNames = new Array();

	// Find all the <li> elements in the toolbar, and extract their id's into an array.

	if (toolbarElem.hasChildNodes())
	{
		var children = toolbarElem.childNodes;
		for (var i = 0; i < children.length; i++)
		{
			if (toolbarElem.childNodes[i].tagName == "LI") {
				toolbarNames.push(toolbarElem.childNodes[i].id.split("-")[0]);
			}
		}
	}

	// Now iterate through our array of tab names, find matches, and determine where to go.
	for (var i = 0; i < toolbarNames.length; i++) {
		if (toolbarNames[i] == currentSection.split("-")[0]) {
			if (direction == "left") {
				if (i - 1 < 0) {
					gotoTab = toolbarNames[toolbarNames.length - 1];
				} else {
					gotoTab = toolbarNames[i - 1];
				}
			} else {
				if ((i + 1) > (toolbarNames.length - 1)) {
					gotoTab = toolbarNames[0];
				} else {
					gotoTab = toolbarNames[i + 1];
				}
			}
		}
	}

	// Go to the section name!

	ScrollSection(gotoTab+paneTag, scrollArea, offset);

}

//
// Animated Scroll Functions
// Scrolls are synchronous -- only one at a time.
//



function scrollStart(elem, start, end, direction)
{
//	console.log("scrollStart from "+start+" to "+end+" in direction "+direction);

	if (scrollanim.timer != null) {
		clearInterval(scrollanim.timer);
		scrollanim.timer = null;
	}
	scrollanim.time = 0;
	scrollanim.begin = start;
	scrollanim.change = end - start;
	scrollanim.duration = 25;
	scrollanim.element = elem;

	if (direction == "horiz") {
		scrollanim.timer = setInterval("scrollHorizAnim();", 15);
	}
	else {
		scrollanim.timer = setInterval("scrollVertAnim();", 15);
	}
}


/*function scrollAnim() {
	if (scrollanim.time > scrollanim.duration) {
		clearInterval(scrollanim.timer);
		scrollanim.timer = null;
	}
	else {
		move = sineInOut(scrollanim.time, scrollanim.begin, scrollanim.change, scrollanim.duration);
		if (direction == "vertical") {
			scrollanim.element.scrollTop = move;
		   } else {
			scrollanim.element.scrollLeft = move;
		}
		scrollanim.time++;
	}
}*/



function scrollVertAnim() {
	if (scrollanim.time > scrollanim.duration) {
		clearInterval(scrollanim.timer);
		scrollanim.timer = null;
//		console.log(scrollanim.element.id + ".scrollTop = " + scrollanim.element.scrollTop);
	}
	else {
		move = sineInOut(scrollanim.time, scrollanim.begin, scrollanim.change, scrollanim.duration);
		scrollanim.element.scrollTop = move;
		scrollanim.time++;
	}
}

function scrollHorizAnim()
{
	if (scrollanim.time > scrollanim.duration) {
		clearInterval(scrollanim.timer);
		scrollanim.timer = null;
	}
	else {
		move = sineInOut(scrollanim.time, scrollanim.begin, scrollanim.change, scrollanim.duration);
		//scrollanim.element.scrollLeft = move;
		scrollanim.element.style.marginLeft = (move * -1) + "px";
		scrollanim.time++;
	}
}

//
// LARGE POPUP: Full-Screen Pop-up Functions
//

function showLargePopup(elem) {

    var popFullscreen = document.getElementById('fullscreen');
    var popLarge = document.getElementById('largepopup');

	// Put the correct content in the pop-up

	//if (navigator.platform.indexOf('Mac') != -1) {
	//	document.getElementById('start-download').className = 'show';
	//	document.getElementById('wrong-os').className = 'hide';
	//} else {
	//	document.getElementById('start-download').className = 'hide';
	//	document.getElementById('wrong-os').className = 'show';
	//}

 	document.getElementById('start-download').className = 'show';
	// document.getElementById('wrong-os').className = 'hide';

    // Make fullscreen thing really full screen, and show it
    getSize();
    popFullscreen.style.height = myScrollHeight + 'px';
    popFullscreen.style.display = 'block';

    // Position pop-up
    popLarge.style.left = ((myWidth - popLarge.offsetWidth) / 2) + 'px';
    popLarge.style.top = (((myHeight - popLarge.offsetHeight) / 2) + myScroll) + 'px';
    popLarge.style.visibility = 'visible';

    refreshTimer = setTimeout("setLocation('"+elem.getAttribute("href")+"')", 1500);

}

function setLocation(loc) {
	window.location = loc;
}

function hideLargePopup() {
    var popFullscreen = document.getElementById('fullscreen');
    var popLarge = document.getElementById('largepopup');

    popLarge.style.visibility = 'hidden';
    popFullscreen.style.display = 'none';
}

//
// DOWNLOAD SMALL POPUP: Download Hint Pop-up Functions
//
// An advantage of using a timer to do a hide is that we can ignore
// any spurious mouseOut events that have bubbled up, into <td>'s, etc.

var dpopTimer = "";

function showDownloadPopup(e) {
	var popDownload = document.getElementById('dpop');
	var btnDownload = document.getElementById('download');

	if (moveanim.timer != null) {
		clearInterval(moveanim.timer);
		moveanim.timer = null;
	}

	// Determine where we should pop up in relation to the download button

	position = findElementPos(btnDownload);
	popDownload.style.top = (position[1] - (popDownload.offsetHeight - 40)) +"px";
	popDownload.style.left = "5" + "px";

	// If already trigger a rollover, cancel it because we're back in

	if (dpopTimer != "")
	{
		clearTimeout(dpopTimer);
		dpopTimer = "";
	} else {
		setOpacity(0, 'dpop');
		popDownload.style.visibility = 'visible';
		moveStart(popDownload, parseInt(popDownload.style.left), parseInt(popDownload.style.left), parseInt(popDownload.style.top) + 10, parseInt(popDownload.style.top), 15);
		fadeElementSetup('dpop', 0, 100, 13);
	}
}

function hideDownloadPopup() {
	// Start timer to hide the pop-up and the overlay
	dpopTimer = setTimeout("actuallyHide()", 500);
}

function actuallyHide() {
	var popDownload = document.getElementById('dpop');
	if (dpopTimer != "")
	{
		dpopTimer = "";
		moveStart(popDownload, parseInt(popDownload.style.left), parseInt(popDownload.style.left), parseInt(popDownload.style.top), parseInt(popDownload.style.top) - 10, 15);
		fadeElementSetup('dpop', 100, 0, 13, 1);
	}
}

//
// MOVE: Animate the move of an element.
//
// Move is also synchronous. One at a time, please.
//

var moveanim = {time:0, beginX:0, changeX:0.0, beginY:0, changeY:0, duration:0.0, element:null, timer:null};

function moveStart(elem, startX, endX, startY, endY, duration)
{
	if (moveanim.timer != null) {
		clearInterval(moveanim.timer);
		moveanim.timer = null;
	}
	moveanim.time = 0;
	moveanim.beginX = startX;
	moveanim.changeX = endX - startX;
	moveanim.beginY = startY;
	moveanim.changeY = endY - startY;
	moveanim.duration = duration;
	moveanim.element = elem;

	moveanim.timer = setInterval("moveAnimDo();", 15);
}

function moveAnimDo()
{
	if (moveanim.time > moveanim.duration) {
		clearInterval(moveanim.timer);
		moveanim.timer = null;
	}
	else {
		moveX = cubicOut(moveanim.time, moveanim.beginX, moveanim.changeX, moveanim.duration);
		moveY = cubicOut(moveanim.time, moveanim.beginY, moveanim.changeY, moveanim.duration);
		moveanim.element.style.left = moveX + "px";
		moveanim.element.style.top = moveY + "px";
		moveanim.time++;
	}
}

//console.log("Initialized");


// Utility: Find the Y position of an element on a page. Return Y and X as an array
function findElementPos(elemFind) {
	var elemX = 0;
	var elemY = 0;
	do {
		elemX += elemFind.offsetLeft;
		elemY += elemFind.offsetTop;
	} while ( elemFind = elemFind.offsetParent )

	//console.log("Found element "+elemFind+" at "+elemY+"/"+elemX);

	return Array(elemX, elemY);
}


// Utility: Math functions for animation calucations - From http://www.robertpenner.com/easing/
//
// t = time, b = begin, c = change, d = duration
// time = current frame, begin is fixed, change is basically finish - begin, duration is fixed (frames),

function linear(t, b, c, d) {
	return c*t/d + b;
}

function sineInOut(t, b, c, d) {
	return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
}

function cubicIn(t, b, c, d) {
	return c*(t/=d)*t*t + b;
}

function cubicOut(t, b, c, d) {
	return c*((t=t/d-1)*t*t + 1) + b;
}

function cubicInOut(t, b, c, d) {
	if ((t/=d/2) < 1) return c/2*t*t*t + b;
	return c/2*((t-=2)*t*t + 2) + b;
}

function bounceOut(t, b, c, d) {
	if ((t/=d) < (1/2.75)){
		return c*(7.5625*t*t) + b;
	} else if (t < (2/2.75)){
		return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
	} else if (t < (2.5/2.75)){
		return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
	} else {
		return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
	}
}


function changeStage() {
//    alert("hi!");
    if (scrollMap[activeTab]['stages'].length > 0) {
        var deltaName = this.className.replace(/ stage/g, "");
        var oldIndex = scrollMap[activeTab].currentIndex;
        switch (deltaName) {
            case "first":
                scrollMap[activeTab].currentIndex = 0;
            break;
            case "last":
                scrollMap[activeTab].currentIndex = (scrollMap[activeTab]['stages'].length -1);
            break;
            case "next":
            case "prev":
                var deltaVal = 1 * ((deltaName == "prev")?-1:1);
                scrollMap[activeTab].currentIndex = scrollMap[activeTab].currentIndex + deltaVal;
            break;
        }
        scrollMap[activeTab].currentIndex = (scrollMap[activeTab].currentIndex < scrollMap[activeTab]['stages'].length)?((scrollMap[activeTab].currentIndex >=0 )?scrollMap[activeTab].currentIndex:0):(scrollMap[activeTab]['stages'].length-1);

        if (oldIndex != scrollMap[activeTab].currentIndex) {
            var adjustEL = $(activeTab + 'Pane');
            var startValue = (oldIndex * paneWidth);
            var endValue = (scrollMap[activeTab].currentIndex * paneWidth);
            scrollStart(adjustEL, startValue, endValue, 'horiz');
            //alert("Going to the " + deltaName + " stage of the \"" + activeTab + "\" pane. (which is " + scrollMap[activeTab]['stages'][scrollMap[activeTab].currentIndex] + ")");
        }
        return false;
    }
}

	function IPhoneCheckboxes() {
	    return new Class({

			//implements
			Implements: [Options],

			//options
			options: {
				checkedLabel: 'ON',
				uncheckedLabel: 'OFF',
				background: '#fff',
				containerClass: 'iPhoneCheckContainer',
				labelOnClass: 'iPhoneCheckLabelOn',
				labelOffClass: 'iPhoneCheckLabelOff',
				handleClass: 'iPhoneCheckHandle',
				handleBGClass: 'iPhoneCheckHandleBG',
				handleSliderClass: 'iPhoneCheckHandleSlider',
				elements: 'input[type=checkbox]'
			},

			//initialization
			initialize: function(options) {
				//set options
				this.setOptions(options);
				//elements
				this.elements = $$(this.options.elements);
				//observe checkboxes
				this.elements.each(function(el) {
					this.observe(el);
				},this);
			},

			//a method that does whatever you want
			observe: function(el) {
				//turn off opacity
				el.set('opacity',0);
				//create wrapper div
				var wrap = new Element('div',{
					'class': this.options.containerClass
				}).inject(el.getParent());
				//inject this checkbox into it
				el.inject(wrap);
				//now create subsquent divs and labels
				var handle = new Element('div',{'class':this.options.handleClass}).inject(wrap);
				var handlebg = new Element('div',{'class':this.options.handleBGClass,'style':this.options.background}).inject(handle);
				var handleSlider = new Element('div',{'class':this.options.handleSliderClass}).inject(handle);
				var offLabel = new Element('label',{'class':this.options.labelOffClass,text:this.options.uncheckedLabel}).inject(wrap);
				var onLabel = new Element('label',{'class':this.options.labelOnClass,text:this.options.checkedLabel}).inject(wrap);
				var rightSide = wrap.getSize().x - 39;
				//fx instances
				el.offFx = new Fx.Tween(offLabel,{'property':'opacity','duration':200});
				el.onFx = new Fx.Tween(onLabel,{'property':'opacity','duration':200});
				//mouseup / event listening
				wrap.addEvent('mouseup',function() {
					var is_onstate = !el.checked; //originally 0
					var new_left = (is_onstate ? rightSide : 0);
					var bg_left = (is_onstate ? 34 : 0);
					handlebg.hide();
					new Fx.Tween(handle,{
						duration: 100,
						'property': 'left',
						onComplete: function() {
							handlebg.setStyle('left',bg_left).show();
						}
					}).start(new_left);
					//label animations
					if(is_onstate) {
						el.offFx.start(0);
						el.onFx.start(1);
					}
					else {
						el.offFx.start(1);
						el.onFx.start(0);
					}
					//set checked
					el.set('checked',is_onstate);
				});
				//initial load
				if(el.checked){
					offLabel.set('opacity',0);
					onLabel.set('opacity',1);
					handle.setStyle('left',rightSide);
					handlebg.setStyle('left',34);
				} else {
					onLabel.set('opacity',0);
					handlebg.setStyle('left',0);
				}
			}
		});

	}


var inception = "";


// Global Variables
	tabPrefix = "";
	tabSuffix = "Pane";
	tabScrollerContainerID = "viewPort";
	tabScrollerWindowID = "panorama";
	activeTab = "splash";
	var scrollingTabArea;
	var scrollanim = {time:0, begin:0, change:0.0, duration:0.0, element:null, timer:null};
	var paneWidth = 0;
	var scrollMap = {   'splash':   {   'stages': [ 'productStageOne', 'productStageTwo', 'productStageThree' ],
                                      'currentIndex': 0
                                  },
                      'schedule':  {   'stages': [  ],
                                      'currentIndex': 0
                                  },
                      'standings':     {   'stages': [  ],
                                      'currentIndex': 0
                                  },
                      /*'teams':   {   'stages': [ ],
                                      'currentIndex': 0
                                  },*/
                      'stats':  {   'stages': [  ],
                                      'currentIndex': 0
                                  }/*,
                      'privacypolicy':  {   'stages': [  ],
                                      'currentIndex': 0
                                  },
                      'termsconditions':      {   'stages': [  ],
                                      'currentIndex': 0
                                  }*/
                  }
	var mf;
	scrollingTabArea = { unit: 0, multiplier: {} };

  var viewPortEL;
  var containerDimensions = {};
      containerDimensions['width'] = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
      containerDimensions['height'] = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

  var elementCollection = $$("#panorama.content .category");
  var promoBannerEL = $('promoBanner');
  var breadCrumbEL = $("breadCrumb");
  var currentDimensions = { "padding-top": "", "padding-bottom": "", "height": "" };

	function switchTab(chosenTab) {
    var hrefString = "";
	  if (chosenTab) {
      chosenTab.stop();
      hrefString = this.getAttribute("href");
      hrefString = (hrefString == "/")?"/Splash":hrefString;
      chosenTab = ((typeof(chosenTab) == "string")?chosenTab:(typeof(this) == "object")?((hrefString!="")?(hrefString.substring((hrefString.lastIndexOf("/")+1), (hrefString.length))).toLowerCase():this.id):"");
     } else {
      chosenTab = activeTab;
    }

    //alert("let's do this! " + activeTab + "(" + tabSuffix + ") -> " + chosenTab);
    if (chosenTab == "") { // if it's blank, reset the active tabs
      if (activeTab != "") {
        $(activeTab).removeClass("active");
        if ( (activeTab == "splash")&&promoBanner) {
          promoBannerEL.addClass("hideMe");
        }
      }
     } else {
//    if (chosenTab != activeTab) {
//      ScrollSection(chosenTab, 'containerWrapper', 'contentTabAreas');
        if (scrollingTabArea.multiplier[chosenTab + tabSuffix].toString() != "") {
          contentTabAreasEL = $(tabScrollerWindowID);
          contentTabAreasEL.addClass("hideFormElements");
          theScroll = $(tabScrollerContainerID);
          //multiplyBy = (scrollingTabArea.unit * scrollingTabArea.multiplier[chosenTab]);
          //prompt("scrollStart is called using is using: ", (theScroll + ", " + theScroll.scrollTop + ", (" + scrollingTabArea.unit  + " * " +  scrollingTabArea.multiplier  + "[" + chosenTab  + " + " +  tabSuffix + "]), vert") );
  //				console.log(theScroll.scrollTop + " => " + (scrollingTabArea.unit * scrollingTabArea.multiplier[chosenTab + tabSuffix]) + " ~ " + (scrollingTabArea.unit * scrollingTabArea.multiplier[chosenTab + tabSuffix]) );
          newTop = (scrollingTabArea.unit * scrollingTabArea.multiplier[chosenTab + tabSuffix]);
          //newTop = ((newTop>2000)?(newTop - scrollingTabArea.unit):newTop);
          //console.log("theScroll.scrollTop was '" + theScroll.scrollTop + "' and now will be " + newTop);
          //theScroll.scrollTop = newTop;
          //console.log("theScroll.scrollTop set to '" + theScroll.scrollTop);
          $(chosenTab + "Pane").style.marginLeft = "";
          try {
            if (scrollMap[chosenTab]) {
              scrollMap[chosenTab].currentIndex = 0;

              scrollStart(theScroll, theScroll.scrollTop, newTop, "vert");
              $(activeTab).removeClass("active");
              if ( activeTab == "splash" ) {
                bodyEL.removeClass("intro");
                if (promoBannerEL) {
                  promoBannerEL.fade('out');
                }
                if (headerEL) {
                  headerEL.fade('in');
                }
                if (footerEL) {
                  footerEL.fade('in');
                }
                if (breadCrumbEL) {
                  breadCrumbEL.fade('in');
                }
                var sponsorEL = $$(chosenTab + "Pane .sponsor")
                if (sponsorEL) {
                  sponsorEL.fade('in');
                }
              }
      //				$(activeTab + tabSuffix).addClass("hideMe");
              $(chosenTab).addClass("active");
              if ( chosenTab == "splash" ) {
                bodyEL.addClass("intro");
                if (promoBannerEL) {
                  promoBannerEL.fade('in');
                }
                if (headerEL) {
                  headerEL.fade('out');
                }
                if (footerEL) {
                  footerEL.fade('out');
                }
                if (breadCrumbEL) {
                  breadCrumbEL.fade('out');
                }
                var sponsorEL = $$(chosenTab + "Pane .sponsor")
                if (sponsorEL) {
                  sponsorEL.fade('out');
                }
              }
      //				$(chosenTab + tabSuffix).removeClass("hideMe");
              activeTab = chosenTab;
            }
          }catch(noTab){}
        }
//      scrollStart($(activeTab), parseInt($(activeTab).style.marginLeft), 0, 'horiz');
//      contentTabAreasEL.removeClass("hideFormElements");
//     } else {
//      alert(chosenTab + " = " + activeTab);
//    }
    }
  	return false;
	}

	function percisioned() {
    containerDimensions['width'] = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
    containerDimensions['height'] = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    currentDimensions = {   "padding-top":    ((containerDimensions.height * 0.05) + "px"),
                            "padding-bottom": ((containerDimensions.height * 0.18) + "px"),
                            "height":         ((containerDimensions.height * 0.77) + "px")
                        };
	  elementCollection.each( function(targetedEL) {
	    if (targetedEL.hasClass("multiPane")) {
	      var stages = targetedEL.getElements(".pane");
	      targetedEL.setStyle('width', (containerDimensions.width * stages.length) + "px");
	      // (((stages.length > 0)?(stages.length*101):"100")+"%") );
	      stages.setStyle('width', containerDimensions.width + "px");
	      stages.setStyle('height', (containerDimensions.height * 0.75) + "px");
	    }
	    Object.each( currentDimensions, function(styleValue, styleKey) {
	      targetedEL.setStyle(styleKey, styleValue);
        /*targetedEL.setStyle('padding-top', (containerDimensions.height * 0.05) + "px");
        targetedEL.setStyle('padding-bottom', (containerDimensions.height * 0.18) + "px");
        targetedEL.setStyle('height', (containerDimensions.height * 0.77) + "px");*/
      });
	  });
	  paneWidth = containerDimensions.width;
    scrollingTabArea.unit = containerDimensions.height;
	}

	window.addEvent("resize", function(){ percisioned(); switchTab(); });

	window.addEvent("domready", function() {
		$$('.header a, .footer a, #promoBanner a.jump').addEvent('click', switchTab);
		$$('.stage').addEvent('click', changeStage);

    promoBannerEL = $('promoBanner');
    breadCrumbEL = $("breadCrumb");
    headerEL = $("header");
    footerEL = $("footer");
    bodyEL = $("pageID");

		viewPortEL = $("viewPort");
		viewPortEL.scrollTop = 0;

    elementCollection = $$("#panorama.content .category");
	  elementCollection.each( function(targetedEL, indice) {
			scrollingTabArea.multiplier[targetedEL.id] = indice;
    });

    percisioned();

    var scroll = new Fx.Scroll('demo-wrapper', {
      wait: false,
      duration: 2500,
      offset: {'x': -200, 'y': -50},
      transition: Fx.Transitions.Quad.easeInOut
    });

    $('link1').addEvent('click', function(event) {
      event = new Event(event).stop();
      scroll.toElement('content1');
    });

	});

	// Matha 415-572-1975