Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Script used in this document to create a jigsaw puzzle:
// only run on the gesture end (mouse/touch up)
if(event['hypeGesturePhase'] == hypeDocument.kHypeGesturePhaseEnd) {
// use jquery-collision to determine the overlap of the collision box and piece
var returnDivs = $("#collisionBox").collision($("#piece"), {"as":"<div />"});
// if there's not a collision at all, just bail out
if(returnDivs.length != 1) {
// get the hit area and total area of the collision box
var hitArea = parseFloat(returnDivs[0].style["width"]) * parseFloat(returnDivs[0].style["height"]);
var collisionBox = document.getElementById("collisionBox");
var totalArea = parseFloat(["width"]) * parseFloat(["height"]);
// if over a 90% hit, then snap it together!
if((hitArea / totalArea) > .9) {
// start the snap timeline (use window.setTimeout to happen after the drag loses the "lock" on the element
window.setTimeout(function () { hypeDocument.startTimelineNamed("Snap"); }, 0);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.