/*
 *@author:uzzal(http://uzzal.wordpress.com)
 *@doc:
 * $j('#jflipper').flipper({
 *  slide_1:'photo.png',
 *  target_1:'http://example.com',
 *  slide_2:'photo.png',
 *  target_2:'http://example.com',
 *  slide_3:'photo.png',
 *  target_3:'http://example.com',
 * });
 */
(function($){
    $.fn.flipper=function(opt){
        return this.each(function(){
            flipper.init($,this,opt);
        });
    };
})(jQuery);
var flipper={
    height:411,
    width:839,
    timer:null,
    current:0,
    init:function($,obj,opt){        
        this.loadDom($, obj,opt);
        this.start($, obj);        
    },
    loadDom:function($,obj,opt){
        var html="<div class='wrapper'>";
        html+="<div class='slide_1'><a href='"+opt.target_1+"' target='_blank'><img src='"+opt.slide_1+"' /></a></div>";
        html+="<div class='slide_2'><a href='"+opt.target_2+"' target='_blank'><img src='"+opt.slide_2+"' /></a></div>";
        html+="<div class='slide_3'><a href='"+opt.target_3+"' target='_blank'><img src='"+opt.slide_3+"' /></a></div>";
        html+="<div class='clear'></div>";        
        html+="</div>";
        html+="<div class='navigation'><ul><li class='nav_1 sel'></li><li class='nav_2'></li><li class='nav_3'></li></ul><div class='clear'></div></div>";
        
        $(obj).html(html);
        $(obj).find('li.nav_1').bind('click',function(){flipper.moveToA($,obj);});
        $(obj).find('li.nav_2').bind('click',function(){flipper.moveToB($,obj);});
        $(obj).find('li.nav_3').bind('click',function(){flipper.moveToC($,obj);});
    },
    loadSlide:function($,obj){

    },
    start:function($,obj){
        this.timer=setInterval(function(){
           flipper.moveLeft($, obj);
        },3000);
    },
    stop:function(){
        clearInterval(this.timer);
    },
    reStart:function($, obj){
        this.stop();
        this.moveLeft($, obj);        
        this.start($, obj);
    },
    moveLeft:function($,obj){
        if(this.current>2){this.current=0;}
        var curr=this.current;
        var position=this.width*curr;
        var nav_pos=curr+1;
        $(obj).find('li').removeClass('sel');
        $(obj).find('.nav_'+nav_pos).addClass('sel');
        $(obj).children('div.wrapper').animate({'left':'-'+position},'slow');
        this.current++;
    },
    moveToA:function($,obj){
        this.current=0;        
        this.reStart($, obj);
    },
    moveToB:function($,obj){
        this.current=1;
        this.reStart($, obj);
    },
    moveToC:function($,obj){
        this.current=2;
        this.reStart($, obj);
    }
}