[ContextualSearch] Adds long press promo for Contextual Search.

chrome/browser/android/compositor/layer/contextual_search_layer.cc

Index: chrome/browser/android/compositor/layer/contextual_search_layer.cc
diff --git a/chrome/browser/android/compositor/layer/contextual_search_layer.cc b/chrome/browser/android/compositor/layer/contextual_search_layer.cc
index bfa1a6186203e26affd015d6ce625de24d984ddf..c7fad78a1bd09cf3fc703a833b17be9c79f24094 100644
--- a/chrome/browser/android/compositor/layer/contextual_search_layer.cc
+++ b/chrome/browser/android/compositor/layer/contextual_search_layer.cc
@@ -14,12 +14,14 @@
 #include "third_party/skia/include/core/SkColor.h"
 #include "ui/android/resources/resource_manager.h"
 #include "ui/base/l10n/l10n_util_android.h"
+#include "ui/gfx/color_utils.h"
 
 namespace {
 
 const SkColor kSearchBackgroundColor = SkColorSetRGB(0xee, 0xee, 0xee);
 const SkColor kSearchBarBackgroundColor = SkColorSetRGB(0xff, 0xff, 0xff);
 const SkColor kSearchBarBorderColor = SkColorSetRGB(0xf1, 0xf1, 0xf1);
+const SkColor kPeekPromoRippleBackgroundColor = SkColorSetRGB(0x42, 0x85, 0xF4);
 
 }  // namespace
 
