/// <reference path="jquery-1.6.3-vsdoc.js" />
/// <reference path="jquery-ui-1.8.16.custom.min.js" />
/// <reference path="jquery.ba-hashchange.min.js" />

if (!window.sublimemedia) window.sublimemedia = new Object();
window.sublimemedia.sampleswindowextraheight = 10;
isTouchDevice = (function() {
                try {
                    document.createEvent("TouchEvent");
                    return true;
                } catch (e) {
                    return false;
                }
            } ())

            $(document).ready(function () {
                // need a wee bit of time here because some browsers apparently aren't actually ready yet
                setTimeout(function () {

                    // Windows Phone browser doesn't support @font-face /opera/.test(navigator.userAgent.toLowerCase()
                    if (navigator.userAgent.toLowerCase().indexOf('iemobile') > -1) {
                        // IEMOBILE doesn't support TouchEvent?
                        isTouchDevice = true;

                        // remove header qoute
                        $('#hdr-home p').remove();

                        // add png version of quote
                        $('#hdr-home').append('<img id="pngquote" src="theme/smarterhdr.png" alt="" />');

                        // load extra css for IEMOBILE
                        var $iemobcss = $('<link>');
                        $iemobcss.attr({
                            rel: 'stylesheet',
                            type: 'text/css',
                            href: 'theme/site-iemobile.css'
                        });
                        $('head').append($iemobcss);
                    }

                    // expand header sections
                    $('.expandheader').click(function () {
                        var $section = $(this).parent();
                        var closeall = $section.hasClass('selected');
                        $('.service').removeClass('selected');
                        if (!closeall)
                            $section.addClass('selected');

                        $('.service').each(function () {
                            if ($(this).hasClass('selected')) {
                                $(this).find('.expandcontent').stop().animate({ height: $(this).find('.expandcontentheight').height() }, 400, 'easeOutQuart', function () { $(this).css('height', 'auto'); });
                                document.location.hash = '#' + $(this).attr('id').substring($(this).attr('id').indexOf('-') + 1, $(this).attr('id').length);
                            } else {
                                if ($(this).hasClass('hover'))
                                    $(this).find('.expandcontent').stop().animate({ height: 12 }, 400, 'easeOutQuart');
                                else
                                    $(this).find('.expandcontent').stop().animate({ height: 0 }, 400, 'easeOutQuart');
                                $(this).find('.faq-evidence').removeClass('selected');
                                $(this).find('.btn-faq').removeClass('selected');
                                $(this).find('.btn-evidence').removeClass('selected');
                                $(this).find('.faq').stop().animate({ height: 0 }, 300, 'easeOutQuart');
                                $(this).find('.faq dt').removeClass('selected')
                                $(this).find('.faq dd').removeClass('selected').stop().animate({ height: 0 }, 300, 'easeOutQuart');
                                $(this).find('.evidence').stop().animate({ height: 0 }, 300, 'easeOutQuart');
                                $(this).find('.lightbox').stop().animate({ marginTop: 0, height: 0 }, 300, 'easeOutQuart', function () { destroyLightbox($(this)); });
                            }
                        });

                        if ($('.service.selected').length == 0)
                            document.location.hash = '#!';
                    }).hover(function () {
                        var $section = $(this).parent();
                        $section.addClass('hover');
                        if (!$section.hasClass('selected')) $section.find('.expandcontent').stop().animate({ height: 12 }, 700, 'easeOutQuart');
                    }, function () {
                        var $section = $(this).parent();
                        $section.removeClass('hover');
                        if (!$section.hasClass('selected')) $section.find('.expandcontent').stop().animate({ height: 0 }, 700, 'easeOutQuart');
                    });


                    // faq item toggles
                    $('.faq dd').height(0);
                    $('.faq dt').click(function () {
                        var $list = $(this).parent();
                        var index = $list.find('dt').index($(this));
                        var $dds = $list.find('dd');

                        if ($dds.eq(index).hasClass('selected'))
                            $dds.eq(index).stop().animate({ height: 0 }, 300, 'easeOutQuart').removeClass('selected').parent().find('dt').eq(index).removeClass('selected');
                        else {
                            for (var i = 0; i < $dds.length; i++) {
                                if (i == index) {
                                    $dds.eq(i).stop().animate({ height: $dds.eq(i).attr('data-height') }, 300, 'easeOutQuart').addClass('selected').parent().find('dt').eq(i).addClass('selected');
                                } else
                                    $dds.eq(i).stop().animate({ height: 0 }, 300, 'easeOutQuart').removeClass('selected').parent().find('dt').eq(i).removeClass('selected');
                            }
                            setTimeout(function () { tryToScrollToTop($list.parentsUntil('.service').parent(), 300); }, 250);
                        }
                    });


                    // click faq & evidence buttons
                    $('.faq, .evidence').each(function () {
                        $(this).data('height', $(this).height()).attr('data-height', $(this).height()).height(0).addClass('unselected');
                    });

                    $('.btn-faq').click(function () {
                        if (!$(this).hasClass('selected')) {
                            var $queue = $({});
                            var $content = $(this).parentsUntil('.expandcontent').parent();
                            var $faq = $content.find('.faq');
                            var $evidence = $content.find('.evidence');
                            var $evidenceBtn = $content.find('.btn-evidence');

                            if ($evidenceBtn.length > 0) {
                                $evidenceBtn.removeClass('selected');
                                $queue.queue('queue', function (next) {
                                    $evidence.stop().animate({ height: 0 }, 300, 'easeOutQuart', function () { $(this).addClass('unselected'); next(); });
                                });
                            }

                            $(this).addClass('selected');
                            $content.find('.faq-evidence').addClass('selected');
                            $queue.queue('queue', function (next) {
                                $faq.removeClass('unselected').stop().animate({ height: $faq.data('height') }, 300, 'easeOutQuart', function () { $(this).css('height', 'auto'); next(); });
                                setTimeout(function () { tryToScrollToTop($content.parentsUntil('.service').parent(), 300); }, 250);
                            });

                            $queue.dequeue('queue');
                        }
                    });

                    $('.btn-evidence').click(function () {
                        if (!$(this).hasClass('selected')) {
                            var $queue = $({});
                            var $content = $(this).parentsUntil('.expandcontent').parent();
                            var $evidence = $content.find('.evidence');
                            var $faq = $content.find('.faq');
                            var $faqBtn = $content.find('.btn-faq');

                            if ($faqBtn.length > 0) {
                                $faqBtn.removeClass('selected');
                                $queue.queue('queue', function (next) {
                                    $faq.stop().animate({ height: 0 }, 300, 'easeOutQuart', function () { $(this).addClass('unselected'); next(); });
                                });
                            }

                            $(this).addClass('selected');
                            $content.find('.faq-evidence').addClass('selected');
                            $queue.queue('queue', function (next) {
                                $evidence.removeClass('unselected').stop().animate({ height: $evidence.data('height') }, 300, 'easeOutQuart', function () { $(this).css('height', 'auto'); next(); });
                                setTimeout(function () { tryToScrollToTop($content.parentsUntil('.service').parent(), 300); }, 250);
                            });

                            $queue.dequeue('queue');
                        }
                    });


                    //click samples & lightbox buttons
                    $('.btn-samples').click(function () {
                        var $content = $(this).parentsUntil('.expandcontent').parent();
                        var $section = $content.parent();
                        var $lightbox = $section.find('.lightbox');

                        setupLightbox($lightbox);

                        $lightbox.stop().animate({ marginTop: $content.height() * -1, height: 752 }, 400, 'easeOutQuart', function () { $lightbox.find('.selectbuttons button.btn-shot').first().addClass('selected'); showLightboxSample($lightbox.find('.fullshots li').eq(0), $lightbox); });
                        setTimeout(function () { tryToScrollToTop($content.parentsUntil('.service').parent(), 300); }, 250);
                    });



                    // hash change
                    $(window).hashchange(function () {
                        var top = 0;
                        var parts = location.hash.split('/');

                        if (parts.length > 0) {
                            switch (parts[0]) {
                                case '#elearning':
                                    top = $('#svc-elearning').position().top;
                                    if (!$('#svc-elearning').hasClass('selected'))
                                        setTimeout(function () { $('#svc-elearning .expandheader').click(); }, 100);
                                    break;
                                case '#portals':
                                    top = $('#svc-portals').position().top;
                                    if (!$('#svc-portals').hasClass('selected'))
                                        setTimeout(function () { $('#svc-portals .expandheader').click(); }, 100);
                                    break;
                                case '#iltraining':
                                    top = $('#svc-iltraining').position().top;
                                    if (!$('#svc-iltraining').hasClass('selected'))
                                        setTimeout(function () { $('#svc-iltraining .expandheader').click(); }, 100);
                                    break;
                                case '#consulting':
                                    top = $('#svc-consulting').position().top;
                                    if (!$('#svc-consulting').hasClass('selected'))
                                        setTimeout(function () { $('#svc-consulting .expandheader').click(); }, 100);
                                    break;
                                case '#marketing':
                                    top = $('#svc-marketing').position().top;
                                    if (!$('#svc-marketing').hasClass('selected'))
                                        setTimeout(function () { $('#svc-marketing .expandheader').click(); }, 100);
                                    break;
                                case '#thedifference':
                                    top = $('#svc-thedifference').position().top;
                                    if (!$('#svc-thedifference').hasClass('selected'))
                                        setTimeout(function () { $('#svc-thedifference .expandheader').click(); }, 100);
                                    break;
                                case '#contact':
                                    endScrollClientsScrollbar();
                                    $('.hdr-section').css('display', 'none');
                                    $('#hdr-contact').css('display', 'block');
                                    break;
                                case '#clients':
                                    $('.hdr-section').css('display', 'none');
                                    $('#hdr-clients').css('display', 'block');
                                    var isOpera = /opera/.test(navigator.userAgent.toLowerCase());
                                    if (isOpera) {
                                        $('#client-logos').css('width', '6000px');
                                    }
                                    if (isTouchDevice) {
                                        //use roto
                                        $('#client-content').css('width', '665px');
                                        $('#client-logos').css('height', '125px');
                                        $('#client-logos').css('overflow-y', 'hidden');
                                        $('#client-logos').addClass('roto');
                                        $('#client-logos').css('left', '0px');
                                        $('#client-logos img').wrapAll('<ul></ul>');
                                        $('#client-logos img').each(function (index) {
                                            $(this).wrapAll('<li id="c' + index + '"></li>');
                                        })
                                        $('#client-logos li+li').css('margin-left', '50px');
                                        $('#client-logos li:last').css('margin-right', '250px');
                                        $("#client-logos").roto();
                                        $(".roto").css("visibility", "visible");
                                    } else {
                                        setTimeout(function () { sizeClientLogos(); }, 20);
                                        if (!window.sublimemedia.scrollbardrawn) {
                                            setTimeout(function () { sizeClientsScrollbar(); }, 100);
                                        } else {
                                            $('#client-scrollthumb').css('left', 0);
                                            $('#client-logos').css('left', 105);
                                        }
                                    }
                                    break;
                                case '#about':
                                    endScrollClientsScrollbar();
                                    $('.hdr-section').css('display', 'none');
                                    $('#hdr-about').css('display', 'block');
                                    break;
                                case '#home':
                                    endScrollClientsScrollbar();
                                    $('.hdr-section').css('display', 'none');
                                    $('#hdr-home').css('display', 'block');
                                    break;
                                case '#!':
                                case '#':
                                case '':
                                    break;
                                default:
                                    document.location.hash = '#!';
                            }

                            var delta = Math.abs($(window).scrollTop() - top) * 0.6 + 100;
                            $('html, body').stop().animate({ scrollTop: top }, delta, 'easeOutQuart');
                        }

                        if (parts.length > 1) {
                            switch (parts[1]) {
                                case 'faq':
                                    setTimeout(function () { $('.service.selected .btn-faq').click(); }, 500);
                                    break;
                                case 'evidence':
                                    setTimeout(function () { $('.service.selected .btn-evidence').click(); }, 500);
                                    break;
                                case 'samples':
                                    setTimeout(function () { $('.service.selected .btn-samples').click(); }, 500);
                                    break;
                            }
                        }

                        if (parts.length > 2) {
                            var index = parseInt(parts[2]);
                            if (!isNaN(index)) {
                                switch (parts[1]) {
                                    case 'faq':
                                        setTimeout(function () { $('.service.selected .faq dt').eq(index - 1).click(); }, 900);
                                        break;
                                    case 'samples':
                                        setTimeout(function () { $('.service.selected .lightbox button.btn-shot').eq(index - 1).click(); }, 950);
                                        break;
                                }
                            }
                        }
                    });
                    $(window).hashchange();
                }, 250);
            });

