// when the DOM is ready...
$(document).ready(function () {

    var $panels = $('#slider .scrollContainer > div');
	var $scroller1 = $('#slider.onerow .scroll');
	var $scroller2 = $('#slider.tworow .scroll');
    var $container = $('#slider .scrollContainer');

    // if false, we'll float all the panels left and fix the width 
    // of the container
    var horizontal = true;

    // float the panels left if we're going horizontal
    if (horizontal) {
        $panels.css({
            'float' : 'left',
			'margin-right' : '10px',
            'position' : 'relative' // IE fix to ensure overflow is hidden
        });

        // calculate a new width for the container (so it holds all panels)
        $container.css('width', ($panels[0].offsetWidth + 10) * $panels.length + 50);
        $scroller1.css('width', 830);
        $scroller2.css({
			'width' : '830px',
			'height' : '440px'
		});
    }

    // collect the scroll object, at the same time apply the hidden overflow
    // to remove the default scrollbars that will appear
    var $scroll = $('#slider .scroll').css('overflow', 'hidden');


    // handle nav selection
    function selectNav() {
        $(this)
            .parents('ul:first')
                .find('a')
                    .removeClass('selected')
                .end()
            .end()
            .addClass('selected');
    }

    $('#slider .navigation').find('a').click(selectNav);

    // go find the navigation link that has this target and select the nav
    function trigger(data) {
        var el = $('#slider .navigation').find('a[href$="' + data.id + '"]').get(0);
        selectNav.call(el);
    }

    if (window.location.hash) {
        trigger({ id : window.location.hash.substr(1) });
    } else {
        $('ul.navigation a:first').click();
    }

    // offset is used to move to *exactly* the right place, since I'm using
    // padding on my example, I need to subtract the amount of padding to
    // the offset.  Try removing this to get a good idea of the effect
    var offset = parseInt((horizontal ? 
        $container.css('paddingTop') : 
        $container.css('paddingLeft')) 
        || 0) * -1;


    var scrollOptions = {
        target: $scroll, // the element that has the overflow
        items: $panels,
        navigation: '.navigation a',
        axis: 'xy',
        onAfter: trigger, // our final callback
        offset: offset,
        duration: 2000,
        easing: 'easeOutQuart'
    };

    // apply serialScroll to the slider - we chose this plugin because it 
    // supports// the indexed next and previous scroll along with hooking 
    // in to our navigation.
    $('#slider').serialScroll(scrollOptions);

    // now apply localScroll to hook any other arbitrary links to trigger 
    // the effect
    $.localScroll(scrollOptions);

    // finally, if the URL has a hash, move the slider in to position, 
    // setting the duration to 1 because I don't want it to scroll in the
    // very first page load.  We don't always need this, but it ensures
    // the positioning is absolutely spot on when the pages loads.
    scrollOptions.duration = 1;
    $.localScroll.hash(scrollOptions);
/*
	$.sifr({
		path: '/_inc/',
		save: true
	});
	$('div#controller li span a').sifr({ font: 'din-mittelschrift' });
*/
	$('div.scrollContainer').addClass('fadein').fadeIn(1000);

});

/* Touch controls for iPhone/iPod Touch
---------------------------------------------------*/

/*****************************************************
 Author:                              Matthew Congrove
 More Information:               mydailyphoto.com/blog
 
 Modified by:					 Jim Thorpe, HyperArts

******************************************************/

/*****************************************************

 NOTICE:
 
 Vertical scrolling is disabled using the Touch API
 (e.preventDefault). This means that it is
 impossible for a user to access the window location
 bar on the iPhone, so please be kind and provide some
 sort of 'Close' button, or modify the script to suit
 your needs, as well as those of your users.
 
******************************************************/

var touching, dPrevious, dCurrent, dNext, oX;

// Whether or not the finger is touching the screen
touching = false;

// Original X-coordinate
oX = 0;

