Change videourl for video transistions

Martin-W · June 17, 2021 at 3:05 PM

Hi,

I am trying to implement video transitions between different scenes. I already got it working by creating a layer outside the scenes in following way:

Code

<layer name="video"
  	url.html5="plugins/videoplayer.js"
 	url.flash="pugins/videoplayer.swf"
   	videourl="gehen.mp4"
   	align="center" x="0" y="0"
   	width="100%" height="prop"
   	pausedonstart="true"
	keep="true"
	alpha="0"
	visible="false"
	enabled="false"
   	loop="false"
   	volume="1.0"
   	onvideoready=""
   	onvideoplay=""
   	onvideopaused=""
   	onvideocomplete="tween(layer[video].alpha, 0, 1); delayedcall(2, set(layer[video].visible, false));"
   	onerror=""
/>

Display More

And within the scene I create a hotspot, which calls an action to set the video active, play the video and change to the next scene in the background of the video. This also works fine with the following code:

Code

<hotspot name="videotest" url="skin/vtourskin_hotspot.png" ath="-20.205" atv="32.860" onclick="video_blend();" />


<action name="video_blend">
    set(layer[video].visible, true);
    layer[video].play();
    tween(layer[video].alpha, 1, 1);
    loadscene(scene_Standpunkt_2_edit, null, MERGE, NOBLEND);
</action>

Now in the next scene I would like to use

Code

set(layer[video].videourl, gehen_2.mp4);

to update the video url for the next transition (that is from scene 2 to scene 3 for example). However this doesn´t seem to work. If I call the action to play the video after updating the video url it still uses the first video and not the new one with the updated url. Is set(layer[video].videourl, new_url.mp4); possible to use?

If it´s not possible, what could be a workaround? I thought about creating a bunch of video layers in the beginning and then later use the one I need for my transition as I did above. However I´m not sure if these many layers will affect the performance of my tour when I a need a lot of different transition videos (although they are set to visible="false" and enabled="false").
It would be great to hear your oppinion and suggestions.
Regards
Martin

Amit Suthar · June 25, 2021 at 10:55 AM

Hi Martin,

If you are still trying to find out the solution, This is how I generally do it to play different videos.

Code

function play_video(video_name){  var krpano = document.getElementById("krpanoViewer");  video_url = "%CURRENTXML%/videos/"+video_name;  krpano.call("layer[video].playvideo("+video_url+");");}

Though I have used JS code but you can do it through krpano actions too. Idea is to use playvideo functionality and pass the url.

Hope this helps.

Martin-W · June 28, 2021 at 8:23 AM

Thanks Amit for your tip. Have you noticed some delay because of the buffering of the video? I think in your JS code the video will be opened and start to play right away. As far as I understood with the videolayer which is paused on start, the video will be preloaded and therefore no latency should be noticeable when I start the video.
Is the layer[video] in your code the same layer as I have written in my first code snippet?

Nupsi · October 25, 2021 at 10:00 AM

Hi there,

I´m hijacking your thread because I´m facing the same problem: set(layer[video].url,***** does´nt have any effect on existing videos
And even layer[video].playvideo(URL) does´nt work very reliable. Sometimes it works, sometimes not and the old video starts again.

Is there any reliable way to change a video-url? I know I could create an action which removes the old layer and creates a new one with the new url, but I need to change the existing video, because it´s the ONLY way to autoplay a video on mobile devices in VR-mode, because of the needed touch-action to start a video.

Thx in advance,
NUPSI

Participate now!