@@ -43,10 +45,18 @@ void ContextualSearchLayer::SetProperties(
     int progress_bar_background_resource_id,
     int progress_bar_resource_id,
     int search_promo_resource_id,
+    int peek_promo_ripple_resource_id,
+    int peek_promo_text_resource_id,
     content::ContentViewCore* content_view_core,
     bool search_promo_visible,
     float search_promo_height,
     float search_promo_opacity,
+    bool search_peek_promo_visible,
+    float search_peek_promo_height,
+    float search_peek_promo_padding,
+    float search_peek_promo_ripple_width,
+    float search_peek_promo_ripple_opacity,
+    float search_peek_promo_text_opacity,
     float search_panel_x,
     float search_panel_y,
     float search_panel_width,
@@ -56,7 +66,6 @@ void ContextualSearchLayer::SetProperties(
     float search_context_opacity,
     float search_term_opacity,
     bool search_bar_border_visible,
-    float search_bar_border_y,
     float search_bar_border_height,
     bool search_bar_shadow_visible,
     float search_bar_shadow_opacity,
@@ -64,7 +73,6 @@ void ContextualSearchLayer::SetProperties(
     float arrow_icon_rotation,
     float close_icon_opacity,
     bool progress_bar_visible,
-    float progress_bar_y,
     float progress_bar_height,
     float progress_bar_opacity,
     int progress_bar_completion) {
@@ -90,6 +98,9 @@ void ContextualSearchLayer::SetProperties(
   // Round values to avoid pixel gap between layers.
   search_bar_height = floor(search_bar_height);
 
+  float search_bar_top = search_peek_promo_height;
+  float search_bar_bottom = search_bar_top + search_bar_height;
+
   bool is_rtl = l10n_util::IsLayoutRtl();
 
   // ---------------------------------------------------------------------------
@@ -112,11 +123,98 @@ void ContextualSearchLayer::SetProperties(
   panel_shadow_->SetPosition(shadow_position);
 
   // ---------------------------------------------------------------------------
+  // Peek Promo
+  // ---------------------------------------------------------------------------
+  if (search_peek_promo_visible) {
+    // Grabs the Search Opt Out Promo resource.
+    ui::ResourceManager::Resource* search_peek_promo_resource =
+        resource_manager_->GetResource(ui::ANDROID_RESOURCE_TYPE_DYNAMIC,
+                                       peek_promo_text_resource_id);
+
+    ui::ResourceManager::Resource* peek_promo_ripple_resource =
+        resource_manager_->GetResource(ui::ANDROID_RESOURCE_TYPE_STATIC,
+                                       peek_promo_ripple_resource_id);
+
+    // Peek Promo Container

[Theresa, 2015/10/02 17:34:45]

nit: add a //-------------- line above this line? and below for "peek promo
ripple" and "peek promo text"? Or was this style intentional?

[pedro (no code reviews), 2015/10/02 20:29:08]

It was intentional, supposed to be more subtle than the separator above, since
it's a sub section. But it looks inconsistent. Adding the line above the sub
sections. They are narrower than the main sections, so you can still visually
tell which one is which.

+    // -----------------------------------------------------------------
+    if (peek_promo_container_->parent() != layer_) {
+      layer_->AddChild(peek_promo_container_);
+    }
+
+    gfx::Size peek_promo_size(search_panel_width, search_peek_promo_height);
+    peek_promo_container_->SetBounds(peek_promo_size);
+    peek_promo_container_->SetPosition(gfx::PointF(0.f, 0.f));
+    peek_promo_container_->SetMasksToBounds(true);
+
+    // Apply a 25% blend based on the ripple opacity. The resulting color
+    // will be an interpolation of the background color of the Search Bar,
+    // and a lighter shade of the background color of the ripple.
+    peek_promo_container_->SetBackgroundColor(
+        color_utils::AlphaBlend(kPeekPromoRippleBackgroundColor,

[pedro (no code reviews), 2015/10/02 10:35:53]

Question to reviewers: should I be concerned about the cost of calling
AlphaBlend() on every frame? I could cache the blended value by comparing if
search_peek_promo_ripple_opacity (which drives the blend) has changed since the
last frame.

[David Trainor- moved to gerrit, 2015/10/02 20:49:20]

IIRC this isn't very expensive right?  It just normalizes/blends the 3 color
components?

[pedro (no code reviews), 2015/10/02 22:15:57]

Yeah, pretty much. Then it converts back to back to SkColor:
https://code.google.com/p/chromium/codesearch#chromium/src/ui/gfx/color_utils...

I will keep the code how it is then.

+                                kSearchBarBackgroundColor,
+                                63 * search_peek_promo_ripple_opacity));
+
+    // Peek Promo Ripple
+    // -----------------------------------------------------------------
+    gfx::Size peek_promo_ripple_size(
+        search_peek_promo_ripple_width, search_peek_promo_height);
+    gfx::Rect peek_promo_ripple_border(
+        peek_promo_ripple_resource->Border(peek_promo_ripple_size));
+
+    // Add padding so the ripple will occupy the whole width at 100%.
+    peek_promo_ripple_size.set_width(
+        peek_promo_ripple_size.width() + peek_promo_ripple_border.width());
+
+    float ripple_rotation = 0.f;
+    float ripple_left = 0.f;
+    if (is_rtl) {
+      // Rotate the ripple 180 degrees to make it point to the left side.
+      ripple_rotation = 180.f;
+      ripple_left = search_panel_width - peek_promo_ripple_size.width();
+    }
+
+    peek_promo_ripple_->SetUIResourceId(
+        peek_promo_ripple_resource->ui_resource->id());
+    peek_promo_ripple_->SetBorder(peek_promo_ripple_border);
+    peek_promo_ripple_->SetAperture(peek_promo_ripple_resource->aperture);
+    peek_promo_ripple_->SetBounds(peek_promo_ripple_size);
+    peek_promo_ripple_->SetPosition(gfx::PointF(ripple_left, 0.f));
+    peek_promo_ripple_->SetOpacity(search_peek_promo_ripple_opacity);
+
+    if (ripple_rotation != 0.f) {
+      // Apply rotation about the center of the resource.
+      float pivot_x = floor(peek_promo_ripple_size.width() / 2);
+      float pivot_y = floor(peek_promo_ripple_size.height() / 2);
+      gfx::PointF pivot_origin(pivot_x, pivot_y);
+      gfx::Transform transform;
+      transform.Translate(pivot_origin.x(), pivot_origin.y());
+      transform.RotateAboutZAxis(ripple_rotation);
+      transform.Translate(-pivot_origin.x(), -pivot_origin.y());
+      peek_promo_ripple_->SetTransform(transform);
+    }
+
+    // Peek Promo Text
+    // -----------------------------------------------------------------
+    if (search_peek_promo_resource) {
+      peek_promo_text_->SetUIResourceId(

[Theresa, 2015/10/02 17:34:45]

Does the "NEW" button and promo text get reversed in RTL? 

[pedro (no code reviews), 2015/10/02 20:29:09]

Yes.

+          search_peek_promo_resource->ui_resource->id());
+      peek_promo_text_->SetBounds(search_peek_promo_resource->size);
+      peek_promo_text_->SetPosition(
+          gfx::PointF(0.f, search_peek_promo_padding));
+      peek_promo_text_->SetOpacity(search_peek_promo_text_opacity);
+    }
+  } else {
+    // Peek Promo Container
+    if (peek_promo_container_.get() && peek_promo_container_->parent())
+      peek_promo_container_->RemoveFromParent();
+  }
+
+  // ---------------------------------------------------------------------------
   // Search Bar Background
   // ---------------------------------------------------------------------------
   gfx::Size background_size(search_panel_width, search_bar_height);
   search_bar_background_->SetBounds(background_size);
-  search_bar_background_->SetPosition(gfx::PointF(0.f, 0.f));
+  search_bar_background_->SetPosition(gfx::PointF(0.f, search_bar_top));
 
   // ---------------------------------------------------------------------------
   // Search Bar Text
@@ -124,6 +222,7 @@ void ContextualSearchLayer::SetProperties(
   if (search_context_resource) {
     // Centers the text vertically in the Search Bar.
     float search_bar_padding_top =
+        search_bar_top +
         search_bar_height / 2 -
         search_context_resource->size.height() / 2;
     search_context_->SetUIResourceId(
@@ -136,6 +235,7 @@ void ContextualSearchLayer::SetProperties(
   if (search_term_resource) {
     // Centers the text vertically in the Search Bar.
     float search_bar_padding_top =
+        search_bar_top +
         search_bar_height / 2 -
         search_term_resource->size.height() / 2;
     search_term_->SetUIResourceId(search_term_resource->ui_resource->id());
@@ -157,7 +257,7 @@ void ContextualSearchLayer::SetProperties(
   }
 
   // Centers the Search Provider Icon vertically in the Search Bar.
-  float search_provider_icon_top =
+  float search_provider_icon_top = search_bar_top +
       search_bar_height / 2 -
       search_provider_icon_resource->size.height() / 2;
 
@@ -185,7 +285,8 @@ void ContextualSearchLayer::SetProperties(
   }
 
   // Centers the Arrow Icon vertically in the Search Bar.
-  float arrow_icon_top = search_bar_height / 2 -
+  float arrow_icon_top = search_bar_top +
+      search_bar_height / 2 -
       arrow_icon_resource->size.height() / 2;
 
   arrow_icon_->SetUIResourceId(arrow_icon_resource->ui_resource->id());
@@ -225,6 +326,7 @@ void ContextualSearchLayer::SetProperties(
 
   // Centers the Close Icon vertically in the Search Bar.
   float close_icon_top =
+      search_bar_top +
       search_bar_height / 2 -
       close_icon_resource->size.height() / 2;
 
@@ -253,7 +355,7 @@ void ContextualSearchLayer::SetProperties(
       int search_promo_content_height = search_promo_resource->size.height();
       gfx::Size search_promo_size(search_panel_width, search_promo_height);
       search_promo_container_->SetBounds(search_promo_size);
-      search_promo_container_->SetPosition(gfx::PointF(0.f, search_bar_height));
+      search_promo_container_->SetPosition(gfx::PointF(0.f, search_bar_bottom));
       search_promo_container_->SetMasksToBounds(true);
 
       // Search Promo
@@ -278,7 +380,7 @@ void ContextualSearchLayer::SetProperties(
   // Search Content View
   // ---------------------------------------------------------------------------
   content_view_container_->SetPosition(
-      gfx::PointF(0.f, search_bar_height + search_promo_height));
+      gfx::PointF(0.f, search_bar_bottom + search_promo_height));
   if (content_view_core && content_view_core->GetLayer().get()) {
     scoped_refptr<cc::Layer> content_view_layer = content_view_core->GetLayer();
     if (content_view_layer->parent() != content_view_container_)
@@ -305,7 +407,7 @@ void ContextualSearchLayer::SetProperties(
       search_bar_shadow_->SetUIResourceId(
           search_bar_shadow_resource->ui_resource->id());
       search_bar_shadow_->SetBounds(shadow_size);
-      search_bar_shadow_->SetPosition(gfx::PointF(0.f, search_bar_height));
+      search_bar_shadow_->SetPosition(gfx::PointF(0.f, search_bar_bottom));
       search_bar_shadow_->SetOpacity(search_bar_shadow_opacity);
     }
   } else {
@@ -316,7 +418,8 @@ void ContextualSearchLayer::SetProperties(
   // ---------------------------------------------------------------------------
   // Search Panel.
   // ---------------------------------------------------------------------------
-  layer_->SetPosition(gfx::PointF(search_panel_x, search_panel_y));
+  layer_->SetPosition(
+      gfx::PointF(search_panel_x, search_panel_y - search_bar_top));
 
   // ---------------------------------------------------------------------------
   // Progress Bar
@@ -339,8 +442,10 @@ void ContextualSearchLayer::SetProperties(
     if (progress_bar_background_->parent() != layer_)
       layer_->AddChild(progress_bar_background_);
 
+    float progress_bar_y = search_bar_bottom - progress_bar_height;
     gfx::Size progress_bar_background_size(search_panel_width,
                                            progress_bar_height);
+
     progress_bar_background_->SetUIResourceId(
         progress_bar_background_resource->ui_resource->id());
     progress_bar_background_->SetBorder(
@@ -379,8 +484,10 @@ void ContextualSearchLayer::SetProperties(
   if (!should_render_progress_bar && search_bar_border_visible) {
     gfx::Size search_bar_border_size(search_panel_width,
                                      search_bar_border_height);
+    float border_y = search_bar_bottom - search_bar_border_height;
     search_bar_border_->SetBounds(search_bar_border_size);
-    search_bar_border_->SetPosition(gfx::PointF(0.f, search_bar_border_y));
+    search_bar_border_->SetPosition(
+        gfx::PointF(0.f, border_y));
     layer_->AddChild(search_bar_border_);
   } else if (search_bar_border_.get() && search_bar_border_->parent()) {
     search_bar_border_->RemoveFromParent();
@@ -418,7 +525,13 @@ ContextualSearchLayer::ContextualSearchLayer(
       search_promo_(
           cc::UIResourceLayer::Create(content::Compositor::LayerSettings())),
       search_promo_container_(
-          cc::SolidColorLayer::Create(content::Compositor::LayerSettings())) {
+          cc::SolidColorLayer::Create(content::Compositor::LayerSettings())),
+      peek_promo_container_(
+          cc::SolidColorLayer::Create(content::Compositor::LayerSettings())),
+      peek_promo_ripple_(
+          cc::NinePatchLayer::Create(content::Compositor::LayerSettings())),
+      peek_promo_text_(
+          cc::UIResourceLayer::Create(content::Compositor::LayerSettings())) {
   layer_->SetMasksToBounds(false);
   layer_->SetIsDrawable(true);
 
@@ -427,6 +540,15 @@ ContextualSearchLayer::ContextualSearchLayer(
   panel_shadow_->SetFillCenter(false);
   layer_->AddChild(panel_shadow_);
 
+  // Search Peek Promo
+  peek_promo_container_->SetIsDrawable(true);
+  peek_promo_container_->SetBackgroundColor(kSearchBarBackgroundColor);
+  peek_promo_ripple_->SetIsDrawable(true);
+  peek_promo_ripple_->SetFillCenter(true);
+  peek_promo_text_->SetIsDrawable(true);
+  peek_promo_container_->AddChild(peek_promo_ripple_);
+  peek_promo_container_->AddChild(peek_promo_text_);
+
   // Search Bar Background
   search_bar_background_->SetIsDrawable(true);
   search_bar_background_->SetBackgroundColor(kSearchBarBackgroundColor);