Paint tab-loading throbbers into a ui::Layer.

chrome/browser/ui/views/tabs/tab.cc

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 #include "chrome/browser/ui/views/tabs/tab.h"
 
 #include <limits>
 
 #include "base/command_line.h"
 #include "base/debug/alias.h"
@@ skipping 364 matching lines @@
 
     return MaskedTargeterDelegate::DoesIntersectRect(target, rect);
   }
 
   Tab* tab_;
 
   DISALLOW_COPY_AND_ASSIGN(TabCloseButton);
 };
 
 ////////////////////////////////////////////////////////////////////////////////
+// ThrobberView
+//
+// A Layer-backed view for updating a waiting or loading tab throbber.
+class Tab::ThrobberView : public views::View {
+ public:
+  explicit ThrobberView(Tab* owner);
+
+  // Resets the times tracking when the throbber changes state.
+  void ResetStartTimes();
+
+ private:
+  // views::View:
+  bool CanProcessEventsWithinSubtree() const override;
+  void OnPaint(gfx::Canvas* canvas) override;
+
+  Tab* owner_;  // Weak. Owns |this|.
+
+  // The point in time when the tab icon was first painted in the waiting state.
+  base::TimeTicks waiting_start_time_;
+
+  // The point in time when the tab icon was first painted in the loading state.
+  base::TimeTicks loading_start_time_;
+
+  // Paint state for the throbber after the most recent waiting paint.
+  gfx::ThrobberWaitingState waiting_state_;
+
+  DISALLOW_COPY_AND_ASSIGN(ThrobberView);
+};
+
+Tab::ThrobberView::ThrobberView(Tab* owner) : owner_(owner) {
+  // Since the throbber can animate for a long time, paint to a separate layer
+  // to reduce repaint overhead.
+  SetPaintToLayer(true);
+  SetFillsBoundsOpaquely(false);
+}
+
+void Tab::ThrobberView::ResetStartTimes() {
+  waiting_start_time_ = base::TimeTicks();
+  loading_start_time_ = base::TimeTicks();
+  waiting_state_ = gfx::ThrobberWaitingState();
+}
+
+bool Tab::ThrobberView::CanProcessEventsWithinSubtree() const {
+  return false;
+}
+
+void Tab::ThrobberView::OnPaint(gfx::Canvas* canvas) {
+  const TabRendererData::NetworkState state = owner_->data().network_state;
+  if (state == TabRendererData::NETWORK_STATE_NONE)
+    return;
+
+  ui::ThemeProvider* tp = GetThemeProvider();
+  const gfx::Rect bounds = GetLocalBounds();
+  if (state == TabRendererData::NETWORK_STATE_WAITING) {
+    if (waiting_start_time_ == base::TimeTicks())
+      waiting_start_time_ = base::TimeTicks::Now();
+
+    waiting_state_.elapsed_time = base::TimeTicks::Now() - waiting_start_time_;
+    gfx::PaintThrobberWaiting(
+        canvas, bounds, tp->GetColor(ThemeProperties::COLOR_THROBBER_WAITING),
+        waiting_state_.elapsed_time);
+  } else {
+    if (loading_start_time_ == base::TimeTicks())
+      loading_start_time_ = base::TimeTicks::Now();
+
+    waiting_state_.color =
+        tp->GetColor(ThemeProperties::COLOR_THROBBER_WAITING);
+    gfx::PaintThrobberSpinningAfterWaiting(
+        canvas, bounds, tp->GetColor(ThemeProperties::COLOR_THROBBER_SPINNING),
+        base::TimeTicks::Now() - loading_start_time_, &waiting_state_);
+  }
+}
+
+////////////////////////////////////////////////////////////////////////////////
 // ImageCacheEntry
 
 Tab::ImageCacheEntry::ImageCacheEntry()
     : resource_id(-1),
       scale_factor(ui::SCALE_FACTOR_NONE) {
 }
 
 Tab::ImageCacheEntry::~ImageCacheEntry() {}
 
 ////////////////////////////////////////////////////////////////////////////////
