/*!
 ______ _____   _______ _______ _______ _______ ______ _______ 
|   __ \     |_|    ___|_     _|   |   |       |   __ \   _   |
|    __/       |    ___| |   | |       |   -   |      <       |
|___|  |_______|_______| |___| |___|___|_______|___|__|___|___|

p l e t h o r a t h e m e s . c o m 				     (c) 2014
                        
theme name: cleanstart
version: 1.0.2
this file contains necessary javascript for the theme to function properly.

*/

//===============jquery to perform on dom ready=========================================================

jquery(document).ready(function() {
			  
"use strict";			  

    trianglesetup();

    // flexslider settings & init for the homepage slider

    jquery('#main_flexslider').flexslider({
        namespace: "flex-",             //{new} string: prefix string attached to the class of every element generated by the plugin
        selector: ".slides > li",       //{new} selector: must match a simple pattern. '{container} > {slide}' -- ignore pattern at your own peril
        animation: "slide",              //string: select your animation type, "fade" or "slide"
        easing: "swing",               //{new} string: determines the easing method used in jquery transitions. jquery easing plugin is supported!
        direction: "horizontal",        //string: select the sliding direction, "horizontal" or "vertical"
        reverse: false,                 //{new} boolean: reverse the animation direction
        animationloop: true,             //boolean: should the animation loop? if false, directionnav will received "disable" classes at either end
        smoothheight: false,            //{new} boolean: allow height of the slider to animate smoothly in horizontal mode
        startat: 0,                     //integer: the slide that the slider should start on. array notation (0 = first slide)
        slideshow: true,                //boolean: animate slider automatically
        slideshowspeed: 7000,           //integer: set the speed of the slideshow cycling, in milliseconds
        animationspeed: 600,            //integer: set the speed of animations, in milliseconds
        initdelay: 0,                   //{new} integer: set an initialization delay, in milliseconds
        randomize: false,               //boolean: randomize slide order
         
        // usability features
        pauseonaction: true,            //boolean: pause the slideshow when interacting with control elements, highly recommended.
        pauseonhover: true,            //boolean: pause the slideshow when hovering over slider, then resume when no longer hovering
        usecss: true,                   //{new} boolean: slider will use css3 transitions if available
        touch: true,                    //{new} boolean: allow touch swipe navigation of the slider on touch-enabled devices
        video: false,                   //{new} boolean: if using video in the slider, will prevent css3 3d transforms to avoid graphical glitches
         
        // primary controls
        controlnav: true,               //boolean: create navigation for paging control of each clide? note: leave true for manualcontrols usage
        directionnav: true,             //boolean: create navigation for previous/next navigation? (true/false)
        prevtext: "previous",           //string: set the text for the "previous" directionnav item
        nexttext: "next",               //string: set the text for the "next" directionnav item
         
        // callback api
        start: function(){
        	//jquery('.flex-active-slide .container .carousel-caption').addclass('show');
        	},            //callback: function(slider) - fires when the slider loads the first slide
        before: function(){
        	jquery('.flex-active-slide .container .carousel-caption').removeclass('show');
        	jquery(".flexslider .carousel-caption").addclass("wait_for_photo_load").hide();
        	},           //callback: function(slider) - fires asynchronously with each slider animation
        after: function(slider){
        	jquery('.flex-active-slide .container .carousel-caption').addclass('show');
        	jquery(".flexslider .carousel-caption.show").removeclass("wait_for_photo_load").show();
        	},            //callback: function(slider) - fires after each slider animation completes
        end: function(){},              //callback: function(slider) - fires when the slider reaches the last slide (asynchronous)
        added: function(){},            //{new} callback: function(slider) - fires after a slide is added
        removed: function(){}           //{new} callback: function(slider) - fires after a slide is removed

    });


    // portfolio page flexslider with carousel---------------------------------------------------------------------

    jquery('#carousel').flexslider({
        animation: "slide",
        controlnav: false,
        animationloop: false,
        slideshow: false,
        itemwidth: 210,
        itemmargin: 10,
        asnavfor: '#portfolio_slider'
      });	
    	
    jquery('#portfolio_slider').flexslider({
        namespace: "flex-",             //{new} string: prefix string attached to the class of every element generated by the plugin
        selector: ".slides > li",       //{new} selector: must match a simple pattern. '{container} > {slide}' -- ignore pattern at your own peril
        animation: "slide",              //string: select your animation type, "fade" or "slide"
        easing: "swing",               //{new} string: determines the easing method used in jquery transitions. jquery easing plugin is supported!
        direction: "horizontal",        //string: select the sliding direction, "horizontal" or "vertical"
        reverse: false,                 //{new} boolean: reverse the animation direction
        animationloop: true,             //boolean: should the animation loop? if false, directionnav will received "disable" classes at either end
        smoothheight: false,            //{new} boolean: allow height of the slider to animate smoothly in horizontal mode
        startat: 0,                     //integer: the slide that the slider should start on. array notation (0 = first slide)
        slideshow: false,                //boolean: animate slider automatically
        slideshowspeed: 7000,           //integer: set the speed of the slideshow cycling, in milliseconds
        animationspeed: 600,            //integer: set the speed of animations, in milliseconds
        initdelay: 0,                   //{new} integer: set an initialization delay, in milliseconds
        randomize: false,               //boolean: randomize slide order
         
        // usability features
        pauseonaction: true,            //boolean: pause the slideshow when interacting with control elements, highly recommended.
        pauseonhover: false,            //boolean: pause the slideshow when hovering over slider, then resume when no longer hovering
        usecss: true,                   //{new} boolean: slider will use css3 transitions if available
        touch: true,                    //{new} boolean: allow touch swipe navigation of the slider on touch-enabled devices
        video: false,                   //{new} boolean: if using video in the slider, will prevent css3 3d transforms to avoid graphical glitches
         
        // primary controls
        controlnav: true,               //boolean: create navigation for paging control of each clide? note: leave true for manualcontrols usage
        directionnav: true,             //boolean: create navigation for previous/next navigation? (true/false)
        prevtext: "previous",           //string: set the text for the "previous" directionnav item
        nexttext: "next",               //string: set the text for the "next" directionnav item
         
        // secondary navigation
        keyboard: true,                 //boolean: allow slider navigating via keyboard left/right keys
        multiplekeyboard: false,        //{new} boolean: allow keyboard navigation to affect multiple sliders. default behavior cuts out keyboard navigation with more than one slider present.
        mousewheel: false,              //{updated} boolean: requires jquery.mousewheel.js (https://github.com/brandonaaron/jquery-mousewheel) - allows slider navigating via mousewheel
        pauseplay: false,               //boolean: create pause/play dynamic element
        pausetext: 'pause',             //string: set the text for the "pause" pauseplay item
        playtext: 'play',               //string: set the text for the "play" pauseplay item
         
        // special properties
        controlscontainer: "",          //{updated} selector: use class selector. declare which container the navigation elements should be appended too. default container is the flexslider element. example use would be ".flexslider-container". property is ignored if given element is not found.
        manualcontrols: "",             //selector: declare custom control navigation. examples would be ".flex-control-nav li" or "#tabs-nav li img", etc. the number of elements in your controlnav should match the number of slides/tabs.
        sync: "",                       //{new} selector: mirror the actions performed on this slider with another slider. use with care.
        asnavfor: "",                   //{new} selector: internal property exposed for turning the slider into a thumbnail navigation for another slider
         
        // carousel options
        itemwidth: 0,                   //{new} integer: box-model width of individual carousel items, including horizontal borders and padding.
        itemmargin: 0,                  //{new} integer: margin between carousel items.
        minitems: 0,                    //{new} integer: minimum number of carousel items that should be visible. items will resize fluidly when below this.
        maxitems: 0,                    //{new} integer: maxmimum number of carousel items that should be visible. items will resize fluidly when above this limit.
        move: 0,                        //{new} integer: number of carousel items that should move on animation. if 0, slider will move all visible items.
         
        // callback api
        start: function(){
        	jquery('.flex-active-slide .container .carousel-caption').addclass('show');
        	},            //callback: function(slider) - fires when the slider loads the first slide
        before: function(){
        	jquery('.flex-active-slide .container .carousel-caption').removeclass('show');
        	jquery(".flexslider .carousel-caption").addclass("wait_for_photo_load").hide();
        	},           //callback: function(slider) - fires asynchronously with each slider animation
        after: function(slider){
        	jquery('.flex-active-slide .container .carousel-caption').addclass('show');
        	jquery(".flexslider .carousel-caption.show").removeclass("wait_for_photo_load").show();
        	},            //callback: function(slider) - fires after each slider animation completes
        end: function(){},              //callback: function(slider) - fires when the slider reaches the last slide (asynchronous)
        added: function(){},            //{new} callback: function(slider) - fires after a slide is added
        removed: function(){}           //{new} callback: function(slider) - fires after a slide is removed

    });

    // onepage -------------------------------------------------------------------------------------------------------------

    var header_height = jquery('header').outerheight();
    var window_height = jquery(window).outerheight();
    var rest_height = header_height + 40;
    var contact_form_overlay_height = jquery('.contact_form_overlay').outerheight();
    jquery('.onepage .main section[id]').css( "padding-top", rest_height).css( "padding-bottom", rest_height/2).css( "margin-top", -rest_height);
    jquery('.onepage #map').css( "height", contact_form_overlay_height );
    jquery('.onepage .contact').css( "height", contact_form_overlay_height );

    //smooth scrolling to hash id when clicking from the menu

    var $htmlbody;

    jquery('.onepage .menu_container a').click(function() {
        var href = $.attr(this, 'href');
        $htmlbody = $htmlbody || jquery('html, body');
        $htmlbody.animate({
            scrolltop: jquery(href).offset().top
        }, 500, function () {
            window.location.hash = href;
        });
        return false;
    });

    // sticky header

    var full_page_photo_height = jquery('.full_page_photo').outerheight();
    var sticky_appear_height = full_page_photo_height - 100;
    var sticky_nav = jquery('.sticky_header header');


        
        jquery(window).scroll(function () {
    	if (jquery(this).scrolltop() > 4) {
    	  jquery('.full_page_photo .flexslider .flex-control-nav').removeclass("show").addclass("disappear");
    	  jquery('#big-video-control-container').removeclass("show").addclass("disappear");
    	  jquery('.full_page_photo .flexslider .flex-direction-nav').hide();
           
            } else {
                jquery('.full_page_photo .flexslider .flex-control-nav').removeclass("disappear").addclass("show");
    	        jquery('#big-video-control-container').removeclass("disappear").addclass("show");
                jquery('.full_page_photo .flexslider .flex-direction-nav').show();
            }
        });
        
        jquery(window).scroll(function () {
            if (jquery(this).scrolltop() > sticky_appear_height) {
                sticky_nav.addclass("stuck");
            } else {
                sticky_nav.removeclass("stuck");
            }
        });
        
    var window_top = jquery(window).scrolltop();

            if (window_top > full_page_photo_height) {
    	  sticky_nav.addclass("stuck");
            } else {
    	  sticky_nav.removeclass("stuck");
            }  
       
       
    jquery('.sticky_header .main').css( "top", header_height - 1 );

    //onepage map settings

    var $onepageclosemap = jquery(".onepage .close_map");
    var $onepagecontact  = jquery(".onepage .contact");
    var $onepageopenmap  = jquery(".onepage .open_map");

    $onepageclosemap.click(function() {
        $onepagecontact.removeclass( "show_map" );
        $onepageclosemap.hide();
        $onepageopenmap.show();
    });

    $onepageopenmap.click(function() {
        $onepagecontact.addclass( "show_map" );
        $onepageopenmap.hide();
        $onepageclosemap.show();
    });

    $onepageclosemap.hide();


    // refrain animations untill the photos load--------

    //refrain the full_page_photo call_to_action elements from performing their animation untill the photo loads 
    jquery(".full_page_photo .hgroup .hgroup_title").addclass("wait_for_photo_load").hide();
    jquery(".full_page_photo .hgroup .hgroup_subtitle").addclass("wait_for_photo_load").hide();

    //refrain the flexslider carousel-caption elements from performing their animation untill the photo loads 
    jquery(".flexslider .carousel-caption").addclass("wait_for_photo_load").hide();


    // twitter feed

    if (jquery('#twitter_flexslider').length) {

    $('#twitter_flexslider').twittie({
        username: 'plethorathemes', 				//option to load tweets from another account or list owner's username.
        apipath: './js/tweetie/api/tweet.php', 		//path to your tweet.php file.
        dateformat: '%b. %d, %y', 					//your date format
        template: '<blockquote><p>{{user_name}} / {{screen_name}} &bull; {{date}}</p><p>{{tweet}}</p></blockquote>', //format how you want to show your tweets.
        count: 3, 									//number of tweets you want to display.
        ulclass: "slides", 							//class for the ul element that contains the tweets
        liclass: "items" 							//class for the li element that contains each tweet
      //,list: null  								//list name to load tweets from. if you define list name you also must define the username of the list owner in the username option.
      //,hashtag: null  							//option to load tweets with a specific hashtag.
      //,hidereplies: false 						//set true if you want to hide "@" replies as well. or leave it false to just to show your tweets and no replies.
    }, function() {
        jquery('#twitter_flexslider').flexslider({
            namespace: "flex-",             //{new} string: prefix string attached to the class of every element generated by the plugin
            selector: ".slides > li",       //{new} selector: must match a simple pattern. '{container} > {slide}' -- ignore pattern at your own peril
            animation: "slide",              //string: select your animation type, "fade" or "slide"
            easing: "swing",               //{new} string: determines the easing method used in jquery transitions. jquery easing plugin is supported!
            direction: "vertical",        //string: select the sliding direction, "horizontal" or "vertical"
            reverse: false,                 //{new} boolean: reverse the animation direction
            animationloop: true,             //boolean: should the animation loop? if false, directionnav will received "disable" classes at either end
            smoothheight: false,            //{new} boolean: allow height of the slider to animate smoothly in horizontal mode
            startat: 0,                     //integer: the slide that the slider should start on. array notation (0 = first slide)
            slideshow: true,                //boolean: animate slider automatically
            slideshowspeed: 5000,           //integer: set the speed of the slideshow cycling, in milliseconds
            animationspeed: 600,            //integer: set the speed of animations, in milliseconds
            initdelay: 0                   //{new} integer: set an initialization delay, in milliseconds
        });
    });

    }
    
    // client list carousel ------------------------------

    var client_item_width = 180;
    var $clientcarousel   = $('#clients-list');
    var clients           = $clientcarousel.children().length;

    $clientcarousel.css('width',(clients * client_item_width));

    var rotating    = true;
    var clientspeed = 1800;
    var seeclients  = setinterval(rotateclients, clientspeed);

    $(document).on({
       // turn off rotation on hover
       mouseenter: function(){ rotating = false; },
       mouseleave: function(){ rotating = true;  }
    }, '#clients');

    function rotateclients() {
       if(rotating) {
            var $first = $('#clients-list li:first');
                $first.animate({ 'margin-left': '-'+client_item_width+'px' }, 600, function() {
                      $first.remove().css({ 'margin-left': '0px' });
                      $('#clients-list li:last').after($first);
                 });
       }
    }

});
//end==================jquery to perform on dom ready=============================================================





