Hype3 Html5 animations


(Ken Heins) #1

I use Hype3 for the creation of HTML5 animations. They create javascript in html that triggers a separate resources folder. I do think it would be possible to just create a page containing that content and just bring it in with a URL, but have had good luck with the embedded javascript.

Its compatible with Freeway 7, but I detest that app for many reasons.
Can someone point me in the right direction, its a deal breaker if I can’t in RapidWeaver


(Peter Danckwerts) #2

I have embedded Hypeanimations in RW in the past but I can’t get the hang of its approach to responsiveness.


(Ken Heins) #3

Peter, what stack or whatever did you use in order to embed the source code, or did you use the source code?
Using the source code and the resource folder from Hype works well in Freeway, you just create a html item in a page and copy the source code into it.

My question may sound very simple but Rapid Weaver is different because of the terminology. Stacks seem just like layers in a file. Am I understanding them correctly?

Have not yet dealt with responsive. Hype has probably the best support of any app I have ever used. I will talk to them about that aspect.

I really like a lot of the features that Rapid Weaver offers, but at the same time, it does have a large learning curve because of it.

Thanks for the reply.


(Jon C. Munson II) #4

Stacks are divs (and other parts) that could have css & functionality combined, so they’re a little more than just “layers” or just “divs.”


(Ken Heins) #5

'“Stacks are divs (and other parts) that could have css & functionality combined,”

Could you point me to some documentation that shows how things like javascript are incorporated.

I see your point and I can see what you say, its just that there is a whole new set of terminologies compared to other apps. I see the potential of it.


(Jon C. Munson II) #6

Javascript goes either in the HEAD and/or Javascript/Script area of the page (see the Page Info tabs), or, in an HTML block on the page where you’d like (can go pretty much in any text block or stack, provided you format it/mark it as HTML), or the Code section of the Project Settings. If you are courageous, and don’t mind doing your own housekeeping, you can even modify the theme to incorporate javascript libraries. Just be sure to make a duplicate of the theme and work on that so you don’t break the base theme.

Right-click a theme to duplicate it, then right-click your duplicate and choose Show in Finder (or the actual menu option as I can’t recall it at the moment). From there, observe the file hierarchy and look at the .plists. WARNING: Modifying a theme in this way removes it from the thememakers responsibility, so don’t expect help if you break it, and, also, if you modify it that way, don’t expect updates to get applied - you’ll have to do that yourself, which might be easy, or might be involved depending upon your mods.

Google searching will bring up plenty of resources on this topic.


(Ken Heins) #7

ok, thanks. Basically the same as in Freeway, I’m just not that familiar with Rapid Weaver yet.

Modifying the theme sounds like a good idea since nearly all my work involves HTML5 animations. It’s my specialty, as opposed to creating sites. I just do a bit of that for friends.

Just in the middle of a crazy week where the few sites that I work with came up for new versions at the same time I was in the midst of decided which web development app to use. So I am looking at two different replacements for Freeway while I am doing the new site versions. Bad timing.


(Jon C. Munson II) #8

I’ve not used Freeway, just Espresso, Dreamweaver, and RapidWeaver. :smile:


#9

I created a Hype Tutorial for Rapidweaver insertion. It was written for RW 4 and 5 but all is still working in RW 6. You can very easily test and preview a working Hype project in Rapidweaver. All you do is load the included RW project file and re-link the 3 resources. Hit preview and all will be working.


(Fernando Biancardi P.) #10

Hi John!
Thank´s for the PDF tutorial; I´ve been following it for quite some time but I can go as far as previewing my project with in RW (Ver.6 in my case) but when I published it my page appears to be empty, no animation what so ever. I don´t know if I have to put aditional html instructions or what…I´m using a stack 3 html with this code:




The page in question is here:
I wonder if you can enlighten me as I no nothing related with code.
Thank you,

Fernando Biancardi


(PJ) #11

Great topic and questions.

I have the same issue as Fernando. When I load my Hype i get an empty page as well.


(kris ) #12

This post was flagged by the community and is temporarily hidden.


(Fernando Biancardi P.) #13

Hi dear Kris for you quick response!
Yes, I had this experience once, the Hype animation worked fine as long as it was embedded or contained in the home page of the project, but is different if you have it in a different page as in my case “Cristmas Card” page; as I mention before, the page works really fine as long as it plays with in RW or Safary preview, but once you upload, all the joy fades away.
When you mention hierarchy you mean that you would have to change the order of the files with in the Hype folder or take some files out of it?
Sorry for this newcomer basic questions !

Yours,

Fernando


(kris ) #14

This post was flagged by the community and is temporarily hidden.


(Fernando Biancardi P.) #15

Thanks Kris for your concern!
I’ll give it a try tomorrow…hope it’ll work

Most kind!

Fernando


(kris ) #16

This post was flagged by the community and is temporarily hidden.


(Fernando Biancardi P.) #17

Hey Kris:
Thank you again for your concern and YES! this did the trick just adding this (…/) to the code was the solution to my nightmare, as you said: once you ad this to your code you can´t see the preview in RW anymore but you can delete and paste this as many times as needed; I think PAProf can also benefit of this as well.
Great help my friend.

Yours,

Fernando


(kris ) #18

This post was flagged by the community and is temporarily hidden.


(Fernando Biancardi P.) #19
https://forums.realmacsoftware.com/t/hype3-html5-animations/3952/18?source_topic_id=3952

Hi Kris this is Fernando again
Sorry to bother you once more!..some how I manage to forget where the insertion point was to include “…/e” I was trying to modify my page several times and it stopped working when I publish, I really don´t know what happened as I managed to work this around a couple of days ago…this is the original piece of code after the first edit: charset=“utf-8” src=“resources/TarnaviOK2.hyperesources ; which is able to preview in RW and this other one is what I´m trying to insert in order to publish: charset=“utf-8” src=”…/resources/TarnaviOK2.hyperesources. I wrote a tutorial about this in “widgets” so I could remember next time but has magically vanished!

Yours,

Fernando


(kris ) #20

This post was flagged by the community and is temporarily hidden.