OK, Framer-ers, I'm trying to write a module, but I'm not finding anything that really helps me understand what I need to do. The guide attached here only goes so far - where I'm trying to make a module that generates a media player, but that has multiple layers in it, the properties of which might need to be manipulated by the end user after the module / media component is generated. I can't work out how to expose ALL the layers created in the module so they can be accessed in Framer, while also generating and nesting them inside the module. For example #in module file class exports.MediaController extends layer constructor: opts.name ?= 'mediaController' #other opts scrubberBar = new Layer parent: @ width: @width #other properties #in framer MediaContainer = require 'videoPlayer' mc = new MediaContainer.MediaContainer scrubberBar.backgroundColor = "FFF" # framer says 'variable scrubberBar not found' but see the picture - it's visible in Framer! Help, please. Modules confuse the hell out of me. https://medium.com/bpxl-craft/developing-a-framer-module-dbf6a7d6ffc9#.1lrp8mkzx

Gregory J. Orton

Posted Nov 12 - Read on Facebook

OK, Framer-ers, I'm trying to write a module, but I'm not finding anything that really helps me understand what I need to do.

The guide attached here only goes so far - where I'm trying to make a module that generates a media player, but that has multiple layers in it, the properties of which might need to be manipulated by the end user after the module / media component is generated.

I can't work out how to expose ALL the layers created in the module so they can be accessed in Framer, while also generating and nesting them inside the module.

For example

#in module file

class exports.MediaController extends layer
constructor:
opts.name ?= 'mediaController'
#other opts

scrubberBar = new Layer
parent: @
width: @width
#other properties

#in framer

MediaContainer = require 'videoPlayer'
mc = new MediaContainer.MediaContainer

scrubberBar.backgroundColor = "FFF"
# framer says 'variable scrubberBar not found'

but see the picture - it's visible in Framer!

Help, please. Modules confuse the hell out of me.

https://medium.com/bpxl-craft/developing-a-framer-module-dbf6a7d6ffc9#.1lrp8mkzx

3 Comments

Giles Perry

As I understand it, anything from the module you want to reference in your Framer project needs exports in front of it. So:

exports.scrubberBar = new Layer

I've written an article about what I learned writing my own module.

https://blog.prototypr.io/ring-a-ding-ding-how-i-created-a-custom-layer-class-in-framer-and-learnt-to-draw-svgs-with-code-3337d4ef6f62#.re08lq427

Sam Thorne

The idea with modules is that they are self contained. So in this case, rather than trying to access the scrubber, think about what properties of the scrubber you need to access from outside of the media controller.
Maybe you just want to set the percentage of completion on the scrubber rather than the actual width or x position, for example.
In that case you should make an accessor that can set the progress position.

E.g.
@define "progress"
get: ->
(scrubberBar.width / @width) * 100
set: (percentage) ->
scrubberBar.width = @width*(percentage/100)

Or something like that (I wrote this in my phone and have t tested it).

Jordan Robert Dobson

Yes most times modules shouldn't be concerned with the prototype they are included in... they should work for any prototype they are included with without concern of anything else but themselves.

Read the entire post on Facebook