Run Javascript Function Only After ALL Scenes have been viewed

1

Hi -

I’d like to run a javascript function ONLY after all of the scenes have been viewed.
I’ve looked at several threads about how to get scene info etc. and I’m guessing there is a way to do this using Hype Extension. Is there a way to use “sceneInfo.sceneCount” and based on the total number of scenes have the function run when the total is reached?
I just can’t figure it out.
I’ve attached a demo file.
View Scenes Example.hype.zip (39.0 KB)

2

Have not looked at your example - short on time here - but here is one strategy which You have already touched the shores of - use an array. Info about using arrays here.

Create an empty array. e.g. sceneChecker = []

=========================
Then, as You have suggested use hypeDocument.sceneInfo to:

Get the total count of all scenes in the Hype document.

Then on each “Scene Load” check the scene name with the names in the array.

If the scene name is not in the array add it to the array ( “push()” ).

Check the array length if the array length = the sceneCount You are home Baby!

Again all the references to using arrays mentioned in the paragraph just above are covered in the “here” link in the first paragraph.

===============================
Example of checking for a value in an array - doing this on the fly so consider this general concept:

We have a variable “sceneName” with the current scene name already placed into it (e.g. “Part 3”)
We have our array “sceneChecker” with other scene names placed into it (we’ve already visited those scenes). This array currently contains [“Intro”, “Part 1”, “Part 2”, “Epilogue”]

“On Scene Load”

<script>
function checkSceneName() {
var n = sceneChecker.indexOf(sceneName);
if (n == -1) {sceneChecker.push(sceneName);}
}
</script>

"indexOf" returns “-1” if the item is not found in the string (i.e. the array), so we will add “Scene 3” to the array (i.e. the “push” method).


Have not tested anything - just a concept! :sunglasses:

2 Likes
3

To be honest you do not need to use the extension ( although you can)

The hype API can get all the scene names hypeDocument.sceneNames()

And you can use that in the head along with hypeDocument.customData like so.

<script>

function myCallback(hypeDocument, element, event) {

hypeDocument.customData.allScene = hypeDocument.sceneNames()


}


if("HYPE_eventListeners" in window === false) {
window.HYPE_eventListeners = Array();
}
window.HYPE_eventListeners.push({"type":"HypeDocumentLoad", "callback":myCallback});

</script>

Then using the prepare for display scene action we run this script which gets the current scene name, checks if it is in the hypeDocument.customData.allScene array and removes it if it is.

Once the hypeDocument.customData.allScene count is equal to 0 we can run the other javascript function.

hypeDocument.customData.allScene.map(myFunction)

function myFunction(nam,index) {
 
 
 if (hypeDocument.currentSceneName() == nam && hypeDocument.customData.allScene.length != 0){
 
 
hypeDocument.customData.allScene.splice(index, 1)
 
 }
 
 
  if (hypeDocument.customData.allScene.length == 0){
	   hypeDocument.functions().someFunction()
	    
	   }
 
}

The above can be jiggled as you want it to meet your needs.
It can also all be done in the head with another head script to run the checker on prepare for display
etc.

View Scenes Example.hype mhv1.zip (40.6 KB)

4 Likes
4

Good one @MarkHunte ! You can even put the init into the on prepare or on load call…

if (!hypeDocument.customData.hasOwnProperty('allScene')){
    hypeDocument.customData.allScene = hypeDocument.sceneNames()
}

Sidenote: Hype still has this bug that equal scene names results in broken scene targeting.

2 Likes
5

Thank you all SO much!
I’m going to go with @MarkHunte 's solution.

I hope others find this helpful as well.

3 Likes