var R = {
    
    blue : {meter:10, sec:1,speed:0.1},
    red : {meter:10, sec:1,speed:0.1},
    color : null,
    select : null,
    winner : null,
    startM : 94, //스타트 라인위치(픽셀)
    endM : 594, //피니쉬 라인위치(픽셀)
    gapM : 5, //미터당 이동 픽셀치 = (R.endM - R.startM)/100
    ing : true,

    init : function(){
        
        //터치온 이미지 이벤트 등록
         $("img.touch_btn").mousedown(function(){
            $(this).attr("src",function(index,src){return src.replace('_off','_on');});
        });
         $("img.touch_btn").mouseup(function(){
            $(this).attr("src",function(index,src){return src.replace('_on','_off');});
        });

        //값 설정
        $("#setting > li > p>span").click(function(){
            
            if(!R.ing) return false;
            $("div.p_area4").hide();

            if(this.parentNode.parentNode.firstChild.innerText == "파란 자동차") R.color = "blue";
            else R.color = "red";

            var sum = -1;
            if(this.className=="sp_top") sum = 1;

            var per;
            if(this.parentNode.className=="sp1") {
                per = sum*10;
                if( (R[R.color].meter<=10 && per < 0) || (R[R.color].meter>=100 && per > 0) ) return false;
                R[R.color].meter += per;
                $(this).parent().parent().find("input.box1").val(R[R.color].meter);
                R.setReady("meter");
            }else{
                per = sum*1;
                if( (R[R.color].sec<=1 && per < 0) || ( R[R.color].sec>=10 && per > 0) ) return false;
                R[R.color].sec += per;
                $(this).parent().parent().find("input.box2").val(R[R.color].sec);
                R.setReady("sec");
            }
        });

        //자동차 선택
        $("div.p_area2 > p > input").click(function(){
            if(!R.ing) return false;
            $("div.p_area4").hide();
            R.select = this.value;
        });

        //출발
        $("div.start").click(function(){

             

            if(!R.ing) return false;

            var ment = [ "파란 자동차의 거리를", "파란 자동차의 도착시간을", "빨간 자동차의 거리를", "빨간 자동차의 도착시간을"];

            //입력값 유효성 체크
            for ( var i=0; i < $("#setting>li>input").length ; i++) {
                 if(!($("#setting > li > input").eq(i).val() > 0) ){
                    alert( ment[i]+" 설정하세요.");
                    return false;
                }
            }

            if(R.select == null) { alert("자동차를 선택하세요"); return false; }
            //모션 실행.
            R.goRacing();
        });

        //새로시작
        $("div.refresh").click(function(){
            
            if(!R.ing) return false;
            R.reseting();
            
        });

        $("div.tatal_answer_ox").click(function(){ 
            $(this).hide();
            R.ing = true;
        });
    },

    goRacing : function(){
        R.ing = false;
        $("div.p_area3>div>img").css("margin-left","0");
        $("div.flag_blue>img").animate({"margin-left":(R.gapM*R.blue.meter)+"px"}, 1000*R.blue.sec);
        $("div.flag_red>img").animate({"margin-left":(R.gapM*R.red.meter)+"px"}, 1000*R.red.sec);

        if(R.blue.sec > R.red.sec) {
            setTimeout(function(){
                R.resulting();
            }, R.blue.sec*1000);
        }else{ 
            setTimeout(function(){
                R.resulting();
            }, R.red.sec*1000);
        }
    },

    resulting : function(){
        
        R.blue.speed = R.blue.meter / R.blue.sec;
        R.red.speed = R.red.meter / R.red.sec;
        if(R.blue.speed > R.red.speed) R.winner = "blue";
        else if(R.blue.speed < R.red.speed) R.winner = "red";
        else R.winner = "blue red";

        $("#P089_TB04_i05").val(R.blue.meter);
        $("#P089_TB04_i06").val(R.blue.sec);
        $("#P089_TB04_i07").val(R.blue.speed.toFixed(1));

        $("#P089_TB04_i08").val(R.red.meter);
        $("#P089_TB04_i09").val(R.red.sec);
        $("#P089_TB04_i10").val(R.red.speed.toFixed(1));
        
        if($("div.p_area4").css("display")=="none") {
            $("div.p_area4").fadeIn(500, function(){
                
                if(R.winner.indexOf(R.select) != -1) { //비겼을때 까지 정답처리..
                    //if(R.winner == R.select) { 
                    //alert("맞았어용~");
                        $("div.tatal_answer_ox > img.answer_x").hide();
                        $("div.tatal_answer_ox > img.answer_o").show();
                    /*}else{
                        alert("두 차가 똑같은 속도로 다렸군요~");
                        R.ing = true;
                        $("div.tatal_answer_ox > img.answer_o").hide();
                        $("div.tatal_answer_ox > img.answer_x").hide();
                    }*/
                }else{
                    //alert("틀렸어용~");
                    $("div.tatal_answer_ox > img.answer_o").hide();
                    $("div.tatal_answer_ox > img.answer_x").show();
                }

                $("div.tatal_answer_ox").fadeIn(500);
            });
        }else{
            R.ing = true;
        }
    
    },

    reseting : function(){

        R.blue.meter = 10;
        R.blue.sec = 1;
        R.red.meter = 10;
        R.red.sec = 1;
        R.color = null;
        R.select = null,

        $("#setting > li > input.box1").val(10);
        $("#setting > li > input.box2").val(1);
        $("div.p_area2 > p > input").attr("checked",null);
        $("div.p_area3>div>div").css("left","144px");
        $("div.p_area3>div>div>p:even").text("1s");
        $("div.p_area3>div>div>p:odd").text("10m");
        $("div.p_area3>div>img").css("margin-left","0");
        $("div.p_area4").hide();

    },

    setReady : function(mns){
        if(mns == "sec"){
            $("div.flag_"+R.color+">div>p").eq(0).text(R[R.color].sec+"s");
        }else{
            $("div.flag_"+R.color+">div>p").eq(1).text(R[R.color].meter+"m");
            $("div.flag_"+R.color+">div").css("left",((R.gapM*R[R.color].meter)+94)+"px");
        }
    }
}