Move ID based off Draggable


(Lucky) #1

Hey hey,
Wanted to make a draggable controller stick which controls a character and i use JS to make it move to make it have a circular mask all good and fine. Now the issue is(well 2), mainly is there a way to set event[‘hypeGesturePhase’] so that it constantly spits out a result when your mouse is over it.

Currently if i move it it only logs things out if i’m actually dragging it. The reason why is I’m trying to do a trigger when i move the ball the hero mc moves. But right now it only moves when i constantly move it.

part 2 of the question is that its going crazy atm but i think i can solve that if i can at least get it to move constantly. Any help on this is appreciated.

And again since this is complicated as hell to explain here’s the source file

controller.zip (15.4 KB)


(Greg) #2

I think ‘hypeGesturePhase’ only works on a “On Drag” event.

Are you wanting to see the mouse coordinates on a mouse over? If so,

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_event_mouse_clientxy2

might work for you.


(Lucky) #3

I’m fine with the mouse co ordinates, which i’m using pageX instead of clientX for since it doesnt work on my tablet

moveLX=(event.pageX-stage.offsetLeft)-thumbW/2;
moveLY=(event.pageY-stage.offsetTop)-thumbW/2;

However if i move the item to a spot then dont move it it stops returning outputs so the hero ID stops moving;
e.g. for left

if(event['hypeGesturePhase']=="move"){
lm+=0.1
hero.style.left=parseInt(hero.style.left)+lm+"px"
}

which only works if i’m actively moving it as in the example file. Wanted to see if there was a way to constantly have a log/move action on drag, or if one of the prebuilt On commands has a neverending execute like drag so that i can have the item jut constantly move untill i release the controller. VS that stop and start action thats happening in the example file


(Mark Hunte) #4

I cannot play with this right now (Darn it) but in my

Poor mans Hit detection (physics )

I think I used a setInterval in the end to constantly fire the hit detection function to checking every tenth of a second…


(Mark Hunte) #5

So this is what I meant.

It a small edit to your code and I have set it at 1/2 second (slow ) so you can play with the control more easily .

Also not sure if this was what you were after. That the hero carried on moving when you set the direction.
The control as I think you are saying is flaky at the mo.

controller.hype.zip (16.1 KB)


(Lucky) #6

Hey Mark,

I rethought the whole concept, got some help on the movement of the draggable and ended up using translate3d and webkit-transition to make the circle move along with the touch event, wanted to show you!
http://www.luckyde.com/ipad/joystick/joystick.html
Also now i’ve got a hit test detector going on i built which i still haven’t quite figured out, but i can’t find a good library online that only has a hittest script so i did my own. At this point i got it hit testing, but i’ll need to figure out a way to snap back to a position which is empty after hit testing, but that’s the next step. Eventually this can be hopefully a basis for a game :smile:


(Mark Hunte) #7

Hey,
Lucky thats really good.
Do you mean this stuff.
http://www.w3schools.com/cssref/trycss3_transform-origin_inuse.htm

I need to get into this…