Change scenes via timeout

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.


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>
div {
    width: 200px;
    height: 100px;
    border: 1px solid black;

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

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

function myFunction(event) {
    var n = event.timeStamp;
    document.getElementById("demo").innerHTML = n;


Hello @The_Beaticus,

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

anyway: here ( (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"

@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?


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

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;
I’m sure its’wrong, and it’s simpler than that. (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. (114.3 KB)

If I’m reading it right, it looks like the clicking resets the interval counter.
Of course my syntax is non existence.:roll_eyes:

ups sry … i replaced the file …

I know this is an old thread, and I’ve used this script as described here to jump back to an idleScene. What I want this to do now is to go to the next scene after the idle timeout, but I obviously can’t just put “hypedocument.shownextscene” as my idleScene variable. What’s the syntax for this?