-
Notifications
You must be signed in to change notification settings - Fork 7.5k
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
Slider updates - "separate" handle logic from the slider and allow for vertical or horizontal orientation #1816
Conversation
|
||
handleWidth = handle.el().offsetWidth, | ||
// Set the new bar width or height | ||
if (this.options()['vertical']) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think this should check this.vertical()
now instead of the option.
So in this PR we're still adjusting the bar location based on the handle, right? |
@heff Yep, that's correct. |
ping on this one. |
@@ -78,11 +81,12 @@ vjs.Slider.prototype.update = function(){ | |||
// If scrubbing, we could use a cached value to make the handle keep up with the user's mouse. | |||
// On HTML5 browsers scrubbing is really smooth, but some flash players are slow, so we might want to utilize this later. | |||
// var progress = (this.player_.scrubbing) ? this.player_.getCache().currentTime / this.player_.duration() : this.player_.currentTime() / this.player_.duration(); | |||
var progress = this.getPercent(); | |||
var handle = this.handle; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Doesn't look like this handle var is being used anymore.
looks good to me! |
NOTE: This was originally done so I could unblock myself and continue working on the base styles, so there's almost certainly room for improvement. Going ahead and opening a PR to start the conversation, but this shouldn't be pulled in yet.
The crux of this is that it allows a slider to be either horizontal or vertical without needing to use a css transform. If the vertical option is set on the slider, it will update the elements height and do the necessary calculations against the Y axis, or vice versa if the slider is horizontal.
In the process of doing this, I broke the update logic into two parts so the slider handle update is handled in its own method. This is still pretty ugly, since we have to adjust the slider bar position in the slider handle method, but it helped a bit with readability (imo).
Thoughts?