Hype Power Pack

Here is an early drop of a Hype Power Pack. It currently offers a preview of the following commands:

  • Conditional Behavior
  • Set Variable
  • Run Function on Selector
  • Run JavaScript Expression

And additional callbacks

  • HypeDocumentLoad in functions()

It uses the export script interface to extend Hype with new actions. As most people don't use export scripts this might come in handy.

The extensions needed for this are injected into the generated script. Runtime is untouched. Based on the previously released playground and inspired by @h_classen Logic dataset implementation and some other tricks I have been using in my personal Hype Export Magic (never released).



Parental_gate.hype.zip (31.2 KB)

example: the parental gate using the PowerPack

well done @MaxZieb :slight_smile:


Thank you! If I remembered correctly you had a test condition thing, but I figured you can just put the condition into a custom behaviour listener (on…) if you need it as a shared condition and trigger the associated custom behaviour like for example after setting some variable. I saw you put the test on the last key in your sequence. For your example that is totally fine. But for a condition that needs to be tested on each key on could just put the condition into an "on test" and trigger the custom behaviour "test" on each relevant interaction. Furthermore, the expressions used are JS and can be as complex as they need to be… like a==b && c==d.

Any suggestions for further commands in the pack?

1 Like

not in the matter of wording ... but:

for my understanding something like your project (and it was the intention of mine...) can be useful for educational content in first place. That's why i did a setup for a quiz running over multiple Hypescenes including a evaluation that has to work documentwide: HypeConditionLinker: Perform actions based on AND/OR conditions without JavaScript code

your powerPack uses the customData and hypebehaviors, so it's got everything needed to accomplish the same and even with an absolute free setup for conditions. perhaps a setup/example for such a quiz could reach the folks doing educational content ...


AND! as the powerPack can assign its commands to custombehaviors too it could be a great buddy for the dragAndDropEnabler!


so this might be an exciting project -> in case in proofs to be easy enough

1 Like

So, currently the Action names cannot be localized and the name is also the id they are handled with in Hype. This makes it important to keep them simple and consistent until this is fixed so project using this export script idea don't break.

I was thinking to refactor them as follows:

Conditional Behavior

Set Variable

Run Function Query
Not sure, suggestions?

Run JavaScript Expression
Fix camel casing on JavaScript
I think that is actually okay?!

Imho "query selector" is a very specific and known call, whereas query could be a lot of different things. So if the name is just Query, then the argument label should be Query Selector, querySelector or at least selector but I think both words are definitely needed somewhere in some form to know what it is operating on.

It kills me that the S is capitalized every time I have to use it in Hype. But last I checked the capital S is the correct spelling.

True, maybe Run Function on Query Selector wasn't that bad? or Run Function with Query Selector? Maybe scrape it but does it still sound right? Run Function Query Selector? I'll probably stick with the initial one then.

I ran into a problem... the nice clean names work by creating a with (customData){} and with (hypeDocument){} scope. That works in all browsers but is considered deprecated. So, I am thinking about removing it. The downside would be that expressions would need to be much longer like hypeDocument.customData.counter + 1 instead of counter + 1. That would be sad, though as it is currently so clean and easy. Not prefacing it would declare counter in the window scope if I remove the with statement. What now? Keep the with statement or honor the deprecated status?

Fixed… release tonight. My workaround for customData (like used in Set Variable) is to export all existing variables into the execution scope as local variables. That makes them available and if an explicit scope is wanted it needs to be prefaced. In any expression hypeDocument is available, though! That should help to keep things easy and consistent with the feel inside of regular Hype functions. This is modern and doesn't require with and checks out when processed by closure.

1 Like

Hi @MaxZieb. Do I update the scripts file? I implemented the original version before your last post.

I still didn't post an update.

Thanks. Don't mind my enthusiasm.

1 Like

No, great. Love the enthusiasm. I am on it… but lots of things going on. The update will most certainly break things so don't build anything beyond testing as this still is beta.

↑ look at project
v1.0.1 Fixed scope, HypeDocumentLoad in functions()
v1.0.2 limited to id, refactored python, IIFE

I refactored the code a bit. Signatures are better now. Python handling files also. Just replace the Python file in your export script folder and fire up the Hype testing example.


↑ look at project
v1.0.3 refactored JS, streamline API, replaced Eval with new Function

Code and tests have their home on GitHub

↑ look at project
v1.0.4 multi behavior, refactored JS , unpack functions, closure compiler

This update is much more than meets the eye. On the surface the only thing that changed is that you can now trigger multiple behaviors with the Conditional Behavior Action. They are separated by comma. Most work in this update went into extracting the Hype functions from the generated JavaScript and adding them directly to the generated JavaScript output. This should give you much better error messages while debugging and clickable line numbers in the inspector. Furthermore, there is now a direct integration with the Closure Compiler API by Google. This feature can be enabled for exports but not on previews in the Document inspector and is called "Closure compiler on export". Set it to either true, on or enabled. On the next export your Hype functions and all code related to Hype Power Pack is compiled. This is more than a regular minification as the Google compiler builds an AST (Abstract Syntax Tree) and "understands" your code. Unused branches are removed, variables shortened if possible and much more. Using this is totally optional, though. It requires an online connection while exporting.

1 Like

There was a slight error. So, if anybody downloaded since the last post above. I just realized that I left a broken snippet in the code before committing. Please, redownload v1.0.4 :+1::nerd_face:
PS: In the next update function unpacking will have a toggle

2 posts were split to a new topic: New Bundle System based on Export Script Interface (dev thread)

I decided to leave the Hype Power Pack as is on GitHub as its still reasonably simple and a good starting point for people developing similar ideas. That said, in the split thread above I started a more involved version of this project. So, check it out.

Small guide on installing self written Export Scripts

Download the script or write your own …

  1. Download the ZIP version, unpack
  2. The file we need ends in .hype-export.py

Open the Hype preferences and reveal the Export Script folder

  1. Click the Exporting Icon and then the button "Show Export Scripts Folder in Finder"
  2. Move the file that ends in .hype-export.py from step (2) into the folder that just opened. You will need to authenticate for this action as the folder is outside your user folder structure.

  • Now open the Terminal program and write chmod 755
  • Make sure you end with a whitespace
  • Next drag the file that ends in .hype-export.py from step (4) into the terminal. That renders the full path so you don't have to type it… and should be something like
    chmod 755 /Users/USERNAME/Library/Application\ Scripts/com.tumult.Hype4/HypePowerPack.hype-export.py
  • Press enter to set the file to executable

:partying_face: Your done.

Hype should have new functionality (in this case some Logic and Expressions).
To use them enable them on your preview menu in Hype on a project basis.
In case of this thread, feel free to open the new script. You can always locate it with step 3 and tweak it to your needs and play with it.

Disclaimer applies and ... kids: Only install scripts from trusted sources (Like Tumult or me… :wink: ) or if you understand what is written in them.


If you are using this script or want to tweak it ... this great cheatsheet for Python :snake: should come in handy for you:


Keep in mind that the preinstalled Python on macOS is a bit behind at version 2.7