← Back to team overview

yahoo-eng-team team mailing list archive

[Bug 1570485] Re: UX: Inconsistent Spinner Usage

 

Reviewed:  https://review.openstack.org/313685
Committed: https://git.openstack.org/cgit/openstack/horizon/commit/?id=c219a3efc6622c6e5857577d94633efc7d139860
Submitter: Jenkins
Branch:    master

commit c219a3efc6622c6e5857577d94633efc7d139860
Author: Diana Whitten <hurgleburgler@xxxxxxxxx>
Date:   Tue Feb 9 11:20:38 2016 -0700

    Horizon Spinner/Loader should inherit from theme
    
    The Horizon spinner was using a spinner generated and animated
    entirely out of JavaScript. Since CSS3 provides animates and we have
    access to icon fonts, doing everything with JavaScript is not
    necessary and actually taxing on the browser. Plus, all of the
    spinner options were being passed in and around with JavaScript,
    including the colors.  This makes it supremely difficult to use the
    theme to style the spinner.
    
    The new spinner is just defined by a handful of templates now. There
    are two clientside templates to support Legacy Horizon, and one
    template in the Angular to support spinners going forward.  Legacy
    Horizon had two forms of spinners, so it was broken up. Angular as
    not yet made use of the inline spinner, but should follow the same
    markup when it is made.
    
    There are two types of spinners, inline spinners (those shown when a
    dynamic tab content is loading) and modal spinners (various other
    places).  These are consistent with each other for the 'default'
    experience, but their experience can be entirely customized separate
    from each other.  'material' has been augmented with loaders defined
    within their design spec to show the power of this new feature.
    
    horizon.templates.js was augmented with this refactor to support only
    having to compile one tempalte at a time (instead of all of them) and
    caching that template so that all of them can be recompiled later.
    Also, horizon.loader.js was added to house template compilation code
    that was repeated in several locations.
    
    To test overwriting page modal spinner and inline-modal spinner
    examples, please follow the instructions in _loading_inline_exmaple.html,
    _loading_modal_example.html under
    openstack_dashboard/themes/material/templates/horizon/client_side
    
    Change-Id: I92bc786160e070d30691eeabd4f2a50d6e2bb395
    Partially-implements: blueprint horizon-theme-css-reorg
    Partially-Implements: blueprint bootstrap-html-standards
    Closes-bug: #1570485


** Changed in: horizon
       Status: In Progress => Fix Released

-- 
You received this bug notification because you are a member of Yahoo!
Engineering Team, which is subscribed to OpenStack Dashboard (Horizon).
https://bugs.launchpad.net/bugs/1570485

Title:
  UX: Inconsistent Spinner Usage

Status in OpenStack Dashboard (Horizon):
  Fix Released

Bug description:
  admin/volumes: Clicking from 'Volumes' tab to 'Volume Types', gives a
  strange spinner ... not consistent with other spinner usage and the
  styling on it isn't great: https://i.imgur.com/cj20kV1.gif

  Note: volumes tab -> Volume types tab has been reorganized to
  different panels. So the problem won't be observed anymore. You can
  see the problem from project -> networks , click one of the
  network...since there are a couple tabs there, you should be able to
  see the strange spinning problem.

  Another problem observed is from project -> Object Store -> Containers
  ...create a folder, then click that folder then click upload file
  button to upload anything...then the spinner box shows with a strange
  long rectangle with updating...at the lower left side.

  There are 3 cases of the spinner usages and they are not consistent.

To manage notifications about this bug go to:
https://bugs.launchpad.net/horizon/+bug/1570485/+subscriptions


References