@@ skipping 10 matching lines @@
 // Tab, public:
 
 Tab::Tab(TabController* controller)
     : controller_(controller),
       closing_(false),
       dragging_(false),
       detached_(false),
       favicon_hiding_offset_(0),
       immersive_loading_step_(0),
       should_display_crashed_favicon_(false),
+      throbber_(nullptr),
       media_indicator_button_(nullptr),
       close_button_(nullptr),
       title_(new views::Label()),
       tab_activated_with_last_tap_down_(false),
       hover_controller_(this),
       showing_icon_(false),
       showing_media_indicator_(false),
       showing_close_button_(false),
       button_color_(SK_ColorTRANSPARENT) {
   DCHECK(controller);
   InitTabResources();
 
   // So we get don't get enter/exit on children and don't prematurely stop the
   // hover.
   set_notify_enter_exit_on_child(true);
 
   set_id(VIEW_ID_TAB);
 
   title_->SetHorizontalAlignment(gfx::ALIGN_TO_HEAD);
   title_->SetElideBehavior(gfx::FADE_TAIL);
   title_->SetHandlesTooltips(false);
   title_->SetAutoColorReadabilityEnabled(false);
   title_->SetText(CoreTabHelper::GetDefaultTitle());
   AddChildView(title_);
 
   SetEventTargeter(
       scoped_ptr<views::ViewTargeter>(new views::ViewTargeter(this)));
 
+  throbber_ = new ThrobberView(this);
+  AddChildView(throbber_);
+
   media_indicator_button_ = new MediaIndicatorButton(this);
   AddChildView(media_indicator_button_);
 
   close_button_ = new TabCloseButton(this);
   close_button_->SetAccessibleName(
       l10n_util::GetStringUTF16(IDS_ACCNAME_CLOSE));
   // The normal image is set by OnButtonColorMaybeChanged() because it depends
   // on the current theme and active state.  The hovered and pressed images
   // don't depend on the these, so we can set them here.
   const gfx::ImageSkia& hovered = gfx::CreateVectorIcon(
@@ skipping 34 matching lines @@
   return controller_->IsTabSelected(this);
 }
 
 void Tab::SetData(const TabRendererData& data) {
   DCHECK(GetWidget());
 
   if (data_.Equals(data))
     return;
 
   TabRendererData old(data_);
+  UpdateLoadingAnimation(data.network_state);
   data_ = data;
 
   base::string16 title = data_.title;
   if (title.empty()) {
     title = data_.loading ?
         l10n_util::GetStringUTF16(IDS_TAB_LOADING_TITLE) :
         CoreTabHelper::GetDefaultTitle();
   } else {
     Browser::FormatTitleForDisplay(&title);
   }
@@ skipping 38 matching lines @@
 }
 
 void Tab::UpdateLoadingAnimation(TabRendererData::NetworkState state) {
   if (state == data_.network_state &&
       state == TabRendererData::NETWORK_STATE_NONE) {
     // If the network state is none and hasn't changed, do nothing. Otherwise we
     // need to advance the animation frame.
     return;
   }
 
-  TabRendererData::NetworkState old_state = data_.network_state;
   data_.network_state = state;
-  AdvanceLoadingAnimation(old_state, state);
+  AdvanceLoadingAnimation(state);
 }
 
 void Tab::StartPulse() {
   pulse_animation_.reset(new gfx::ThrobAnimation(this));
   pulse_animation_->SetSlideDuration(kPulseDurationMs);
   if (animation_container_.get())
     pulse_animation_->SetContainer(animation_container_.get());
   pulse_animation_->StartThrobbing(std::numeric_limits<int>::max());
 }
 
@@ skipping 212 matching lines @@
   const int extra_padding =
       (controller_->ShouldHideCloseButtonForInactiveTabs() ||
        (IconCapacity() < 3)) ? 0 : kExtraLeftPaddingToBalanceCloseButtonPadding;
   const int start = lb.x() + extra_padding;
   favicon_bounds_.SetRect(start, lb.y(), 0, 0);
   if (showing_icon_) {
     favicon_bounds_.set_size(gfx::Size(gfx::kFaviconSize, gfx::kFaviconSize));
     favicon_bounds_.set_y(lb.y() + (lb.height() - gfx::kFaviconSize + 1) / 2);
     MaybeAdjustLeftForPinnedTab(&favicon_bounds_);
   }
+  throbber_->SetBoundsRect(favicon_bounds_);
 
   showing_close_button_ = ShouldShowCloseBox();
   if (showing_close_button_) {
     // If the ratio of the close button size to tab width exceeds the maximum.
     // The close button should be as large as possible so that there is a larger
     // hit-target for touch events. So the close button bounds extends to the
     // edges of the tab. However, the larger hit-target should be active only
     // for mouse events, and the close-image should show up in the right place.
     // So a border is added to the button with necessary padding. The close
     // button (BaseTab::TabCloseButton) makes sure the padding is a hit-target
@@ skipping 540 matching lines @@
 }
 
 void Tab::PaintIcon(gfx::Canvas* canvas) {
   gfx::Rect bounds = favicon_bounds_;
   if (bounds.IsEmpty())
     return;
 
   bounds.set_x(GetMirroredXForRect(bounds));
 
   if (data().network_state != TabRendererData::NETWORK_STATE_NONE) {
-    // Paint network activity (aka throbber) animation frame.
-    ui::ThemeProvider* tp = GetThemeProvider();
-    if (data().network_state == TabRendererData::NETWORK_STATE_WAITING) {
-      if (waiting_start_time_ == base::TimeTicks())
-        waiting_start_time_ = base::TimeTicks::Now();
-
-      waiting_state_.elapsed_time =
-          base::TimeTicks::Now() - waiting_start_time_;
-      gfx::PaintThrobberWaiting(
-          canvas, bounds, tp->GetColor(ThemeProperties::COLOR_THROBBER_WAITING),
-          waiting_state_.elapsed_time);
-    } else {
-      if (loading_start_time_ == base::TimeTicks())
-        loading_start_time_ = base::TimeTicks::Now();
-
-      waiting_state_.color =
-          tp->GetColor(ThemeProperties::COLOR_THROBBER_WAITING);
-      gfx::PaintThrobberSpinningAfterWaiting(
-          canvas, bounds,
-          tp->GetColor(ThemeProperties::COLOR_THROBBER_SPINNING),
-          base::TimeTicks::Now() - loading_start_time_, &waiting_state_);
-    }
+    // Throbber will do its own painting.
   } else if (should_display_crashed_favicon_) {
     // Paint crash favicon.
     ui::ResourceBundle& rb = ui::ResourceBundle::GetSharedInstance();
     gfx::ImageSkia crashed_favicon(*rb.GetImageSkiaNamed(IDR_SAD_FAVICON));
     bounds.set_y(bounds.y() + favicon_hiding_offset_);
     DrawIconCenter(canvas, crashed_favicon, 0,
                    crashed_favicon.width(),
                    crashed_favicon.height(),
                    bounds, true, SkPaint());
   } else if (!data().favicon.isNull()) {
     // Paint the normal favicon.
     DrawIconCenter(canvas, data().favicon, 0,
                    data().favicon.width(),
                    data().favicon.height(),
                    bounds, true, SkPaint());
   }
 }
 
-void Tab::AdvanceLoadingAnimation(TabRendererData::NetworkState old_state,
-                                  TabRendererData::NetworkState state) {
-  if (state == TabRendererData::NETWORK_STATE_WAITING) {
-    // Waiting steps backwards.
-    immersive_loading_step_ =
-        (immersive_loading_step_ - 1 + kImmersiveLoadingStepCount) %
-            kImmersiveLoadingStepCount;
-  } else if (state == TabRendererData::NETWORK_STATE_LOADING) {
-    immersive_loading_step_ = (immersive_loading_step_ + 1) %
-        kImmersiveLoadingStepCount;
-  } else {
-    waiting_start_time_ = base::TimeTicks();
-    loading_start_time_ = base::TimeTicks();
-    waiting_state_ = gfx::ThrobberWaitingState();
-    immersive_loading_step_ = 0;
+void Tab::AdvanceLoadingAnimation(TabRendererData::NetworkState state) {
+  if (controller_->IsImmersiveStyle()) {
+    if (state == TabRendererData::NETWORK_STATE_WAITING) {
+      // Waiting steps backwards.
+      immersive_loading_step_ =
+          (immersive_loading_step_ - 1 + kImmersiveLoadingStepCount) %
+          kImmersiveLoadingStepCount;
+    } else if (state == TabRendererData::NETWORK_STATE_LOADING) {
+      immersive_loading_step_ =
+          (immersive_loading_step_ + 1) % kImmersiveLoadingStepCount;
+    } else {
+      immersive_loading_step_ = 0;
+    }
+
+    SchedulePaintInRect(GetImmersiveBarRect());
+    return;
   }
-  if (controller_->IsImmersiveStyle()) {
-    SchedulePaintInRect(GetImmersiveBarRect());
-  } else {
-    ScheduleIconPaint();
+
+  // To ensure the throbber layer does not paint over stacked or dragged tabs,
+  // hide it when the favicon would be clipped out. Check for any clipping on
+  // the left since the shoulder of a dragged tab can still paint over the icon.
+  gfx::Rect clip = GetLocalBounds();
+  const bool needs_throbber = state != TabRendererData::NETWORK_STATE_NONE &&
+                              controller_->ShouldPaintTab(this, &clip) &&
+                              clip.x() == 0 && clip.Contains(favicon_bounds_);

[sky, 2015/10/09 15:16:38]

I don't think this is enough. I can still easily get bleed through if a tab is
loading and I drag another tab on top of it.

[tapted, 2015/10/11 10:36:38]

Thanks for trying it! I added handling for two additional cases. The first I
didn't notice on a desktop-linux build, but on a ChromeOS build it showed in
some tab reorder animations. The fix is in TabStrip::ShouldPaintTab(..) - there
are two cases for when the tab being dragged overlaps the right side of a tab
animating to the left: the clip rect wasn't updated for these, now it is.

The other case was when a tab first attaches to a tab strip from another window.
In this case, the right-side of a throbber can get the dragged tab over it
(usually the tab reorders to the right before that can happen, but not when it
happens in TabDragController::Attach). So, that check replaces the
clip.Contains(..) here.

I need to stare at the logic in TabStrip::ShouldPaintTab some more -- I think
the clipping needs to be different for non-stacked tabs now that it updates the
clip rect for both types.

But let me know if you think this approach seems sound, and I'll fix that up and
work on some tests.

+
+  if (needs_throbber != throbber_->visible()) {
+    throbber_->SetVisible(needs_throbber);
+    ScheduleIconPaint();  // Repaint the icon area to update favicon visibility.
   }
+  if (state == TabRendererData::NETWORK_STATE_NONE)
+    throbber_->ResetStartTimes();
+  throbber_->SchedulePaint();
 }
 
 int Tab::IconCapacity() const {
   const gfx::Size min_size(GetMinimumUnselectedSize());
   if (height() < min_size.height())
     return 0;
   const int available_width = std::max(0, width() - min_size.width());
   // All icons are the same size as the favicon.
   const int icon_width = gfx::kFaviconSize;
   // We need enough space to display the icons flush against each other.
@@ skipping 258 matching lines @@
                          const gfx::ImageSkia& image) {
   DCHECK_NE(scale_factor, ui::SCALE_FACTOR_NONE);
   ImageCacheEntry entry;
   entry.resource_id = resource_id;
   entry.scale_factor = scale_factor;
   entry.image = image;
   image_cache_->push_front(entry);
   if (image_cache_->size() > kMaxImageCacheSize)
     image_cache_->pop_back();
 }