[Athena] Add status icons and system time to the centered home card

athena/home/athena_start_page_view.cc

Index: athena/home/athena_start_page_view.cc
diff --git a/athena/home/athena_start_page_view.cc b/athena/home/athena_start_page_view.cc
index b5b8df565ef346740e27453dc70f29fe5861710f..07d7a2d090f4b3a8c0033d5af8fc1cd2cfad9193 100644
--- a/athena/home/athena_start_page_view.cc
+++ b/athena/home/athena_start_page_view.cc
@@ -5,6 +5,7 @@
 #include "athena/home/athena_start_page_view.h"
 
 #include "athena/home/home_card_constants.h"
+#include "athena/system/public/system_ui.h"
 #include "base/bind.h"
 #include "base/strings/string_util.h"
 #include "third_party/skia/include/core/SkPaint.h"
@@ -155,7 +156,8 @@ namespace athena {
 const char AthenaStartPageView::kViewClassName[] = "AthenaStartPageView";
 
 AthenaStartPageView::LayoutData::LayoutData()
-    : logo_opacity(1.0f),
+    : top_view_opacity(1.0f),
+      logo_opacity(1.0f),
       background_opacity(1.0f) {
 }
 
@@ -171,6 +173,22 @@ AthenaStartPageView::AthenaStartPageView(
   background_->SetFillsBoundsOpaquely(false);
   AddChildView(background_);
 
+  time_view_ = SystemUI::Get()->CreateTimeView(SystemUI::COLOR_SCHEME_DARK);
+  time_view_->SetPaintToLayer(true);
+  // Set a background on the view because painting text on a transparent layer
+  // looks bad. |time_view_|'s background animating at a different rate than

[sadrul, 2014/09/02 15:11:14]

I think you can set some attrib on the Label so the text looks OK on a
transparent layer (iirc we use it for the ash-tray texts).

[pkotwicz, 2014/09/02 19:47:49]

Disabling subpixel rendering does the trick. Thanks for making me look.

+  // |background_| is not noticeable in practice.
+  time_view_->set_background(
+      views::Background::CreateSolidBackground(SK_ColorWHITE));
+  AddChildView(time_view_);
+
+  status_icon_view_ =
+      SystemUI::Get()->CreateStatusIconView(SystemUI::COLOR_SCHEME_DARK);
+  status_icon_view_->set_background(
+      views::Background::CreateSolidBackground(SK_ColorWHITE));
+  status_icon_view_->SetPaintToLayer(true);
+  AddChildView(status_icon_view_);
+
   logo_ = view_delegate->CreateStartPageWebView(
       gfx::Size(kWebViewWidth, kWebViewHeight));
   logo_->SetPaintToLayer(true);
@@ -234,6 +252,10 @@ void AthenaStartPageView::SetLayoutState(float layout_state) {
 }
 
 void AthenaStartPageView::SetLayoutStateWithAnimation(float layout_state) {
+  ui::ScopedLayerAnimationSettings time(
+      time_view_->layer()->GetAnimator());
+  ui::ScopedLayerAnimationSettings status_icon(
+      status_icon_view_->layer()->GetAnimator());
   ui::ScopedLayerAnimationSettings logo(logo_->layer()->GetAnimator());
   ui::ScopedLayerAnimationSettings search_box(
       search_box_container_->layer()->GetAnimator());
@@ -242,6 +264,8 @@ void AthenaStartPageView::SetLayoutStateWithAnimation(float layout_state) {
   ui::ScopedLayerAnimationSettings controls(
       control_icon_container_->layer()->GetAnimator());
 
+  time.SetTweenType(gfx::Tween::EASE_IN_OUT);
+  status_icon.SetTweenType(gfx::Tween::EASE_IN_OUT);
   logo.SetTweenType(gfx::Tween::EASE_IN_OUT);
   search_box.SetTweenType(gfx::Tween::EASE_IN_OUT);
   icons.SetTweenType(gfx::Tween::EASE_IN_OUT);
@@ -268,6 +292,7 @@ AthenaStartPageView::LayoutData AthenaStartPageView::CreateBottomBounds(
   state.search_box.set_x((width - state.search_box.width()) / 2);
   state.search_box.set_y((kHomeCardHeight - state.search_box.height()) / 2);
 
+  state.top_view_opacity = 0.0f;
   state.logo_opacity = 0.0f;
   state.background_opacity = 0.9f;
   return state;
@@ -289,6 +314,7 @@ AthenaStartPageView::LayoutData AthenaStartPageView::CreateCenteredBounds(
   state.controls.set_x(width / 2 + kIconMargin / 2 + kIconMargin % 2);
   state.controls.set_y(state.icons.y());
 
+  state.top_view_opacity = 1.0f;
   state.logo_opacity = 1.0f;
   state.background_opacity = 1.0f;
   return state;
@@ -364,6 +390,19 @@ void AthenaStartPageView::OnSearchResultLayoutAnimationCompleted(
 
 void AthenaStartPageView::Layout() {
   search_results_view_->SetVisible(false);
+
+  // The time goes in the top left corner.
+  time_view_->SetBoundsRect(gfx::Rect(time_view_->GetPreferredSize()));
+
+  // The status icons go in the top right corner.
+  gfx::Size status_icon_view_preferred_size =
+      status_icon_view_->GetPreferredSize();
+  status_icon_view_->SetBoundsRect(
+      gfx::Rect(width() - status_icon_view_preferred_size.width(),
+                0,
+                status_icon_view_preferred_size.width(),
+                status_icon_view_preferred_size.height()));
+
   gfx::Rect logo_bounds(x() + width() / 2 - kWebViewWidth / 2, y() + kTopMargin,
                         kWebViewWidth, kWebViewHeight);
   logo_->SetBoundsRect(logo_bounds);
@@ -371,6 +410,15 @@ void AthenaStartPageView::Layout() {
   LayoutData bottom_bounds = CreateBottomBounds(width());
   LayoutData centered_bounds = CreateCenteredBounds(width());
 
+  float top_view_opacity = gfx::Tween::FloatValueBetween(
+      gfx::Tween::CalculateValue(gfx::Tween::EASE_IN_2, layout_state_),
+      bottom_bounds.top_view_opacity, centered_bounds.top_view_opacity);
+  time_view_->layer()->SetOpacity(top_view_opacity);
+  time_view_->SetVisible(time_view_->layer()->GetTargetOpacity() != 0.0f);
+  status_icon_view_->layer()->SetOpacity(top_view_opacity);
+  status_icon_view_->SetVisible(
+      status_icon_view_->layer()->GetTargetOpacity() != 0.0f);
+
   logo_->layer()->SetOpacity(gfx::Tween::FloatValueBetween(
       gfx::Tween::CalculateValue(gfx::Tween::EASE_IN_2, layout_state_),
       bottom_bounds.logo_opacity, centered_bounds.logo_opacity));
@@ -395,6 +443,11 @@ bool AthenaStartPageView::OnKeyPressed(const ui::KeyEvent& key_event) {
       search_results_view_->OnKeyPressed(key_event);
 }
 
+void AthenaStartPageView::ChildPreferredSizeChanged(views::View* view) {
+  // Relayout when |status_icon_view_| changes its preferred size.
+  Layout();
+}
+
 void AthenaStartPageView::QueryChanged(app_list::SearchBoxView* sender) {
   delegate_->StartSearch();