Glitch is a fantastic tool to test out code, but it’s not great for referencing code from their assets folder with a dependable relative URL – this is necessary for loading Hype documents. When uploading any external files (the generated JS and Hype runtime files) into the ‘assets’ folder, files get a URL like:
https://cdn.hyperdev.com/us-east-1%3A1a0f89c8-26bf-4073-baed-2b409695e959%2Ffoobar.png?1465688971290
To get better relative URLs, I remixed this express server project referenced here to get a relative URL for anything in the assets folder.
Embedding a Hype project is now as easy as dropping your exports into the assets folder, and modifying the three line embed snippet inside of an HTML file. Instead of this:
<div id="test_hype_container" style="margin:auto;position:relative;width:600px;height:400px;overflow:hidden;">
<script type="text/javascript" charset="utf-8" src="test.hyperesources/test_hype_generated_script.js?45805"></script>
</div>
You would use this:
<div id="test_hype_container" style="margin:auto;position:relative;width:600px;height:400px;overflow:hidden;">
<script type="text/javascript" charset="utf-8" src="/assets/test_hype_generated_script.js?45805"></script>
</div>
The only change I made to the exported HTML file is that I deleted test.hyperesources and replaced it with assets. You can see this example in action here: