Search code examples
javascriptjquerycoffeescriptframerjs

How can I listen for an event based on a common class/ object name instead of a unique layer in Framer JS?


I would like to return the unique name of the object that the user has clicked on but I can't find the solution. Below is what I'm trying to achieve but in CoffeeScript.

$(".class").click(function(){
    alert("You clicked on this specific element");
});

The best example I could find is shown below, but each layer is unique so they can't be assigned to different layers.

layerA.on Events.Click, (event, layer) ->
    print "This layer was clicked", layer.name

I can listen to the event on each layer individually, but that would breach the DRY principle.


Solution

  • I've managed to figure it out myself. Here's the solution below.

    Create an array and store all of the layer names inside

    layerArray = [layer, layer2, layer3, layer4]
    

    Create a function that will be called when the click event is triggered, passing in the layer object and the layer index

    callFunc = (layer, index) ->
        print index
    

    Loop over each layer in the array and pass the clicked layer to the function

    for layer, index in layerArray
        layer.on(Events.Click, callFunc)