//=====================jquery to perform on window load===========================================================
 
jquery(document).ready(function() {
			
"use strict";			

    window.cleanstartslider = function slidewindow(){

        var header_height = jquery('header').outerheight();
        var full_page_photo_height = jquery('.full_page_photo').outerheight();		         
        		         
        jquery('.sticky_header .main').css( "top", full_page_photo_height ); 
        jquery('.touch .sticky_header .overflow_wrapper').css( "padding-bottom", full_page_photo_height ); 

        jquery('.flex-active-slide .container .carousel-caption').addclass('show');

        //settimeout( function() {
        var window_top = jquery(window).scrolltop();

        if (window_top < 4) {
        	  //jquery(".full_page_photo .flexslider .flex-control-nav").removeclass("show").addclass("disappear");
                //} else {
        	jquery(".full_page_photo .flexslider .flex-control-nav").addclass("show");
        	jquery("#big-video-control-container").addclass("show");
        	
                } 		 
        		 

        //}, 1000 );

        //starting the full_page_photo call_to_action elements animations now that the photo is loaded   
        jquery(".full_page_photo .hgroup .hgroup_title").removeclass("wait_for_photo_load").show();
        jquery(".full_page_photo .hgroup .hgroup_subtitle").removeclass("wait_for_photo_load").show();	
        jquery(".flexslider .carousel-caption.show").removeclass("wait_for_photo_load").show();

    }
    cleanstartslider();

    // twenty twenty plugin ------------------------------

    var $twentytwentycontainer = jquery('.twentytwenty-container');

    if ( $twentytwentycontainer.length) {

        $twentytwentycontainer.twentytwenty({ default_offset_pct: 0.5 });

    }


    // parallax ------------------------------------------

    var $window = jquery(window);
     
    jquery('.parallax').each(function(){

        var $scroll = jquery(this);
                         
        $window.scroll(function() {
            if ( $window.scrolltop() + $window.outerheight() >= $scroll.offset().top ) {
                var ypos = ($window.scrolltop() + $window.outerheight() - $scroll.offset().top) / 10;        
                var coords = '50% '+ (100-ypos) + '%';
            }  
            $scroll.css({ backgroundposition: coords });    
          }); // end window scroll
       });  // end section function

    //------wow reveal on scroll initialization only for no-touch devices------------------

    if (jquery('.no-touch').length) {

        var wow = new wow(
        	{
        	animateclass: 'animated',
        	offset:       100
        	}
        );	

        wow.init();

    }

    //end---wow-----------------------------------------

    	
    //------lightbox with all its settings--------------

    var activityindicatoron = function()
    	{
    		jquery( '<div id="imagelightbox-loading"><div></div></div>' ).appendto( 'body' );
    	},
    	activityindicatoroff = function()
    	{
    		jquery( '#imagelightbox-loading' ).remove();
    	},

    	overlayon = function()
    	{
    		jquery( '<div id="imagelightbox-overlay"></div>' ).appendto( 'body' );
    	},
    	overlayoff = function()
    	{
    		jquery( '#imagelightbox-overlay' ).remove();
    	},

    	closebuttonon = function( instance )
    	{
    		jquery( '<a href="#" id="imagelightbox-close">close</a>' ).appendto( 'body' ).on( 'click', function(){ jquery( this ).remove(); instance.quitimagelightbox(); return false; });
    	},
    	closebuttonoff = function()
    	{
    		jquery( '#imagelightbox-close' ).remove();
    	},

    	captionon = function()
    	{
    		var description = jquery( 'a[href="' + jquery( '#imagelightbox' ).attr( 'src' ) + '"] img' ).attr( 'alt' );
    		if( description.length > 0 )
    			jquery( '<div id="imagelightbox-caption">' + description + '</div>' ).appendto( 'body' );
    	},
    	portfoliocaptionon = function()
    	{
    		var description = jquery( 'a.lightbox_portfolio' ).attr( 'title' );
    		if( description.length > 0 )
    			jquery( '<div id="imagelightbox-caption">' + description + '</div>' ).appendto( 'body' );
    	},
    	onepageportfoliocaptionon = function()
    	{
            var description = jquery( 'a[href="' + jquery( '#imagelightbox' ).attr( 'src' ) + '"]' ).attr( 'alt' );
            
            if( typeof description == "undefined" ){
                description = jquery( '.onepage .portfolio_item a p' ).html();
            }
            if( description.length > 0 )
    			jquery( '<div id="imagelightbox-caption">' + description + '</div>' ).appendto( 'body' );
    	},
    	captionoff = function()
    	{
    		jquery( '#imagelightbox-caption' ).remove();
    	},

    	navigationon = function( instance, selector )
    	{
    		var images = jquery( selector );
    		if( images.length )
    		{
    			var nav = jquery( '<div id="imagelightbox-nav"></div>' );
    			for( var i = 0; i < images.length; i++ )
    				nav.append( '<a href="#"></a>' );

    			nav.appendto( 'body' );
    			nav.on( 'click touchend', function(){ return false; });

    			var navitems = nav.find( 'a' );
    			navitems.on( 'click touchend', function()
    			{
    				var $this = jquery( this );
    				if( images.eq( $this.index() ).attr( 'href' ) != jquery( '#imagelightbox' ).attr( 'src' ) )
    					instance.switchimagelightbox( $this.index() );

    				navitems.removeclass( 'active' );
    				navitems.eq( $this.index() ).addclass( 'active' );

    				return false;
    			})
    			.on( 'touchend', function(){ return false; });
    		}
    	},
    	navigationupdate = function( selector )
    	{
    		var items = jquery( '#imagelightbox-nav a' );
    		items.removeclass( 'active' );
    		items.eq( $( selector ).filter( '[href="' + jquery( '#imagelightbox' ).attr( 'src' ) + '"]' ).index( selector ) ).addclass( 'active' );
    	},
    	navigationoff = function()
    	{
    		jquery( '#imagelightbox-nav' ).remove();
    	};

    //	init for masonry gallery
    if ( jquery().imagelightbox ) {

        var instancef = jquery( 'a.lightbox' ).imagelightbox(
        {
            onstart:        function() { overlayon(); closebuttonon( instancef ); },
            onend:          function() { overlayoff(); captionoff(); closebuttonoff(); activityindicatoroff(); },
            onloadstart:    function() { captionoff(); activityindicatoron(); },
            onloadend:      function() { captionon(); activityindicatoroff(); }
        });

        //  init for portfolio item
        var instanceg = jquery( 'a.lightbox_portfolio' ).imagelightbox(
        {
            onstart:        function() { overlayon(); closebuttonon( instanceg ); },              
            onend:          function() { overlayoff(); captionoff(); closebuttonoff(); activityindicatoroff(); },
            onloadstart:    function() { captionoff(); activityindicatoron(); },
            onloadend:      function() { portfoliocaptionon(); activityindicatoroff(); }
        });

        //  init for portfolio item on onepager
        var instanceh = jquery( '.onepage .portfolio_item a' ).imagelightbox(
        {
            onstart:        function() { overlayon(); closebuttonon( instanceh ); },              
            onend:          function() { overlayoff(); captionoff(); closebuttonoff(); activityindicatoroff(); },
            onloadstart:    function() { captionoff(); activityindicatoron(); },
            onloadend:      function() { onepageportfoliocaptionon(); activityindicatoroff(); }
        });

    }
    //end---lightbox with all its settings--------------

    // flickr feed snippet by css-tricks.com----------------------------------------------------------------
    // for instructions visit http://css-tricks.com/snippets/jquery/show-most-recent-flickr-uploads/
    jquery.getjson("https://api.flickr.com/services/feeds/photos_public.gne?id=37321137@n03&format=json&jsoncallback=?", function(data) {
        var target = "#latest-flickr-images ul"; // where is it going?
        for ( var i = 0; i <= 7 && i <= data.items.length-1; i = i + 1 ) { // loop through the 8 most recent, [0-9] and up to the maximum found
            var pic = data.items[i];
            var linumber = i + 1; // add class to each li (1-12)
            jquery(target).append("<li class='flickr-image no-" + linumber + "'><a rel='prettyphoto' title='" + pic.title + "' href='" + pic.link + "'><img src='" + pic.media.m.replace("_m.jpg","_s.jpg") + "' /></a></li>");
        }
    });

});
//end=============================jquery to perform on window load=======================================






