Upstream version 7.36.149.0
[platform/framework/web/crosswalk.git] / src / chrome / browser / resources / chromeos / login / screen_locally_managed_user_creation.js
index 5fd61df..6f05f55 100644 (file)
@@ -256,8 +256,9 @@ login.createScreen('LocallyManagedUserCreationScreen',
     decorate: function() {
       // Mousedown has to be used instead of click to be able to prevent 'focus'
       // event later.
-      this.addEventListener('mousedown',
-                            this.handleMouseDown_.bind(this));
+      this.addEventListener('mousedown', this.handleMouseDown_.bind(this));
+      var screen = $('managed-user-creation');
+      var importList = screen.importList_;
     },
 
     /**
@@ -330,6 +331,35 @@ login.createScreen('LocallyManagedUserCreationScreen',
 
     /** @override */
     decorate: function() {
+      this.setAttribute('tabIndex', 0);
+      this.classList.add('nofocus');
+      var importList = this;
+      var screen = $('managed-user-creation');
+
+      this.addEventListener('focus', function(e) {
+        if (importList.selectedPod_ == null) {
+          if (importList.pods.length > 0)
+            importList.selectPod(importList.pods[0]);
+        }
+      });
+
+      this.addEventListener('keydown', function(e) {
+        switch (e.keyIdentifier) {
+          case 'Up':
+            importList.selectNextPod(-1);
+            e.stopPropagation();
+            break;
+          case 'Enter':
+            if (importList.selectedPod_ != null)
+              screen.importSupervisedUser_();
+            e.stopPropagation();
+            break;
+          case 'Down':
+            importList.selectNextPod(+1);
+            e.stopPropagation();
+            break;
+        }
+      });
     },
 
     /**
@@ -340,6 +370,14 @@ login.createScreen('LocallyManagedUserCreationScreen',
       return this.children;
     },
 
+    /**
+     * Returns selected pod.
+     * @type {Node}
+     */
+    get selectedPod() {
+      return this.selectedPod_;
+    },
+
     addPod: function(user) {
       var importPod = new ImportPod({user: user});
       this.appendChild(importPod);
@@ -409,6 +447,7 @@ login.createScreen('LocallyManagedUserCreationScreen',
       if (!podToSelect)
         return;
       podToSelect.classList.add('focused');
+      podToSelect.focus();
       var screen = $('managed-user-creation');
       if (!this.selectedPod_) {
         screen.getScreenButton('import').disabled = true;
@@ -422,6 +461,25 @@ login.createScreen('LocallyManagedUserCreationScreen',
       }
     },
 
+    selectNextPod: function(direction) {
+      if (!this.selectedPod_)
+        return false;
+      var index = -1;
+      for (var i = 0, pod; pod = this.pods[i]; ++i) {
+        if (pod == this.selectedPod_) {
+          index = i;
+          break;
+        }
+      }
+      if (-1 == index)
+        return false;
+      index = index + direction;
+      if (index < 0 || index >= this.pods.length)
+        return false;
+      this.selectPod(this.pods[index]);
+      return true;
+    },
+
     selectUser: function(user_id) {
       for (var i = 0, pod; pod = this.pods[i]; ++i) {
         if (pod.user.id == user_id) {
@@ -546,10 +604,7 @@ login.createScreen('LocallyManagedUserCreationScreen',
 
       // Toggle 'animation' class for the duration of WebKit transition.
       this.getScreenElement('flip-photo').addEventListener(
-          'click', function(e) {
-            previewElement.classList.add('animation');
-            imageGrid.flipPhoto = !imageGrid.flipPhoto;
-          });
+          'click', this.handleFlipPhoto_.bind(this));
       this.getScreenElement('image-stream-crop').addEventListener(
           'webkitTransitionEnd', function(e) {
             previewElement.classList.remove('animation');
@@ -686,15 +741,16 @@ login.createScreen('LocallyManagedUserCreationScreen',
      * @type {!Array} Array of Buttons.
      */
     get buttons() {
-      var buttons = [];
-
-      var status = this.makeFromTemplate('status-container', 'status');
-      buttons.push(status);
+      var links = this.ownerDocument.createElement('div');
+      var buttons = this.ownerDocument.createElement('div');
+      links.classList.add('controls-links');
+      buttons.classList.add('controls-buttons');
 
       var importLink = this.makeFromTemplate('import-supervised-user-link',
                                              'import-link');
       importLink.hidden = true;
-      buttons.push(importLink);
+      links.appendChild(importLink);
+
       var linkElement = importLink.querySelector('.signin-link');
       linkElement.addEventListener('click',
           this.importLinkPressed_.bind(this));
@@ -702,47 +758,50 @@ login.createScreen('LocallyManagedUserCreationScreen',
       var createLink = this.makeFromTemplate('create-supervised-user-link',
                                              'create-link');
       createLink.hidden = true;
-      buttons.push(createLink);
+      links.appendChild(createLink);
+
+      var status = this.makeFromTemplate('status-container', 'status');
+      buttons.appendChild(status);
 
       linkElement = createLink.querySelector('.signin-link');
       linkElement.addEventListener('click',
           this.createLinkPressed_.bind(this));
 
-      buttons.push(this.makeButton(
+      buttons.appendChild(this.makeButton(
           'start',
           'managedUserCreationFlow',
           this.startButtonPressed_.bind(this),
           ['intro'],
           ['custom-appearance', 'button-fancy', 'button-blue']));
 
-      buttons.push(this.makeButton(
+      buttons.appendChild(this.makeButton(
           'prev',
           'managedUserCreationFlow',
           this.prevButtonPressed_.bind(this),
           ['manager'],
           []));
 
-      buttons.push(this.makeButton(
+      buttons.appendChild(this.makeButton(
           'next',
           'managedUserCreationFlow',
           this.nextButtonPressed_.bind(this),
           ['manager', 'username'],
           []));
 
-      buttons.push(this.makeButton(
+      buttons.appendChild(this.makeButton(
           'import',
           'managedUserCreationFlow',
           this.importButtonPressed_.bind(this),
           ['import', 'import-password'],
           []));
 
-      buttons.push(this.makeButton(
+      buttons.appendChild(this.makeButton(
           'gotit',
           'managedUserCreationFlow',
           this.gotItButtonPressed_.bind(this),
           ['created'],
           ['custom-appearance', 'button-fancy', 'button-blue']));
-      return buttons;
+      return [links, buttons];
     },
 
     /**
@@ -788,6 +847,7 @@ login.createScreen('LocallyManagedUserCreationScreen',
       if (this.disabled)
         return;
       this.disabled = true;
+
       this.context_.managedName = userName;
       chrome.send('specifyLocallyManagedUserCreationFlowUserData',
           [userName, firstPassword]);
@@ -1254,6 +1314,7 @@ login.createScreen('LocallyManagedUserCreationScreen',
         control.disabled = value;
       }
       $('login-header-bar').disabled = value;
+      $('cancel-add-user-button').disabled = false;
     },
 
     /**
@@ -1446,14 +1507,29 @@ login.createScreen('LocallyManagedUserCreationScreen',
     },
 
     /**
+     * Handle camera-photo flip.
+     */
+    handleFlipPhoto_: function() {
+      var imageGrid = this.getScreenElement('image-grid');
+      imageGrid.previewElement.classList.add('animation');
+      imageGrid.flipPhoto = !imageGrid.flipPhoto;
+      var flipMessageId = imageGrid.flipPhoto ?
+         'photoFlippedAccessibleText' : 'photoFlippedBackAccessibleText';
+      announceAccessibleMessage(loadTimeData.getString(flipMessageId));
+    },
+
+    /**
      * Handle photo capture from the live camera stream.
      */
     handleTakePhoto_: function(e) {
       this.getScreenElement('image-grid').takePhoto();
+      chrome.send('supervisedUserTakePhoto');
     },
 
     handlePhotoTaken_: function(e) {
       chrome.send('supervisedUserPhotoTaken', [e.dataURL]);
+      announceAccessibleMessage(
+          loadTimeData.getString('photoCaptureAccessibleText'));
     },
 
     /**
@@ -1470,6 +1546,9 @@ login.createScreen('LocallyManagedUserCreationScreen',
     handleDiscardPhoto_: function(e) {
       var imageGrid = this.getScreenElement('image-grid');
       imageGrid.discardPhoto();
+      chrome.send('supervisedUserDiscardPhoto');
+      announceAccessibleMessage(
+          loadTimeData.getString('photoDiscardAccessibleText'));
     },
 
     setCameraPresent: function(present) {
@@ -1477,8 +1556,12 @@ login.createScreen('LocallyManagedUserCreationScreen',
     },
 
     setExistingManagedUsers: function(users) {
-      var userList = users;
+      var selectedUser = null;
+      // Store selected user
+      if (this.importList_.selectedPod)
+        selectedUser = this.importList_.selectedPod.user.id;
 
+      var userList = users;
       userList.sort(function(a, b) {
         // Put existing users last.
         if (a.exists != b.exists)
@@ -1488,14 +1571,21 @@ login.createScreen('LocallyManagedUserCreationScreen',
       });
 
       this.importList_.clearPods();
-      for (var i = 0; i < userList.length; ++i)
+      var selectedIndex = -1;
+      for (var i = 0; i < userList.length; ++i) {
         this.importList_.addPod(userList[i]);
+        if (selectedUser == userList[i].id)
+          selectedIndex = i;
+      }
 
       if (userList.length == 1)
-        this.importList_.selectPod(this.managerList_.pods[0]);
+        this.importList_.selectPod(this.importList_.pods[0]);
+
+      if (selectedIndex >= 0)
+        this.importList_.selectPod(this.importList_.pods[selectedIndex]);
 
-      if (userList.length > 0 && this.currentPage_ == 'username')
-        this.getScreenElement('import-link').hidden = false;
+      if (this.currentPage_ == 'username')
+        this.getScreenElement('import-link').hidden = (userList.length == 0);
     },
   };
 });