(function ($) {
	
	$.selectRegion = function (options) {
		return $.selectRegion.impl.init(options);
	};
	
	$.fn.selectRegion = function (options) {
		return $.selectRegion.impl.init(this, options);
	};
	
	/*
	 * default options
	 */
	$.selectRegion.defaults = {
	    
	};
	
	$.selectRegion.impl = {
		
		/*
		 * options
		 */
		opts:           null,
		
		/*
		 * helper
		 */
		helper:         {},
		        
        /*
        * animating
        */
        animating: false,
        
        /*
        * open
        */
        open: false,
        
        /*
        * base height
        */
        baseH: 0,
		
		/*
		 * Initialize
		 */
		init: function (options) {
            
            var self = this;
            
            this.opts = $.extend({}, $.selectRegion.defaults, options);
            
            // helpers
            self.helper.container = $('div.region-container');
            self.helper.regions = self.helper.container.find('.table-regions');
            self.helper.backgroundContainer = $('div.background-container');
            self.helper.background = self.helper.backgroundContainer.find('img');
            
            self.helper.container.find('td')
                .attr('valign', 'top')
                ;
            
            self.baseH = self.helper.container.height();
            
            // background
            self.background();
            
			return self;
		},
		
	    /*
        * Events
        */
        events: function () {
            
            var self = this;
            
            // region click
            self.helper.regions.find('a')
                .hover(
                    function()
                    {
                        if (self.animating == true)
                            return;
                        
                        if ($(this).parent().hasClass('active'))
                            return;
                        
                        $(this).parent()
                            .addClass('active')
                            .siblings()
                            .removeClass('active')
                            ;
                        
                        var region = $(this).attr('class');
                        
                        self.region(region);
                    },
                    function(){}
                )
                ;
            
            return;
        },
        
        /*
        * Region
        */
        region: function (region) {
            
            var self = this;
            
            var $region = self.helper.container.find('table.' + region);
            
            $region
                .addClass('region-active')
                .css({
                    opacity:    '0.00',
                    display:    'block'
                })
                ;
            
            var regionH = $region.height();
            var h = self.baseH + 21 + regionH;
            
            self.animate(h);
            
            $region
                .fadeTo(800, '1.00')
                ;
            
            self.helper.container.find('table.table-countries:not(".' + region +'")')
                .fadeOut(800)
                ;
            
            return;
        },
		
		/*
        * Animate
        */
        animate: function (h) {
            
            var self = this;
            
            self.animating = true;
            
            self.helper.container
                .animate({height: h + 'px'}, 800, 'easeOutExpo', function(){
                    
                    self.animating = false;
                    
                    if (h == 0)
                        self.open = false;
                    
                    else
                        self.open = true;
                })
                ;
            
            return;
        },
        
        /*
	     * Background
	     */
		background: function () {
		    
		    var self    = this;
		    
		    // load the image
		    $(new Image()).load(function(){
                
                var rat = self.helper.background.width()/self.helper.background.height()
                
                // scale the image
                if ($(window).width()/$(window).height() < rat)
                {
                    self.helper.background
                        .css({
                            width:      'auto',
                            height:     '100%'
                        })
                        ;
                }
                else
                {
                    self.helper.background
                        .css({
                            width:      '100%',
                            height:     'auto'
                        })
                        ;
                }
                
                // show the image
                self.helper.background
                    .fadeIn(2000, 'easeOutExpo')
                    ;
                
                // events
                self.events();
                
            }).attr('src', self.helper.background.attr('src'));
		    
		    return;
		}
		
	};
})(jQuery);