function setupLightbox($lightbox) {
    var $uicontainer = $('<div class="uicontainer"></div>');
    var $closebutton = $('<button class="btn-close"><span class="value">Close</span><span class="icon"></span></button>');
    $closebutton.click(function () {
        $lightbox.stop().animate({ marginTop: 0, height: 0 }, 400, 'easeOutQuart', function () { destroyLightbox($lightbox); });
    });

    var $selectbuttons = $('<div class="selectbuttons"></div>');

    var $prevbutton = $('<button class="btn-prevshot"><span class="icon"></span></button>');
    $selectbuttons.append($prevbutton);

    $lightbox.find('.fullshots li').each(function () {
        var $btn = $('<button class="btn-shot"></button>');
        $btn.data('fullshot', $(this)).click(function () {
            $(this).parent().find('button').removeClass('selected');
            showLightboxSample($(this).data('fullshot'), $lightbox);
            $(this).addClass('selected');
        }).hover(function () {
            $(this).addClass('hover');
        }, function () {
            $(this).removeClass('hover');
        });

        $selectbuttons.append($btn);
    });

    var $nextbutton = $('<button class="btn-nextshot"><span class="icon"></span></button>');
    $selectbuttons.append($nextbutton);

    $uicontainer.append($closebutton);
    $lightbox.append($uicontainer);
    $lightbox.append($selectbuttons);
    $selectbuttons.css('margin-left', $selectbuttons.width() / -2);
}

