Hype Matter Helper (main) doxdox documentation

Helps in dealing with the matter.js Engine included in Tumult Hype 4

# hintPhysicsEnabled(element)

Output an hint to the console to enable physics on an element being queried

Parameters

Name Types Description
element HTMLDivElement The element to

# hypeDocument.addClassToTarget(target, className)

Add a className to targets

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.
className String the className to add

# hypeDocument.applyForce(target, force, angle, options)

Add a force to an Matter object. It simplifies the process by using an angle. The source of the force is the element position (center), but can tweaked using the options to add angular momentum by either an absolute position or relative position There is an options object that can contain the following values { position: { x: 123, y: 456, absolute: true, }, usePercentOfMass: true }

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.
force Number Is the amount of force to apply. If the option usePercentOfMass is set to true it becomes a percentage value of the mass the force is applied to.
angle Number Is a angle in degrees 0-359 that is converted into a unit vector to be become multiplied by the forceMagnitude (0 is right, thereafter clockwise)
options Object This is an optional object containing options.

# hypeDocument.applyForceBasedOnMass()

This function only serves as an alias preapplying usePercentOfMass See hypeDocument.applyForce

# hypeDocument.disablePhysicsCollisions(target)

Disables physics collisions on all targets by setting a collision filter unused in Hype. The function stores the existing collision filter if needed.

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.

# hypeDocument.disablePointerEvents(target)

Disables all pointer events by assigning a class to all targets. Requires the following class to be present .disable-pointer-events, .disable-pointer-events * { pointer-events: none !important; }

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.

# hypeDocument.enablePhysicsCollisions(target)

Enables physics collisions on all targets by restoring the previous collision filter.

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.

# hypeDocument.enablePointerEvents(target)

Enables all pointer events by removing a class to all targets.

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.

# hypeDocument.queryIntersections(sourceElm, targetElms)

Query intersections between elements using Matter.js

Parameters

Name Types Description
sourceElm Node The source element used in each check
targetElms Nodelist The target elements to query against

Returns

Nodelist

Returns a list of targetElms that intersect with sourceElm

# hypeDocument.queryIntersectionsByPoint(targetElms, point)

Query intersections of a points and elements using Matter.js

Parameters

Name Types Description
targetElms Nodelist The target elements to query against
point Vector The point containing the properties x and y to test against

Returns

Nodelist

Returns a list of targetElms that intersect with sourceElm

# hypeDocument.queryIntersectionsByRay(targetElms, startPoint, endPoint, rayWidth)

Query intersections of a ray and elements using Matter.js

Parameters

Name Types Description
targetElms Nodelist The target elements to query against
startPoint Vector The startPoint contains the properties x and y of the ray start point
endPoint Vector The endPoint contains the properties x and y of the ray end point
rayWidth Number The width of the ray (optional)

Returns

Nodelist

Returns a list of targetElms that intersect with sourceElm

# hypeDocument.removeClassFromTarget(target, className)

Remove a className from targets

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.
className String the className to add

# hypeDocument.resolveTargetToNodeList(target, singleNode)

This function wraps resolveTargetToNodeList, but defaults to current scene element over document

Parameters

Name Types Description
target String, NodeList, Node allows either type. Strings are considered a selector.
singleNode Boolean Setting this to true switches from a nodelist to a single node

Returns

NodeList, Array

Makes sure we are dealing with a list

# HypeMatterHelper()

# if()

Install CSS to the Head HTML on runtime

# resolveTargetToNodeList(actions)

creates a node list if possible

Parameters

Name Types Description
actions String, Array This can be a string, coma seperated string, array or nested array of coma seperated strings

Returns

Array

Returns a flat array