[cros] WebUI user image screen with photo taking implemented as a dialog.

R=altimofeev@chromium.org,nkostylev@chromium.org
BUG=chromium-os:15924
TEST=Login as a new user with WebUI login/oobe, verify that the image screen functionality is the same as in views version


Review URL: http://codereview.chromium.org/7484060

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@93985 0039d316-1c4b-4281-b951-d872f2087c98

15 files changed, 521 insertions, 41 deletions

diff --git a/chrome/browser/chromeos/login/user_image_screen.cc b/chrome/browser/chromeos/login/user_image_screen.cc
index e924abc..085cbc5 100644
--- a/chrome/browser/chromeos/login/user_image_screen.cc
+++ b/chrome/browser/chromeos/login/user_image_screen.cc
@@ -56,8 +56,14 @@ void UserImageScreen::Show() {
 
   UserManager* user_manager = UserManager::Get();
   std::string logged_in_user = user_manager->logged_in_user().email();
-  actor_->SelectImage(
-      user_manager->GetUserDefaultImageIndex(logged_in_user));
+  int selected_image_index =
+      user_manager->GetUserDefaultImageIndex(logged_in_user);
+  // The image must have been assigned by UserManager on new user login but
+  // under some circumstances (i.e. the data is not written to Local State
+  // or the file was corrupt) -1 could still be returned.
+  if (selected_image_index == -1)
+    selected_image_index = 0;
+  actor_->SelectImage(selected_image_index);
 }
 
 void UserImageScreen::Hide() {
diff --git a/chrome/browser/chromeos/options/take_photo_dialog.cc b/chrome/browser/chromeos/options/take_photo_dialog.cc
index 3be00bc..4c8cd1a 100644
--- a/chrome/browser/chromeos/options/take_photo_dialog.cc
+++ b/chrome/browser/chromeos/options/take_photo_dialog.cc
@@ -7,7 +7,6 @@
 #include "base/string_util.h"
 #include "base/utf_string_conversions.h"
 #include "chrome/browser/chromeos/login/helper.h"
-#include "chrome/browser/chromeos/login/user_manager.h"
 #include "chrome/common/chrome_notification_types.h"
 #include "content/common/notification_service.h"
 #include "grit/chromium_strings.h"
@@ -27,9 +26,10 @@ const int kFrameHeight = 480;
 
 }  // namespace
 
-TakePhotoDialog::TakePhotoDialog()
+TakePhotoDialog::TakePhotoDialog(Delegate* delegate)
     : take_photo_view_(NULL),
-      camera_controller_(this) {
+      camera_controller_(this),
+      delegate_(delegate) {
   camera_controller_.set_frame_width(kFrameWidth);
   camera_controller_.set_frame_height(kFrameHeight);
   registrar_.Add(
@@ -38,6 +38,9 @@ TakePhotoDialog::TakePhotoDialog()
       NotificationService::AllSources());
 }
 
+TakePhotoDialog::~TakePhotoDialog() {
+}
+
 bool TakePhotoDialog::IsDialogButtonEnabled(
     MessageBoxFlags::DialogButton button) const {
   if (button == MessageBoxFlags::DIALOGBUTTON_CANCEL)
@@ -56,15 +59,8 @@ bool TakePhotoDialog::Cancel() {
 bool TakePhotoDialog::Accept() {
   camera_controller_.Stop();
 
-  UserManager* user_manager = UserManager::Get();
-  DCHECK(user_manager);
-
-  const UserManager::User& user = user_manager->logged_in_user();
-  DCHECK(!user.email().empty());
-
-  const SkBitmap& image = take_photo_view_->GetImage();
-  user_manager->SetLoggedInUserImage(image);
-  user_manager->SaveUserImage(user.email(), image);
+  if (delegate_)
+    delegate_->OnPhotoAccepted(take_photo_view_->GetImage());
   return true;
 }
 
diff --git a/chrome/browser/chromeos/options/take_photo_dialog.h b/chrome/browser/chromeos/options/take_photo_dialog.h
index 9cecd71..c6956db 100644
--- a/chrome/browser/chromeos/options/take_photo_dialog.h
+++ b/chrome/browser/chromeos/options/take_photo_dialog.h
@@ -25,7 +25,16 @@ class TakePhotoDialog : public views::DialogDelegateView,
                         public CameraController::Delegate,
                         public NotificationObserver {
  public:
-  TakePhotoDialog();
+  class Delegate {
+   public:
+    virtual ~Delegate() {}
+
+    // Called when user accepts the photo.
+    virtual void OnPhotoAccepted(const SkBitmap& photo) = 0;
+  };
+
+  explicit TakePhotoDialog(Delegate* delegate);
+  virtual ~TakePhotoDialog();
 
   // views::DialogDelegate overrides.
   virtual bool IsDialogButtonEnabled(
@@ -69,6 +78,8 @@ class TakePhotoDialog : public views::DialogDelegateView,
 
   NotificationRegistrar registrar_;
 
+  Delegate* delegate_;
+
   DISALLOW_COPY_AND_ASSIGN(TakePhotoDialog);
 };
 
diff --git a/chrome/browser/resources/chromeos/login/oobe.css b/chrome/browser/resources/chromeos/login/oobe.css
index 1b5abf1..0e47b19 100644
--- a/chrome/browser/resources/chromeos/login/oobe.css
+++ b/chrome/browser/resources/chromeos/login/oobe.css
@@ -166,6 +166,32 @@ hr.bottomshadow {
   margin-top: 20px;
 }
 
+#user-image-list {
+  display: inline-block;
+  width: 360px;
+}
+
+#user-image-list img {
+  border-radius: 4px;
+  height: 50px;
+  margin: 0 10px 8px 0;
+  padding: 4px;
+  width: 50px;
+}
+
+#user-image-list .user-image-selected {
+  border: 2px solid rgb(0, 102, 204);
+  padding: 2px;
+}
+
+#user-image-preview {
+  border-radius: 4px;
+  float: right;
+  height: 250px;
+  margin: 4px;
+  width: 250px;
+}
+
 #footer button {
   display: none;
 }
