This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Noam Elbaz
Posted Jul 01 - Read on Facebook

Can anybody help me with writing a correct constructor?

(I should be able to change their x/y independently )

24 Comments

Noam Elbaz

I'm trying to create many objects upon which I can interact with independently but still control / tweak the look easily. Dont know if class / constructor is the way to go.

James Morris

For convention, give your "brick" class a capital B. And then you can do "brick_1 = new Brick()" ... remember the brackets at the end when you create a new instance of the class :)

Noam Elbaz

James 'Shorty' Morris Thanks alot. Why does this end with error? What am I missing? If I would update an attribute, like: brick_1.x = 100, would that work?

James Morris

I like that you're exploring classes for this stuff. I've found that classes really help with keeping your code in discrete chunks. For the main layer that is associated with your class, you could give it a generic name like @layer (or something similar). That way, after you've created an instance of your class Brick, you should be able to do whatever you like by referencing that inner main layer. So after "brick = new Brick()" you could do brick.layer.x = 0 or brick.layer.y = 0 ... if you're class will contain other sub layers, you could call that main or generic layer something like "container", so brick.container.width = 200 or brick.container.on Events.Click etc.

James Morris

I hope that made sense?! :)

Noam Elbaz

James 'Shorty' Morris kinda made sense to me, but check it out. looks like something is working!

James Morris

Great!

JL Flores Mena

Hey Noam Elbaz, if you're using this class just to create a Layer, you could use 'class Brick extends Layer'. And don't forget to include 'super @options' in your constructor. That way you can use shorter lines of code, like 'brick_2.y = 660' .

James Morris

I presume that won't allow for other sub layers in the class if you extend layer?

Noam Elbaz

JL Flores Mena thanks. Yeah, that's basically what I want to do. Super helpful. Did not get the super part... do you have any links that would explain classes / constructors / etc? I learned programming through Framer so I find it a bit hard to bridge the gap between the majority of info written in JS to Coffee.

Noam Elbaz

James 'Shorty' Morris I'll try both. And see. Either way.

Noam Elbaz

JL Flores Mena can you explain to me where to put "super @options" in class Brick extends Layer
constructor: (name) ->
?

JL Flores Mena

James 'Shorty' Morris it depends on how you plan and structure your code. You can treat it like a bigger object that includes several layers & functions. See this example: https://www.youtube.com/watch?v=Zkrqy6QeUdw I created that module by using 'extends Layer', so I could either duplicate or change the position of that custom scroll and everything that's inside it.

Chris Camargo
JL Flores Mena

You beat me to it Chris! Thanks : )

Chris Camargo

Chris Camargo

JL Flores Mena, when are you going to post that sweet sticky labels class to Framerco.de? I'm sure the community would enjoy it, and Jordan Robert Dobson would be thankful. :)

Noam Elbaz

JL Flores Mena awesome ... and the "?" next to the equals sign just means "I can be changed" whereas no "?" means "I cant be changed", right? Thanks alot... Chris Camargo you too.

JL Flores Mena

I'll do it Chris, it's just that I need to clean and comment the code so it's a bit more presentable to the community. Also, I've been busy with another experiment I want to share here, I'll show you a sneak peek today!

Chris Camargo

Noam Elbaz: scroll down to "The Existential Operator" to learn about CoffeeScript's use of "?". http://coffeescript.org/#operators

Josh Ackerman

Out of curiosity why does @options.draggable.enabled = true return an error (using Chris's method)?

Jordan Robert Dobson

Nice one Chris Camargo! I'm having flashbacks. You def understand this stuff very well now! :D

Jordan Robert Dobson

So very encouraging!!!

Jordan Robert Dobson

myVar ?= 20

Basically means if myVar is empty set it to 20 if not leave it alone.

Read the entire post on Facebook