Get hypeDocument object from form trick

Tips & Tricks
1

Normally you can only access the hypeDocument inside a form. by using code similar to this.

HYPE.documents['index'].startTimelineNamed('timeline2', HYPE.documents['index'].kDirectionForward)

** index** being the name of the hype document.

When you use preview the name will always be ‘index’

But once exported you need to make sure that the name is what you actually name the export.

We have used many tricks to get around this. Especially when we want to preview and export without writing the name again. Normally this involves code in the Head file.

But it occurred to me that when we use HYPE.documents[‘index’] we must be accessing an associated array.
i.e {key: value}

So all we actually need to do is either get the key or value.

This code : HYPE.documents['index']

Becomes.

Object.values(HYPE.documents)[0]

This returns the hypeDocument object which is what we are after and we do not need to know the name.

So to further simplify things in the code I push that to a var named hypeDocument and we can then do this.

<form name="form1" onsubmit="var hypeDocument=Object.values(HYPE.documents)[0];hypeDocument.startTimelineNamed('timeline2', hypeDocument.kDirectionForward);return false">

<input type="text" id="email" placeholder="email" name="email" style="font-size: 30px; border-style: none; background-color: lightyellow; color: black; padding: 5px;" size="9" fontsize:30px="">
<input id="submit" name="submit" type="submit" value="Send" class="button">
</form>

formSubmit_newHypeDocumentAccess.hype.zip (16.4 KB)

I have not tested this massively, this also assumes one hypeDocument is on a page I.e we use [0] but I guess we could work with multi indexes.
if anyone see an issue with this please speak up

3 Likes