StreamusChromeExtension
StreamusChromeExtension copied to clipboard
Refactor implementation of loading spinner
The current implementation of loading spinners isn't working out very well. You can find it here
Currently, one assigns a class to a parent view is-showingSpinner
which causes any spinner
DOM nodes underneath it to become visible. Additionally, some elements underneath it will fade out, others only fade out partially, and some elements become unclickable. These effects are applied with the spinner--faded
, spinner--faded--light
, and spinner--unclickable
classes.
This is all bad for a few reasons:
- Showing all spinners underneath an element is weird. When I show the 'YouTube Loading' overlay all the ListItems underneath it show spinners when they should not.
- I don't always show a spinner when fading out elements. So, it's a bit weird to be re-using these classes for that.
- It's weird having to start spinners with display: none and then override that with display: block.
I'm not really sure what the correct approach is, though. I suppose I could append/remove spinners via JavaScript and control it all that way, but I'd prefer to have it controlled with just CSS classes.