Request: play video in main window from speaker view

[ivanperez-keera]

When using the speaker view, playing a video will play it in the speaker view, not in the main window.

This is unfortunate. A common setup when using the presenter view is that one has the speaker view in front of him, and the screen behind. Sometimes, a clone of the presentation screen is not available. That means the speaker needs to turn around to look at the projection screen.

If events and display of the speaker view were in sync with the main window, then playing videos or interacting with the slide would be viewed by the audience.

I understand that this feature is non-trivial, and unless a general mechanism is found to clone the window and send input to the right locations, doing this just for videos might complicate the code in reveal.js unnecessarily. Maybe someone has found a solution for this 🙏

And thanks for reveal.js! It's really good :)

[hostile-d]

I've just faced with the same problem. Unless reveal.js hasn't native support for remote video start, I'm using autoplay trick, probably it may be useful to anybody:

Reveal.addEventListener( 'slidechanged', function( e ) {
    e.currentSlide.querySelectorAll('.js-play-toggle').forEach(v => v.play());
});

I've added to my videos class .js-play-toggle and on each slidechanged event I'm searching in current slide elements with this class and starting playing it.

UPD: Or you can just use autoPlayMedia flag in config 🙈, just found it in docs.

[jcouton]

The speaker view redirects the keys pressed, but not the mouse events.

// notes.html
document.addEventListener( 'keydown', function( event ) {
	currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'triggerKey', args: [ event.keyCode ] }), '*' );
} );

The solution would be to do the same using the mousedown event :

document.addEventListener( 'mousedown', function( event ) {
currentSlide.contentWindow.postMessage( JSON.stringify({ method: 'triggerMouse', args: [ {x: event.clientX, y: event.clientY} ] }), '*' );
} );
// or simply pass the event to be generic

Then create a new entry for the Reveal API :

Reveal = {
 ...,
  triggerMouse: function( event ) {
    // do your magic here
  }
}

This would also solve the #1529 if you "fire" the event mousedown provided by zoom.js

Maybe we can add the modifications suggested by the #2118

But javascript is not a language I can write code with, could I ask for some help ?

[ivanperez-keera]

This looks great. Is there any case in which that would not be desirable? Meaning: should interacting with the shown slide, as opposed to the presenter slide (current behaviour) be something that one might want to disable?

[jcouton]

The point of the presenter slide is to monitor what is displayed. But I agree that it can be practical since the displayed slide is smaller thant the one on screen.
Maybe we can add a button to enable/disable this option ?

[ivanperez-keera]

The point of the presenter slide is to monitor what is displayed.

Do you mean that the purpose is not to interact with the slide via the speaker view (and, therefore, the feature should not be enabled by default), or that the purpose is to be able to use only the speaker view (and, so, the feature should be enabled by default)?

Use case (happened to me): standing in front of a podium, I had my laptop in front of me and the projection screen behind. Everything went smoothly until I had to play videos: I had to turn around and look at the big screen, which made me look stupid (because I'm not good at interacting with the presentation that way) and I turned my back towards the audience. Big no-no.

[jcouton]

Sorry, wrongly said.
The feature (start a video/zoom/press next on an included pdf from the presenter view) to pilot the projection screen should be enabled by default.
Then and only then the presenter can press on a button to interact with the speaker-view only.
I would like it to be this way.

This means changing the current behavior and adding a button on the speaker view.

[janisdd]

Just a quick note event.clientX/Y is not enough if the size of the speaker-view is different. But you can use relative coordinates, something like relX = event.clientX / document.body.clientWidth in the main view
and in the speaker-view x = document.body.clientWidth * relX

However, I think a special approach for video playback would be better as clicking would suffer from the different sizes/aspect ratios.

Haven't looked into this but if the videos don't have an id attribute, maybe xpath could be used to find the same video in both views