why is "print event.y" NaN on mobile safari when running inside Events.DragMove, (event) ->it works fine on chrome/safari on the desktop
Something similar was asked earlier today. This was the response.
"NaN is not a number so you are trying to calculate with things that are not numbers. If I had to guess you are likely counting an event to have a number that is only available on desktop (maybe clientX iirc).
Debugging is easy. Look for "Safari on iOS"
so you're saying some of the the dragging examples don't work on mobile because event.x is not supported? that sounds wild.http://examples.framerjs.com/#draggable-basics.framer
Yeah I was very disappointed with that too - getting the same NaN error when using event.x and clientX. Hammer.js was also no use. :-(
so … how can you change the draggable layer's speedX and speedY then. If I calculate the dragged distance by comparing the layer's x or y WHILE also changing the speedX and speedY according to those values, my layers jump around because of a circular reference (I guess). the way the framer team does that on the example site is by calculating the dragged distance based on the event difference
The reason x and y don't exist in mobile safari is that there's no single source for these values. On desktop, you have only one mouse so x and y map to wherever it clicked. In a multi-touch environment, x/y information is saved on the particular touch and since there can be many of those at the same time, a single x/y property doesn't make sense. You can get a normalized version of the event that would work on both mobile and desktop with the following:
event = Events.touchEvent(event)print event.x # should now exist
Nice explanation Tisho, thanks! I assume I just add that to my coffee file? Or does it need to go into the framework or something? (Sorry, noob here)
You need to add it to the event handler:
myLayer.on Events.Click, (event) -> event = Events.touchEvent(event) ... Rest of your code ...
Ooh gotcha thank you!
Thanks a lot, @Tisho! I almost lost faith in this when my frustration rised. I think framer will result in a lot of these situations that should be better handled by a framework, but I'm very certain the team knows that
Johannes Eckert, did it work for you? i'm still getting NaN :-(
Just FYI, after the event = Event.touchEvent(event), you should now use event.clientX and event.clientY, and NOT event.x and event.y. Edward, maybe that's the problem you're having?
ooooh that's gonna be why!
Now I'm getting TypeError: 'undefined' is not an object (evaluating 'event.touches'
Can you paste in your code? Looks like you're not actually passing in anything to Events.touchEvent. You should be passing in the original event object.
Dragger.on Events.Click, (event) -> event = Events.touchEvent(event) Dragger.animateStop() if isDragging == false && isHolding == false Dragger.animate curve: curve1 properties: x: (Math.ceil((StripPosition-(event.clientX*2)+267)/89)*89)
What you have there should work. Can you download this: https://dl.dropboxusercontent.com/u/3320134/EventTest.framer.zip and then tell me if you're seeing two numbers show up when you click the rectangle in the middle? Try it out on desktop and on mobile and let me know what you're seeing.
So I got what I did wrong, I had event = Events.touchEvent(event) in a setInterval when there were no events being fired. #noobThanks for all your help!
This seems to work: https://gist.github.com/edwardsanchez/b14f2408cb4d5c5f3e9b