StreamusChromeExtension icon indicating copy to clipboard operation
StreamusChromeExtension copied to clipboard

Refactor implementation of loading spinner

Open MeoMix opened this issue 9 years ago • 0 comments

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.

MeoMix avatar May 18 '15 07:05 MeoMix