/* Initialize */
jQuery(document).ready(function($){

	 
  $("a[rel*=lightbox]").colorbox({
	
	opacity:0, width: "969px", height: "662px", previous: "p", next: "n" 
	
  });	

});

var myScroll; 

function loaded() { 
	setTimeout(function () { 
		myScroll = new iScroll('content'); 
	}, 100); 
} 


if(navigator.userAgent.match(/iPad/i)) {
	 
	window.addEventListener('load', loaded, false); 
		 								  
}



jQuery(document).ready(function($){
  

    $.Body = $('body');
    
    $.Window = $(window);
    
    $.Scroll = ($.browser.mozilla || $.browser.msie) ? $('html') : $.Body;
    
    $.Mobile = ($.Body.hasClass('webkit-mobile') || (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i)));
    
    $.Unsupported = $.Body.hasClass('unsupported-browser');
	
	if($('html').hasClass('ie8')) $.Unsupported = false;
	
    $("#story-contact").css({height: $.Window.height()/1.4});
	
	if(($.Mobile) || ($.Unsupported)) $.Body.addClass("unsupp");
	
	$('#inpta textarea').focus(function() { $(this).parent().parent().css({backgroundImage: 'url(/wp-content/uploads/files/img/contact-m-focus.png)'}) }); 
	$('#inpta textarea').blur(function() {  $(this).parent().parent().css({backgroundImage: 'url(/wp-content/uploads/files/img/contact-m-blur.png)'});});

    if(!$.Unsupported && ! ($('html').hasClass('ie8'))) { 
		
		//$.Body.Keyboard();
		$('[data-target=_blank]').TargetBlank();
	
	}
	
	$('[data-controller]').Instantiate();
		
	
	if(navigator.userAgent.match(/iPad/i)) {
		$.Body.addClass("ipad");
		$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-white.png");				
	}
	
	$('#story-work a').hover(function() {
										  
		$(this).find("span").css({background: "url(/wp-content/uploads/files/img/hover.png) top left repeat"}).fadeIn();

	}, function() {
		
		$(this).find("span").fadeOut();	
		
	});
	
	if(!$.Body.hasClass("unsupp")) {

		var $self = $(this),
			$bg = $self.find('.bg'),
			$ml = $self.find('#ml'),
			$mo = $self.find('#mo'),
			$yl = $self.find('#yl'),
			$yo = $self.find('#yo');
			$yourbrand = $self.find('#your-brand');
			$shadow = $self.find('#shadow');
			dist = $.Window.height();
		
          var bpos = '50% ' + ($.Window.height()/2.5-dist/3) + 'px';
          var mlpos= '50% ' + ($.Window.height()/0.95-dist/2.5) + 'px';
          var yopos= '50% ' + ($.Window.height()/0.805-dist/2) + 'px';
          var mopos= '50% ' + ($.Window.height()/0.46-dist/1.025) + 'px';
          var ylpos= '50% ' + ($.Window.height()/0.54-dist/1.23) + 'px';
          var shpos= '50% ' + ($.Window.height()/0.60-dist/1.8) + 'px';
          var ybpos= '50% ' + ($.Window.height()/0.54-dist/1.8) + 'px';
				 
		  $bg.css({'backgroundPosition':bpos});
		  $ml.css({'backgroundPosition':mlpos});
		  $mo.css({'backgroundPosition':ylpos});
		  $yl.css({'backgroundPosition':mopos});
		  $yo.css({'backgroundPosition':yopos});
		  $yourbrand.css({'backgroundPosition':ybpos});
		  $shadow.css({'backgroundPosition':shpos});
		}
	
				$("#bg1").fadeIn(400, function() {console.log('animation finished'); $("#bg4").fadeOut();$("#abouttriangle").animate({backgroundColor: "#fd45ff"});$("#posttriangle").animate({backgroundColor: "#fd45ff"});$("#pstriangle").animate({backgroundColor: "#fd45ff"});});
	
	$(".about-more").click(function() {
		
		
		switch($(this).attr("rel")) {
			
			case "1":
			
				
				$("#bg2").fadeIn(400, function() {$("#bg1").fadeOut();$("#abouttriangle").animate({backgroundColor: "#000"}); $("#posttriangle").animate({backgroundColor: "#000"}); $("#pstriangle").animate({backgroundColor: "#000"});});
				if($('html').hasClass('ie8') || $('html').hasClass('ie9')) {
					$("#main").css({'background-image': 'url(/wp-content/uploads/files/img/bribbon.png)'});
					
				}
				$("#story-about header").css({background: "#000"});
				$(".about-more").attr("rel", "2");
				$(".about-more").find("img").attr("src", "/wp-content/uploads/files/img/more-b.png");
				$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-white.png");				
				$("#nav li a").css({color: "#fff"});
				break;
			
			case "2":
				
				$("#bg3").fadeIn(400, function() {$("#bg2").fadeOut();$("#abouttriangle").animate({backgroundColor: "#ffb93f"});$("#posttriangle").animate({backgroundColor: "#ffb93f"});;$("#pstriangle").animate({backgroundColor: "#ffb93f"});});
				$("#story-about header").css({background: "#ffb93f"});
				$(".about-more").attr("rel", "3");
				if($('html').hasClass('ie8') || $('html').hasClass('ie9')) {
				
					$("#main").css({'background-image': 'url(/wp-content/uploads/files/img/oribbon.png)'});
					
				}
				
				if(!$.Body.hasClass("ipad")) {
					$("#nav li a").css({color: "#000"});
					$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-logo.png"); 
				}
				break;
							
			case "3":
			
				if($('html').hasClass('ie8') || $('html').hasClass('ie9')) {
				
					$("#main").css({'background-image': 'url(/wp-content/uploads/files/img/blribbon.png)'});
					
				}
				$("#bg4").fadeIn(400, function() {$("#bg3").fadeOut();$("#abouttriangle").animate({backgroundColor: "#61dee9"});$("#posttriangle").animate({backgroundColor: "#61dee9"});$("#pstriangle").animate({backgroundColor: "#61dee9"});});
				$("#story-about header").css({background: "#61dee9"});
				$(".about-more").attr("rel", "4");
				break;
			
			case "4":
			
				if($('html').hasClass('ie8') || $('html').hasClass('ie9')) {
				
					$("#main").css({'background-image': 'url(/wp-content/uploads/files/img/pribbon.png)'});
					
				}
				$("#bg1").fadeIn(0, function() {$("#bg4").fadeOut();$("#abouttriangle").animate({backgroundColor: "#fd45ff"});$("#posttriangle").animate({backgroundColor: "#fd45ff"});$("#pstriangle").animate({backgroundColor: "#fd45ff"});});
				$("#story-about header").css({background: "#fd45ff"});
				$(".about-more").attr("rel", "1")
				$(".about-more").find("img").attr("src", "/wp-content/uploads/files/img/more.png");
				break;
			
		}
		
		return false;
	});
	
	$("#align a").click(function() {
								 
		$.Body.triggerHandler($.Events.SCROLL_TO,'story-work');
		return false;
	});
 	function mycarousel_initCallback(carousel) {
		$('#mycarousel-next').bind('click', function() {
			carousel.next();
			
			switch($('#story-services').attr("rel")) {
				
				case "1":
				
					if($("html").hasClass("no-webgl")) {
						$("#ie8triangle").css({backgroundImage: "url(/wp-content/uploads/files/img/triangleb.png)"});
						$('#ie8triangle').animate({marginTop: '60px'});
	
					}
					$('#striangle').css({background: "#3cdeeb"});
					$('#striangle').animate({marginTop: '68px'});
					$('#triangle').css({background: "#3cdeeb"});
					$('#triangle').animate({marginTop: '68px'});
					$('#story-services').attr("rel", "2");
					break;
					
				case "2":

					if($("html").hasClass("no-webgl")) {
						$("#ie8triangle").css({backgroundImage: "url(/wp-content/uploads/files/img/trianglep.png)"});
						$('#ie8triangle').animate({marginTop: '130px'});
	
					}
					$('#striangle').css({background: "#ff4bff"});
					$('#striangle').animate({marginTop: '138px'});
					$('#triangle').css({background: "#ff4bff"});
					$('#triangle').animate({marginTop: '138px'});
					$('#story-services').attr("rel", "3");
					break;

				case "3":
									
					if($("html").hasClass("no-webgl")) {
						$("#ie8triangle").css({backgroundImage: "url(/wp-content/uploads/files/img/triangleo.png)"});
						$('#ie8triangle').animate({marginTop: '-10px'});
	
					}
					$('#striangle').css({background: "#ffa100"});
					$('#striangle').animate({marginTop: '0px'});
					$('#triangle').css({background: "#ffa100"});
					$('#triangle').animate({marginTop: '0px'});
					$('#story-services').attr("rel", "1");
					break;

			}

			return false;
		});
	};
	
	$("#story-services .story").jcarousel({vertical: true, scroll: 1, wrap: 'circular', initCallback: mycarousel_initCallback, buttonNextHTML: null, buttonPrevHTML: null});
   
    if($.Mobile==null) {
		//alert("OK");
		$.Body.triggerHandler($.Events.SCROLL_TO,290);
   
	}else{
		
		$("#story-work #overlay img").each(function() {
														  
			src = $(this).attr("src");
			alt = $(this).attr("rel");
			$(this).attr("rel", src);
			$(this).attr("src", alt);
		 });
	}
	
  
});

