Change width of shapes after exporting

1

Hi all! I’m working on a project that is a slideshow of images and copy. The client wants the final product to have the ability to swap in different images and copy. I have figured that part out by changing the ‘hype_generated_script.js’ file.

My question. Is there a way to change the width of some of the rectangles (just like I’m changing the images and copy) that are in the animation? Some of the copy has a rectangle that it is comfortably inside of. I want to change the length of these boxes so that they match the length of the copy that it is placed in it. I’m assuming that can be changed in that same JS file but it’s hard to tell what to change.

Let me know if you need a file uploaded for reference.

Thanks!
Bret

2

Hello Welcome,

you can always do it in Javascript at runtime (see Hype API and search the forum for Hype CMS). If you want todo it through hard parsing the outputed file (regEx etc.) or rendering the JS/JSON file on the fly, you can also do it… there is no “official” symbol map and they could change at any time but the following symbols are what you’d be looking for in the JSON-Blob:

"top" : "b"
"left" : "a"
"width": "c"
"height": "d"
"rotateZ" : "f"
"scaleX" : "cQ"
"scaleY" :  "cR"
"z-index" :  "z"
"opacity" : "e"

Be aware that the width (c) and height (d) is represented without the border thickness.

Hope that helps

3

This is extremely helpful! Thanks for spelling out what the letter codes are referring to. This is saving me a lot of time. I appreciate you!

4

Please note that this technique is unsupported and the runtime values may change without notice at anytime.

A supported way would be to use the hypeDocument.setElementProperty() API at runtime to change the width. (This could be set from a global JS that has the particular values you want). I understand how in your case it may be a bit more of a hurdle to do it this way, though.

1 Like