Good morning everyone,
I created a hype file of two slides. At second 15 of "Scene A", I set the action "go to the next scene", "Scene B".
"Scene B" contains an HTML Widget that links to a URL. When "Scene B" loads, the site corresponding to the URL is shown, which automatically opens the privacy management pop-up box, with the possibility of choosing between "Manage settings" and "Accept all".
By clicking on one of the two options, "Scene B" shows the desired page. After a few seconds, I set the timeline action to return to "Scene A". This loop should therefore be repeated: "Scene 1", which has its duration, then goes to "Scene B", which has its duration, and so on...
The problem is that every time I view "Scene B" the privacy management pop-up box appears again.
I would like this box to be present only at the first loading, and then the privacy settings selected at the first launch would be stored and no longer displayed in the subsequent "Scene B" uploads.
Is there any way to achieve this?
Thanks for your attention and any advice
If the user has already made a choice, should nothing happen at all? -- Should the user stay on scene A?
You could store whether this choice has been made in localstorage:
In the Head HTML of your Hype document (via Document > Edit Head HTML), declare the global variable:
window.userPrivacyChoice = null;
When the user makes a choice on the privacy pop-up in "Scene B", set the global variable and also save to localStorage:
// if there are two choices....
window.userPrivacyChoice = 'choice1';
localStorage.setItem('userPrivacyChoice', 'choice1');
// And this code is for when the user makes 'choice2'
window.userPrivacyChoice = 'choice2';
localStorage.setItem('userPrivacyChoice', 'choice2');
When "Scene B" is loaded, before showing the privacy pop-up, check the global variable or localStorage:
if (window.userPrivacyChoice === 'choice1' || localStorage.getItem('userPrivacyChoice') === 'choice1') {
// Logic for 'choice1'
} else if (window.userPrivacyChoice === 'choice2' || localStorage.getItem('userPrivacyChoice') === 'choice2') {
// Logic for 'choice2'
} else {
// No choice has been made, show the pop-up
}
This assumes you're not storing the choice in the variable, just that the user has made a choice -- of course you could store the choice here as well. This should persist across reloads and restarts.
For the user, it is a question of choosing whether to accept or customize the choices relating to privacy that are presented to him when he opens "Scene B", and I would like this choice to occur only when "Scene B" is first loaded, and not every time you automatically switch from "Scene A" to "Scene B".
Regardless of the choice made by the user in the "Scene B" popup, at a certain second, from "Slide B" you return again to "Slide A", and so on.
The Timeline Action on the Main Timeline of Scene A has the key logic, which looks at previously chosen choices:
if (window.userPrivacyChoice === 'choice1') {
hypeDocument.startTimelineNamed('choice1', hypeDocument.kDirectionForward)
} else if (window.userPrivacyChoice === 'choice2') {
hypeDocument.startTimelineNamed('choice2', hypeDocument.kDirectionForward)
} else {
// no choice has been made (this is likely first launch)
hypeDocument.showSceneNamed('B', hypeDocument.kSceneTransitionCrossfade, .4)
}
Note that the buttons on Scene B should handle the logic relating to your cookies or whatever you're asking permission to do.
Note that you can see what localstorage values have been set by using the Application tab in Chrome's developer tools:
The exchange between "Scene A" and "Scene B" must be a continuous loop, and I would like the privacy choice made at the very first loading of scene B to be saved (regardless of the choice made) and therefore the GDPR popup not appear at each new loading of "Scene B".
You can use the logic function I shared to show the HTML widget if the cookie choice hasn't been made. However, since the choice is made within an HTML widget (I assume) then this is a bit more complicated and you would need to use cross frame communication. This tool by @MaxZieb makes it more simple to integrate: Hype Global Behavior (Custom Behavior Extension)