/* ---------------------------------- */

/* Events */

(function($) {

  $.Events = {

     
     SECTION_ENTER: 'sectionEnter',
     
     SCROLL_TO: 'scrollTo',
     
     SCROLL: 'windowScroll',
     SCROLL_ENTER: 'windowScrollEnter',
     SCROLL_LEAVE: 'windwScrollLeave',
     
     KEY_UP: 'keyUp',
     KEY_DOWN: 'keyDown',
     KEY_LEFT: 'keyLeft',
     KEY_RIGHT: 'keyRight',
     KEY_ESC: 'keyEsc',
     KEY_SPACE: 'keySpace',
     
     
     PROOF_POINT: 'proofPointMore'
    
  
  } // Events  
  
  $.Views = {
  
  
  } // Views 

   
  
})(jQuery);


/* ---------------------------------- */

/* Auto Instantiate */

(function($) {

  $.fn.Instantiate = function(settings) {
     //alert("instantiate");
    var config = {};
 
    if (settings) $.extend(config, settings);
  
      this.each(function() { 

          var $self = $(this),
              $controller = $self.attr('data-controller');
                  
          if ($self[$controller])
            $self[$controller]();
              
      });
      
  }
    
  

})(jQuery);




/* ---------------------------------- */

/* Shell */

(function($) {

  $.fn.SHELL = function(settings) {
     
    var config = {};
 
    if (settings) $.extend(config, settings);
  
      this.each(function() { 

              
      });
      
      
      return this;
  }

})(jQuery); 

