Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chore: Scrubber/Media fixes for mobile #185

Merged
merged 3 commits into from
Jul 5, 2017
Merged

Chore: Scrubber/Media fixes for mobile #185

merged 3 commits into from
Jul 5, 2017

Conversation

jeremypress
Copy link
Contributor

  • Enables scrubbing on mobile
  • Prevents tap and hold from bringing up copy/paste menu
  • makes track title the file name

@jeremypress
Copy link
Contributor Author

jeremypress commented Jun 26, 2017

Tests coming soon.

I still see two issues with scrubbing in general.

  1. The tap targets are too small, but the media-container has its height hard coded at 60px
  2. On iOS, scrubbing when the video/audio is playing causes the scrubber to jump when scrubbing at certain speeds

@@ -77,6 +86,8 @@ const CLASS_SCRUBBER_HOVER = 'bp-media-scrubber-hover';
this.playedEl.removeEventListener('mousedown', this.mouseDownHandler);
this.convertedEl.removeEventListener('mousedown', this.mouseDownHandler);
this.handleEl.removeEventListener('mousedown', this.mouseDownHandler);
this.scrubberContainerEl.removeEventListener('touchstart', this.mouseDownHandler);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

does this also need to be inside an if (this.hasTouch) {} ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

From MDN:

Calling removeEventListener() with arguments that do not identify any currently registered EventListener on the EventTarget has no effect.

@@ -1,10 +1,12 @@
import autobind from 'autobind-decorator';
import EventEmitter from 'events';
import scrubberTemplate from './Scrubber.html';
import Browser from '../../Browser';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is this needed? Didn't see it used anywhere in the code you added

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Browser.hasTouch() on line 61

Copy link
Contributor

@JustinHoldstock JustinHoldstock left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good stuff changing to use pointer terminology. It'll also be easier to mentally parse once we have PointerEvent support in all browsers

@jeremypress jeremypress merged commit 884799c into box:master Jul 5, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants