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

What is Framer? Join the Community
Return to index
Propeller Katapulsky
Posted May 01 - Read on Facebook

i am fanscinated by framer! being a motiongraphicsdesigner, by now most of my javascript knolledge was limited to photoshop/aftereffects scripting. as i discovered framer recently by using the framerPS script to get my work out into a website i get really interested in the "web-side" of javascript

so, i have my big new javascript book on my table, surf through selfthtml, framerjs,... and... am a little confused :) for example, i can read out all names of layers in photoshop but i have no clue how to do the same in js. with my views, what do i have to know about css/html to understand framer?

is there a in depht manual of framer beside the good information on framerjs.com that i am missing? also i am wondering if there is a forum where i can ask questions and maybe help others with my photoshop scriptin experience?

framer is really cool!

19 Comments

Cemre Güngör

you can ask questions here :)

Propeller Katapulsky

i am struggeling getting all PSD["some name"] elements of my document into an array. i generate my website-prototype with framerps.jsx. this creates PSD["some name"] elements for each layergroup of photoshop. would you be so nice and tell me how to read these elements into an array with javascript? my plan is to generate a clickable list of all elements in my document.

Cemre Güngör

How so into an array? PSD is an array :)

Propeller Katapulsky

i thought so :) maybe my brain is just confused at the moment. but why do i get "undefined" when i do var info = PSD[1] ? PSD[1].name does not work either.

Koen Bok

You guys are confusing arrays vs objects. An array is an ordered list of things that you access with an index (number). An object is a collection of values that you access by key (string/word). PDS is an object so you access it like:

PSD.myLayer or if there is a space PSD["my Layer"]

http://eloquentjavascript.net/chapter4.html

Koen Bok

Another way to think about it:

Array = Numbered list
Object = Dictionary by word

Propeller Katapulsky

so is PSD["Background"] one object and PSD["Group1"] another? or are "Background" and "Group1" both PSD objects?

Propeller Katapulsky

ok, i got it :) ! this is my solution of getting all PSD objects: for (var layerGroupName in PSD) {
alert (PSD[layerGroupName].name);
}

Koen Bok

Yup, you got it!

Propeller Katapulsky

took me a while beeing a noob.

Propeller Katapulsky

now, i have another question for you wonderful people out there. wrote a little script which should create new views from existing ones names. and there is definetly something wrong there :( i get the new views names displayed but i can not adress them with their name. i would be soo happy if someone could clear my mind up. var ypsilon = 30;

for (var layerGroupName in PSD) {
var newView = PSD[layerGroupName].name + "_new";
var newViewName = PSD[layerGroupName].name + "_new";
newView = new ImageView({x:20, y:ypsilon, width:400, height:30});
newView.name = newViewName;
newView.style = {
"font-size": "18px",
"text-align": "left",
"color": "white"
}
newView.html = newViewName;
ypsilon = ypsilon + 30;
}

Propeller Katapulsky

if i press "esc" in my browser i see the views with their correct names, but i can only adress the last one with newView.x = 200 for example

Cemre Güngör

This is because you are overwriting newview every time the loop is running

Cemre Güngör

Instead of a for, try doing PSD.forEach(function(layerGroup) { .... })

Propeller Katapulsky

dear cemre, thank you for your kind answer. it makes sense that i am overwriting newview. i must admit that i do not know the forEach function but i googled it and tried to work it out. i get "anonymous function" no matter how hard i try ;) is there another way (without forEach) that i could try?

Cemre Güngör

If you make a codepen we can help you better ;)

Propeller Katapulsky

oh, thats great. never had anything to do with codepen, so i opened an account. so if you want to help, here is the link to the code: http://codepen.io/PropellerK/pen/uepcK

Propeller Katapulsky

problem solved.

Read the entire post on Facebook