jQuery.noConflict();

 (function($j) {

    BgSlides = {

        settings: {
            dimensions: {
                w: '1280',
                h: '800'
            },
            slides: {
                images: '#Slides img',
                links: [],
                descriptions: [],
                wait: null,
                count: 0,
                isAnimating: false
            }
        },

        init: function() {

            var self = this;

            if ($j('#Home').length) {
                self.processDescriptions();
            } else {
                self.processImages();
            }
        },

        processDescriptions: function() {

			/* Function for the homepage - pull the img hrefs and titles into arrays, build and attach the info panel */
            var self = this;

            var projectInfo = "<div class='project-information' id='ProjectInformation'><div class='background'></div><div class='inner'><a class='p-button' href='#' title='Information'>Information</a><p class='p-description'>Lorem ipsum dolor sit amet - consectetur adipisicing elit</p><p class='p-more'><a href='#' title='Find out more'>Find out more</a></p></div></div>";
            $j('body').append(projectInfo);

            $j(self.settings.slides.images).each(function(i) {
                var a = $j(this).parent().attr('href');
                var d = $j(this).attr('title');
                self.settings.slides.links[i] = a;
                self.settings.slides.descriptions[i] = d;
            });

            $j('#ProjectInformation').mouseenter(function() {
                $j(this).stop(true, true).animate({
                    height: '140'
                });
                $j('.background', this).stop(true, true).animate({
                    opacity: '1'
                });
                $j('.inner', this).stop(true, true).animate({
                    opacity: '1'
                });
                $j('#Slides, #Container').mouseenter(function() {
                    hideInfo()
                })
            });

            function hideInfo() {
                $j('#ProjectInformation').animate({
                    height: '80'
                });
                $j('.background', '#ProjectInformation').animate({
                    opacity: '0'
                });
                $j('.inner', '#ProjectInformation').animate({
                    opacity: '0.25'
                });
            }

            $j(self.settings.slides.images).unwrap('a');
            $j('.p-description').text(self.settings.slides.descriptions[0]);
            hideInfo();
            self.processImages();
        },

        processImages: function() {

			/* For all pages with scalable background images */
            var self = this;

            self.settings.slides.count = $j(self.settings.slides.images).size();
            $j(self.settings.slides.images).hide();
            $j(self.settings.slides.images + ':first').addClass('visible').show();

            $j(window).bind("resize",
            function() {
                self.resizeSlides();
            });
            self.resizeSlides();

            if (self.settings.slides.count > 1) {
                self.startSlides();
                self.hoverEvents();
            }
        },


        hoverEvents: function() {

            var self = this;

            //$j('#Header').mouseover(function() {
            $j('#ProjectInformation').mouseover(function() {
                self.pauseSlides();
            });
            $j('#ProjectInformation').mouseout(function() {
                self.startSlides();
            });

        },

        resizeSlides: function() {

            var self = this;

            $j(self.settings.slides.images).each(function() {
            	
                var wWidth = $j(window).width();
                var wHeight = $j(window).height();
                /*
                var iWidth = $j(this).width();
                var iHeight = $j(this).height();*/
                
                // full screen images are always the same size
                var iWidth = 1280;
                var iHeight = 800;
                
                var wRatio = wHeight / wWidth;
                var iRatio = iHeight / iWidth;

                if (wRatio > iRatio) {
                    iHeight = wHeight;
                    iWidth = wHeight / iRatio;
                } else {
                    iHeight = wWidth * iRatio;
                    iWidth = wWidth;
                }
                /*
                iHeight = Math.round(iHeight);
                iWidth = Math.round(iWidth);
                */
                var l = 0;
                var h = 0;
                
                l = -Math.round((iWidth-wWidth)/2)
                h = -Math.round((iHeight-wHeight)/2)
                /*
                var cssObj = {
                    height: iHeight,
                    left: l,
                    position: 'absolute',
                    top: h,
                    width: iWidth
                }
*/
                var cssObj = {
                    height: iHeight,
                    left: l,
                    position: 'fixed',
                    top: h,
                    width: iWidth
                }
                $j(this).css(cssObj);
                $j('#hensshaws-bg').css(cssObj);
                
                if( $j('#ModalOverlay') ){
                    var cssObj = {
                        height: $j(window).height(),
                        width: $j(window).width()
                    }
                 
                    $j('#ModalOverlay').css(cssObj);
                }
            });

        },

        startSlides: function() {

            var self = this;
            var current = 0;
            var index = self.settings.slides.count - 1;

            if (self.settings.slides.links.length > 1) {
                $j('.p-description').text(self.settings.slides.descriptions[current]);
                $j('.p-more a, .p-button').attr("href", self.settings.slides.links[current]);
            }

            self.settings.slides.wait = setInterval(function() {

                if ((self.settings.slides.isAnimating) && (self.settings.slides.count > 1)) {
                    return false;
                } else {
                    self.settings.slides.isAnimating = true;
                }

                (current == index) ? current = 0: current++;

                if (self.settings.slides.links.length > 1) {
                    $j('.p-description').text(self.settings.slides.descriptions[current]);
                    $j('.p-more a, .p-button').attr("href", self.settings.slides.links[current]);
                }

                var currentSlide = $j(self.settings.slides.images + '.visible');
                $j(currentSlide).removeClass('visible').css({
                    'z-index': '1'
                });

                var nextSlide = $j(currentSlide).next().length ? $j(currentSlide).next() : $j(self.settings.slides.images + ':first');
                nextSlide.addClass('visible').css({
                    'z-index': '2'
                });

                $j(nextSlide).fadeIn(500,
                function() {
                    $j(self.settings.slides.images).not(self.settings.slides.images + '.visible').hide().css({
                        'z-index': '0'
                    });
                    self.settings.slides.isAnimating = false;
                });

            },
            6000);

        },

        pauseSlides: function() {

            var self = this;

            clearInterval(self.settings.slides.wait);
            self.settings.slides.wait = '';

        }

    };

    $j().ready(function() {

        BgSlides.init();

    });

})(jQuery);