//------text rotator flip animations unfortunately don't work well on safari / ie so we replace flip-up animation with the default dissolve animation on those browsers -------------------------------------

(function(){
	
"use strict";	

    var animationsettting    = "flipup"; // animation type for the rotation effect: dissolve, fade, flip, flipup, flipcube, flipcubeup and spin.
    var textrotatorspeed     = 6000;      // how many milliseconds until the next word show.
    var textrotatorseparator = ",";      // define a new separator here: |, &, * etc.

    if ( navigator.useragent.indexof('safari') != -1 && navigator.useragent.indexof('chrome') == -1 ) {
        animationsettting = "dissolve";
        jquery(".rotate").textrotator({
              animation: animationsettting, 
              separator: textrotatorseparator, 
              speed: textrotatorspeed 
            });
    } else {
        if ( jquery().textrotator ){
            // ie doesn't play well with 3d transforms...
            if ( navigator.appname == 'microsoft internet explorer'
                || window.navigator.useragent.indexof("msie ") > 0
                || !!navigator.useragent.match(/trident.*rv\:11\./)
                || !!/rv:11.0/i.test(navigator.useragent)
            ) {
                animationsettting = "dissolve";
            } else {
                animationsettting = "flipup";
            }
        // nope, it's another browser =(
            jquery(".rotate").textrotator({
              animation: animationsettting, 
              separator: textrotatorseparator, 
              speed: textrotatorspeed 
            });
        }
    }

}());

