//JavaScript

$(document).ready(function(){
    var r = new Game();
    r.init();
});

function Game(){

}

Game.prototype = {
    init:function(){
        this.findBlocks();
    },
    findBlocks:function(){
        if($('.about .content .bg').length != 0){
            this.initBg();
        }
        if($('.screenshot .wrap .bg').length != 0){
            this.initScreenshot();
        }
        if($('.outer .menu .bg').length != 0){
            this.initMenuBg();
        }
    },
    initBg:function(){
        this.ghostBg = $('.about .content .textblock .bg');
        this.ghostBg.css({opacity:0.6});
        
        textBlock = $('.about .content .textblock');
        this.ghostBg.height( textBlock.height() );
    },
    initMenuBg:function(){
        this.menuBg = $('.outer .menu .bg');
        this.menuBg.css({opacity:0.6});
    },
    initScreenshot:function(){
        this.screenBg = $('.screenshot .wrap .bg');
        this.screenBg.css({opacity:0.8});
        this.findImg();
    },
    findImg:function(){
		var _my = this;
		this.aSmall = new Array();
		$('.small .inner img').each(function(i){
			_my.aSmall.push(new Small(this, i, _my, $('.small .inner img').length));
		});
		this.wrap = $('.small .inner');
		this.begOffset = this.wrap.offset().left
		this.bigLeft = $('.wrap .left-arr');
		this.smallLeft = $('.wrap .left-arr2');
        this.rFlag = true;
        this.lFlag = true;
		this.bigRight = $('.wrap .right-arr');
		this.smallRight = $('.wrap .right-arr2');
		this.bigLeft.click(function(){
		    _my.prev();
		});
		this.bigRight.click(function(){
		    _my.nex();
		});
/*		this.smallLeft.mousedown(function(){
            _my.lInterval = setInterval(function(){_my.lScroll()}, 10);
		}).mouseup(function(){
            clearInterval(_my.lInterval);
		});
		this.smallRight.mousedown(function(){
            _my.rInterval = setInterval(function(){_my.rScroll()}, 10);
		}).mouseup(function(){
            clearInterval(_my.rInterval);
		});
		$(window).mouseup(function(){
            clearInterval(_my.rInterval);
            clearInterval(_my.lInterval);
		})*/
		this.smallLeft.click(function(){
            if(_my.wrap.get(0).offsetLeft  < 0){
    		    if(_my.lFlag == true){
         		   _my.lFlag = false;
                   _my.smallLeft.css({display:'block'});
                   _my.smallRight.css({display:'block'});
                    var temp = _my.wrap.get(0).offsetLeft+336;
         		   _my.wrap.animate({left:temp}, 100, 'linear', function(){
         		      _my.lFlag = true; 
                      if(_my.wrap.get(0).offsetLeft  >= 0){
                          _my.smallLeft.css({display:'none'});
                      }
         		   });
    		    }
            } else {
                _my.smallLeft.css({display:'none'});
            }
		});
		this.smallRight.click(function(){
            if(_my.wrap.get(0).offsetLeft + _my.wrap.width() > 700){
    		    if(_my.rFlag == true){
         		   _my.rFlag = false;
                   _my.smallRight.css({display:'block'});
                   _my.smallLeft.css({display:'block'});
                    var temp2 = _my.wrap.get(0).offsetLeft-336;
         		   _my.wrap.animate({left:temp2}, 100, 'linear', function(){
         		      _my.rFlag = true;
         		      if(_my.wrap.get(0).offsetLeft + _my.wrap.width() <= 700){
                          _my.smallRight.css({display:'none'});
         		      }
         		   });
    		    }
            } else {
                _my.smallRight.css({display:'none'});
            }
		});
    },
    hideAll:function(obj){
        for(var i=0; i<this.aSmall.length; i++){
            this.aSmall[i].hide();
            if(obj == this.aSmall[i]){
                this.aSmall[i].big.css({visibility:'visible'});
            }
        }
    },
    prev:function(){
	    for(var i=0; i<this.aSmall.length; i++){
	        if(this.aSmall[i].big.css('visibility') != 'hidden'){
	            var k = i;
	        }
	    }
	    this.aSmall[k-1].show();
    },
    nex:function(){
	    for(var i=0; i<this.aSmall.length; i++){
	        if(this.aSmall[i].big.css('visibility') == 'visible'){
	            var k = i;
	        }
	    }
        this.aSmall[k+1].show();
    },
    lScroll:function(){
        if(this.wrap.get(0).offsetLeft  < 0){
            var temp2 = this.wrap.get(0).offsetLeft+5;
            this.wrap.css({left:temp2});
            this.smallLeft.css({display:'block'});
            this.smallRight.css({display:'block'});
        } else {
            this.smallLeft.css({display:'none'});
        }
    },
    rScroll:function(){
        if(this.wrap.get(0).offsetLeft + this.wrap.width() > 700){
            var temp = this.wrap.get(0).offsetLeft-5;
            this.wrap.css({left:temp});
            this.smallRight.css({display:'block'});
            this.smallLeft.css({display:'block'});
        } else {
            this.smallRight.css({display:'none'});
        }
    }
}

function Small(obj, i, parent, length){
	this.iLength = length;
	this.obj = $(obj);
	this.parent = parent;
	this.index = i;
	this.init();
}

Small.prototype = {
	init:function(){
		var _my = this;
		this.big = $('.wrap .big img').eq(this.index);
		if(this.index != 0){
		    this.big.css({visibility:'hidden'});
		} else if (this.index == 0){
            this.big.css({visibility:'visible'});
        }
		this.attachEvents();
	},
	attachEvents:function(){
	    var _my = this;
	    this.obj.click(function(){
	        _my.show();
	    });
	    
	},
	show:function(){
	    this.parent.hideAll(this);
	    if(this.index == 0){
    		this.parent.bigLeft.css({display:'none'});
    		this.parent.bigRight.css({display:'block'});
	    } else if(this.index == this.iLength-1){
    		this.parent.bigLeft.css({display:'block'});
    		this.parent.bigRight.css({display:'none'});
	    } else {
    		this.parent.bigLeft.css({display:'block'});
    		this.parent.bigRight.css({display:'block'});
	    }
	},
	hide:function(){
	    this.big.css({visibility:'hidden'});
	}
}