Script used in this document to create a jigsaw puzzle: http://tumult.com/support/examples/21330-JigsawPuzzle/JigsawPuzzle2.hype.zip

collision.js

	// 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) {
			return;
		}
		
		// 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(collisionBox.style["width"]) * parseFloat(collisionBox.style["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);
		}
	}