/* ---------------------------------- */

/* ProofPoints */

(function($) {

  $.fn.ProofPoints = function(settings) {
     
    var config = {};
 
    if (settings) $.extend(config, settings);
  
      this.each(function() { 

        var $self = $(this),
            $id = $self.attr('id'),
            $points = $self.find('[data-proofpoint]'),
            $points_container = $self.find('.proof-points-container'),
            $more = $self.find('nav.more a'),
            _active = 0;
            
        
        $self.Scrollable({is_nav:true})
        
        /*$.Window
          .bind('scroll',
            function(){
              
              if ( $.inview($self,{threshold:0}) ) {
              
                if (!$self.hasClass('active')) {
                
                  $self.addClass('active');
                  
                  $.Body.triggerHandler($.Events.SECTION_ENTER,$id);
                }
              
              }else{
              
                $self.removeClass('active');
                
              }
              
            })*/
        
        $points.ProofPoint({owner:$self})
        
        $more
          .bind('mousedown',
            function(e){
              $more.addClass('_down');
            })
          .bind('mouseup',
            function(e){
              $more.removeClass('_down');
            })
          .bind('click',
            function(e){
              
              _active++;
              
              if(_active>$points.length-1)
                _active=0;
              
              var dir = (_active==0) ? -1 : 1;
              
              $self.triggerHandler($.Events.PROOF_POINT,[_active,dir])
              
              $points_container.stop().animate({marginTop:-_active*600},850,'easeOutExpo')
              
              e.preventDefault();
              
            })
        
       
              
      });
      
      
      return this;
      
  } //ProofPoint
  

  $.fn.ProofPoint = function(settings) {
     
    var config = {};
 
    if (settings) $.extend(config, settings);
  
      this.each(function(index) { 

        var $self = $(this),
            $h1 = $self.find('h1'),
            $headline = $self.attr('data-share'),
            $summary = $self.find('p').html(),
            $copy = $self.find('section.proof-description'),
            $icons = $('<aside/>').appendTo($copy),
            _heading = $h1.html();
            
        $self.css({left:index*500})
          
        config.owner
          .bind($.Events.PROOF_POINT,
            function(e,i,dir){
              
              if (i==index)
                _show(dir);
              else
                _hide(dir);
                
              
            });
      

       
       function _show(dir) {
       
        $self.stop().animate({opacity: 1},800,'easeOutExpo')
        
        $.Body.triggerHandler($.Events.OMNITURE_TRACK,'proofpoint_'+escape($headline))
        
        
       }
       
       function _hide(dir) {
        
        $self.stop().animate({opacity: 0},800,'easeOutExpo')

       }  
        
            
              
      });
      
      
      return this;
  } // ProofPoint

})(jQuery); 