// Initial page numbers
dPrevious = 0;
dCurrent = 1;
dNext = 2;

// Apple iPhone Touch API events
document.addEventListener('touchstart', touchHandler, false);
document.addEventListener('touchmove', touchHandler, false);
document.addEventListener('touchend', touchHandler, false);
document.addEventListener('touchcancel', touchHandler, false);

// The handler for all Apple iPhone Touch API events
function touchHandler(e) {
	// If the user has started a touch event
	if (e.type == "touchstart") {
		touching = true;
		// If there's only one finger touching
		if (e.touches.length == 1) {
			var touch = e.touches[0];
			// If they user tries clicking on a link
			if(touch.target.onclick) {
				touch.target.onclick();
			}
			// The originating X-coord (point where finger first touched the screen)
			oX = touch.pageX;
			// Reset default values for current X-coord and scroll distance
			nX = 0;
			scrollX = 0;
			/* Debugging document.getElementById('dir').innerHTML = 'Direction: Null'; */
			/* Debugging document.getElementById('oX').innerHTML = 'Start X-Coord: '+oX+'px'; */
		}
	}
	// If the user has touched the screen and moved the finger
	else if (e.type == "touchmove") {
		// Prevent the default scrolling behaviour (notice: This disables vertical scrolling as well)
		e.preventDefault();

		// If there's only one finger touching
		if (e.touches.length == 1) {
			var touch = e.touches[0];
			// The current X-coord of the users finger
			var nX = touch.pageX;
			/* Debugging document.getElementById('nX').innerHTML = 'Current X-Coord: '+nX+'px'; */
			
			// If the user moved the finger from the right to the left
			if (oX > nX) {
				// Find the scrolling distance
				var scrollX = oX-nX;
				/* Debugging document.getElementById('scrollX').innerHTML = 'Scroll Distance: '+scrollX+'px'; */
				// If the user scrolled more than 100 pixels
				if (scrollX > 100) {
					/* Debugging document.getElementById('dir').innerHTML = 'Direction: Flicked Left'; */
					// If the next DIV exists then continue
					if (document.getElementById('panel'+dNext)) {
						// If this is still from the original touch
						if (touching == true)
						{
							// End the current touch
							touching = false;
							// Move in the next DIV
							$('#controller a.flip'+dNext).click();
							// Recalculate the pages
							dPrevious = dCurrent;
							dCurrent = dNext;
							dNext = dNext+1;
							/* Debugging alertIt(); */
						}
					}
				}
			// If the user moved the finger from the left to the right
			} else {
				// Find the scrolling distance
				var scrollX = nX-oX;
				/* Debuggingdocument.getElementById('scrollX').innerHTML = 'Scroll Distance: '+scrollX+'px'; */ 
				// If the user scrolled more than 100 pixels
				if (scrollX > 100) {
					/* Debuggingdocument.getElementById('dir').innerHTML = 'Direction: Flicked Right'; */ 
					// If the previous page isn't 0, in other words there's a previous page to the left
					if (dPrevious != 0) {
						// If this is still from the original touch
						if (touching == true) {
							// End the current touch
							touching = false;
							// Move in the previous DIV
							$('#controller a.flip'+dPrevious).click();
							// Recalculate the pages
							dNext = dCurrent;
							dCurrent = dPrevious;
							dPrevious = dPrevious-1;
							/* Debugging alertIt(); */
						}
					}
				}
			}
		}
	}
	// If the user has removed the finger from the screen
	else if (e.type == "touchend" || e.type == "touchcancel") {
		// Defines the finger as not touching
		touching = false;
	}
}
/* Debug Results Display DIV */
function alertIt() {
	document.getElementById('divPrev').innerHTML = 'Previous Page: '+dPrevious;
	document.getElementById('divCurrent').innerHTML = 'Current Page: '+dCurrent;
	document.getElementById('divNext').innerHTML = 'Next Page: '+dNext;
}