//Setup Arrays that will hold the x,y,z of each element.


var x = new Array();


var y = new Array();


var z = new Array();


//Get the list of items.


var items = $('li');


//Animate the items.


function animate() {



    //Step through each item.


    for (i = items.length - 1; i >= 0; i--) {


        //variables for movement.


        var xVar = 50 + x[i] 			// x value


        var yVar = 50 + y[i] * z[i]++;	// y value, move towards bottom of screen


        var zVar = 10 * z[i]++;			// z value, text get larger.


        //Check to see if text position is still on the screen.


        // the #'s are %.   100 is far right or bottom, 0 is top or left.


        // for z value it's the font size in %.


        if (!xVar | xVar < 0 | xVar > 90 |


            yVar < 0 | yVar > 90 |


            zVar < 0 | zVar > 1500) {


            //if it's off the screen randomly pick a starting place.


            x[i] = Math.random() * 2 - 1;


            y[i] = Math.random() * 2 - 1;


            z[i] = 2;


        }


        else {


            //if it's still on the screen apply the appropriate styles.


            $(items[i]).css("position", "absolute"); // make sure we can move the text around.


            $(items[i]).css("top", xVar + "%");  // y value


            $(items[i]).css("left", yVar + "%"); // x value


            $(items[i]).css("fontSize", zVar + "%"); // font size (illusion of perspective.)


            $(items[i]).css("opacity", (zVar) / 3000); // fade in from the distance.


        }


    }


    setTimeout(animate, 9);


}

