Youtube video in slider does not go to next slide

Hey marcie73,

Thank you for the inquiry.

It seems to be working properly on my end. The slider resets back or transitions to the first slide when the video ended. It triggers the following function in the enfold\config-templatebuilder\avia-shortcodes\slideshow\slideshow.js file.

function onFinish(event) {
				console.log('test')
				//if the video is not looped resume the slideshow
				if (!event.data.slide.is('.av-single-slide') && !event.data.slide.is('.av-loop-video')) {
					event.data.slide.trigger('reset');
					self._navigate('next');
					self.resume();
				}

				//safari 8 workaround for self hosted videos which wont loop by default
				if (event.data.slide.is('.av-loop-video') && event.data.slide.is('.av-video-service-html5')) {
					if ($html.is('.avia-safari-8')) {
						setTimeout(function () {
							event.data.slide.trigger('play');
						}, 1);
					}
				}
			}

Best regards,
Ismael

Hi,

Thank you for the info.

The issue seems to also occur on IE browsers version 10 and older. Would you mind posting the FTP account so that we could edit the files and debug the issue? Please place the info in the private field.

Best regards,
Ismael

Hi,

For some reason we cannot connect to the server using the account above. Are you blocking certain countries? Please make sure that connections coming from these countries are allowed.

// https://kriesi.at/about

Thank you for your patience.

Best regards,
Ismael

Hi,

We tested the video on IE 11/10 for quite a while but we always get stuck in this error.

Screenshot: https://imgur.com/xXqUPhW

Do you see that error on Safari browser?

The slider does not reset because this line (297) in the slideshow-video.js file never gets executed.

_self.$option_container.trigger(command);

Or the onStateChange event never gets called.

Best regards,
Ismael

Hi,

Looks like the onStateChange is triggered properly on Safari. Please look for this code in the slideshow-video.js around line 310:

var command = _self.options.loop != false ? 'loop' : 'av-video-ended';

Below, add this code.

console.log("YOUTUBE ENDED");

After that, make sure to purge any cache and in the browser console, check if you can see the log that we created above.

Is it working correctly when minification or compression is completely disabled? Please try to disable the WP Rocket plugin temporarily, remove the browser cache, then test it again.

Best regards,
Ismael

Hi,

Thank you for the screenshot.

The screenshot is cut off at the very end. Are you waiting for the video to end? The console.log “YOUTUBE ENDED” above should show once the video ended, but if not, this means that the following condition (line 311) is not met.

if (event.data === YT.PlayerState.ENDED)

This might be the same issue as the one reported here.

// https://kriesi.at/support/topic/youtube-video-throwing-error-when-played-in-color-selection/

Best regards,
Ismael

Hi,

Hi Ismael, which screenshot of the 4 I sent do you mean?

I was referring to the most recent screenshot, the info at the very end of the console are cut off. You have to wait for the video to end before checking the console. If you do not see the text “YOUTUBE ENDED” in the console after the video ends, it means that the following conditions are not met and so it does not resume or reset the slider.

if (event.data === YT.PlayerState.ENDED)

Best regards,
Ismael