@@ -173,7 +199,8 @@ hr.bottomshadow {
 #oobe.connect #continue-button,
 #oobe.eula #back-button,
 #oobe.eula #accept-button,
-#oobe.signin #signin-button {
+#oobe.signin #signin-button,
+#oobe.user-image #ok-button {
   display: inline-block;
 }
 
@@ -181,7 +208,7 @@ hr.bottomshadow {
 #oobe.eula #eula-dot,
 #oobe.signin #signin-dot,
 #oobe.enrollment #signin-dot,
-#oobe.photo #photo-dot {
+#oobe.user-image #photo-dot {
   opacity: 0.4;
 }
 
diff --git a/chrome/browser/resources/chromeos/login/oobe.html b/chrome/browser/resources/chromeos/login/oobe.html
index 4c4f7c4..b50cb1c 100644
--- a/chrome/browser/resources/chromeos/login/oobe.html
+++ b/chrome/browser/resources/chromeos/login/oobe.html
@@ -18,6 +18,7 @@
 <script src="oobe_screen_eula.js"></script>
 <script src="oobe_screen_network.js"></script>
 <script src="oobe_screen_update.js"></script>
+<script src="oobe_screen_user_image.js"></script>
 <script src="oobe_screen_enrollment.js"></script>
 <script src="screen_account_picker.js"></script>
 <script src="screen_gaia_signin.js"></script>
@@ -45,6 +46,7 @@
         <include src="oobe_screen_eula.html">
         <include src="oobe_screen_update.html">
         <include src="oobe_screen_enrollment.html">
+        <include src="oobe_screen_user_image.html">
         <include src="screen_signin.html">
         <include src="screen_gaia_signin.html">
         <include src="screen_account_picker.html">
