// jquery.jparallax.js
// 0.9.1
// Stephen Band
//
// Dependencies:
// jQuery 1.2.6 (jquery.com)
//
// Project and documentation site:
// http://webdev.stephband.info/parallax.html


// CLOSURE

(function(jQuery) {


    // PRIVATE FUNCTIONS

    function stripFiletype(ref) {
        var x=ref.replace('.html', '');
        return x.replace('#', '');
    }

    function initOrigin(l) {
        if (l.xorigin=='left')	{
            l.xorigin=0;
        }	else if (l.xorigin=='middle' || l.xorigin=='centre' || l.xorigin=='center')	{
            l.xorigin=0.5;
        }	else if (l.xorigin=='right')	{
            l.xorigin=1;
        }
        if (l.yorigin=='top')		{
            l.yorigin=0;
        }	else if (l.yorigin=='middle' || l.yorigin=='centre' || l.yorigin=='center')	{
            l.yorigin=0.5;
        }	else if (l.yorigin=='bottom')	{
            l.yorigin=1;
        }
    }

    function positionMouse(mouseport, localmouse, virtualmouse) {

        var difference = {
            x: 0, 
            y: 0, 
            sum: 0
        };
  
        // Set where the virtual mouse is, if not on target
        if (!mouseport.ontarget) {
    
            // Calculate difference
            difference.x    = virtualmouse.x - localmouse.x;
            difference.y    = virtualmouse.y - localmouse.y;
            difference.sum  = Math.sqrt(difference.x*difference.x + difference.y*difference.y);
    
            // Reset virtualmouse
            virtualmouse.x = localmouse.x + difference.x * mouseport.takeoverFactor;
            virtualmouse.y = localmouse.y + difference.y * mouseport.takeoverFactor;
    
            // If mouse is inside the takeoverThresh set ontarget to true
            if (difference.sum < mouseport.takeoverThresh && difference.sum > mouseport.takeoverThresh*-1) {
                mouseport.ontarget=true;
            }
        }
        // Set where the layer is if on target
        else {
            virtualmouse.x = localmouse.x;
            virtualmouse.y = localmouse.y;
        }
    }

    function setupPorts(viewport, mouseport) {

        var offset = mouseport.element.offset();
		
        jQuery.extend(viewport, {
            width: 		viewport.element.width(),
            height: 	viewport.element.height()
        });
  
        jQuery.extend(mouseport, {
            width:		mouseport.element.width(),
            height:		mouseport.element.height(),
            top:			offset.top,
            left:			offset.left
        });
    }

    function parseTravel(travel, origin, dimension) {
  
        var offset;
        var cssPos;
  
        if (typeof(travel) === 'string') {
            if (travel.search(/^\d+\s?px$/) != -1) {
                travel = travel.replace('px', '');
                travel = parseInt(travel, 10);
                // Set offset constant used in moveLayers()
                offset = origin * (dimension-travel);
                // Set origin now because it won't get altered in moveLayers()
                cssPos = origin * 100 + '%';   
                return {
                    travel: travel, 
                    travelpx: true, 
                    offset: offset, 
                    cssPos: cssPos
                };
            }
            else if (travel.search(/^\d+\s?%$/) != -1) {
                travel.replace('%', '');
                travel = parseInt(travel, 10) / 100;
            }
            else {
                travel=1;
            }
        }
        // Set offset constant used in moveLayers()
        offset = origin * (1 - travel);
        return {
            travel: travel, 
            travelpx: false, 
            offset: offset
        }
    }

    function setupLayer(layer, i, mouseport) {

        var xStuff;
        var yStuff;
        var cssObject = {};

        layer[i]=jQuery.extend({}, {
            width:		layer[i].element.width(),
            height:		layer[i].element.height()
        }, layer[i]);

        xStuff = parseTravel(layer[i].xtravel, layer[i].xorigin, layer[i].width);
        yStuff = parseTravel(layer[i].ytravel, layer[i].yorigin, layer[i].height);
        jQuery.extend(layer[i], {
            // Used in triggerResponse
            diffxrat:    mouseport.width / (layer[i].width - mouseport.width),
            diffyrat:    mouseport.height / (layer[i].height - mouseport.height),
            // Used in moveLayers
            xtravel:     xStuff.travel,
            ytravel:     yStuff.travel,
            xtravelpx:   xStuff.travelpx,
            ytravelpx:   yStuff.travelpx,
            xoffset:     xStuff.offset,
            yoffset:     yStuff.offset
        });
  
        // Set origin now if it won't be altered in moveLayers()
        if (xStuff.travelpx) {
            cssObject.left = xStuff.cssPos;
        }
        if (yStuff.travelpx) {
            cssObject.top = yStuff.cssPos;
        }
        if (xStuff.travelpx || yStuff.travelpx) {
            layer[i].element.css(cssObject);
        }
    }

    function setupLayerContents(layer, i, viewportOffset) {

        var contentOffset;

        // Give layer a content object
        jQuery.extend(layer[i], {
            content: []
        });
        // Layer content: get positions, dimensions and calculate element offsets for centering children of layers
        for (var n=0; n<layer[i].element.children().length; n++) {
	  
            if (!layer[i].content[n])          layer[i].content[n]             = {};
            if (!layer[i].content[n].element)  layer[i].content[n]['element']  = layer[i].element.children().eq(n);
	  
            // Store the anchor name if one has not already been specified.  You can specify anchors in Layer Options rather than html if you want.
            if(!layer[i].content[n].anchor && layer[i].content[n].element.children('a').attr('name')) {
                layer[i].content[n]['anchor'] = layer[i].content[n].element.children('a').attr('name');
            }
	  
            // Only bother to store child's dimensions if child has an anchor.  What's the point otherwise?
            if(layer[i].content[n].anchor) {
                contentOffset = layer[i].content[n].element.offset();
                jQuery.extend(layer[i].content[n], {
                    width: 		layer[i].content[n].element.width(),
                    height:		layer[i].content[n].element.height(),
                    x:			  contentOffset.left - viewportOffset.left,
                    y:			  contentOffset.top - viewportOffset.top
                });
                jQuery.extend(layer[i].content[n], { 
                    posxrat:  (layer[i].content[n].x + layer[i].content[n].width/2) / layer[i].width,
                    posyrat:  (layer[i].content[n].y + layer[i].content[n].height/2) / layer[i].height
                });
            }
        }
    }

    function moveLayers(layer, xratio, yratio) {

        var xpos;
        var ypos;
        var cssObject;
	
        for (var i=0; i<layer.length; i++) {
    
            // Calculate the moving factor
            xpos = layer[i].xtravel * xratio + layer[i].xoffset;
            ypos = layer[i].ytravel * yratio + layer[i].yoffset;
            cssObject = {};
            // Do the moving by pixels or by ratio depending on travelpx
            if (layer[i].xparallax) {
                if (layer[i].xtravelpx) {
                    cssObject.marginLeft = xpos * -1 + 'px';
                } 
                else {
                    cssObject.left = xpos * 100 + '%';
                    cssObject.marginLeft = xpos * layer[i].width *-1 + 'px';
                }
            }
            if (layer[i].yparallax) {
                if (layer[i].ytravelpx) {
                    cssObject.marginTop = ypos * -1 + 'px';
                }
                else {
                    cssObject.top = ypos * 100 + '%';
                    cssObject.marginTop = ypos * layer[i].height * -1 + 'px';
                }
            }
            layer[i].element.css(cssObject);
        }
    }

    // PLUGIN DEFINITION **********************************************************************

    jQuery.fn.jparallax = function(options) {
	
        // Organise settings into objects (Is this a bit of a mess, or is it efficient?)
        var settings = jQuery().extend({}, jQuery.fn.jparallax.settings, options);
        var settingsLayer = {
            xparallax:				settings.xparallax,
            yparallax:				settings.yparallax,
            xorigin:					settings.xorigin,
            yorigin:					settings.yorigin,
            xtravel:          settings.xtravel,
            ytravel:          settings.ytravel
        };
        var settingsMouseport = {
            element:					settings.mouseport,
            takeoverFactor:		settings.takeoverFactor,
            takeoverThresh:		settings.takeoverThresh
        };
        if (settings.mouseport) settingsMouseport['element'] = settings.mouseport;
	
        // Populate layer array with default settings
        var layersettings = [];
        for(var a=1; a<arguments.length; a++) {
            layersettings.push( jQuery.extend( {}, settingsLayer, arguments[a]) );
        }
	
        // Iterate matched elements
        return this.each(function() {

            // VAR
    
            var localmouse = {
                x:				0.5,
                y:				0.5
            };
		
            var virtualmouse = {
                x:				0.5,
                y:				0.5
            };
		
            var timer = {
                running:		false,
                frame:			settings.frameDuration,
                fire:				function(x, y) {
                    positionMouse(mouseport, localmouse, virtualmouse);
                    moveLayers(layer, virtualmouse.x, virtualmouse.y);
                    this.running = setTimeout(function() {
                        if ( localmouse.x!=x || localmouse.y!=y || !mouseport.ontarget ) {
                            timer.fire(localmouse.x, localmouse.y);
                        }
                        else if (timer.running) {
                            timer.running=false;
                        }
                    }, timer.frame);
                }
            };

            var viewport	=	{
                element: jQuery(this)
                };		

            var mouseport = jQuery.extend({}, {
                element: viewport.element
                }, settingsMouseport, {
                xinside:          false,		// is the mouse inside the mouseport's dimensions?
                yinside:	        false,
                active:		        false,		// are the mouse coordinates still being read?
                ontarget:         false			// is the top layer inside the takeoverThresh?
            });
    
            var layer			= [];
    
            // FUNCTIONS
    
            function matrixSearch(layer, ref, callback) {
                for (var i=0; i<layer.length; i++) {
                    var gotcha=false;
                    for (var n=0; n<layer[i].content.length; n++) {
                        if (layer[i].content[n].anchor==ref) {
                            callback(i, n);
                            return [i, n];
                        }
                    }
                }
                return false;
            }
    
            // RUN
    
            setupPorts(viewport, mouseport);
		
            // Cycle through and create layers
            for (var i=0; i<viewport.element.children().length; i++) {
                // Create layer from settings if it doesn't exist
                layer[i]=jQuery.extend({}, settingsLayer, layersettings[i], {
                    element:	viewport.element.children('*:eq('+i+')')
                });
			
                setupLayer(layer, i, mouseport);
      
                if (settings.triggerResponse) {
                    setupLayerContents(layer, i, viewport.element.offset());
                }
            }
		
		
    
            // Set up layers CSS and initial position
            viewport.element.children().css('position', 'absolute');
            moveLayers(layer, 0.5, 0.5);
		
            // Mouse Response
            if (settings.mouseResponse) {
                jQuery(window).mousemove(function(mouse){
                    // Is mouse inside?
                    mouseport.xinside = ((mouse.pageX >= mouseport.left && mouse.pageX < mouseport.width+mouseport.left) || settings.mouseActiveOutside) ? true : false;
                    mouseport.yinside = ((mouse.pageY >= mouseport.top  && mouse.pageY < mouseport.height+mouseport.top) || settings.mouseActiveOutside) ? true : false;
                    // Then switch active on.
                    if (mouseport.xinside && mouseport.yinside && !mouseport.active) {
                        mouseport.ontarget = false;
                        mouseport.active = true;
                    }
                    // If active is on give localmouse coordinates
                    if (mouseport.active) {
                        if (mouseport.xinside) {
                            localmouse.x = (mouse.pageX - mouseport.left) / mouseport.width;
                        }
                        else {
                            localmouse.x = (mouse.pageX < mouseport.left) ? 0 : 1;
                        }
                        if (mouseport.yinside) {
                            localmouse.y = (mouse.pageY - mouseport.top) / mouseport.height;
                        } 
                        else {
                            localmouse.y = (mouse.pageY < mouseport.top) ? 0 : 1;
                        }
                    }
				
                    // If mouse is inside, fire timer
                    if (mouseport.xinside && mouseport.yinside)  {
                        if (!timer.running) timer.fire(localmouse.x, localmouse.y);
                    }
                    else if (mouseport.active) {
                        mouseport.active = false;
                    }			
                });
            }
		
            // Trigger Response
            if (settings.triggerResponse) {
                viewport.element.bind("jparallax", function(event, ref){
		    
                    ref = stripFiletype(ref);
		          
                    matrixSearch(layer, ref, function(i, n) {
                        localmouse.x = layer[i].content[n].posxrat * (layer[i].diffxrat + 1) - (0.5 * layer[i].diffxrat);
                        localmouse.y = layer[i].content[n].posyrat * (layer[i].diffyrat + 1) - (0.5 * layer[i].diffyrat);
  
                        if (!settings.triggerExposesEdges) {
                            if (localmouse.x < 0) localmouse.x = 0;
                            if (localmouse.x > 1) localmouse.x = 1;
                            if (localmouse.y < 0) localmouse.y = 0;
                            if (localmouse.y > 1) localmouse.y = 1;
                        }
          
                        mouseport.ontarget = false;
          
                        if (!timer.running) timer.fire(localmouse.x, localmouse.y);
                    });
                });
            }
		
            // Window Resize Response
            jQuery(window).resize(function() {

                setupPorts(viewport, mouseport);
                for (var i=0; i<layer.length; i++) {
                    setupLayer(layer, i, mouseport);
                }
            });
		
		
        });
    };

    // END OF PLUGIN DEFINITION **********************************************************************

    // PLUGIN DEFAULTS

    jQuery.fn.jparallax.settings = {
        mouseResponse:		    true,						// Sets mouse response
        mouseActiveOutside:		false,					// Makes mouse affect layers from outside of the mouseport. 
        triggerResponse:	    true,					  // Sets trigger response
        triggerExposesEdges:  false,          // Sets whether the trigger pulls layer edges into view in trying to centre layer content.
        xparallax:				    true,						// Sets directions to move in
        yparallax:				    true,						//
        xorigin:					    0.5,				    // Sets default alignment - only comes into play when travel is not 1
        yorigin:					    0.5,				    //
        xtravel:              1,              // Factor by which travel is amplified
        ytravel:              1,              //
        takeoverFactor:		    0.65,						// Sets rate of decay curve for catching up with target mouse position
        takeoverThresh:		    0.002,					// Sets the distance within which virtualmouse is considered to be on target, as a multiple of mouseport width.
        frameDuration:        25							// In milliseconds
    };

    // RUN

    initOrigin(jQuery.fn.jparallax.settings);

    jQuery(function() {
	
        });


// END CLOSURE

})(jQuery);