function destroyLightbox($lightbox, keepUI) {
    if (!keepUI) {
        $lightbox.find('.uicontainer').remove();
        $lightbox.find('.selectbuttons').remove();
    }
    $lightbox.find('.shotinset').remove();
    $lightbox.find('.textcontainer').remove();
    $lightbox.find('.demolinkcontainer').remove();
}

function showLightboxSample($shot, $lightbox) {
    destroyLightbox($lightbox, true);   // maybe make this fade out instead?
    var $shotinset = $('<div class="shotinset"></div>');
    var $shotcontainer = $('<div class="shotcontainer"></div>');
    var $textcontainer = $('<div class="textcontainer"></div>');
    var $btncontainer = $('<div class="demolinkcontainer"><div class="demolinkwidth"></div></div>');

    var $img = $shot.find('img').clone();
    var $title = $shot.find('h4').clone();
    var $desc = $shot.find('p').clone();
    var $btn = null;
    if ($shot.find('a.link').length > 0) {
        var $link = $shot.find('a.link');
        $btn = $('<button class="btn-demolink"><span class="value">' + $link.text() + '</span><span class="icon"></span></button>').click(function () {
            var href = $link.attr('href')
            if ($link.attr('target'))
                window.open(href, $link.attr('target'));
            else
                document.location = href;
        });
    }

    $shotcontainer.width($img.attr('width'));
    $shotinset.append($shotcontainer);
    $shotcontainer.append($img);
    $lightbox.append($shotinset);

    $textcontainer.width($img.attr('width'));
    $textcontainer.append($title);
    $textcontainer.append($desc);
    $lightbox.append($textcontainer);

    if ($btn) {
        $btncontainer.find('.demolinkwidth').width($img.attr('width'));
        $btncontainer.css('bottom', $lightbox.find('.selectbuttons').css('bottom'));
        $btncontainer.find('.demolinkwidth').append($btn);
        $lightbox.append($btncontainer);
    }

    var $dots = $lightbox.find('.btn-shot');
    $lightbox.find('.btn-prevshot').unbind().click(function () {
        var $curdot = $lightbox.find('.btn-shot.selected');
        $dots.removeClass('selected');
        if ($curdot.prev('.btn-shot').length > 0)
            showLightboxSample($curdot.prev('.btn-shot').addClass('selected').data('fullshot'), $lightbox);
        else
            showLightboxSample($dots.last().addClass('selected').data('fullshot'), $lightbox);
    });

    $lightbox.find('.btn-nextshot').unbind().click(function () {
        var $curdot = $lightbox.find('.btn-shot.selected');
        $dots.removeClass('selected');
        if ($curdot.next('.btn-shot').length > 0)
            showLightboxSample($curdot.next('.btn-shot').addClass('selected').data('fullshot'), $lightbox);
        else
            showLightboxSample($dots.first().addClass('selected').data('fullshot'), $lightbox);
    });

    $lightbox.animate({ height: $textcontainer.position().top + $textcontainer.height() + window.sublimemedia.sampleswindowextraheight }, 500, 'easeOutCirc');
    $lightbox.find('.shotcontainer, .textcontainer').stop().animate({ opacity: 1 }, 500, 'easeOutCirc');
    $lightbox.find('.selectbuttons').stop().animate({ bottom: $textcontainer.height() + 25 }, 500, 'easeOutCirc');
    $lightbox.find('.demolinkcontainer').stop().animate({ opacity: 1, bottom: $textcontainer.height() + 19 }, 500, 'easeOutCirc');
}

