// JavaScript Document

var lamp={

elem:$('.b_background'),

bright:function(){

this.elem.addClass('lamp-bright')

},

? ?dark:function(){

this.elem.removeClass('lamp-bright')

},

}

var container=$("#content");

var visualWidth=container.width();

var visualHeight=container.height();

var getValue=function(className){

var $elem=$(''+className+'');

return{

height:$elem.height(),

top:$elem.position().top

}

}

var pathY=function(){

var data=getValue(".a_background_middle");

return data.top+data.height/2;

}();

? ? ////////

? ? //小女孩 //

? ? ////////

? ? var girl = {

? ? ? ? elem: $('.girl'),

? ? ? ? getHeight: function() {

? ? ? ? ? ? return this.elem.height()

? ? ? ? },

? ? ? ? setOffset: function() {

? ? ? ? ? ? this.elem.css({

? ? ? ? ? ? ? ? left: visualWidth / 2,

? ? ? ? ? ? ? ? top: bridgeY - this.getHeight()

? ? ? ? ? ? });

? ? ? ? }

? ? };

? ? // 修正小女孩位置

? ? girl.setOffset();

swipe.scrollTo(visualWidth * 2, 0);

function doorAction(left,right,time){

var $door=$('.door');

var doorLeft=$('.door-left');

var doorRight=$('.door-right');

var defer=$.Deferred();

var count=2;

var complete=function(){

if(count==1){

defer.resolve();

return;

}

count--;

};

doorLeft.transition({

'left':left

},time,complete);

doorRight.transition({

'left':right

},time,complete);

return defer;

}

function openDoor(){

return doorAction('-50%','100%',2000);

}

function shutDoor(){

return doorAction('0%','50%',2000);

}

var instanceX;

function boyWalk(){

var container=$("#content");

var visualWidth=container.width();

var visualHeight=container.height();

var getValue=function(className){

var $elem=$(''+className+'');

return{

height:$elem.height(),

top:$elem.position().top

}

}

var pathY=function(){

var data=getValue(".a_background_middle");

return data.top+data.height/2;

}();

//console.log(pathY);

var $boy=$("#boy");

var boyWidth=$boy.width();

var boyHeight=$boy.height();

$boy.css({

top:pathY-boyHeight+25

})

function pauseWalk(){

$boy.addClass('pauseWalk');

}

function restoreWalk(){

$boy.removeClass('pauseWalk');

}

function slowWalk(){

$boy.addClass('slowWalk');

}

function startRun(options,runTime){

var dfdPlay=$.Deferred();

restoreWalk();

$boy.transition(

options,

runTime,

'linear',

function(){

dfdPlay.resolve();

});

return dfdPlay;

}

function walkRun(time,disX,disY){

time=time||3000;

slowWalk();

var d1=startRun({

'left':disX+'px',

'top':disY?disY:undefined},time);

return d1;

}

function walkToShop(){

var defer=$.Deferred();

var doorObj=$('.door');

var doorOffsetLeft=doorObj.offset().left;

var doorOffsetTop=doorObj.offset().top;

var posBoy=$boy.position();

var boyPoxLeft=posBoy.left;

var boyPoxTop=posBoy.top;

//中間位置

var boyMiddle=$boy.width()/2;

var doorMiddle=doorObj.width()/2;

var doorTopMiddle=doorObj.height()/2;

instanceX=(doorOffsetLeft+doorMiddle)-(boyPoxLeft+boyMiddle);

instanceY=boyPosTop+boyHeight- doorOffsetTop+(doorTopMiddle)

var walkPlay=startRun({

transform:'translateX('+instanceX+'px),translateY(-'+instanceY+'px),scale(0.5,0.5)',

opacity:0.1},2000);

walkPlay.done(function(){

$boy.css({

opacity:0

})

defer.resolve();

})

return defer;

}

function walkOutShop(runTime){

var defer=$.Deferred();

restoreWalk();

var walkPlay=startRun({

transform:'translateX('+instanceX+'px), translateY(0),scale(1,1)',

opacity:1},runTime);

walkPlay.done(function(){

defer.resolve();

})

return defer;

}

//取花

function talkFlower(){

var defer=$.Deferred();

setTimeout(function(){

$boy.addClass('slowFlowerWalk')

defer.resolve()},1000)

return defer;

}

function calculateDist(direction,proportion){

return (direction=='x'?visualWidth:visualHeight)*proportion;

}

return{

walkTo:function(time,proportionX,proportionY){

var distX=calculateDist('x',proportionX);

var distY=calculateDist('y',proportionY);

return walkRun(time,distX,distY);

},

toShop:function(){

return walkToShop.apply(null,arguments);

},

outShop:function(){

return walkOutShop.apply(null,arguments);

},

stopWalk:function(){

pauseWalk();

},

setColorer:function(value){

$boy.css('background-color',value)

},

getWidth:function(){

return $boy.width();

},

resetOriginal: function() {

? ? ? ? ? ? ? ? this.stopWalk();

? ? ? ? ? ? ? ? // 恢復圖片

? ? ? ? ? ? ? ? $boy.removeClass('slowWalk slowFlolerWalk').addClass('boyOriginal');

? ? ? ? ? ? },

talkFlower:function(){

return talkFlower();

}

}

}