Initial implementation of ColorChooser for Aura.

ui/views/color_chooser/color_chooser_view.cc

Index: ui/views/color_chooser/color_chooser_view.cc
diff --git a/ui/views/color_chooser/color_chooser_view.cc b/ui/views/color_chooser/color_chooser_view.cc
new file mode 100644
index 0000000000000000000000000000000000000000..7c55be81b1e516ee0dc4dd6b9b4876061b3293df
--- /dev/null
+++ b/ui/views/color_chooser/color_chooser_view.cc
@@ -0,0 +1,318 @@
+// 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 "ui/views/color_chooser/color_chooser_view.h"
+
+#include "base/bind.h"
+#include "base/logging.h"
+#include "base/message_loop.h"
+#include "base/string_number_conversions.h"
+#include "base/stringprintf.h"
+#include "base/utf_string_conversions.h"
+#include "ui/gfx/canvas.h"
+#include "ui/base/keycodes/keyboard_codes.h"
+#include "ui/views/color_chooser/color_chooser_listener.h"
+#include "ui/views/controls/textfield/textfield.h"
+#include "ui/views/controls/textfield/textfield_controller.h"
+#include "ui/views/events/event.h"
+#include "ui/views/layout/box_layout.h"
+#include "ui/views/widget/widget.h"
+
+namespace {
+const int kHueBarWidth = 20;

[Peter Kasting, 2012/06/18 21:24:03]

Nit Blank line above

[Jun Mukai, 2012/06/19 08:40:00]

Done.

+const int kSaturationValueSize = 200;
+const int kMarginWidth = 5;
+const int kSaturationValueIndicatorSize = 3;
+const int kHueIndicatorSize = 2;
+
+string16 GetColorText(SkColor color) {
+  return UTF8ToUTF16(base::StringPrintf("#%02x%02x%02x",

[Peter Kasting, 2012/06/18 21:24:03]

Nit: ASCIIToUTF16()

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+                                        SkColorGetR(color),
+                                        SkColorGetG(color),
+                                        SkColorGetB(color)));
+}
+
+bool GetColorFromText(const string16& text, SkColor* result) {
+  if (text.size() != 6 && !(text.size() == 7 && text[0] == '#'))
+    return false;
+
+  std::string input = UTF16ToUTF8((text.size() == 6) ? text : text.substr(1));
+  std::vector<uint8> hex;
+  if (!base::HexStringToBytes(input, &hex))
+    return false;
+
+  *result = SkColorSetRGB(hex[0], hex[1], hex[2]);
+  return true;
+}
+
+}  // namespace
+
+namespace views {
+
+class ColorChooserView::HueView : public View {
+ public:
+  explicit HueView(ColorChooserView* chooser_view);
+
+  void OnHueChanged(float hue);
+
+ private:
+  // View overrides:
+  virtual gfx::Size GetPreferredSize() OVERRIDE;
+  virtual void OnPaint(gfx::Canvas* canvas) OVERRIDE;
+  virtual bool OnMousePressed(const MouseEvent& event) OVERRIDE;
+  virtual bool OnMouseDragged(const MouseEvent& event) OVERRIDE;
+
+  ColorChooserView* chooser_view_;
+  int level_;
+
+  DISALLOW_COPY_AND_ASSIGN(HueView);
+};
+
+ColorChooserView::HueView::HueView(ColorChooserView* chooser_view)
+    : chooser_view_(chooser_view), level_(0) {

[Peter Kasting, 2012/06/18 21:24:03]

Nit: One initializer per line (2 places)

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  set_focusable(false);
+}
+
+void ColorChooserView::HueView::OnHueChanged(float hue) {
+  int level = hue * GetPreferredSize().height() / 360.0f;
+  if (level_ != level) {
+    level_ = level;
+    SchedulePaint();
+  }
+}
+
+gfx::Size ColorChooserView::HueView::GetPreferredSize() {
+  return gfx::Size(kHueBarWidth + kHueIndicatorSize * 4, kSaturationValueSize);

[Peter Kasting, 2012/06/18 21:24:03]

Nit: This * 4 is magic, what does it mean?

(I think it comes from kHueIndicatorSize actually being a radius, so there's 2
indicators * (2 radius values per indicator diameter); better naming of the
constants, e.g. kHueIndicatorRadiusPx, could help here, as could comments
somewhere that describe the control layout so we know there's an indicator on
each side of the bar.  Maybe using a constant for the diameter instead of the
radius?)

[Jun Mukai, 2012/06/19 08:40:01]

Changed as:
- use -Radius rather than Size, for the radius of indicator
- declare -Size = -Radius * 2
- put a comment of why we enlarge the width here

Please let me know if this still doesn't make sense.

+}
+
+void ColorChooserView::HueView::OnPaint(gfx::Canvas* canvas) {
+  SkScalar hsv[3];
+  // bightness/value are 100%

[Peter Kasting, 2012/06/18 21:24:03]

Nit: Comments should be complete sentences (initial capital, trailing period)

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  hsv[1] = 1.0;

[Peter Kasting, 2012/06/18 21:24:03]

Nit: Use SK_Scalar1 (2 places)

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  hsv[2] = 1.0;
+
+  for (int y = 0; y < height(); ++y) {
+    SkPaint paint;
+    if (y == level_) {
+      paint.setColor(SK_ColorBLACK);
+    } else {
+      hsv[0] = 360 * static_cast<float>(y) / height();

[Peter Kasting, 2012/06/18 21:24:03]

Nit: 360.0f * y / height()

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+      paint.setColor(SkHSVToColor(hsv));
+    }
+    canvas->DrawLine(gfx::Point(kHueIndicatorSize * 2, y),
+                     gfx::Point(width() - kHueIndicatorSize * 2, y),
+                     paint);
+  }
+
+  SkPaint circle_paint;
+  circle_paint.setColor(SK_ColorBLACK);
+  circle_paint.setStyle(SkPaint::kStroke_Style);
+  canvas->DrawCircle(gfx::Point(kHueIndicatorSize, level_),
+                     kHueIndicatorSize,
+                     circle_paint);
+  canvas->DrawCircle(gfx::Point(width() - kHueIndicatorSize, level_),
+                     kHueIndicatorSize,
+                     circle_paint);
+}
+
+bool ColorChooserView::HueView::OnMousePressed(const MouseEvent& event) {
+  level_ = std::max(0, std::min(height(), event.y()));
+  chooser_view_->OnHueChosen(360 * static_cast<float>(level_) / height());

[Peter Kasting, 2012/06/18 21:24:03]

Nit: 360.0f * level_ / height()

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  return true;
+}
+
+bool ColorChooserView::HueView::OnMouseDragged(const MouseEvent& event) {
+  return OnMousePressed(event);
+}
+
+class ColorChooserView::SaturationValueView : public View {
+ public:
+  explicit SaturationValueView(ColorChooserView* chooser_view);
+
+  void OnHueChanged(float hue);
+  void OnSaturationValueChanged(float saturation, float value);
+
+ private:
+  // View overrides:
+  virtual gfx::Size GetPreferredSize() OVERRIDE;
+  virtual void OnPaint(gfx::Canvas* canvas) OVERRIDE;
+  virtual bool OnMousePressed(const MouseEvent& event) OVERRIDE;
+  virtual bool OnMouseDragged(const MouseEvent& event) OVERRIDE;
+
+  ColorChooserView* chooser_view_;
+  float hue_;
+  gfx::Point marker_position_;
+
+  DISALLOW_COPY_AND_ASSIGN(SaturationValueView);
+};
+
+ColorChooserView::SaturationValueView::SaturationValueView(
+    ColorChooserView* chooser_view)
+    : chooser_view_(chooser_view), hue_(0) {
+  set_focusable(false);
+}
+
+void ColorChooserView::SaturationValueView::OnHueChanged(float hue) {
+  if (hue_ == hue)

[Peter Kasting, 2012/06/18 21:24:03]

Tiny nit: Early return or using {} are both fine, but make this function and
HueView::OnHueChanged() do the same thing.

[Jun Mukai, 2012/06/19 08:40:01]

Using if {} here.

+    return;
+
+  hue_ = hue;
+  SchedulePaint();
+}
+
+void ColorChooserView::SaturationValueView::OnSaturationValueChanged(
+    float saturation,
+    float value) {
+  gfx::Size size = GetPreferredSize();

[Peter Kasting, 2012/06/18 21:24:03]

Nit: const& ?  Or just use kSaturationValueSize directly in this function.

[Jun Mukai, 2012/06/19 08:40:01]

Used kSaturationValueSize

+  int x = saturation * size.width();
+  int y = (1.0 - value) * size.height();
+  if (gfx::Point(x, y) == marker_position_)
+    return;
+
+  marker_position_.set_x(x);
+  marker_position_.set_y(y);
+  SchedulePaint();
+  chooser_view_->OnSaturationValueChosen(saturation, value);
+}
+
+gfx::Size ColorChooserView::SaturationValueView::GetPreferredSize() {
+  return gfx::Size(kSaturationValueSize, kSaturationValueSize);
+}
+
+void ColorChooserView::SaturationValueView::OnPaint(gfx::Canvas* canvas) {
+  SkScalar hsv[3];
+  hsv[0] = hue_;
+  for (int x = 0; x < width(); ++x) {
+    hsv[1] = static_cast<float>(x) / width();
+    for (int y = 0; y < height(); ++y) {
+      hsv[2] = 1.0 - static_cast<float>(y) / height();
+      SkPaint paint;
+      paint.setColor(SkHSVToColor(255, hsv));
+      canvas->DrawPoint(gfx::Point(x, y), paint);
+    }
+  }
+
+  SkPaint circle_paint;
+  // The background is very dark at the bottom of the view.  Use white

[Peter Kasting, 2012/06/18 21:24:03]

Nit: "Use a white"

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  // marker in that case.
+  circle_paint.setColor(
+      (marker_position_.y() > width() * 3 / 4) ? SK_ColorWHITE : SK_ColorBLACK);
+  circle_paint.setStyle(SkPaint::kStroke_Style);
+  canvas->DrawCircle(

[Peter Kasting, 2012/06/18 21:24:03]

Nit: Preferred linebreaking:

  canvas->DrawCircle(marker_position_, kSaturationValueIndicatorSize,
                     circle_paint);

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+      marker_position_, kSaturationValueIndicatorSize, circle_paint);
+}
+
+bool ColorChooserView::SaturationValueView::OnMousePressed(
+    const MouseEvent& event) {
+  float saturation = static_cast<float>(event.x()) / width();
+  float value = 1.0 - static_cast<float>(event.y()) / height();
+  saturation = std::max(0.0f, std::min(1.0f, saturation));
+  value = std::max(0.0f, std::min(1.0f, value));
+  OnSaturationValueChanged(saturation, value);
+  return true;
+}
+
+bool ColorChooserView::SaturationValueView::OnMouseDragged(
+    const MouseEvent& event) {
+  return OnMousePressed(event);
+}
+
+
+ColorChooserView::ColorChooserView(ColorChooserListener* listener,
+                                   SkColor initial_color)
+    : listener_(listener) {
+  DCHECK(listener_);
+
+  set_focusable(false);
+  set_background(Background::CreateSolidBackground(SK_ColorLTGRAY));
+  SetLayoutManager(new BoxLayout(
+      BoxLayout::kVertical, kMarginWidth, kMarginWidth, kMarginWidth));
+
+  View* container = new View();
+  container->SetLayoutManager(
+      new BoxLayout(BoxLayout::kHorizontal, 0, 0, kMarginWidth));

[Peter Kasting, 2012/06/18 21:24:03]

Nit: See preferred linebreaking above

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+  saturation_value_ = new SaturationValueView(this);
+  container->AddChildView(saturation_value_);
+  hue_ = new HueView(this);
+  container->AddChildView(hue_);
+  AddChildView(container);
+
+  textfield_ = new Textfield();
+  textfield_->SetController(this);
+  AddChildView(textfield_);
+
+  OnColorChanged(initial_color);
+  MessageLoopForUI::current()->PostTask(
+      FROM_HERE,

[Peter Kasting, 2012/06/18 21:24:03]

Nit: Can go on prior line

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+      base::Bind(&View::RequestFocus, base::Unretained(textfield_)));
+}
+
+ColorChooserView::~ColorChooserView() {
+}
+
+void ColorChooserView::OnOwningWindowClosed() {
+  listener_ = NULL;

[Ben Goodger (Google), 2012/06/18 17:00:46]

is it valid for this window to still exist with the window that opened it
closed? seems like this window should be destroyed when the window that opened
it closes.

[Jun Mukai, 2012/06/19 08:40:01]

When the owning window is closed, the color chooser is closed automatically
because of it's window-modal dialog.
In that case, OnOwningWindowClosed() is called before WindowClosing(), to guard
calling OnColorChooserDialogClosed().

+}
+
+void ColorChooserView::OnColorChanged(SkColor color) {
+  SkColorToHSV(color, hsv_);
+  hue_->OnHueChanged(hsv_[0]);
+  saturation_value_->OnHueChanged(hsv_[0]);
+  saturation_value_->OnSaturationValueChanged(hsv_[1], hsv_[2]);
+  textfield_->SetText(GetColorText(color));
+}
+
+void ColorChooserView::OnHueChosen(float hue) {
+  hsv_[0] = hue;
+  SkColor color = SkHSVToColor(255, hsv_);
+  listener_->OnColorChosen(color);
+  saturation_value_->OnHueChanged(hue);
+  textfield_->SetText(GetColorText(color));
+}
+
+void ColorChooserView::OnSaturationValueChosen(float saturation, float value) {
+  hsv_[1] = saturation;
+  hsv_[2] = value;
+  SkColor color = SkHSVToColor(255, hsv_);
+  listener_->OnColorChosen(color);
+  textfield_->SetText(GetColorText(color));
+}
+
+ui::ModalType ColorChooserView::GetModalType() const {
+  return ui::MODAL_TYPE_WINDOW;
+}
+
+void ColorChooserView::WindowClosing() {
+  if (listener_)
+    listener_->OnColorChooserDialogClosed();
+}
+
+View* ColorChooserView::GetContentsView() {
+  return this;
+}
+
+void ColorChooserView::ContentsChanged(Textfield* sender,
+                                       const string16& new_contents) {
+  SkColor color;
+  if (GetColorFromText(new_contents, &color)) {
+    SkColorToHSV(color, hsv_);
+    listener_->OnColorChosen(color);
+    hue_->OnHueChanged(hsv_[0]);
+    saturation_value_->OnHueChanged(hsv_[0]);
+    saturation_value_->OnSaturationValueChanged(hsv_[1], hsv_[2]);
+  }
+}
+
+bool ColorChooserView::HandleKeyEvent(Textfield* sender,
+                                      const KeyEvent& key_event) {
+  if (key_event.key_code() == ui::VKEY_RETURN ||
+      key_event.key_code() == ui::VKEY_ESCAPE) {

[Peter Kasting, 2012/06/18 21:24:03]

Nit: Can avoid {} if you reverse conditional and early-return

[Jun Mukai, 2012/06/19 08:40:01]

Done.

+    GetWidget()->Close();
+    return true;
+  }
+
+  return false;
+}
+
+}  // namespace views