Binding click events to container/video does not work while playing (GC)

[koosvanderkolk]

Using the latest version of the code, in Google Chrome.

videojs(video_element).ready(function(){
  videojs_player = this;
  videojs_player.play();
  $video_container = $video_element.parent();

  $video_container.bind('click', function(event){
    //does not fire in GC
  });
});

http://jsbin.com/ijigac/1/

[heff]

There's a mix of vars here that I'm not following. $video_element and video_element, are supposed to be the same? But either way, try videojs_player.on('click', function(){})

[koosvanderkolk]

Thanks! However, videojs_player.on('click', function(){}); also does not work in GC (Version 27.0.1453.94 m, Win7) while the movie is playing

http://jsbin.com/ijigac/3/edit

After the movie stops, it works.

P.S. Is it an idea to add this event type to this list add the bottom of https://github.com/videojs/video.js/blob/master/docs/api.md?

[heff]

That example works for me, assuming it's supposed to log event X/Y. What platform/browser version?

Click could be added to the event list, though it will capture every click, including those on buttons, so I'm not sure how useful it'd be.

On May 28, 2013, at 11:18 PM, koosvanderkolk [email protected] wrote:

Thanks! However, videojs_player.on('click', function(){}); does not work in GC while the movie is playing

http://jsbin.com/ijigac/3/edit

After the movie stops, it works.

P.S. Is it an idea to add this event type to this list add the bottom of https://github.com/videojs/video.js/blob/master/docs/api.md?

—
Reply to this email directly or view it on GitHub.

[koosvanderkolk]

GC / Win7

(Weird, this is mentioned in the post on github, but not in the e-mail
notification you got...)
Op 29 mei 2013 21:39 schreef "Steve Heffernan" [email protected]
het volgende:

That example works for me, assuming it's supposed to log event X/Y. What
platform/browser version?

Click could be added to the event list, though it will capture every
click, including those on buttons, so I'm not sure how useful it'd be.

On May 28, 2013, at 11:18 PM, koosvanderkolk [email protected]
wrote:

Thanks! However, videojs_player.on('click', function(){}); does not work
in GC while the movie is playing

http://jsbin.com/ijigac/3/edit

After the movie stops, it works.

P.S. Is it an idea to add this event type to this list add the bottom of
https://github.com/videojs/video.js/blob/master/docs/api.md?

—
Reply to this email directly or view it on GitHub.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/545#issuecomment-18640911
.

[heff]

Every windows machine + Chrome I check seems to be working, for both your example and this new one I threw together just to check.
http://jsbin.com/apigoh/1/edit

[DeanMarkTaylor]

This specific page http://jsbin.com/apigoh/1/edit clicking the video works for me in the following Chrome browsers on Windows 7:
Release: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.94 Safari/537.36"
Canary: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1523.0 Safari/537.36"

Although if you have Emulate touch events enabled it doesn't work.

Also tested in IE 10 - it doesn't work (don't know if you care, thought I would test anyway):
"Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; InfoPath.3)"

Hope this helps.

[heff]

Ah, so it's a touch events issue. Ok, we're running into those elsewhere too.

On May 31, 2013, at 3:53 PM, Dean Taylor [email protected] wrote:

This specific page http://jsbin.com/apigoh/1/edit clicking the video works for me in the following Chrome browsers on Windows 7:
Release: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.94 Safari/537.36"
Canary: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1523.0 Safari/537.36"

Although if you have Emulate touch events enabled it doesn't work.

Also tested in IE 10 - it doesn't work (don't know if you care, thought I would test anyway):
"Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; InfoPath.3)"

Hope this helps.

—
Reply to this email directly or view it on GitHub.

[gkatsev]

If touchevents are available, we disable the click event while playing so that we can toggle the controls. https://github.com/videojs/video.js/blob/master/src/js/control-bar/control-bar.js#L49-L51

[DeanMarkTaylor]

Perhaps @koosvanderkolk can confirm it's related to touch events?
If you are having touch events issues you may want to have a read up on this: http://www.html5rocks.com/en/mobile/touchandmouse/

[heff]

For this specific issue, it sounds like we're doing this on purpose. When you're on a touch device, you need to be able to click the video to show the controls after they've hidden, and I think the idea is we don't want that playing/pausing the video at the same time.

If you're using a mouse while emulating touch events, I bet that would feel wrong. But that's probably not a use case we can account for.

[gkatsev]

Supporting both touch and mouse at the same time is very tough. That's why Microsoft invented PointerEvents, though, I'd rather they'd have just built on top of our current touch events.
But really, we only preventDefault the click event if a touchend event is received and we are not currently paused. So, I don't think this is the issue in this particular case.

[koosvanderkolk]

Disabling the 'Emulate touch events' (http://martinkool.com/post/24459554064/emulate-touch-events-in-chrome) solved the problem 👍

(enabled that feature a loooooong time ago and forgot about it)

[GFoley83]

@gkatsev I using videojs on a mobile device and need to capture tap events on the video (e.g. for X/Y position of the tap); how can I re-enable the click event for mobile?

[gkatsev]

@GFoley83 if you're listening on the player, you can listen to a 'tap' event that we generate, otherwise, you should just listen to touch events on mobile devices. Why do you mean to listen to click directly?

[GFoley83]

@gkatsev Just a business requirement; we need to know exactly where on the video has been clicked or tapped as it is playing. And thanks, 'tap' worked as needed. If only I Safari on iOS would support it too... sigh

[gkatsev]

@GFoley83 ios safari does support it if the controls attribute is disabled. In 4.10, we have made the custom controls the default, so, when you are not in fullscreen, you should be able to know where things were tapped.

[GFoley83]

@gkatsev Really? I'll have to retest so, thanks for the heads-up. At least that's a step in the right direction. Complete pain the arse that Sarari still goes fullscreen when the video plays though (outside of uiwebview) as that is what's really mucking us up at the moment.

[gkatsev]

@GFoley83 only iphones will always go fullscreen. iPads will play in-line just fine. But fullscreen in ipads is native as well.

[pingram]

@gkatsev do you know if the behavior has changed with respect to listening to 'tap' events? I have the same business case as GFoley83 and wasn't able to get the touch events to work

[gkatsev]

I haven't tested this on iphones in recent versions but it probably still behaves in the same manner.