jQuery(function($) {

    animate();

    /*
     $.localScroll({
     duration:1000,
     hash:true, offset: {top:-100}
     });
     */

    /**
     * Adobe Helium: symbol definitions
     */
    window.symbols = {
        "stage": {
            version: "0.1",
            baseState: "Base State",
            initialState: "Base State",
            parameters: {

            },
            content: {
                dom: [
                    {
                        id:'Text1',
                        type:'text',
                        rect:[53,99,0,0],
                        text:"Vision to Value."//,
                        //font:["Lucida Sans Unicode, Lucida Grande, sans-serif",24,"rgba(0,0,0,1)","normal","none",""],
                    },
                    {
                        id:'Text2',
                        type:'text',
                        rect:[400,112,0,0],
                        text:"Accelerate Results.",
                        align:"-webkit-auto"//,
                        //font:["Lucida Sans Unicode, Lucida Grande, sans-serif",24,"rgba(0,0,0,1)","normal","none","normal"],
                    },
                ],
                symbolInstances: [
                ],
            },
            states: {
                "Base State": {
                    "#stageanim": [
                        ["style", "height", '115px'],
                        ["style", "overflow", 'hidden'],
                        ["style", "width", '1056px']
                    ],
                    "#Text2": [
                        ["style", "font-size", '50px'],
                        ["style", "font-style", 'normal'],
                        ["transform", "translateX", '2000px'],
                        ["color", "color", 'rgba(0,157,243,1.00)'],
                        ["style", "height", '32px'],
                        ["style", "font-family", 'normal 40px "Actor, Helvetica Neue", Helvetica, Arial, Sans-serif'],
                        ["transform", "translateY", '-83px'],
                        ["style", "width", '227px']
                    ],
                    "#Text1": [
                        ["transform", "translateX", '60px'],
                        ["color", "color", 'rgba(0,0,0,1.00)'],
                        ["style", "opacity", '0'],
                        ["style", "font-family", 'normal 40px "Actor, Helvetica Neue", Helvetica, Arial, Sans-serif'],
                        ["transform", "translateY", '-70px'],
                        ["style", "font-size", '40px']
                    ]
                }
            },
            actions: {

            },
            bindings: [

            ],
            timelines: {
                "Default Timeline": {
                    fromState: "Base State",
                    toState: "",
                    duration: 2000,
                    timeline: [
                        { id: "eid12", tween: [ "transform", "#Text2", "translateY", '-83px', { valueTemplate: undefined, fromValue: '-83px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid9", tween: [ "transform", "#Text1", "translateX", '45px', { valueTemplate: undefined, fromValue: '-28px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid15", tween: [ "color", "#Text2", "color", 'rgba(0,161,255,1.00)', { animationColorSpace: 'RGB', valueTemplate: undefined, fromValue: 'rgba(0,161,255,1.00)'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid10", tween: [ "transform", "#Text1", "translateY", '-70px', { valueTemplate: undefined, fromValue: '-70px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid24", tween: [ "style", "#Text2", "font-style", 'normal', { valueTemplate: undefined, fromValue: 'normal'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid19", tween: [ "transform", "#Text2", "translateX", '90px', { valueTemplate: undefined, fromValue: '2000px'}], position: 1750, duration: 250, easing: "linear" },
                        { id: "eid29", tween: [ "style", "#stage", "width", '1056px', { valueTemplate: undefined, fromValue: '1056px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid27", tween: [ "style", "#Text2", "width", '500px', { valueTemplate: undefined, fromValue: '227px'}], position: 0, duration: 1500, easing: "linear" },
                        { id: "eid6", tween: [ "style", "#Text2", "height", '32px', { valueTemplate: undefined, fromValue: '32px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid26", tween: [ "style", "#Text2", "font-size", '55px', { valueTemplate: undefined, fromValue: '40px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid25", tween: [ "style", "#Text1", "font-size", '55px', { valueTemplate: undefined, fromValue: '40px'}], position: 0, duration: 0, easing: "linear" },
                        { id: "eid23", tween: [ "style", "#Text1", "opacity", '1', { valueTemplate: undefined, fromValue: '0'}], position: 455, duration: 1150, easing: "linear" }
                    ]
                }
            },
        }};

    /**
     * Adobe Edge DOM Ready Event Handler
     */
    $(window).ready(function() {

        if ((jQuery("body.home").length) > 0) //custom override to prevent display on any other page
            if (!window.edge_authoring_mode || window.edge_remote_authoring) {
                if (!window.edge_remote_authoring) {
                    //$.Edge.initialize(symbols);
                } else {
                    //$.Edge.autoPlay = false;
                    //$.Edge.initialize(symbols);
                    //BYOD.initialize();
                }
            }
    });
    /**
     * Adobe Edge Timeline Launch
     */
    $(window).load(function() {

        if ((jQuery("body.home").length) > 0) //custom override to prevent display on any other page
            if (!window.edge_authoring_mode || window.edge_remote_authoring) {
                //$.Edge.play();
            }
    });


    $("#tabs").tabs({
        collapsible: false});

    if ((jQuery("body.home").length) > 0) { //custom override to prevent display on any other page
// initialize scrollable and return the programming API
        var api = $("#scroll").scrollable({
            items: '#tools', circular: true, mousewheel: false,

            // up/down keys will always control this scrollable
            keyboard: 'static',
            // number of items to scroll on up/down keys
            keyboardSteps: 1

// use the navigator plugin
        })/*.autoscroll({ autoplay: false, interval: 10000, steps: 1, autopause: true
            })*/.autoscroll({autopause:true, interval: 8000}).navigator();//.data("scrollable");

        //$(".tool, #tools").hover(api.pause, api.play);

    }

// this callback does the special handling of our "intro page"
    /*
     api.onBeforeSeek(function(e, i) {

     // when on the first item: hide the intro
     if (i) {
     $("#intro").fadeOut("slow");

     // dirty hack for IE7-. cannot explain
     if ($.browser.msie && $.browser.version < 8) {
     $("#intro").hide();
     }

     // otherwise show the intro
     } else {
     $("#intro").fadeIn(1000);
     }

     // toggle activity for the intro thumbnail
     $("#t0").toggleClass("active", i == 0);
     });

     // a dedicated click event for the intro thumbnail
     $("#t0").click(function() {

     // seek to the beginning (the hidden first item)
     $("#scroll").scrollable().begin();

     });
     */


    $(function() {

        var name = "";

        $(".processRollOverBox").hover(function() {

            name = $(this).attr("id");

            $("#image-" + name).stop().show().animate({ opacity: 1 });
        }, function() {
            name = $(this).attr("id");

            $("#image-" + name).stop().animate({ opacity: 0 });

        });

    });

    $.fn.qtip.styles.uvision = {
        width: 500,
        padding: 15,
        background: '#000',
        color: '#FFF',
        border: {
            radius: 0,
            color: '#000'
        },
        tip: 'topLeft'
    }
    $.fn.qtip.styles.uvision2 = {
        width: 200,
        padding: 15,
        background: '#000',
        color: '#FFF',
        border: {
            radius: 0,
            color: '#000'
        },
        tip: 'topLeft'
    }

    try {
        $('#processImage div#discover').qtip(
            {

                content: $("#processImage div#discover > .tipinfo").html(),
                style: 'uvision',
                position: {
                    target: 'mouse',
                    adjust: { mouse: true,
                        screen: true,
                        x: 16,
                        y: 16
                    }
                },
                show: {
                    effect: function() {
                        $(this).fadeTo(200, 0.9);
                    }
                },
                api: {
                    onRender: function() {
                        this.elements.target.bind('click', this.show);
                    }
                }
            });
        $('#processImage div#design').qtip(
            {
                //content: 'Using a definition document as a springboard, we design and develop a schematic plan for the project to share with the team and appropriate stakeholders. Concepts are communicated through a variety of means including sketches, diagrams, plans, and rough 3D models.',
                content: $("#processImage div#design > .tipinfo").html(),
                style: 'uvision'
                ,
                position: {
                    target: 'mouse',
                    adjust: { mouse: true,
                        screen: true,
                        x: 16,
                        y: 16
                    }
                },
                show: {
                    effect: function() {
                        $(this).fadeTo(200, 0.9);
                    }
                },
                api: {
                    onRender: function() {
                        this.elements.target.bind('click', this.show);
                    }
                }
            });
        $('#processImage div#develop').qtip(
            {
                //content: 'Design concepts are refined based on feedback and input shared with us. All aspects of the project are developed in detail, prototypes are made and reviewed, and intensive research and selection of appropriate materials is underway. To ensure that project goals are realistic, we produce preliminary documentation for construction or fabrication.',
                content: $("#processImage div#develop > .tipinfo").html(),
                style: 'uvision'
                ,
                position: {
                    target: 'mouse',
                    adjust: { mouse: true,
                        screen: true,
                        x: 16,
                        y: 16
                    }
                },
                show: {
                    effect: function() {
                        $(this).fadeTo(200, 0.9);
                    }
                },
                api: {
                    onRender: function() {
                        this.elements.target.bind('click', this.show);
                    }
                }
            });
        $('#processImage div#deploy').qtip(
            {
                //content: 'A successful project is a team effort. We work closely with clients, fabricators, engineers, printers, photographers, contractors and installation teams to bring our collective vision to reality. We are committed to seeing every project through to conclusion, and delivering on design and business objectives.',
                content: $("#processImage div#deploy > .tipinfo").html(),
                style: 'uvision'
                ,
                position: {
                    target: 'mouse',
                    adjust: { mouse: true,
                        screen: true,
                        x: 16,
                        y: 16
                    }
                },
                show: {
                    effect: function() {
                        $(this).fadeTo(200, 0.9);
                    }
                },
                api: {
                    onRender: function() {
                        this.elements.target.bind('click', this.show);
                    }
                }
            });

// By suppling no content attribute, the library uses each elements title attribute by default
    $('.bits a[href][title]').qtip({
        content: {
            text: true // Use each elements title attribute
        },

        position: {
            target: 'mouse',
            adjust: { mouse: true,
                screen: true,
                x: 16,
                y: 16
            }
        },
        show: {
            effect: function() {
                $(this).fadeTo(200, 0.9);
            }
        },
        style: 'uvision2' // Give it some style
    });
    $('.tool img[title]').qtip({
        content: {
            text: true // Use each elements title attribute
        },
        position: {
            target: 'mouse',
            adjust: { mouse: true,
                screen: true,
                x: 16,
                y: 16
            }
        },
        show: {
            effect: function() {
                $(this).fadeTo(200, 0.9);
            }
        },
        style: 'uvision2'
    });
    } catch (e) {
        
    }
    $(window).bind("load", function() {

        //$('#load_fade').fadeOut(1500);
    });


    /*  //TODO Grayscale media logos

     // On window load. This waits until images have loaded which is essential
     $(window).load(function(){

     // Fade in images so there isn't a color "pop" document load and then on window load
     $(".item img").fadeIn(500);

     // clone image
     $('.item img').each(function(){
     var el = $(this);
     el.css({"position":"absolute"}).wrap("<div class='img_wrapper' style='display: inline-block'>").clone().addClass('img_grayscale').css({"position":"absolute","z-index":"998","opacity":"0"}).insertBefore(el).queue(function(){
     var el = $(this);
     el.parent().css({"width":this.width,"height":this.height});
     el.dequeue();
     });
     this.src = grayscale(this.src);
     });

     // Fade image
     $('.item img').mouseover(function(){
     $(this).parent().find('img:first').stop().animate({opacity:1}, 1000);
     })
     $('.img_grayscale').mouseout(function(){
     $(this).stop().animate({opacity:0}, 1000);
     });
     });

     */

});

/*
 $(document).ready(function() {
 var interval;

 $('#clientlogos')
 .roundabout({
 easing: 'easeInOutBack',
 duration: 1000
 })
 .hover(
 function() {
 // oh no, it's the cops!
 clearInterval(interval);
 },
 function() {
 // false alarm: PARTY!
 interval = startAutoPlay();
 }
 );

 // let's get this party started
 interval = startAutoPlay();
 });

 function startAutoPlay() {
 return setInterval(function() {
 $('ul').roundabout_animateToNextChild();
 }, 5000);
 }

 //$(document).ready(function() {
 //	$('#clientlogos').roundabout({
 //		easing: 'easeInOutBack',
 //		duration: 1000
 //	});
 //});


 // SET THIS VARIABLE FOR DELAY, 1000 = 1 SECOND
 var delayLength = 4000;

 function doMove(panelWidth, tooFar) {
 var leftValue = $("#mover").css("left");

 // Fix for IE
 if (leftValue == "auto") {
 leftValue = 0;
 }
 ;

 var movement = parseFloat(leftValue, 10) - panelWidth;

 if (movement == tooFar) {
 $(".slide img").animate({
 "top": -200
 }, function() {
 $("#mover").animate({
 "left": 0
 }, function() {
 $(".slide img").animate({
 "top": 20
 });
 });
 });
 }
 else {
 $(".slide img").animate({
 "top": -200
 }, function() {
 $("#mover").animate({
 "left": movement
 }, function() {
 $(".slide img").animate({
 "top": 20
 });
 });
 });
 }
 }

 */

$(function() {
    /*
     var $slide1 = $("#slide-1");

     var panelWidth = $slide1.css("width");
     var panelPaddingLeft = $slide1.css("paddingLeft");
     var panelPaddingRight = $slide1.css("paddingRight");

     panelWidth = parseFloat(panelWidth, 10);
     panelPaddingLeft = parseFloat(panelPaddingLeft, 10);
     panelPaddingRight = parseFloat(panelPaddingRight, 10);

     panelWidth = panelWidth + panelPaddingLeft + panelPaddingRight;

     var numPanels = $(".slide").length;
     var tooFar = -(panelWidth * numPanels);
     var totalMoverwidth = numPanels * panelWidth;
     $("#mover").css("width", totalMoverwidth);

     $("#slider").append('<a href="#" id="slider-stopper">Stop</a>');

     sliderIntervalID = setInterval(function() {
     doMove(panelWidth, tooFar);
     }, delayLength);

     $("#slider-stopper").click(function() {
     if ($(this).text() == "Stop") {
     clearInterval(sliderIntervalID);
     $(this).text("Start");
     }
     else {
     sliderIntervalID = setInterval(function() {
     doMove(panelWidth, tooFar);
     }, delayLength);
     $(this).text("Stop");
     }

     });
     */


    /*
     // Grayscale w canvas method
     function grayscale(src){
     var canvas = document.createElement('canvas');
     var ctx = canvas.getContext('2d');
     var imgObj = new Image();
     imgObj.src = src;
     canvas.width = imgObj.width;
     canvas.height = imgObj.height;
     ctx.drawImage(imgObj, 0, 0);
     var imgPixels = ctx.getImageData(0, 0, canvas.width, canvas.height);
     for(var y = 0; y < imgPixels.height; y++){
     for(var x = 0; x < imgPixels.width; x++){
     var i = (y * 4) * imgPixels.width + x * 4;
     var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
     imgPixels.data[i] = avg;
     imgPixels.data[i + 1] = avg;
     imgPixels.data[i + 2] = avg;
     }
     }
     ctx.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
     return canvas.toDataURL();
     }
     */


});

function showPanel(id, obj) {
    $('#' + id).fadeIn();
    $(obj).hide();
    return false;
}


$(document).ready(
    function() {/*
     $('#news').innerfade({
     animationtype: 'slide',
     speed: 750,
     timeout: 2000,
     type: 'random',
     containerheight: '1em'
     });

     $('#portfolio').innerfade({
     speed: 'slow',
     timeout: 4000,
     type: 'sequence',
     containerheight: '220px'
     });
     */ //TODO Testimonials

        /*
        $('.fade').innerfade({
            speed: 'slow',
            timeout: 1000,
            type: 'sequence',
            containerheight: '1.5em'
        });
        */
    }
);