Moving resource folder path from root [Hype 3]

(Alexandre Geissmann) #1

Hi everyone,
Sorry for the double post but I realized this was the new forum so I repost my request here.

We’re trying to implement hype powered pages into a Rails environment.
And here is our problem, we wanted to change path of the ressource folder, it seems ok EXCEPT for embedded fonts. It doesn’t seem to get the right path and it throws Get error :

This thread from 3 years ago, is about the same request.

How can we deal with this ?
Thank you


Can you share your Tumult Hype document as a zip file?

It looks like when the fonts were added, they were not added to the resource library (and / or) were not referenced based on this format:

    @font-face {
        font-family: 'FuturaTOTBold';
        src: url('${resourcesFolderName}/futuratot-bol-webfont.eot?#iefix') format('embedded-opentype'),
             url('${resourcesFolderName}/futuratot-bol-webfont.woff') format('woff'),
             url('${resourcesFolderName}/futuratot-bol-webfont.ttf') format('truetype'),
             url('${resourcesFolderName}/futuratot-bol-webfont.svg#FuturaTOTBold') format('svg');

Once your font files are in your resource library, the ${resourcesFolderName} variable is replaced with the folder name of your documentname.hyperesources folder.

To load these fonts from a predefined URL, just fill in the full URL instead of the variable + font name.

(Alexandre Geissmann) #3

Sure here it is

And yes we load the fonts like we should (I guess so).
In our particular case we changed in the sommaire.html :

<script type="text/javascript" charset="utf-8" src="sommaire.hyperesources/sommaire_hype_generated_script.js?29989"></script>


<script type="text/javascript" charset="utf-8" src="static/sommaire.hyperesources/sommaire_hype_generated_script.js?29989"></script>

Although we changed the path for loading fonts also, but fonts are handled in javascript too. We achieve to make it work by hard coding this block of code in the “sommaire_hype_generated_script.js” (unminified)

var headAdditions = ["<style>\n\t@font-face {\n\t\tfont-family: 'Vitesse-Book';\n\t\tsrc: url('sommaire.hyperesources/Vitesse-Book.eot'); \n \t\tsrc: url('sommaire.hyperesources/Vitesse-Book.eot?#iefix'),\n\t\turl('sommaire.hyperesources/Vitesse-Book.woff') format('woff'), \n\t\turl('sommaire.hyperesources/Vitesse-Book.ttf') format('truetype'), \n\t\turl('sommaire.hyperesources/Vitesse-Book.svg#Vitesse-Book') format('svg');\n\t\tfont-weight: normal;\n\t\tfont-style: normal;\n\t}\n</style>","<style>\n\t@font-face {\n\t\tfont-family: 'Vitesse-Bold';\n\t\tsrc: url('sommaire.hyperesources/Vitesse-Bold.eot'); \n \t\tsrc: url('sommaire.hyperesources/Vitesse-Bold.eot?#iefix'),\n\t\turl('sommaire.hyperesources/Vitesse-Bold.woff') format('woff'), \n\t\turl('sommaire.hyperesources/Vitesse-Bold.ttf') format('truetype'), \n\t\turl('sommaire.hyperesources/Vitesse-Bold.svg#Vitesse-Bold') format('svg');\n\t\tfont-weight: normal;\n\t\tfont-style: normal;\n\t}\n</style>"];

But of course, we would like not to hard code every time the real path.

(Jonathan Deutsch) #4

Thanks, it looks like we should be doing an on-the-fly setting for ${resourcesFolderName} when in font code. Until then, I’d recommend at least putting the static prefix in your font code.

(Alexandre Geissmann) #5

Ok, thanks. I will try another way


3 posts were merged into an existing topic: How to properly set up a rails app to load hype files in a view

How to properly set up a rails app to load hype files in a view

2 posts were split to a new topic: Ruby gem for integrating Hype animations into the Rails Asset Pipeline

Ruby gem for integrating Hype animations into the Rails Asset Pipeline