function tryToScrollToTop($elem, duration) {
    $('html, body').stop().animate({ scrollTop: $elem.position().top }, duration, 'easeOutQuart');
}

function sizeClientsScrollbar() {
    var logostripwidth = $('#client-logos img').last().position().left;
    var scrollablewidth = $('#client-scrollarea').width();
    var initleftoffset = 105;
    var isIE7 = /msie 7\.0/.test(navigator.userAgent.toLowerCase());
    if (logostripwidth > scrollablewidth) {
        var sblength = Math.round(scrollablewidth / logostripwidth * $('#client-scrolltrack').width());
        $('#client-scrollthumb').css('display', 'block').width(sblength).draggable({ axis: "x", containment: "parent",
            start: function () { $(this).addClass("hover"); },
            stop: function () { $(this).removeClass("hover"); },
            drag: function (event, ui) {
                endScrollClientsScrollbar();
                var pct = ui.position.left / (scrollablewidth - ui.helper.width());
                var offset = -logostripwidth * pct;
                $("#client-logos").css('left', offset + initleftoffset);
                sizeClientLogos();
            }
        });
        if (isIE7) {
            $('#client-scrollthumb').css('border', '5px solid white');
        }
    }

    window.sublimemedia.scrollbardrawn = true;
}

function beginScrollClientsScrollbar() {
    var initleftoffset = 105, autoscrollduration = 50000;

    if (!window.sublimemedia.$clientsQueue) window.sublimemedia.$clientsQueue = $({});

    window.sublimemedia.$clientsQueue.queue('queue', function (next) {
        $('#client-scrollthumb').stop().animate({ left: $('#client-scrollthumb').parent().width() - $('#client-scrollthumb').width() }, autoscrollduration, 'linear', function () { next(); });
        $('#client-logos').stop().animate({ left: initleftoffset - $('#client-logos img').last().position().left },
            { duration: autoscrollduration, easing: 'linear', complete: function () { next(); }, step: function () { sizeClientLogos() } });
    });
    window.sublimemedia.$clientsQueue.dequeue('queue');
}

function endScrollClientsScrollbar() {
    $('#client-scrollthumb, #client-logos').stop();
}

function sizeClientLogos() {
    var scrollablewidth = $('#client-scrollarea').width();
    var initleftoffset = 105;
    var logosoffset = parseInt($("#client-logos").css('left'));

    $('#client-logos img').each(function () {
        var cpos = $(this).position().left + $(this).width() / 2 + logosoffset;
        var cdelta = Math.abs(scrollablewidth / 2 - cpos);
        var cpct = Math.abs(1 - (cdelta / scrollablewidth));
        if (cpct < 0.3) cpct = 0.3;
        if (cpct > 1) cpct = 1;
        
        var newwidth = Math.round($(this).attr("data-origwidth") * cpct);
        var newheight = Math.round($(this).attr("data-origheight") * cpct);

        $(this).width(newwidth).height(newheight);
    });
}

// this is called if we are using IE and don't have text-shadow
function createFakeTextShadow() {
    $(document).ready(function () {
        var $newps = $('#hdr-home p.hdr-quotegreen').clone();
        $newps.addClass('hdr-quoteshadow').each(function () {
            $(this).css('left', parseInt($(this).css('left')) + 2).css('top', parseInt($(this).css('top')) + 2);
        });
        $('#hdr-home').append($newps);
    });
}