Is there any way through JS to get the name given to an element in the Timeline for e.g. to get the name "Posts" from this Timeline?
when console logging the event you'll see that it propagates the name of the timeline.
so set up some js-object on scene- or documentload that holds the element-id of this posts-element.
var myObject = {
'yourSpecialTimlineName' : 'postsElementId'
}
so easily get it. it's just a sample to be improved in any way 
Display Names are not exported. You'll need to use a Unique Element ID, Class Name, and/or maintain your own mapping as a JavaScript object.
As a pedantic note - elements do not belong to timelines. Elements are a part of scenes, and timelines are also parts of scenes. Timelines only contain streams of animations.
Thanks for your answers!
Unfortunately, I am still a bit unclear on whether what I am attempting is possible or not. Apologies.
Our use case is that the easiest way to make edits to our file is to change the Display name. E.g. Change element Display name from "Posts" in the reference above to "Red" and then have the text Posts or Red to be used in other situations.
In response to Han's reply, if we were to use your suggested code, would that be able to capture a change in the display name from "Posts" to "Red"?
In response to Jonathan's reply, if we gave the "Posts" element a Unique Element ID e.g. "elementname" would that be able to capture a change in the Display name from "Posts" to "Red"?
I believe you both are saying that what we are attempting is not possible, but I just want to be sure before giving up.
Thanks!
No it would not. Normal Element display names cannot be accessed in code or otherwise.
The only type of element that does have this feature is symbols.
And coding to do this is simple.
hypeDocument.getSymbolInstanceById(element.id).symbolName()
But these are not normal elements and using them for just this may become a slippery road down a spiral hill , in managing your elements and referencing them in other code..
Also as Jonathan explains, The timelines do not know about an elements display name.
At the moment for me at least, it is a little unclear on where and why you are doing this edit and referencing to the display name.
So we can fully understand what your goal is and maybe help find a way for you to reach it if possible.
Can you break this down by running through a step by step of what you do here. ( like a manual or user guide )
2 Likes
just to get you right:
your aim is to script the app (Hype) itsself and not the output (html)¿
Sorry ... was on a break for a few days.
Here is a step by step of what I am trying to do:
I have a file which I want to reuse several times.
One set of variables I need to use in multiple places is a list of menu items e.g. Nav 1, Nav 2, Nav 3 etc. This can be a long list, so I am trying to automate edits to it.
To shorten the production cycle, the fastest way to change the name of Nav 1, Nav 2 etc. is to do it here:
by clicking on them and retyping them like this:
I am trying to find a way to get the contents of each element so I can use JS to take that text and put it in different places, so that the changes are automatic. E.g. I want a button that had "Nav 3' text in it
to become "Nav new name" without having to make the changes individually.
I hope this clarifies.
Thank you so much for trying to solve this obscure Hype only problem!
Ok.
As said there is no access to the display name of a normal element.
But lets make things a bit quicker for you.
1,
Select you buttons
2,
In the Identity Inspector.
Change the name.
This will ask you if you want to make them the same or unique.
Choose unique and Sort order Descending or Ascending , depending on which direction you buttons fall.
The display names will get a number added
3,
With all the elements still selected.
Do the same for the id
The ids will get a hyphen and a number added to make them unique.
Give the elements all the same class name ( you only ever have to do the class name once in you template )
Now on a scene load.
Run this code, which will set the text from the ids.
It also removes the added hyphen and replaces it with a space.
//-- get all nav button
var navButtons = document.querySelectorAll('.navbutton')
//-- itterate and change them
navButtons.forEach(changeName)
function changeName(button) {
//use their IDs as the text and replace the hyphone with a space
button.innerHTML = button.id.replace('-',' ')
}
3 Likes
You could also just give this a try 
1 Like