Go to a secondary timeline of another scene doesn't seem to work

Using JavaScript with Hype
1

I’m trying to use JavaScript to redirect my users based on cookie value.

So, if a cookie with the name ‘theme’ has a value ‘light’, the users are supposed to be redirected from ‘Choose theme’ scene to ‘Light’ timeline of ‘Home’ scene.

To do this, I created a custom behaviour on my ‘Home’ scene with the name ‘Cookie (light)’ which goes to time (00:00:00) in timeline ‘Light’. Then, I ran the function ‘checkCookie()’ on scene load of ‘Choose theme’ scene. Its code is this:

var cookieName2 = getCookie("theme");

if (cookieName2 === 'dark')
	{
		hypeDocument.showSceneNamed('Home')
	}
else if (cookieName2 === 'light')
	{
		hypeDocument.showSceneNamed('Home')
		hypeDocument.triggerCustomBehaviorNamed('Cookie (light)')
	}
else
	{
	}

I found the hype code from here: Go to a specific time line frame in another scene

My problem is, it is going fine to the ‘Home’ scene, just not going to the ‘Light’ timeline. (As of now, the ‘Light’ timeline has a white background as the only difference from the main timeline).

I’ve attached my document: Transitions.hype.zip (370.4 KB)

2

A scene's custom behaviors won't get triggered if the scene is not shown; so your behavior is only affecting the "Choose theme" scene which does not have this behavior.

I'll note that the document you attached does not have the code from your post, but I will just assume you posted an older copy.

The version you posted has these on the "Home" scene's on scene load handler:

setBlack()
setDark()
checkCookie()

So you'll see that it changes to the black theme, then sets the cookie to black. So even if the code you have above was on the Home scene, it would still be set to dark by the time checkCookie() is called.

Note that On Scene Load is called only when the particular scene is shown.

1 Like
3

I'm very sorry. I have the code in the document, just the name was different.

I'm talking about 'Check theme' function and not 'Check cookie'. My bad.

4

Then you should probably not be calling setDark() on the home scene and instead call checkTheme() in its spot.

5

setDark() is just setting the cookie named theme with the value dark.

I had added that keeping in mind the following condition:

Suppose a user visits my website from a link to some other scene other than my Choose theme scene, the theme preferences should be saved, so that the next time the user visits my home page (Choose theme scene), he/she doesn’t have to choose the theme preferences again.

The checkTheme() function on Choose theme scene is handling the redirects based on the cookie value. So, I guess, it should be on Choose Theme scene itself.

Actually, till now, I was using the traditional ‘single scene per .html page’ approach and now, I’m trying to switch to a complete ‘scene-based’ approach so, that I can get the complete website in just on .html file. Thus, all these problems.

6

I personally would not set a cookie unless a user is explicitly making an option - this would let you change default behavior in the future if you want.

Regardless I assume you got it that the problem is you were overwriting the cookie you were setting previously with the way your on scene load calls were being dispatched?

7

Well, I think, we’re diverting from the main problem.

My problem was that I need to switch to the timeline named Light on my Home scene based on some condition in the Check theme scene (the cookie value in this case). The redirect is (partially) working as I’m getting redirected to the Home scene, but, not switching to the Light timeline. Forgetting what I’ve done, what do I need to do to achieve this?

8

Okay. I got what you meant. I just had to create a duplicate of the checkTheme() function to run it differently on my Choose theme scene and Home scene.

1 Like
9

BTW your Cookie approach can be solved much easier with the more modern localStorage or sessionStorage see https://www.w3schools.com/html/html5_webstorage.asp

There is also a project called Hype StorageKit that might help.

10

That’s something I’ll have to read more about. Thanks for the information.