/**
 * @author Mitsuaki Ishimoto
 */


/**
 * Found
 */
Found = {};

/**
 * Renovation
 */
Found.Renovation = {};

/**
 * Screen
 * @param {Object} $
 * @param {Object} Found
 */
Found.Renovation.Screen = (function($, Found){
    var getClientSize = function(){
        var client = (function(){
            if(!!(window.attachEvent && !window.opera) && document.compatMode == 'CSS1Compat'){
                return document.documentElement;
            }
            else if(!!(window.attachEvent && !window.opera)){
                return document.body;
            }
            else{
                return document.documentElement;
            }
        })();
        return ({"width" : client.clientWidth, "height" : client.clientHeight});
    };
    var photos = [
        'img/renovation/kitchen-b.jpg',
        'img/renovation/kitchen-a.jpg',
        'img/renovation/living-b.jpg',
        'img/renovation/living-a.jpg',
        'img/renovation/childroom-b.jpg',
        'img/renovation/childroom-a.jpg',
        'img/renovation/bedroom-b.jpg',
        'img/renovation/bedroom-a.jpg'
    ];
    var setCenter = function(elm){
        //var elm = document.getElementById('container');
        var clientSize = getClientSize();
        if(750 > clientSize.width){
            elm.css({
                "left"       : 0,
                "marginLeft" : 0
            });
        }
        if(550 > clientSize.height){
            elm.css({
                "top"       : "20px",
                "marginTop" : 0
            });
        }
    }
    return {
        /**
         * 
         */
        "_shadowfadeInTime" : 1000,
        
        /**
         * 
         */
        "_textDisplayTime" : 5000,
        
        /**
         * 
         */
        "_textFadeOutTime" : 1500,
        
        /**
         * 
         */
        "_imgDisplayTime" : 5000,
        
        /**
         * 
         */
        "_imgFadeOutTime" : 1500,
        
        /**
         * 
         */
        "_isOpened" : false,
        
        /**
         * 
         */
        "_timeIdFadeTextOut" : "",
        
        /**
         * 
         */
        "_timeIDisplayPicture" : "",
        
        /**
         * 
         */
        "_counter" : 0,
        /**
         * 
         */
        "_shadow" : "",
        
        /**
         * 
         */
        "_imgs" : "",
        
        
        /**
         * 
         */
        "_p" : "",
        
        
        /**
         * 
         */
        "_img" : "",
        
        /**
         * init
         */
        "init" : function(){
            this._addButtonEvent();
            this._addCloseEvent();
            this._resizeWindowEvent();
            if(Found.Renovation.Photos){
                photos = Found.Renovation.Photos;
            }
        },
        
        /**
         * _resizeWindowEvent
         */
        "_resizeWindowEvent" : function(){
            var self = this;
            $(window).resize(function(){
                if(self._shadow){
                    var width  = (document.documentElement.scrollWidth > getClientSize().width)? document.documentElement.scrollWidth : getClientSize().width;
                    var height = (document.documentElement.scrollHeight > getClientSize().height)? document.documentElement.scrollHeight : getClientSize().height;
                    $(self._shadow).css({
                        "width"           : width + 'px',
                        "height"          : height + 30 + 'px'
                    });
                    setCenter($('div#renovation'));
                }
            });
        },
        
        /**
         * _addButtonEvent
         */
        "_addButtonEvent" : function(){
            var self = this;
            $('a.buttonOpenRenovation').click(function(){
                setCenter($('div#renovation'));
                var div    = document.createElement('div');
                self._shadow = div;
                var width  = (document.documentElement.scrollWidth > getClientSize().width)? document.documentElement.scrollWidth : getClientSize().width;
                var height = (document.documentElement.scrollHeight > getClientSize().height)? document.documentElement.scrollHeight : getClientSize().height;
                $(div).css({
                    "position"        : "absolute",
                    "top"             : "-30px",
                    "left"            : "0",
                    "width"           : width + 'px',
                    "height"          : height + 30 + 'px',
                    "backgroundColor" : "#000000",
                    "zIndex"          : 10
                });
                $(div).fadeOut(0);
                $('div#renovation').fadeOut(0);
                $('div#renovation').css({
                    "zIndex"          : 100
                });
                $(div).fadeTo(
                    200,
                    0.8
                );
                $('body').append(div);
                $('div#renovation').fadeIn(
                    200,
                    function(){
                        self._counter  = 0;
                        self._isOpened = true;
                        self._setSlideShow();
                    }
                );
            });
        },
        
        /**
         * _addCloseEvent
         */
        "_addCloseEvent" : function(){
            var self = this;
            $('a.buttonClose').click(function(){
                clearTimeout(self._timeIdFadeTextOut);
                clearTimeout(self._timeIDisplayPicture);
                self._isOpened            = false;
                self._timeIdFadeTextOut   = false;
                self._timeIDisplayPicture = false;
                $(self._p).remove();
                $(self._img).remove();
                $('div#renovation div.main').css({
                    "backgroundImage" : "none"
                });
                if(self._shadow){
                    $(self._shadow).fadeOut(
                        200,
                        function(){
                            $('div#renovation div.main div.wrapper').fadeIn(0);
                            $(self._shadow).remove();
                            self._shadow = '';
                        }
                    );
                }
                $('div#renovation').fadeOut(200);
            });
        },
        
        /**
         * _setSlideShow
         */
        "_setSlideShow" : function(){
            var self = this;
            self._imgs    = [];
            for(var i = 0; i < photos.length; i++){
                self._imgs[i] = document.createElement('img');
                self._imgs[i].src = photos[i];
            }
            
            self._timeIdFadeTextOut = setTimeout(
                function(){
                    if(self._isOpened){
                        $('div#renovation div.wrapper').fadeOut(
                            self._textFadeOutTime,
                            function(){
                                var p   = document.createElement('p');
                                p.id    = 'beforeAfterWrapper';
                                self._p = p;
                                var img = document.createElement('img');
                                self._img  = img;
                                img.id     = 'beforeAfter';
                                img.width  = 680;
                                img.height = 400;
                                img.src = photos[self._counter];
                                p.appendChild(img);
                                $('div#renovation div.main').append(p);
                                $(p).fadeOut(
                                    0,
                                    function(){
                                        $(p).fadeIn(
                                            self._imgFadeOutTime,
                                            function(){
                                                if(self._isOpened){
                                                    self._setSlide();
                                                }
                                            }
                                        )
                                    }
                                );
                            }
                        );
                    }
                },
                self._textDisplayTime
            );
        },
        
        /**
         * _setSlide
         */
        "_setSlide" : function(){
            var self = this;
            $(self._img).attr('src', photos[self._counter]);
            var bg;
            if(photos[self._counter + 1]){
                bg = photos[self._counter + 1];
            }
            else{
                bg = photos[0];
            }
            $('div#renovation div.main').css({
                "backgroundImage" : "url('" + bg + "')"
            });
            self._timeIDisplayPicture = setTimeout(
                function(){
                    if(self._isOpened){
                        $(self._p).fadeOut(
                            self._imgFadeOutTime,
                            function(){
                                self._counter++;
                                if(!photos[self._counter]){
                                    self._counter = 0;
                                }
                                $(self._p).fadeIn(0);
                                if(self._isOpened){
                                    self._setSlide();
                                }
                            }
                        );
                    }
                },
                self._imgDisplayTime
            );
        }
    };
})($, Found);

/**
 * Bootstrap
 * @param {Object} $
 * @param {Object} Found
 */
Found.Renovation.Bootstrap = (function($, Found){
    return {
        "run" : function(){
            this._bootstrap();
        },
        
        "_bootstrap" : function(){
            Found.Renovation.Screen.init();
        }
    };
})($, Found);

$(function(){
    Found.Renovation.Bootstrap.run();
});