State Transition - Design and Handling
State Transition - Design and Handling
Agenda
State for a simple application Some enhancements Non-deterministic case:
real example problem solving
State Diagram
Confusing game
Click the ball as long as you want Can only finish by pressing the button if clicking at n times, where n is dividable by 2 or 3
Compositional Game
Interface: One Ball Three buttons: Red, Blue and Yellow Mode 1 [Ball appears slowly, few points] only blue button allowed (force playing by left hand) Mode 2 [Ball appears fast, large points] only red button allowed (force playing by right hand) Switch from Mode 1 to Mode 2 by pressing Yellow
Compositional Game
Interface: One Ball Three Two buttons: Red, Blue and Yellow Mode 1 [Ball appears slowly, few points] only blue button allowed (force playing by left hand) Mode 2 [Ball appears fast, large points] only red button allowed (force playing by right hand) Switch from Mode 1 to Mode 2 by pressing nothing
Interface: A ball and two buttons [Ctrn-Exit] [Waiting Mode]: Ball immobilized initially Action: Press Ctrn or click the ball to make it fly [Flying Mode]: Ball flying Action:
When the ball is clicked, if the click is right-positioned, the ball changes to Flickering Mode, otherwise it returns to Waiting Mode When Ctrn is pressed, the ball changes direction, still in Flying Mode When Exit is pressed, the ball stops
Timer
function handleClick(){ type++; if(type >6) type=0; noClick++; if(noClick>=2) { noClick=0; ball.ballState=Constant.DEATH_ BALL; ballTimer.start(); } if(noClick==1){ ball.ballState = Constant.SELECT_BALL; } }
Timer
Timer
function createBall(inState) { if(component.status == Component.Ready){ ball = component.createObject(clickArea, {"type": type, "width": 40, "height": 40}); if(ball == null){ console.debug("error creating block"); console.log(component.errorString()); return false; } ball.ballState = inState; ball.anchors.centerIn = clickArea; }else{ console.debug("error loading block component"); console.log(component.errorString()); return false; } return true; }
Timer
function handleClick(){ if there is no ball start the timer to create new ball else select the ball } }
Timer