Need multiple actions to a button or similar using javascript?


(Ralph) #1

Ok I have an original Flash document that I have to do over in Hype. The basics are not a problem and I have those done but I now ran into some intricate functions I need to do. Basically it goes like this

5 buttons for 5 scenes
when each scene starts it is an animation of a hand opening then stops with the info for each page in the palm of the hand.

I have that done but the next part is when you click on any other button to go to another scene it first must trigger the animation of the hand going in reverse.
( this I was able to do ) but THEN I need to jump to the scene assigned to the button pressed and play the animation of that hand with the information for that page, follow.

So with each button press I first need to reverse out of the current page timeline then trigger the new timeline on another page.

I hope I’m clear as I tried to add extra actions to a mouseclick and that did not do the trick.

Any help?

R


(Jonathan Deutsch) #2

You can use the Start Timeline… action as part of an On Scene Unload event handler in the Scene Inspector. When the timeline is complete, the scene will perform the transition.


(Hans-Gerd Claßen) #3

create additional timelines for each button that just have a timelineaction to switch the scene. length should be the same as the reversed one … :slight_smile: use a custom behaviour in the targeted scene to play the expected timeline …

xyz.hype.zip (15.8 KB)


(Hans-Gerd Claßen) #4

you beat me … with another approach :wink:


(Jonathan Deutsch) #5

Your approach is clever and works too!


(Ralph) #6

Hmm, this is a bit tricky as your approach seems like the best one. The best way would be for me to send the .hype file so you could see exactly what I need to do. I will try to explain in simple terms below.

Picture a hand
Hand has 5 fingers
Each finger has a button to go to another scene
each scene or hand has an animation on mouse click
hand animates to become a fist then opens again to reveal text in the hand
so in each animation I have a pause in the main timeline that stops the animation half way thru to reveal text in the palm of the hand now when you choose another button
the action triggers the scene to continue the main timeline to the palm open again but at the end of the timeline there is a jump to scene action.

The problem is I need each button to go to the correct scene as now I can only have each button go to one scene.

As mentioned this would be much easier to explain by having someone see the actual.hype file to understand. I come from a Flash background and if I was doing this in Flash I would be using If statements .

So you are on the right track as I believe this would work using multiple timelines or jonathans on Scene Unload but thats a bit confusing.

Any help?

RD


(Hans-Gerd Claßen) #7

posting a hypefile is always a good starting point :slight_smile: if it’s to complex: rebuilt a simple file that shows your issue.


(Ralph) #8

Not complex at all just complex to explain. If I post a zip here how do I do?

R


(Hans-Gerd Claßen) #9

drag’n’drop


(Ralph) #10

File to big just PM’d dropbox link TO YOUR PRIVATE MESSAGE PROFILE, thanks so much R


(Hans-Gerd Claßen) #11

so you can proceed as i described above …

as example scene ‘what we do’:

  1. ) delete the jump to scene action at the end of the main timeline
    2.) for each button create its own new timeline (e.g. ‘who we are’ -> timeline ‘who we are’)
    3.) at 3 seconds of those timelines place an action which jumps to destscene
    4.) onclick or touchstart of the button run continue maintimeline and start the timeline corresponding to the button

btw.: really nice idea :slight_smile:


(Ralph) #12

Hmm still confused but correct me if I’m wrong :
there should be 5 scenes with 5 timelines
what we do
who we are
where we are
our customers
contact us

how do I create 5 timelines in each scene?
the only things different in each timeline are the yellow text in each palm twice ( once for forward and once for reverse)

This is confusing me

Can you show me the difference in two timeline samples from what I sent you?

So I can see what to display and what not too?
R


(Hans-Gerd Claßen) #13

correct

puh, you shall have a look at the documentation. it does a good job in explaining hypes functionality

after all, all you have to do is:
remove the timelineactions at the end of main timelines
create timelinelines for each button -> at 3 seconds of each timeline place a behaviour that switches to the desired scene …


(Ralph) #14

Ah figured out how to add timelines as when I was pasting it would delete the timeline I pasted from but now I got it, as I see that

Question!
I now see that ALL layers must be listed in each timeline and ONLY what you want animated gets recorded on each timelime.

That brings me to ONE question.

Before I resume, if I have the same exact animations running in multiple timelines can I copy those actions from one timeline to another by hitting copy and paste with animations?

Then just remove the animation from the layers that are different?

In other words

if I have 3 timelines that have the same animations EXCEPT for two layers that display different text just copy and paste then delete the actions from each different layer in each timeline? Hope I’m clear

R


(Ralph) #15

Ah now I understand and working on it. All timelines are done just need to add the new animations for each timeline then link it up to see where I am . Took a bit of figuring and had to look at a few tutes on timelines but now its clear.

I’ll post back if I run into any issues , thx you guys rock!

R


(Ralph) #16

Coding time for this bad boy, since I last posted about this I now lined everything up and have

5 timelines for the five buttons

I also have 6 scenes copied so all timelines are in each scene

Home
what we do
who we are
where we are
our customers
contact us

opening is the home page with all buttons visible, getting a bit confused on how to proceed here as lets say I want to go to What We Do

on the main timeline of the homepage do I select the what we do button, JUMP SCENE?

Or do I do away with the home page and have the opening scene as WHAT WE DO, so when I click What We Do button, it plays the timeline what we do in the WHAT WE DO scene?

any help plz R


(Mark Hunte) #17

Is it possible for you to post the project. It would be easier to help if you can.

Ah I see you mention it is big, you can use dropbox as before… PM me if need


(Ralph) #18

Dropbox link is in a PM from me, plz read below so you know how its supposed to work.

each button needs to trigger the timeline it is currently in to continue from 3:03 to 6:00 seconds
that plays the timeline in reverse.

Once the timeline hits 6:00 THEN I need to go to the new scene and play the timeline associated with that scene. Follow?

All this has is TWO scenes for now


(Mark Hunte) #19

Pm’d back with changes…

For others.

Ok, I slightly started from scratch. ( by removing all duplicate timelines )

This is a bit organic… as my time at the mo is little limited…

Each scene ( example only has two) has two timelines. The main and the one that does all the animations for that scene.

My Idea is that when the page first loads:

WHAT_WE_DO’s Main Time line starts the the timeline named : WHAT_WE_DO
Note the same name of the scene and the Timeline.

Each button for a scene also uses the scene name but in it’s class list.

When you click a button, for example WHO WE ARE

The button will first run a javascript function Named marker.
The marker Function. set a global var that is the clicked buttons second class name which for example will be WHO_WE_ARE.

It will then also tell the current timeline WHAT_WE_DO to continue.

When the timeline reaches the 6.03 point, A timeline Action will then run a javascript function named Jump

The Jump function will the use the current global var entry Which in this case will be WHO_WE_ARE and jump to the scene name WHO_WE_ARE

ta da…


(Ralph) #20

Mark, thanks so much for looking into this for me. This project has gone a little over my head as I understand how to do basic functions but this needs a bit more than that as I see now the only way to have someone understand what I need done would be to send the original file which was in Flash actionscript 2.0 I have both the fla and swf.

Once someone looks at the swf file they will know exactly how to replicate as the entire file with all the scenes are layed out in Hype. Just needs to be linked together, so if someone can get back to me I’ll dropbox both the flash swf file and the .hype file I did.

could really use the help

RD