/* ---------------------------------- */

/* Scrollable */

(function($) {

  
  $.fn.Scrollable = function(settings) {
   
    if(!$.Unsupported) {
     var config = { threshold: -100, offset_scroll: 6, offset_intertia: .15 };
 
     if (settings) $.extend(config, settings);
    
     this.each(function() { 
      
        var $self = $(this),
            $id = $self.attr('id');
            
        config.threshold = 0
        
        if ($.Mobile) {  
          $self.css({backgroundAttachment:'scroll'})
        }else{
        
        $.Window
          .bind('scroll',
            function(e){
            
              if ( $.inview($self,{threshold:config.threshold}) ) {
                
                if (!$self.hasClass('_active')){
                
                  $self.addClass('_active');
                  
                  if (config.is_nav)
                    $.Body.triggerHandler($.Events.SECTION_ENTER,$id);
                  
                  $self.triggerHandler($.Events.SCROLL_ENTER);
                  
                }
                  
                _scroll_background();
                  
                $self.triggerHandler($.Events.SCROLL,$.distancefromfold($self,{threshold:config.threshold}) - config.threshold)
                
              }else{
                
                if ($self.hasClass('_active')){
                
                  $self.removeClass('_active');
                  
                  $self.triggerHandler($.Events.SCROLL_LEAVE);
                  
                }
              
              }
              
            
            })
            
            
        }
        
        function _scroll_background() {

          var _x = '50% '
                  
          var bpos = _x + (-($.distancefromfold($self,{threshold:config.threshold}) - config.threshold) * config.offset_intertia) + 'px';
          
          $self.css({'backgroundPosition':bpos})

        }
        
        /*if (config.auto_scroll)
          _scroll_background();*/
            
     });
     
    return this;
	}
	
  } //Story
  
  
  $.fn.Logo = function() {
   
     if(!$.Unsupported) {
    this.each(function() { 
      
        var $self = $(this),
            $ml = $self.find('#ml'),
            $mo = $self.find('#mo'),
            $yl = $self.find('#yl'),
			$yo = $self.find('#yo'),
            $id = $self.attr('id'),
            $img = $self.find('img'),
			$shadow = $self.find('#shadow'),
 			$yourbrand = $self.find('#your-brand'),
           _threshold = -200;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL,on_scroll)
          .bind($.Events.SCROLL_ENTER,on_scroll_enter)
          .bind($.Events.SCROLL_LEAVE,on_scroll_leave);
        
        
        //alert($.Window.height());
        function on_scroll(e,distance) {
		//alert(distance);
		  var wHeight = $.Window.height();
		  
          //if($('html').hasClass('ie8')) wHeight = $.Window.height()*0.8;
		  
		  var dist2 = (wHeight/0.95-distance/2.5);
		  var dist3 = (wHeight/0.805-distance/2);
		  var dist4 = (wHeight/0.46-distance/1.025);
		  var dist5 = (wHeight/0.54-distance/1.23);
		  var dist6 = (wHeight/0.60-distance/1.8);
		  var dist7 = (wHeight/0.54-distance/1.8);
		  

          var mlpos= '50% ' + dist2 + 'px';
          var yopos= '50% ' + dist3 + 'px';
          var mopos= '50% ' + dist4 + 'px';
          var ylpos= '50% ' + dist5 + 'px';
          var shpos= '50% ' + dist6 + 'px';
          var ybpos= '50% ' + dist7 + 'px';
          $ml.css({'backgroundPosition':mlpos})
          $mo.css({'backgroundPosition':mopos})
          $yl.css({'backgroundPosition':ylpos})
          $yo.css({'backgroundPosition':yopos})
          $shadow.css({'backgroundPosition':shpos})
          $yourbrand.css({'backgroundPosition':ybpos})
       
        }
        
        function on_scroll_enter(e) {
 			$("#nav li a").css({color: "#000"});
			$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-logo.png");
       
        }
        
        function on_scroll_leave(e) {
        
        }
        
        
            
     });
     
    return this;
	 }
	 
  } //Logo
  
  $.fn.About = function() {
   
    if(!$.Unsupported) {
     this.each(function() { 
      
        var $self = $(this),
            $header = $self.find('header'),
            $bg1 = $self.find('#bg1'),
            $bg2 = $self.find('#bg2'),
            $bg3 = $self.find('#bg3'),
            $bg4 = $self.find('#bg4'),
            _threshold = -200;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL,on_scroll)
          .bind($.Events.SCROLL_ENTER,on_scroll_enter)
          .bind($.Events.SCROLL_LEAVE,on_scroll_leave);
        
        
          
        function on_scroll(e,distance) {
        
          var bg4pos = '50% ' + ($.Window.height()/1-distance/1.3) + 'px';
                 
          $bg1.css({'backgroundPosition':bg4pos})
          $bg2.css({'backgroundPosition':bg4pos})
          $bg3.css({'backgroundPosition':bg4pos})
          $bg4.css({'backgroundPosition':bg4pos})
        
        }
        
        function on_scroll_enter(e) {
			
 			if($("#abouttriangle").css('backgroundColor')=="rgb(0, 0, 0)") {
			
				$("#nav li a").css({color: "#fff"});
				$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-white.png");
			}
        }
        
        function on_scroll_leave(e) {
        
        }

            
     });
     
    return this;
	}
  } //About

 $.fn.Services = function() {
     
    if(!$.Unsupported) {
     this.each(function() { 
        var $self = $(this),
            _threshold = -200;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL_ENTER,on_scroll_enter)
          .bind($.Events.SCROLL_LEAVE,on_scroll_leave);
        
        
          
        function on_scroll(e,distance) {
         	
			alert("OK");
        
        }
        
        function on_scroll_enter(e) {
        	
			$("#nav li a").css({color: "#000"});
			$("#nav img").attr("src", "/wp-content/uploads/files/img/mylo-logo.png");

        }
        
        function on_scroll_leave(e) {
        
        }
     });
    return this;
	}
};

 $.fn.Work = function() {
   
    if(!$.Unsupported) {
     this.each(function() { 
      
        var $self = $(this),
            $overlay = $self.find('#overlay'),
            $img1 = $self.find('#work1'),
            $img2 = $self.find('#work2'),
            $img3 = $self.find('#work3'),
            $img4 = $self.find('#work4'),
            $img5 = $self.find('#work5'),
            $img6 = $self.find('#work6'),
            $img7 = $self.find('#work7'),
            $img8 = $self.find('#work8'),
            $img9 = $self.find('#work9'),
            $img10 = $self.find('#work10'),
            $img11 = $self.find('#work11'),
            _threshold = -00;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL,on_scroll)
          .bind($.Events.SCROLL_ENTER,on_scroll_enter)
          .bind($.Events.SCROLL_LEAVE,on_scroll_leave);
        
        
          
        function on_scroll(e,distance) {
			
		  var bgpos01 = (900/0.92-distance/1)+'px';
		  var bgpos0 = (880/1.01-distance/1)+'px';
		  var bgpos1 = (880/0.892-distance/0.880)+'px';
		  var bgpos2 = (880/0.401-distance/0.387)+'px';
		  var bgpos3 = (880/0.892-distance/1.167) +'px';
		  var bgpos4 = (880/1.048-distance/1.470)+'px';
		  var bgpos5 = (880/0.487-distance/0.574)+'px';
		  var bgpos6 = (880/1.133-distance/1.94)+'px';
		  var bgpos7 = (880/0.503-distance/0.63)+'px';
		  var bgpos8 = (880/0.296-distance/0.327)+'px';
		  var bgpos9 = (880/1.045-distance/2.48)+'px';
		  var bgpos10 = (880/1.091-distance/2.75)+'px';
		  
		  $overlay.css({'top':bgpos01});
          $img1.css({'top':bgpos0});
          $img2.css({'top':bgpos1});
          $img3.css({'top':bgpos2});
          $img4.css({'top':bgpos3});
          $img5.css({'top':bgpos4});
          $img6.css({'top':bgpos5});
          $img7.css({'top':bgpos6});
          $img8.css({'top':bgpos7});
          $img9.css({'top':bgpos8});
          $img10.css({'top':bgpos9});
          $img11.css({'top':bgpos10});
		  
			st = Number(distance)
			var mod = 978-$.Window.height();
			//alert("st: "+st+", "+(3730+mod));
			if(st>(800) && st<(870)) {
				
				//$("#fifth #overlay img").attr("src", "");
				//$window.scrollTop(3620);
				
				$("#overlay img").each(function() {
												
					// coloured
					if($(this).attr("which")=="grey") { 
						$(this).attr("which", "colour");
						src = $(this).attr("src");
						alt = $(this).attr("rel");
						$(this).attr("rel", src);
						$(this).attr("src", alt);
					}
					
				});
				
			}else{

				$("#overlay img").each(function() {
								
					// grey
					
					src = $(this).attr("src");
					var re = new RegExp("g\.jpg"); 
					var m = re.exec(src);
					if($(this).attr("which")=="colour") {
						// make it grey
						src = $(this).attr("src");
						alt = $(this).attr("rel");
						$(this).attr("rel", src);
						$(this).attr("src", alt);
						$(this).attr("which", "grey");
						//if(m==null) $(this).attr("src", src.replace(".jpg", "-g.jpg"));
					
					}
				});
			}        
     		
        }
        
        function on_scroll_enter(e) {

        }
        
        function on_scroll_leave(e) {
        
        }

            
     });
     
    return this;
	}
  } // Work
   
    
   
  $.fn.Contact = function() {
	  
     if(!$.Unsupported) {
  
     this.each(function() { 
        var $self = $(this),
            $form = $self.find('header'),
            $shadow = $self.find('.shadow'),
            _threshold = -200;
        
        $self
          .Scrollable({threshold: _threshold,is_nav:true})
          .bind($.Events.SCROLL,on_scroll)
          .bind($.Events.SCROLL_ENTER,on_scroll_enter)
          .bind($.Events.SCROLL_LEAVE,on_scroll_leave);
        
        
          
        function on_scroll(e,distance) {
        
          //alert("ok");
		  var formbgpos = ($.Window.height()/1-distance/1) + 'px';
		  var shadowbgpos = ($.Window.height()/0.95-distance/1) + 'px';
                 
          //$self.css({'backgroundPosition':bg4pos})
          $form.css({'marginTop': formbgpos})
          $shadow.css({'marginTop':shadowbgpos})
          
        }
        
        function on_scroll_enter(e) {
        
        }
        
        function on_scroll_leave(e) {
        
        }

            
     });
     
    return this;
	 }
	 
  } // Contact
     
    
    
})(jQuery);


