-
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
Use classes instead of inline styles for hiding / showing #1681
Conversation
@@ -845,7 +845,7 @@ vjs.Component.prototype.removeClass = function(classToRemove){ | |||
* @return {vjs.Component} | |||
*/ | |||
vjs.Component.prototype.show = function(){ | |||
this.el_.style.display = 'block'; | |||
this.removeClass('vjs-hidden'); |
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.
There's a subtle difference here in that something that was hidden by default could no longer be shown. I wonder if that will be an issue. The more accurate name for this new approach would be unhide
.
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.
That's a very good point...I think in all actuality, this would still work here (if display: none;
was used for the default hide) thanks to the cascading thing since this would be the last class added. Obviously that wouldn't be the case for inline styles, but we definitely shouldn't be doing that ourselves and discouraging others anyway.
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.
An example would be how the control bar used to be before using the state classes. By default it had 'display:none' defined in the CSS, and then show() was used to add display:block. That's the piece that wouldn't work anymore with this change. There's no internal examples of that anymore, and any external skins couldn't rely on that anymore since we're not calling show() anymore on anything, so I don't think we'll break people, but we might want to glance through the plugins and see if there's any use cases like this, where something's hidden by default.
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 agree. If it looks like we'd break other folks in plugin-land, maybe we just plan for this in for version 5 to avoid making a backwards-incompatible change?
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.
Yeah, we can do that. But I don't really don't expect to find issues in the plugins. I doubt many or any are extending Component and using the hide/show methods.
I'm surprised how few places we use show()/hide() internally now that we've moved a lot of things to use CSS states. Really just the tracks (being overhauled) and the menu buttons (which hide themselves if empty). The main place this comes into play is with the player API itself. Any thoughts on the discussion in #1445 in relation to this? re: hiding with visibility instead of display. It doesn't have to be solved with this PR but just interested to know. |
+1 on all of this. Love to see in 5.0. (But I don't much like |
No description provided.