//end---text rotator-------------------------------------

//------ osx touchpad fix: prevent horizontal scrolling using the trackpad. added: v.1.0.1 ------

function trianglesetup(){

    var squareright = document.queryselectorall(".square-right");
    if ( squareright.length > 0 ){
        var bodywidth = jquery(window).outerwidth();
        var containerwidth = jquery(".main > .container").outerwidth();
        var squarewidth = (bodywidth - (containerwidth + 200))/2;
            squarewidth = squarewidth <= 0 ? 0 : squarewidth;
        var squarerighttriangles = document.queryselectorall(".main .triangle-up-right");

        if ( (containerwidth + 200) > bodywidth ){
            var squaretrianglewidth = (bodywidth - containerwidth)/2;
            [].foreach.call(squarerighttriangles,function(el,index){
                    el.setattribute('style', 
                        "width: " + (squaretrianglewidth) + "px;" + 
                        "right: " + "-" + (squaretrianglewidth) + "px; "
                    );
            });
            [].foreach.call(squareright,function(el){
            el.style.width  = "0px";
            el.style.right  = "0px";
            });
        } else {
            [].foreach.call(squarerighttriangles,function(el,index){
                    el.setattribute('style', 
                        "width: 100px;" + 
                        "right: -100px;"
                    );
            }); 
            [].foreach.call(squareright,function(el){
            el.style.width  = squarewidth + "px";
            el.style.right  = "-" + ( squarewidth + 100 ) + "px";
            });           
        }        
    }

}

var waitforfinalevent = (function () {
  var timers = {};
  return function (callback, ms, uniqueid) {
    if (!uniqueid) {
      uniqueid = "don't call this twice without a uniqueid";
    }
    if (timers[uniqueid]) {
      cleartimeout (timers[uniqueid]);
    }
    timers[uniqueid] = settimeout(callback, ms);
  };
})();


//end--- osx touchpad fix: prevent horizontal scrolling using the trackpad. added: v.1.0.1 ------