/* ---------------------------------- */

/* MainNav */

(function($) {

  
   $.fn.MainNav = function() {
   
     this.each(function() { 
      
        var $self = $(this),
            $ul = $('<ul/>').appendTo($self),
            $sections = $('[data-nav]'),
            _sections = new Array(),
            $navs = new Array(),
            _active = 0;
            
       //if (!$.Mobile && !$.Unsupported) { 
        $sections.each(
          function(i){
            _sections.push($(this))
            $('<li/>').appendTo($ul).DotNav({id:$(this).attr('id'),name:$(this).attr('data-nav'), url:""});
        
          })
		
        
		$('<li/>').appendTo($ul).DotNav({id:"Blog",name:"Blog",url:"http://mylodesign.co.uk/blog"});
					  

          
        //$self.css({marginTop:-$self.height()/2})
        
        //}
        
        $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
              
              $sections.each(
                function(i){
                  if ($(this).attr('id')==id)
                    _active = i;
              
                })
            
            })
          .bind($.Events.KEY_RIGHT,
            function(e){
              _active++;
              if (_active>$sections.length-1)
                _active=$sections.length-1;
              _seek();
          })
          .bind($.Events.KEY_LEFT,
            function(e){
              _active--;
              if (_active<0)
                _active=0;
              _seek()
              
          })
          
          
          function _seek() {
            $.Body.triggerHandler($.Events.SCROLL_TO,_sections[_active].attr('id'))
          }
        
            
     });
     
    return this;
     
  } // Main Nav
  
  $.fn.DotNav = function(settings) {
     
    var config = {};
 
    if (settings) $.extend(config, settings);
   
     this.each(function() { 
      
        var $self = $(this),
            $a = $('<a/>'),
            $id = config.id;
			
			if(config.url=="") {
				$a
				  .attr('href',"#/"+config.name.split(' ').join('_'))
				  .html(config.name)
				  .appendTo($self)
				  .bind('click',
					function(e){
					  
					  $.Body.triggerHandler($.Events.SCROLL_TO,$id);
					  
					  e.preventDefault();
					  
					});
			}else{
				$a
				  .attr('href',"http://www.mylodesign.co.uk/blog/")
				  .attr('target','_blank')
				  .html(config.name)
				  .appendTo($self);
					
			}
            $self
              .attr('data-id',$id);
                          
            
        $.Body
          .bind($.Events.SECTION_ENTER,
            function(e,id){
            
              if (id==$id)
                $self.addClass('active');
              else
                $self.removeClass('active');
              
              
              
            
            });
        
            
     });
	 
		
 
     
    return this;
     
  } // DotNav

    
   
    
})(jQuery);


        
/* ---------------------------------- */

