Forum Discussion
"When State Is" triggers fail on Feedback Masters
Note: Workaround included at the end of this post for those who have encountered this issue and need a fix while they wait for a patch :)
The issue:
On Feedback Masters, triggers based on object states are broken and throws console errors (e.g, Do x when the state of Y is Z).
This issue seems to only occur when doing state-based triggers on Feedback Masters, and not on Master Layouts, base slides, or base layers.
It occurs when trying to trigger any function based on an objects state (motion paths, variable updates, state changes, etc.)
In the below course, there are 2 examples to show this happening (and the triggers used to set up the function below), as well as a 3rd example showing a workaround using some simple JavaScript. You can download the example as well if you want to look at the Feedback Masters to see how the JavaScript works, etc.
Review 360 - State-based issues on Feedback Masters (Examples)
Example 1:
When you hover over the box, the text below should change from False to True, and when the hover ends, it should return it back to False. However, you can see that when you hover over the box, the variable text does not change.
If you press F12 to open the Dev Tools, on the Console tab, you'll see 2 errors being thrown whenever you hover on or off (Fig 1 below, same as Example 2).
Example 2:
When you click to select the box, the text below should change from False to True, and when you click to deselect it, it should return it back to False. However, you can see that when you click the box, the variable text does not change.
If you press F12 to open the Dev Tools, on the Console tab, you'll see 2 errors being thrown whenever you click the box (Fig 1 below).
Example 3:
Example 3 functions the same as Example 1, you hover over the box, and it changes the text variable from False to True, and vice versa. This one is set up using a JavaScript trigger, allowing the function to work correctly.
These console errors actually stop the function execution, so nothing else will fire based on those states (either internal or trigger-based).
Console errors:
Fig 1. Console errors being thrown whenever you hover on or off (example 1) or click (example 2).I think this has persisted for at least 6+ months (as this is as far back as I can remember specific state functions not working on Feedback Masters, but it could be much longer).
Replicate this issue:
Current Storyline Version: 3.119.37125.0
I think this has persisted for at least 6+ months (as this is as far back as I can remember specific state functions not working on Feedback Masters, but it could be much longer).
To replicate the issue (via hover states and a variable), do the following on either the Top Layout Master or an individual Feedback Master:
- Create a True/False variable (hoverVariable) and add it as a reference in a text box.
- Add a rectangle (hoverBox) and add a hover state to the rectangle.
- Add an On Hover trigger:
- Set hoverVariable to True when the state of hoverBox is Hover.
- Add an Off Hover trigger:
- Set hoverVariable to False when the state of hoverBox is not Hover.
- On a slide, add a layer and set the layer's layout to your Feedback Master. Show the layer when the timeline starts.
- Preview your slide, click Inspect to open the Dev Tools and then click the Console tab. Hover over your box to see the Console errors appear, and your hoverVariable not change.
Workaround:
As a workaround, I've written the below snip that utilises the pointerover and pointerout functions that came with the JavaScript Advanced API update. This is Example 3 in the above file.
Using the below, we're setting up a JavaScript-based on/off hover function by setting a variable (hoverVariable) to true if the object (hoverObject) is hovered, and false if the object is not hovered. Then, you can add other triggers that fire based on the variable value (true/false) instead of the objects state.
Set this to run when the timeline starts on your Feedback Master, and you should be good to go :)
// Add the object you want to execute triggers based on its state
const hoverObject = object('OBJECT_ID_HERE');
// ON HOVER
// Between the curly brackets ( { } ), place the functions you want to trigger when the object is hovered
hoverObject.pointerover(() => {
// Do the below when the mouse hovers over the object (e.g, set a variable to true if you need to do x when object state is hover)
โโsetVar('hoverVariable', true)
});
// OFF HOVER
// Between the curly brackets ( { } ), place the functions you want to trigger when the object is no longer hovered
hoverObject.pointerout(() => {
// Do the below when the mouse no longer hovers over the object (e.g, set the same variable to false to do an "off hover" trigger)
โโsetVar('hoverVariable', false)
});