Change scenes via timeout

Hey all!

I was wondering if any of you have tried this before as I have no idea where to start.

I am creating an interactive experience that needs an attract loop.

Once the screen (attract loop) is touched the user can go through various menu systems.

Once the user is finished and leaves, it should start the attract loop again and start from the beginning.

Can this be done with scenes via some sort of timeout function? Timeline action?

Thanks in advance for the help!

Happy Halloween!!

What sort of action would be taken by the user when they "finish"... or would You just be relying on a certain amount of time to go by without any activity? (mouse movement, button clicks, etc).

It would be based on the amount of inactive time I would think. I dont have a way of knowing when the user would cease interaction.

Is the environment a web site, a kiosk , or a…?

It is in a kiosk environment.

I have no experience with kiosks - but what You are asking for seems very do-able as others have written about here. Search for "kiosk" on the Forum and You will get 29 hits. The following thread appears to bear some relevancy to your situation - in particular the response from @luckyde:

If interaction with the kiosk is our determinant... Using the setInterval method in combination with a onmousemove event would probably be a significant part of your solution.

Awesome! Thanks @JimScott!

I will investigate today.

@The_Beaticus

I realized my last description might assume too much…

The example of @Luckyde is just an overview of a kiosk in action (including an example of setInterval), I do not believe it is directly applicable to your situation because that code features a “slide show” presentation, whereas You are just having viewers click on menus - not having seen a demo of your project I’m just guessing of course.

Along those lines the solution I was sketching out would work something like:

Below I am assuming the “attract loop” (a new term for my vocabulary) just runs until the viewer engages the screen in some fashion and we then immediately move to other scenes (active screens) in the presentation.

When the active screen(s) were first opened by the program - or the viewer - the initial “onmousemove” and timeStamp Event would be recorded to a variable (let’s call it “timeCheck”); then every 30 seconds (or set an other interval time) the “setInterval function” would run and take the current “onmousemove” timestamp and compare it to the “timeCheck” variable of 30 seconds previous. If the most recent value is equal to “timeCheck” You know no one has been using the screen in the last 30 seconds, and so trigger your reset mechanism to go back to the “attract loop” scene. If the current value is larger than the “timeCheck” variable we would assume the screen is still in use, and set the variable to the most recent “timeStamp”. Then 30 seconds later the process repeats.

If there is a fair amount of reading involved on the screens then 30 seconds might be too short a time interval - season to taste.

I haven’t worked with this code in an actual project - so all of this is a “thought experiment” that You will need to adapt to your particular project.

Below: a demo code mash up - from the links to the w3schools code examples above - using “timeStamp” & “onmousemove” together:

<!DOCTYPE html>
<html>
<head>
<style>
div {
    width: 200px;
    height: 100px;
    border: 1px solid black;
}
</style>
</head>
<body>

<div onmousemove="myFunction(event)"></div>

<p>Timestamp: <span id="demo"></span></p>

<script>
function myFunction(event) {
    var n = event.timeStamp;
    document.getElementById("demo").innerHTML = n;
}
</script>

</body>
</html>

Hello @The_Beaticus,

neither finished nor leaves are javascript-events :wink: ... sadly ...

anyway: here (onIdle.hype.zip (25.2 KB))
is something that may or may not work. it's not well tested.

setup: set the time of inactivity in the head, set the name of the scene that should be displayed when inactivity occurs ...

    //to set: checkInterval = 1000 equals one second and name of idleScene
    
    var checkInterval = 10000, /*10 seconds*/ idleScene = "Pause"
5 Likes

@h_classen Great work! This works perfectly. Thanks for the insight.

Will this work as a function so that when there’s no activity on one scene, it will default to another?

:slight_smile:

ummm, not sure what that smile means exactly… is that a yes?
:thinking::smiley:

not scenerelated but windowrelated … but yes :slight_smile:

The “onIdle” example works great. Wha I’m trying to figure out now is how to add a function to stop the timer when loading a scene I don’t need the idle to run on.

Looking at the timer functions I came up with:

function start(){
counter = 0;
console.log(counter)
idleTimer.stop();
}
I’m sure its’wrong, and it’s simpler than that.

disableIdletimeOnScenes.hype.zip (51.2 KB)

please note that @MaxZieb offered extensions that include a ticker(-managment) … implementing those for idlecontrol will be possible and may be easier too :slight_smile:

I don’t get it, this, this magic… where did you hide the rabbit under what hat?:flushed::no_mouth:
Where’s the code hidden that makes this (disableIdletimeOnScenes) tick? I’m totally flabbergasted.

Hype has an internal notification system (Observer Pattern) that is triggered on different occasions like HypeSceneLoad, HypeSceneUnload, HypeDocumentLoad and much more. You can create an eventlistener to these notifications and act on them. Usually Hype provides these three arguments to the function listening to the event (hypeDocument, element, event) and sometimes the return value of these functions can influence the Runtime at a core level.

  • hypeDocument is the document that is currently doing the notification
  • element is the effected element
  • event contains event specific stuff if there is any (scene name etc.)

To answer you last question… he put it in Head HTML.

1 Like

Ugh… I need new glasses. :grimacing:
Thanks Max! :grinning:

Ok, First let me thank you profusely for all the help thus far! This is the best forum I’ve ever been a part of!
The script work great! The issue that’s popped up now is that on the scene that’s has idle control disabled there are several images that when clicked run a script and a secondary timeline. If nothing in the scene is clicked, the scene will hold indefinitely. As soon as you click something, it seems to start the idle timer again.
I’ve included a modification of your submission.
disableIdletimeOnScenes_v2.zip (114.3 KB)