/* SiteScroll */

(function($) {

  
   $.fn.SiteScroll = function() {
     this.each(function() { 
      
        var $self = $(this);
           
        $.Body
          .bind($.Events.SCROLL_TO,
            function(e,id){
           
              var $element = $('#'+id),
                  $header = $element.find('header'),
                  _align = $element.attr('data-align'),
                  _offset = $element.attr('data-scrolloffset') ? parseInt($element.attr('data-scrolloffset')) : 0
                  ;
				  
              oid = "#"+id;
			  
			 
			 if(id>0)  { _top = id; }else{ _top = $element.offset().top;  }
              
			 if(id=="story-work") {
				 
				wh = $.Window.height();
				_offset = (835 - wh);
				if($.Mobile) { _offset -= 165; }
			 }
			
             _top = _top + _offset;

			if($.Body.hasClass("ipad")) {
				
				if(oid=="#story-services") oid = "#ipadservices";

				 _top = $element.attr("ipad-offset");
				 
				 myScroll.scrollToElement(oid, 800);
				 //.animate(
                  //{ 'scrollTop': _top },
                  //800,
                 // ''
                //)
				 
			 }else{
			 
              $.Scroll
                .stop()
                .animate(
                  { 'scrollTop': _top },
                  800,
                  ''
                )
                
			 }
              
            })
        
            
     });
     
    return this;
     
  }
    
   
    
})(jQuery);

