Framer Classic » Utilities » More utilities

More utilities

The Framer Library has few more utilities, but you can also use JavaScript.

In Framer

The frame inset, debounce, and throttle utilities are explained in the Framer Classic docs, but what might be even more interesting are all the undocumented utilities you can find in the Framer source code on Github. You can use them, but since they’re not (yet) in the official documentation, they might change (a bit) in future versions of Framer.

In JavaScript

Don’t forget that CoffeeScript is JavaScript. That means you can use JavaScript utilities in your Framer projects.

In the ‘Top hat’ dragging events example, for instance, I used Math.atan() to calculate an arctangent. It’s one of the many methods in JavaScript’s Math object.

# some trigonometry for calculating the rotation
rotationRadians = Math.atan (this.x - topHat.x) / (this.y - topHat.y)

Some variable types, like String, Number, and Array, have built-in methods.

As an example, you can use substring() to extract part of a string:

string = "Apple, Banana, Kiwi"
# Print the substring from character 7 to 13
print string.substring 7,13

» "Banana"

Or use sort() and reverse() to reorder the contents of an array:

fruits = ["Banana", "Orange", "Apple", "Mango"]
# Sort them alphabetically
fruits.sort()
# Reverse the current order
fruits.reverse()
# Print the array
print fruits

» ["Orange", "Mango", "Banana", "Apple"]
Open in Framer

You can find the most useful of these methods, with examples, on these w3schools.com pages:


Leave a Reply