Multi-Profiles: New Profile Setup UI

chrome/browser/resources/new_profile.js

+// 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.
+

[Evan Stade, 2011/07/01 20:33:18]

namespace everything in this file

+// Tracks the currently selected avatar icon.
+var gSelectedAvatarIconIndex = 0;

[Evan Stade, 2011/07/01 20:33:18]

I don't think this is the right variable naming style

+
+// Initializes everything once the document loads.
+function load() {
+  // Allow platform specific CSS rules.
+  cr.enablePlatformSpecificCSSRules();
+
+  // Add handlers to HTML elements.
+  $('create-button').onclick = function () { onCreate(); };

[Evan Stade, 2011/07/01 20:33:18]

simply onclick = onCreate

[sail, 2011/07/01 23:47:04]

Done.

+  $('cancel-button').onclick = function () { onCancel(); };
+  $('profile-name-form').onsubmit = function () {
+    onCreate();
+    // Return false to prevent the submit handler from doing a post.
+    return false;
+  };
+
+  chrome.send('requestProfileInfo');
+  updateLogo();
+  $('profile-name').focus();
+}
+
+// Sends the profile information to the browser.
+function onCreate() {
+  chrome.send('create', [$('profile-name').value,
+                         String(gSelectedAvatarIconIndex)]);
+}
+
+// Lets the browser know that the user doesn't want to create the profile.
+function onCancel() {
+  chrome.send('cancel');
+}
+
+// Changes the selected profile.
+function onAvatarClicked(index) {
+  var menu = $('avatar-menu');
+  for (var i = 0; i < menu.childNodes.length; i++) {
+    var button = menu.childNodes[i];
+    if (i == index)
+      button.classList.add("avatar-button-selected");
+    else
+      button.classList.remove("avatar-button-selected");
+  }
+  gSelectedAvatarIconIndex = index;
+}
+
+// Sets the logo image.
+function updateLogo() {
+  var imageId = 'IDR_PRODUCT_LOGO';
+  if (document.documentElement.getAttribute('customlogo') == 'true')
+    imageId = 'IDR_CUSTOM_PRODUCT_LOGO';
+
+  $('logo-img').src = 'chrome://theme/' + imageId + '?' + Date.now();
+}
+
+// Callback from the browser to set the profile information on the page.
+function setProfileInfo(profileName, profileIconIndex) {
+  $('profile-name').value = profileName;
+  onAvatarClicked(profileIconIndex);
+}
+
+// Callback from the browser to fill the avatar menu with default avatar
+// images.
+function setDefaultAvatarImages(imageUrlList) {
+  var menu = $('avatar-menu');
+  for (var i = 0; i < imageUrlList.length; i++) {
+    var button = document.createElement("input");
+    button.setAttribute("type", "image");
+    button.setAttribute("class", "avatar-button");
+    button.setAttribute("src", imageUrlList[i]);
+    button.setAttribute("onclick", "onAvatarClicked(" + i + ")");
+    menu.appendChild(button);
+  }
+}
+
+window.addEventListener('DOMContentLoaded', load);