One button performs more functions


this is the starting position.


When user taps btn1, left square = green.

when user taps btn2 right square = red.

What I want to happen is the following:
When btn1 is tapped nothing should be seen yet. after btn1or2, the left square = green.
When btn2 is tapped nothing should be seen yet. after btn1or2 the right square = red.
I can't find a solution, but maybe it ain't possible?

test1button.hype.zip (10.1 KB)

Thank you

or @MaxZiebs Exportscript Hype Power Pack

to enable some logic

Thank you Hans-Gerd, but this goes far beyond my skills. I guess I'll stay with my 'not so elegant' solution of multiple buttons and hiding the wrong and showing the right one.That's what I can understand :wink:

you have not even tried :wink: but you've got a solution :ok_hand:

1 Like

To clarify, you're looking for something like a "reveal if you were correct" button? Where a user makes a choice, and then on another action they are shown if that choice is correct?

No, that’s not what I’m looking for.
The buttons 1 & 2 are used to activate a musical key.( a function)
Button 1or2 then needs to choose the right function. Actually button 1or 2 is a group of buttons. But that’s not the problem.
My solution is to have several groups (I need 28 groups for it, which works ok), but I hoped it would be possible with just one group.
That will be less design work.

Well it could be a problem I think if we gave you something like this which would get complicated fast because we only are thinking about the interaction of what you have shown us.

test1button.hype 2.zip (16.0 KB)

Thank you Mark.
I think my example with the colours wasn’t really smart. Instead of changing the colours, buttons 1 & 2 need to trigger a function (keyC, keyD etc.) which then will be activated with button 1 or 2.
Don’t know if that is possible. If it is too much of a problem, I’ll stick to my earlier solution. There is also a possibility with more scenes, although that might slow down things a bit.

You can always use timelines as a "state machine". Here is an article about that…

In your case, you could use an additional timeline called "logic" that has key frames with Timeline Actions on it. The timeline would have such a setup:

  • Second 1: Run JavaScript function keyC, pause Timeline
  • Second 2: Run JavaScript function keyD, pause Timeline
    ...

Now pressing Button 1 jumps to time in timeline named 00:00:29 (one frame before Second 1 because 1 second 30 frames)

And pressing Button 2 jumps to time in timeline named 00:01:29 (one frame before Second 2)


Your Button "1 and 2" now just "continues" the timeline. Your play head in the logic timeline will trigger what you need and pause.


timelineAsStateMachine.hype.zip (15,5 KB)

This kind of switch with jumps can also be obviously used for more complex sequences etc. Just think of it as a disk and a play head you set the needle down at different places.

This technique can also be used for intervals and timeouts.

You can also just emit custom behavior instead of calling functions. That way you can trigger symbols and scene stacks “on ...” without ever touching JavaScript.

1 Like

what does that mean? a function like a javascriptfunction? and than what means trigger¿ and activated¿ those descriptions do not exist for js-functions ...

guess: do you like to set a key/variable/value when a button is clicked and the combined button will run a js-function taking those as arguments?

1 Like

I will explain the complete project. It's about scales for a bass/guitar player.

Schermafbeelding 2021-02-14 om 11.28.08

When you press the C in the circle, it starts function() keyC.

Schermafbeelding 2021-02-14 om 11.27.53

Then you press one of the buttons: major or dorian or whatever. The scale changes, but not the key.
All buttons have a class with the same name. These are being called in the function through a switch statement.
But now you want to play another scale in another key. Simple: you press the D in the circle.
Then you need to use the same buttons again, but everything must be done regarding the key of D instead of the key of C.
The solution @MaxZieb suggested works, but only once for the first button pressed.

In my first design, I changed the group of buttons for each key. That works. Then I thought it could be less complicated and that's where the problems began.
Does this makes sense?

Well, if you pressing subsequent keys etc. you would need to switch the logic timeline driving further actions (my guess) or at least the layer of buttons (or invisible click rectangle to avoid duplicating artwork) that address the timeline. But this could be done much more efficient if you dared to touch some JavaScript! :wink:

I'd suggest to concepts if you want to use some code that would allow using a single logic function! The switch statement and the fact that each button click passes it's element along.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch

Agree with the Javascript. But I should have started that 30 years ago. My old brains are not flexible enough anymore to go "quickly" to a deeper level :disappointed_relieved:

Thank you all for helping trying to solve the problem. For now I'll stick to my first solution. And "slowly" try to put it all in a switch statement in the nearby future.

1 Like

Okay, I'll put together an example for switch as a starting point…
What is it you want to do after you got the key and the scale? play a sound? play a timeline?

Please don’t bother. But if you insist😉
A lot of things are happening after that. Notes on staff, sound, derived keys etc.

I didn't even need a switch statement after all… this one function solution has many comments and uses additional attributes (identity panel) to identify the button pressed.

You can use either timelines or custom behaviour to trigger whatever you need.
oneFunctionStateMachine.hype.zip (20,2 KB)

Update: I added a two function version. It contains the same logic but split into two functions as it makes a little easier to digest.
twoFunctionStateMachine.hype.zip (20,2 KB)

2 Likes

I’m not at my Mac at the moment. First thing when I get back.

1 Like

Great Max! I can understand what's happening :thinking:
But now the next challenge. Every key has a lot of variables. Notes on other lines, different ledger lines, different sharps, flats and so on. These are all stored in the functions keyC, keyD etc.
How do acces these functions? If I put the keyC functions like this:

// do something comment if testing alerts are not needed
alert(key+'  '+scale);
    hypeDocument.functions().keyC(hypeDocument, element, event);

it works. But not for keyD etc. Where should I put the other functions?

update:

think I found it.

  var ts = hypeDocument.customData.key;

switch (ts) {
case 'C':
hypeDocument.functions().toonSoortC(hypeDocument, element, event);
break;
case 'D':
hypeDocument.functions().toonSoortD(hypeDocument, element, event);
break;
}

2 Likes