/* ---------------------------------- */

/* TargetBlank */

(function($) {

  
   $.fn.TargetBlank = function() {
   
     this.each(function() { 
      
        var $self = $(this);
            
        
        $self
        .attr('target','_blank')
        .bind('click',on_click);
        
        function on_click(e){
        
        }
        
            
     });
     
    return this;
     
  }
    
   
    
})(jQuery);
    

/* ---------------------------------- */

/* Keyboard */

(function($) {


   $.fn.Keyboard = function(settings) {
    
    var config = {};
 
    if (settings) $.extend(config, settings);
  
      this.each(function() { 
      
        var $self = $(this);
      
        $(document)
        .bind('keydown',on_keydown);
        
        function on_keydown(e) {
          
          var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
          
          switch(key) {

             
             case 27: //escape

              $.Body.triggerHandler($.Events.KEY_ESC);
                        
              break;
             
             case 32: //space

              $.Body.triggerHandler($.Events.KEY_SPACE);
                        
              break;
             
             case 38: //top
              
              $.Body.triggerHandler($.Events.KEY_UP);
                        
              break;
           
             case 39: //right

              $.Body.triggerHandler($.Events.KEY_RIGHT);
              e.preventDefault();
              
              break;
             
             case 40: ///bottom
            
              $.Body.triggerHandler($.Events.KEY_DOWN);
                        
              break;
              
             case 37: //left
             
              $.Body.triggerHandler($.Events.KEY_LEFT);
                        
              break;
             
             
          }//switch
          
        }//keydown
  
      }); 
      
      return this;
    
  } 
  

})(jQuery);


