Experiment – Creating A Single-File Tumult Hype Project 🧪

[MaxZieb (Loves Hype)]

@Photics

Pick the technology – Hype is macOS. That doesn’t look like it will change soon either. So, JXA looks OK. I could leverage JavaScript, which is ideal for a project like this.

The exports script would need to be Python.

@Photics

base64 the images – That’s why I picked JXA. That’s trivial. It’s a simple JavaScript command… btoa() …Although, this can be done easily with Shell too.

Again, Python does this also pretty well.

@Photics

Modify the HTML – This part sucks. I’m not sure how to do that. It might be easier to generate a new index.html file, rather than creating a new one.

In the sample export script there are demos for nearly all callbacks. One demonstrates modifiying the HTML. See --modify_staging_path

tumult/hype-export-scripts/blob/master/SampleExportScript/SampleExportScript.hype-export.py

@Photics

merge the CSS – Easy?

Also possible in the packing process, also found in the example under --modify_staging_path

@Photics

merge the JavaScript

Hype already has the option to inline itself in the export script see --get_options. The actual runtime would need to be added in the --modify_staging_path run.

@Photics

That last part is the problem, and why I think Inliner has trouble with Hype projects. Hype doesn’t just list all of the resources in the index.html file. It’s in the JavaScript.

This code should fix your problem

Hype ImageBaseEncoder (Hype Resource / Image Extension)

[HypeImageBaseEncoder] This little extension helps you inline images and reference them without any efforts in your Hype projects. This reduces further request to any files on the server. Turn those beautiful images into ugly little code frogs. It works the following way: Instruction: Use any images as always in Hype On export (only local) the extension writes your images as Base64 code to your console Copy and paste the images you want in-lined from the console (Chrome has a copy button) a…

It uses the HypeResourceLoad event and reads the files from variables instead like regular from the ressource library. You could use this technic (without the encoding to the console portion) if you put it into the export script.