diff --git a/chrome/browser/resources/chromeos/login/oobe.js b/chrome/browser/resources/chromeos/login/oobe.js
index 0316761..dd44210 100644
--- a/chrome/browser/resources/chromeos/login/oobe.js
+++ b/chrome/browser/resources/chromeos/login/oobe.js
@@ -230,6 +230,7 @@ cr.define('cr.ui', function() {
       login.SigninScreen.register();
     else
       login.GaiaSigninScreen.register();
+    oobe.UserImageScreen.register();
 
     $('security-link').addEventListener('click', function(event) {
       chrome.send('eulaOnTpmPopupOpened', []);
diff --git a/chrome/browser/resources/chromeos/login/oobe_screen_user_image.html b/chrome/browser/resources/chromeos/login/oobe_screen_user_image.html
new file mode 100644
index 0000000..6d4bd72
--- /dev/null
+++ b/chrome/browser/resources/chromeos/login/oobe_screen_user_image.html
@@ -0,0 +1,10 @@
+<div class="step right hidden" id="user-image">
+  <div id="user-image-screen-curtain">
+    <p i18n-content="userImageScreenDescription"></p>
+  </div>
+  <div id="user-image-screen-main">
+    <div id="user-image-list">
+    </div>
+    <img id="user-image-preview" src="chrome://theme/IDR_LOGIN_DEFAULT_USER">
+  </div>
+</div>
diff --git a/chrome/browser/resources/chromeos/login/oobe_screen_user_image.js b/chrome/browser/resources/chromeos/login/oobe_screen_user_image.js
new file mode 100644
index 0000000..15d4a37
--- /dev/null
+++ b/chrome/browser/resources/chromeos/login/oobe_screen_user_image.js
@@ -0,0 +1,142 @@
+// Copyright (c) 2011 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.
+
+/**
+ * @fileoverview Oobe user image screen implementation.
+ */
+
+cr.define('oobe', function() {
+  /**
+   * Creates a new oobe screen div.
+   * @constructor
+   * @extends {HTMLDivElement}
+   */
+  var UserImageScreen = cr.ui.define('div');
+
+  /**
+   * Registers with Oobe.
+   */
+  UserImageScreen.register = function() {
+    var screen = $('user-image');
+    UserImageScreen.decorate(screen);
+    Oobe.getInstance().registerScreen(screen);
+    UserImageScreen.addUserImage(
+        'chrome://theme/IDR_BUTTON_USER_IMAGE_TAKE_PHOTO',
+        UserImageScreen.handleTakePhoto);
+  };
+
+  UserImageScreen.prototype = {
+    __proto__: HTMLDivElement.prototype,
+
+    /**
+     * Currently selected user image index (take photo button is with zero
+     * index).
+     * @type {number}
+     */
+    selectedUserImage_: -1,
+
+    /** @inheritDoc */
+    decorate: function() {
+    },
+
+    /**
+     * Header text of the screen.
+     * @type {string}
+     */
+    get header() {
+      return localStrings.getString('userImageScreenTitle');
+    },
+
+    /**
+     * Buttons in oobe wizard's button strip.
+     * @type {array} Array of Buttons.
+     */
+    get buttons() {
+      var okButton = this.ownerDocument.createElement('button');
+      okButton.id = 'ok-button';
+      okButton.textContent = localStrings.getString('okButtonText');
+      okButton.addEventListener('click', function(e) {
+        chrome.send('onUserImageAccepted');
+      });
+      return [ okButton ];
+    }
+
+  };
+
+  /**
+   * Sets user photo as an image for the take photo button and as preview.
+   * @param {string} photoUrl Image encoded as data url.
+   */
+  UserImageScreen.setUserPhoto = function(photoUrl) {
+    var takePhotoButton = $('user-image-list').children[0];
+    takePhotoButton.src = photoUrl;
+    UserImageScreen.selectUserImage(0);
+  };
+
+  /**
+   * Handler for when the user clicks on "Take photo" button.
+   * @param {Event} e Click Event.
+   */
+  UserImageScreen.handleTakePhoto = function(e) {
+    chrome.send('takePhoto');
+  };
+
+  /**
+   * Handler for when the user clicks on any available user image.
+   * @param {Event} e Click Event.
+   */
+  UserImageScreen.handleImageClick = function(e) {
+    chrome.send('selectImage', [e.target.src]);
+  };
+
+  /**
+   * Appends new image to the end of the image list.
+   * @param {string} src A url for the user image.
+   * @param {function} clickHandler A handler for click on image.
+   */
+  UserImageScreen.addUserImage = function(src, clickHandler) {
+    var imageElement = document.createElement('img');
+    imageElement.src = src;
+    imageElement.addEventListener('click',
+                                  clickHandler,
+                                  false);
+    $('user-image-list').appendChild(imageElement);
+  };
+
+  /**
+   * Appends received images to the list.
+   * @param {List} images A list of urls to user images.
+   */
+  UserImageScreen.addUserImages = function(images) {
+    for (var i = 0; i < images.length; i++) {
+      var imageUrl = images[i];
+      UserImageScreen.addUserImage(
+          imageUrl,
+          UserImageScreen.handleImageClick);
+    }
+  };
+
+  /**
+   * Selects the specified user image and shows it in preview.
+   * @param {number} index The index of the image to select.
+   */
+  UserImageScreen.selectUserImage = function(index) {
+    var userImageList = $('user-image-list');
+    var userImageScreen = $('user-image');
+    var prevIndex = userImageScreen.selectedUserImage_;
+    if (prevIndex != -1) {
+      userImageList.children[prevIndex].classList.remove('user-image-selected');
+    }
+    if (index != -1) {
+      var selectedImage = userImageList.children[index];
+      selectedImage.classList.add('user-image-selected');
+      $('user-image-preview').src = selectedImage.src;
+    }
+    userImageScreen.selectedUserImage_ = index;
+  };
+
+  return {
+    UserImageScreen: UserImageScreen
+  };
+});
diff --git a/chrome/browser/ui/webui/chromeos/login/oobe_ui.cc b/chrome/browser/ui/webui/chromeos/login/oobe_ui.cc
index 634c17d..e225c4d 100644
--- a/chrome/browser/ui/webui/chromeos/login/oobe_ui.cc
+++ b/chrome/browser/ui/webui/chromeos/login/oobe_ui.cc
@@ -21,6 +21,7 @@
 #include "chrome/browser/ui/webui/chromeos/login/network_screen_handler.h"
 #include "chrome/browser/ui/webui/chromeos/login/signin_screen_handler.h"
 #include "chrome/browser/ui/webui/chromeos/login/update_screen_handler.h"
+#include "chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.h"
 #include "chrome/browser/ui/webui/options/chromeos/user_image_source.h"
 #include "chrome/browser/ui/webui/theme_source.h"
 #include "chrome/common/jstemplate_builder.h"
@@ -190,19 +191,20 @@ OobeUI::OobeUI(TabContents* contents)
       update_screen_actor_(NULL),
       network_screen_actor_(NULL),
       eula_screen_actor_(NULL),
-      signin_screen_handler_(NULL) {
+      signin_screen_handler_(NULL),
+      user_image_screen_actor_(NULL) {
   core_handler_ = new CoreOobeHandler(this);
   AddScreenHandler(core_handler_);
 
-  NetworkScreenHandler* network_screen_handler = new NetworkScreenHandler;
+  NetworkScreenHandler* network_screen_handler = new NetworkScreenHandler();
   network_screen_actor_ = network_screen_handler;
   AddScreenHandler(network_screen_handler);
 
-  EulaScreenHandler* eula_screen_handler = new EulaScreenHandler;
+  EulaScreenHandler* eula_screen_handler = new EulaScreenHandler();
   eula_screen_actor_ = eula_screen_handler;
   AddScreenHandler(eula_screen_handler);
 
-  UpdateScreenHandler* update_screen_handler = new UpdateScreenHandler;
+  UpdateScreenHandler* update_screen_handler = new UpdateScreenHandler();
   update_screen_actor_ = update_screen_handler;
   AddScreenHandler(update_screen_handler);
 
@@ -211,10 +213,15 @@ OobeUI::OobeUI(TabContents* contents)
   enterprise_enrollment_screen_actor_ = enterprise_enrollment_screen_handler;
   AddScreenHandler(enterprise_enrollment_screen_handler);
 
+  UserImageScreenHandler* user_image_screen_handler =
+      new UserImageScreenHandler();
+  user_image_screen_actor_ = user_image_screen_handler;
+  AddScreenHandler(user_image_screen_handler);
+
   signin_screen_handler_ = new SigninScreenHandler;
   AddScreenHandler(signin_screen_handler_);
 
-  DictionaryValue* localized_strings = new DictionaryValue;
+  DictionaryValue* localized_strings = new DictionaryValue();
   GetLocalizedStrings(localized_strings);
 
   // Set up the chrome://theme/ source, for Chrome logo.
@@ -261,8 +268,7 @@ EnterpriseEnrollmentScreenActor* OobeUI::
 }
 
 UserImageScreenActor* OobeUI::GetUserImageScreenActor() {
-  NOTIMPLEMENTED();
-  return NULL;
+  return user_image_screen_actor_;
 }
 
 ViewScreenDelegate* OobeUI::GetRegistrationScreenActor() {
diff --git a/chrome/browser/ui/webui/chromeos/login/oobe_ui.h b/chrome/browser/ui/webui/chromeos/login/oobe_ui.h
index 6732b25..2f9a96f 100644
--- a/chrome/browser/ui/webui/chromeos/login/oobe_ui.h
+++ b/chrome/browser/ui/webui/chromeos/login/oobe_ui.h
@@ -68,6 +68,7 @@ class OobeUI : public OobeDisplay,
   // Reference to SigninScreenHandler that handles sign-in screen requrests and
   // forward calls from native code to JS side.
   SigninScreenHandler* signin_screen_handler_;
+  UserImageScreenActor* user_image_screen_actor_;
 
   DISALLOW_COPY_AND_ASSIGN(OobeUI);
 };
diff --git a/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.cc b/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.cc
new file mode 100644
index 0000000..e6c1ca2
--- /dev/null
+++ b/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.cc
@@ -0,0 +1,173 @@
+// Copyright (c) 2011 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/webui/chromeos/login/user_image_screen_handler.h"
+
+#include "base/callback.h"
+#include "base/logging.h"
+#include "base/values.h"
+#include "chrome/browser/chromeos/login/default_user_images.h"
+#include "chrome/browser/chromeos/login/user_manager.h"
+#include "chrome/browser/chromeos/options/take_photo_dialog.h"
+#include "chrome/browser/ui/browser_list.h"
+#include "chrome/browser/ui/browser_window.h"
+#include "chrome/browser/ui/views/window.h"
+#include "chrome/browser/ui/webui/web_ui_util.h"
+#include "grit/generated_resources.h"
+#include "ui/base/l10n/l10n_util.h"
+#include "views/widget/widget.h"
+
+namespace {
+
+// UserImage screen ID.
+const char kUserImageScreen[] = "user-image";
+
+}  // namespace
+
+namespace chromeos {
+
+UserImageScreenHandler::UserImageScreenHandler()
+    : screen_(NULL),
+      show_on_init_(false),
+      selected_image_(-1) {
+}
+
+UserImageScreenHandler::~UserImageScreenHandler() {
+}
+
+void UserImageScreenHandler::GetLocalizedStrings(
+    DictionaryValue *localized_strings) {
+  localized_strings->SetString("userImageScreenTitle",
+      l10n_util::GetStringUTF16(IDS_OPTIONS_CHANGE_PICTURE_DIALOG_TITLE));
+  localized_strings->SetString("userImageScreenDescription",
+      l10n_util::GetStringUTF16(IDS_OPTIONS_CHANGE_PICTURE_DIALOG_TEXT));
+  localized_strings->SetString("takePhoto",
+      l10n_util::GetStringUTF16(IDS_OPTIONS_CHANGE_PICTURE_TAKE_PHOTO));
+  localized_strings->SetString("okButtonText",
+      l10n_util::GetStringUTF16(IDS_OK));
+}
+
+void UserImageScreenHandler::Initialize() {
+  ListValue image_urls;
+  for (int i = 0; i < kDefaultImagesCount; ++i) {
+    image_urls.Append(new StringValue(GetDefaultImageUrl(i)));
+  }
+  web_ui_->CallJavascriptFunction("oobe.UserImageScreen.addUserImages",
+                                  image_urls);
+
+  if (selected_image_ != -1)
+    SelectImage(selected_image_);
+
+  if (show_on_init_) {
+    Show();
+    show_on_init_ = false;
+  }
+}
+
+void UserImageScreenHandler::SetDelegate(
+    UserImageScreenActor::Delegate* screen) {
+  screen_ = screen;
+}
+
+void UserImageScreenHandler::Show() {
+  if (!page_is_ready()) {
+    show_on_init_ = true;
+    return;
+  }
+  ShowScreen(kUserImageScreen, NULL);
+}
+
+void UserImageScreenHandler::Hide() {
+}
+
+void UserImageScreenHandler::PrepareToShow() {
+}
+
+void UserImageScreenHandler::SelectImage(int index) {
+  selected_image_ = index;
+  if (page_is_ready()) {
+    // Skip Take Photo button.
+    FundamentalValue index_value(index + 1);
+    web_ui_->CallJavascriptFunction(
+        "oobe.UserImageScreen.selectUserImage",
+        index_value);
+  }
+}
+
+void UserImageScreenHandler::UpdateVideoFrame(const SkBitmap& frame) {
+}
+
+void UserImageScreenHandler::ShowCameraError() {
+}
+
+void UserImageScreenHandler::ShowCameraInitializing() {
+}
+
+bool UserImageScreenHandler::IsCapturing() const {
+  return false;
+}
+
+void UserImageScreenHandler::RegisterMessages() {
+  web_ui_->RegisterMessageCallback(
+      "takePhoto",
+      NewCallback(this, &UserImageScreenHandler::HandleTakePhoto));
+  web_ui_->RegisterMessageCallback(
+      "selectImage",
+      NewCallback(this, &UserImageScreenHandler::HandleSelectImage));
+  web_ui_->RegisterMessageCallback(
+      "onUserImageAccepted",
+      NewCallback(this, &UserImageScreenHandler::HandleImageAccepted));
+}
+
+void UserImageScreenHandler::OnPhotoAccepted(const SkBitmap& photo) {
+  user_photo_ = photo;
+  StringValue data_url(web_ui_util::GetImageDataUrl(user_photo_));
+  web_ui_->CallJavascriptFunction("oobe.UserImageScreen.setUserPhoto",
+                                  data_url);
+  selected_image_ = -1;
+}
+
+void UserImageScreenHandler::HandleTakePhoto(const base::ListValue* args) {
+  DCHECK(args && args->empty());
+  TakePhotoDialog* take_photo_dialog = new TakePhotoDialog(this);
+  views::Widget* window = browser::CreateViewsWindow(
+      GetBrowserWindow(),
+      gfx::Rect(),
+      take_photo_dialog);
+  window->SetAlwaysOnTop(true);
+  window->Show();
+}
+
+void UserImageScreenHandler::HandleSelectImage(const base::ListValue* args) {
+  std::string image_url;
+  if (!args ||
+      args->GetSize() != 1 ||
+      !args->GetString(0, &image_url)) {
+    NOTREACHED();
+    return;
+  }
+  int user_image_index = -1;
+  if (!IsDefaultImageUrl(image_url, &user_image_index))
+    return;
+  SelectImage(user_image_index);
+}
+
+void UserImageScreenHandler::HandleImageAccepted(const base::ListValue* args) {
+  DCHECK(args && args->empty());
+  if (!screen_)
+    return;
+  if (selected_image_ == -1)
+    screen_->OnPhotoTaken(user_photo_);
+  else
+    screen_->OnDefaultImageSelected(selected_image_);
+}
+
+gfx::NativeWindow UserImageScreenHandler::GetBrowserWindow() const {
+  Browser* browser = BrowserList::FindBrowserWithProfile(web_ui_->GetProfile());
+  if (!browser)
+    return NULL;
+  return browser->window()->GetNativeHandle();
+}
+
+}  // namespace chromeos
diff --git a/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.h b/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.h
new file mode 100644
index 0000000..39ac8cd
--- /dev/null
+++ b/chrome/browser/ui/webui/chromeos/login/user_image_screen_handler.h
@@ -0,0 +1,82 @@
+// Copyright (c) 2011 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.
+
+#ifndef CHROME_BROWSER_UI_WEBUI_CHROMEOS_LOGIN_USER_IMAGE_SCREEN_HANDLER_H_
+#define CHROME_BROWSER_UI_WEBUI_CHROMEOS_LOGIN_USER_IMAGE_SCREEN_HANDLER_H_
+
+#include "chrome/browser/chromeos/login/user_image_screen_actor.h"
+#include "chrome/browser/chromeos/options/take_photo_dialog.h"
+#include "chrome/browser/ui/webui/chromeos/login/base_screen_handler.h"
+#include "chrome/browser/ui/webui/chromeos/login/oobe_ui.h"
+#include "third_party/skia/include/core/SkBitmap.h"
+#include "ui/gfx/native_widget_types.h"
+
+namespace base {
+class ListValue;
+}  // namespace base
+
+namespace chromeos {
+
+// WebUI implementation of UserImageScreenActor. It is used to interact
+// with JS page part allowing user to select avatar.
+class UserImageScreenHandler : public UserImageScreenActor,
+                               public BaseScreenHandler,
+                               public TakePhotoDialog::Delegate {
+ public:
+  UserImageScreenHandler();
+  virtual ~UserImageScreenHandler();
+
+  // BaseScreenHandler implementation:
+  virtual void GetLocalizedStrings(
+      base::DictionaryValue* localized_strings) OVERRIDE;
+  virtual void Initialize() OVERRIDE;
+
+  // UserImageScreenActor implementation:
+  virtual void SetDelegate(
+      UserImageScreenActor::Delegate* screen) OVERRIDE;
+  virtual void Show() OVERRIDE;
+  virtual void Hide() OVERRIDE;
+  virtual void PrepareToShow() OVERRIDE;
+  virtual void SelectImage(int index) OVERRIDE;
+  virtual void UpdateVideoFrame(const SkBitmap& frame) OVERRIDE;
+  virtual void ShowCameraError() OVERRIDE;
+  virtual void ShowCameraInitializing() OVERRIDE;
+  virtual bool IsCapturing() const OVERRIDE;
+
+  // WebUIMessageHandler implementation:
+  virtual void RegisterMessages() OVERRIDE;
+
+  // TakePhotoDialog::Delegate implementation.
+  virtual void OnPhotoAccepted(const SkBitmap& photo) OVERRIDE;
+
+ private:
+  // Opens the camera capture dialog.
+  void HandleTakePhoto(const base::ListValue* args);
+
+  // Handles clicking on default user image.
+  void HandleSelectImage(const base::ListValue* args);
+
+  // Called when user accept the image closing the screen.
+  void HandleImageAccepted(const base::ListValue* args);
+
+  // Returns handle to browser window or NULL if it can't be found.
+  gfx::NativeWindow GetBrowserWindow() const;
+
+  UserImageScreenActor::Delegate* screen_;
+
+  // Keeps whether screen should be shown right after initialization.
+  bool show_on_init_;
+
+  // Index of the selected default user image. -1 if the photo is taken.
+  int selected_image_;
+
+  // Last user photo, if taken.
+  SkBitmap user_photo_;
+
+  DISALLOW_COPY_AND_ASSIGN(UserImageScreenHandler);
+};
+
+}  // namespace chromeos
+
+#endif  // CHROME_BROWSER_UI_WEBUI_CHROMEOS_LOGIN_USER_IMAGE_SCREEN_HANDLER_H_
diff --git a/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.cc b/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.cc
index 66ac058..496b0357 100644
--- a/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.cc
+++ b/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.cc
@@ -72,19 +72,20 @@ void ChangePictureOptionsHandler::RegisterMessages() {
   DCHECK(web_ui_);
   web_ui_->RegisterMessageCallback(
       "chooseFile",
-      NewCallback(this, &ChangePictureOptionsHandler::ChooseFile));
+      NewCallback(this, &ChangePictureOptionsHandler::HandleChooseFile));
   web_ui_->RegisterMessageCallback(
       "takePhoto",
-      NewCallback(this, &ChangePictureOptionsHandler::TakePhoto));
+      NewCallback(this, &ChangePictureOptionsHandler::HandleTakePhoto));
   web_ui_->RegisterMessageCallback(
       "getAvailableImages",
-      NewCallback(this, &ChangePictureOptionsHandler::GetAvailableImages));
+      NewCallback(this,
+                  &ChangePictureOptionsHandler::HandleGetAvailableImages));
   web_ui_->RegisterMessageCallback(
       "selectImage",
-      NewCallback(this, &ChangePictureOptionsHandler::SelectImage));
+      NewCallback(this, &ChangePictureOptionsHandler::HandleSelectImage));
 }
 
-void ChangePictureOptionsHandler::ChooseFile(const ListValue* args) {
+void ChangePictureOptionsHandler::HandleChooseFile(const ListValue* args) {
   DCHECK(args && args->empty());
   if (!select_file_dialog_.get())
     select_file_dialog_ = SelectFileDialog::Create(this);
@@ -111,17 +112,18 @@ void ChangePictureOptionsHandler::ChooseFile(const ListValue* args) {
       NULL);
 }
 
-void ChangePictureOptionsHandler::TakePhoto(const ListValue* args) {
+void ChangePictureOptionsHandler::HandleTakePhoto(const ListValue* args) {
   DCHECK(args && args->empty());
   views::Widget* window = browser::CreateViewsWindow(
       GetBrowserWindow(),
       gfx::Rect(),
-      new TakePhotoDialog());
+      new TakePhotoDialog(this));
   window->SetAlwaysOnTop(true);
   window->Show();
 }
 
-void ChangePictureOptionsHandler::GetAvailableImages(const ListValue* args) {
+void ChangePictureOptionsHandler::HandleGetAvailableImages(
+    const ListValue* args) {
   DCHECK(args && args->empty());
   ListValue image_urls;
   for (int i = 0; i < kDefaultImagesCount; ++i) {
@@ -131,7 +133,7 @@ void ChangePictureOptionsHandler::GetAvailableImages(const ListValue* args) {
                                   image_urls);
 }
 
-void ChangePictureOptionsHandler::SelectImage(const ListValue* args) {
+void ChangePictureOptionsHandler::HandleSelectImage(const ListValue* args) {
   std::string image_url;
   if (!args ||
       args->GetSize() != 1 ||
@@ -158,6 +160,17 @@ void ChangePictureOptionsHandler::FileSelected(const FilePath& path,
   UserManager::Get()->LoadLoggedInUserImage(path);
 }
 
+void ChangePictureOptionsHandler::OnPhotoAccepted(const SkBitmap& photo) {
+  UserManager* user_manager = UserManager::Get();
+  DCHECK(user_manager);
+
+  const UserManager::User& user = user_manager->logged_in_user();
+  DCHECK(!user.email().empty());
+
+  user_manager->SetLoggedInUserImage(photo);
+  user_manager->SaveUserImage(user.email(), photo);
+}
+
 gfx::NativeWindow ChangePictureOptionsHandler::GetBrowserWindow() const {
   Browser* browser = BrowserList::FindBrowserWithProfile(web_ui_->GetProfile());
   if (!browser)
diff --git a/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.h b/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.h
index 3f1e231..5037539 100644
--- a/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.h
+++ b/chrome/browser/ui/webui/options/chromeos/change_picture_options_handler.h
@@ -5,6 +5,7 @@
 #ifndef CHROME_BROWSER_UI_WEBUI_OPTIONS_CHROMEOS_CHANGE_PICTURE_OPTIONS_HANDLER_H_
 #define CHROME_BROWSER_UI_WEBUI_OPTIONS_CHROMEOS_CHANGE_PICTURE_OPTIONS_HANDLER_H_
 
+#include "chrome/browser/chromeos/options/take_photo_dialog.h"
 #include "chrome/browser/ui/shell_dialogs.h"
 #include "chrome/browser/ui/webui/options/options_ui.h"
 #include "ui/gfx/native_widget_types.h"
@@ -18,32 +19,39 @@ namespace chromeos {
 
 // ChromeOS user image options page UI handler.
 class ChangePictureOptionsHandler : public OptionsPageUIHandler,
-                                    public SelectFileDialog::Listener {
+                                    public SelectFileDialog::Listener,
+                                    public TakePhotoDialog::Delegate {
  public:
   ChangePictureOptionsHandler();
   virtual ~ChangePictureOptionsHandler();
 
   // OptionsPageUIHandler implementation.
-  virtual void GetLocalizedValues(base::DictionaryValue* localized_strings);
+  virtual void GetLocalizedValues(
+      base::DictionaryValue* localized_strings) OVERRIDE;
 
   // WebUIMessageHandler implementation.
-  virtual void RegisterMessages();
+  virtual void RegisterMessages() OVERRIDE;
 
  private:
   // Opens a file selection dialog to choose user image from file.
-  void ChooseFile(const base::ListValue* args);
+  void HandleChooseFile(const base::ListValue* args);
 
   // Opens the camera capture dialog.
-  void TakePhoto(const base::ListValue* args);
+  void HandleTakePhoto(const base::ListValue* args);
 
   // Gets the list of available user images and sends it to the page.
-  void GetAvailableImages(const base::ListValue* args);
+  void HandleGetAvailableImages(const base::ListValue* args);
 
   // Selects one of the available images as user's.
-  void SelectImage(const base::ListValue* args);
+  void HandleSelectImage(const base::ListValue* args);
 
   // SelectFileDialog::Delegate implementation.
-  virtual void FileSelected(const FilePath& path, int index, void* params);
+  virtual void FileSelected(
+      const FilePath& path,
+      int index, void* params) OVERRIDE;
+
+  // TakePhotoDialog::Delegate implementation.
+  virtual void OnPhotoAccepted(const SkBitmap& photo) OVERRIDE;
 
   // Returns handle to browser window or NULL if it can't be found.
   gfx::NativeWindow GetBrowserWindow() const;
diff --git a/chrome/chrome_browser.gypi b/chrome/chrome_browser.gypi
index 234cf7af..a033555 100644
--- a/chrome/chrome_browser.gypi
+++ b/chrome/chrome_browser.gypi
@@ -3410,6 +3410,8 @@
         'browser/ui/webui/chromeos/login/signin_screen_handler.h',
         'browser/ui/webui/chromeos/login/update_screen_handler.cc',
         'browser/ui/webui/chromeos/login/update_screen_handler.h',
+        'browser/ui/webui/chromeos/login/user_image_screen_handler.cc',
+        'browser/ui/webui/chromeos/login/user_image_screen_handler.h',
         'browser/ui/webui/chromeos/mobile_setup_ui.cc',
         'browser/ui/webui/chromeos/mobile_setup_ui.h',
         'browser/ui/webui/chromeos/proxy_settings_ui.cc',