/* ---------------------------------- */

/* Worker */

(function($) {


    $.distancefromfold = function($element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).height() + $(window).scrollTop();
        } else {
            var fold = $(settings.container).offset().top + $(settings.container).height();
        }
        return (fold + settings.threshold) - $element.offset().top ;
    };
    
    $.belowthefold = function($element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).height() + $(window).scrollTop();
        } else {
            var fold = $(settings.container).offset().top + $(settings.container).height();
        }
        return fold <= $element.offset().top - settings.threshold;
    };
    
    $.rightoffold = function($element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).width() + $(window).scrollLeft();
        } else {
            var fold = $(settings.container).offset().left + $(settings.container).width();
        }
        return fold <= $element.offset().left - settings.threshold;
    };
        
    $.abovethetop = function($element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).scrollTop();
        } else {
            var fold = $(settings.container).offset().top;
        }
        return fold >= $element.offset().top + settings.threshold  + $element.height();
    };
    
    $.leftofbegin = function($element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).scrollLeft();
        } else {
            var fold = $(settings.container).offset().left;
        }
        return fold >= $element.offset().left + settings.threshold + $element.width();
    };
    
    $.inview = function($element, settings) {
        return ($.abovethetop($element,settings)!=true && $.belowthefold($element,settings)!=true)
    };


    $.extend($.expr[':'], {
        "below-the-fold" : "$.belowthefold(a, {threshold : 0, container: window})",
        "above-the-fold" : "!$.belowthefold(a, {threshold : 0, container: window})",
        "right-of-fold"  : "$.rightoffold(a, {threshold : 0, container: window})",
        "left-of-fold"   : "!$.rightoffold(a, {threshold : 0, container: window})"
    });
    
})(jQuery);