On touch end on drag problem

Using JavaScript with Hype
1

Howdy hype fans

I am having an issue with trying to create a pick up and put down effect on a draggable element using a drop shadow. It works fine unless it is dragged when the touch end function does not fire. I have done some research - i think i need to create an onDragEnd event but i cannot work out how to do this within hype. Nothing I have tried has worked so far. Any guidance will be gratefully received. Ideally I would like this to work within one function on any clicked element in the scene.

pickupcards.hype.zip (7.9 KB)

2

You can add a Run JavaScript… action to the On Drag handler after the Control Element Position which examines the event['hypeGesturePhase'] field to determine if it is the beginning or end of the drag:

	if(event['hypeGesturePhase'] == hypeDocument.kHypeGesturePhaseStart) {
		element.style.boxShadow = "10px 10px 10px grey";
	} else if(event['hypeGesturePhase'] == hypeDocument.kHypeGesturePhaseEnd || event['hypeGesturePhase'] == hypeDocument.kHypeGesturePhaseCancel) {
		element.style.boxShadow = "0px 0px 0px grey";
	}

(we have a bug on record about this behavior)

1 Like
3

amazing Jonathan. Thank you!