Video is not loading when placed into a hotspot. Wordpress.

[Phil_Himmelmann]

Hi folks,

It would be nice to get some help here.

If a Video is implemented into a Wordpress hosted tour you have to use following action instead of using direkt file path:

Screenshot 2020-11-05 at 11.39.20.png (51.11 KiB) Viewed 3699 times

Thats working fine but this method is not working in conjunction with hotspots.

(the video is placed 3d distorted into hotspot because the alpha is control by the skin)

Thanks in advance.

Phil

[Hopki]

Hi Phil,
Add the video as an asset.
Then add the action to the video element:

1.png (29.63 KiB) Viewed 3675 times

The $(r) only works when setting a value to the video element.
Regards,

[Phil_Himmelmann]

Hey Hopki,

thank you so much! It works!

Hint: The value has to be: $(r)assets/filename.mp4

NOT(!) (r)assets/filename.mp4 as the screenshot shows.

All the best.

Phil

[Phil_Himmelmann]

Hi hopki,

unfortunately there's a problem popping up.

The Video plays well in Safari desktop but not in iOS.

In node13 the video should appear.

https://sweetview.de/2020/11/04/futuristic-tour/

thanks in advance.

Phil

[Phil_Himmelmann]

Hi Hopki,

please ignore the last post. i made a mistake. thanks. phil

[Phil_Himmelmann]

Hi Hopki,

I need your help again.

Viewed by a desktop browser the video in node13 appears (alpha controlled by var_timer_node_video) and starts when mouse is pressed as intended.

https://sweetview.de/2020/11/04/futuristic-tour/

On iOS video appears when mouse is pressed.

My settings shown in the screenshot below. Any idea how to solve this?

Thanks in advance.

Phil

Screenshot 2020-11-06 at 10.52.23.png (412.54 KiB) Viewed 3653 times

[SMerriss]

Hey Phil,

The way you described it makes it seem as though it is working as intended. Were you not wanting it to start when it is pressed, or is the video starting when the screen is pressed but on a different node? If you could describe the problem more I would be happy to help.

-Spencer

[Phil_Himmelmann]

Hi Spencer,

on desktop safari it works as intended:

video fades in (alpha controlled by variable), video begins to play when mouse pressed.

on safari mobile (iOS) is behaves wrong:

there's no fade-in, it's even not visible, video appears when mouse is pressed.

you can see the tour here, the video is placed on node13: https://sweetview.de/2020/11/04/futuristic-tour/

thanks in advance.

Phil

[SMerriss]

Hey Phil,

Is the problem on mobile only when using Safari web browser, or is it performing incorrectly on mobile for all web browsers?

I looked on my phone any it appears to be behaving correctly, but I do not have an iphone so I cannot test on Safari.

If you send me your project file I can take a look at what may be causing this to happen, but I would suggest maybe creating logic blocks specific to both mobile and desktop to maybe isolate the problem and work on it from there. You are able to change variables based on the browser used as well as if it is on mobile or desktop to better control the user experience.

I also assume you are viewing it on your local host so it is an up to date tour of the fixes you have made. If you are viewing it from your website, make sure you empty your "browsing cache" or you could be looking at an old version of your tour.

Sorry I could not give you a straight forward answer. Let me know if this helped you at all.

-Spencer

[Phil_Himmelmann]

Hey Spencer,

thank you! I did not except correct behaviour on android. That helps a lot.

To empty the browser cache is good practice which I knew already. Thanks anyways.

The project file (70mb!) is downloadable here: https://sweetview.de/wp-content/uploads ... assets.zip

Maybe you can find a workaround.

Thanks in advance.

Phil

[Hopki]

Hi Phil,
Cool project

Hint: The value has to be: $(r)assets/filename.mp4
NOT(!) (r)assets/filename.mp4 as the screenshot shows.

It did but the screenshot shows the Value text field cropped, I did say under the screenshot

The $(r) only works when setting a value to the video element.

There are issues with iOS.
However, why not use pinned video?
As an experiment, I deleted the point hotspot and pinned the video to the blue rectangle.

I then added a container and gave it the action,

Source: Node Changed
Action: Media
Type: Visibility Media
Mode: Hide
Transition Time: 0.000 seconds
Target: Element01

Then the next action was:

Source: Variable Changed
Variable: var_timer_node_video
Action: Media
Type: Visibility Media
Mode: Show
Transition Time: 1.000 seconds
Target: Element01

This has an action filter:
Trigger: *var_timer_node_video
Comparison: >=
Value: 7

This seems to work well on both desktop and mobile including iOS.
Regards,