chrome/browser/resources/options/supervised_user_list.js

   1 // Copyright 2014 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 cr.define('options.supervisedUserOptions', function() {
   6   /** @const */ var List = cr.ui.List;
   7   /** @const */ var ListItem = cr.ui.ListItem;
   8   /** @const */ var ListSingleSelectionModel = cr.ui.ListSingleSelectionModel;
   9
  10   /**
  11    * Create a new supervised user list item.
  12    * @param {Object} entry The supervised user this item represents.
  13    *     It has the following form:
  14    *       supervisedUser = {
  15    *         id: "Supervised User ID",
  16    *         name: "Supervised User Name",
  17    *         iconURL: "chrome://path/to/icon/image",
  18    *         onCurrentDevice: true or false,
  19    *         needAvatar: true or false
  20    *       }
  21    * @constructor
  22    * @extends {cr.ui.ListItem}
  23    */
  24   function SupervisedUserListItem(entry) {
  25     var el = cr.doc.createElement('div');
  26     el.className = 'list-item';
  27     el.supervisedUser_ = entry;
  28     el.__proto__ = SupervisedUserListItem.prototype;
  29     el.decorate();
  30     return el;
  31   }
  32
  33   SupervisedUserListItem.prototype = {
  34     __proto__: ListItem.prototype,
  35
  36     /**
  37      * @type {string} the ID of this supervised user list item.
  38      */
  39     get id() {
  40       return this.supervisedUser_.id;
  41     },
  42
  43     /**
  44      * @type {string} the name of this supervised user list item.
  45      */
  46     get name() {
  47       return this.supervisedUser_.name;
  48     },
  49
  50     /**
  51      * @type {string} the path to the avatar icon of this supervised
  52      *     user list item.
  53      */
  54     get iconURL() {
  55       return this.supervisedUser_.iconURL;
  56     },
  57
  58     /** @override */
  59     decorate: function() {
  60       ListItem.prototype.decorate.call(this);
  61       var supervisedUser = this.supervisedUser_;
  62
  63       // Add the avatar.
  64       var iconElement = this.ownerDocument.createElement('img');
  65       iconElement.className = 'profile-img';
  66       iconElement.style.content = getProfileAvatarIcon(supervisedUser.iconURL);
  67       this.appendChild(iconElement);
  68
  69       // Add the profile name.
  70       var nameElement = this.ownerDocument.createElement('div');
  71       nameElement.className = 'profile-name';
  72       nameElement.textContent = supervisedUser.name;
  73       this.appendChild(nameElement);
  74
  75       if (supervisedUser.onCurrentDevice) {
  76         iconElement.className += ' profile-img-disabled';
  77         nameElement.className += ' profile-name-disabled';
  78
  79         // Add "(already on this device)" message.
  80         var alreadyOnDeviceElement = this.ownerDocument.createElement('div');
  81         alreadyOnDeviceElement.className =
  82             'profile-name-disabled already-on-this-device';
  83         alreadyOnDeviceElement.textContent =
  84             loadTimeData.getString('supervisedUserAlreadyOnThisDevice');
  85         this.appendChild(alreadyOnDeviceElement);
  86       }
  87     },
  88   };
  89
  90   /**
  91    * Create a new supervised users list.
  92    * @constructor
  93    * @extends {cr.ui.List}
  94    */
  95   var SupervisedUserList = cr.ui.define('list');
  96
  97   SupervisedUserList.prototype = {
  98     __proto__: List.prototype,
  99
 100     /**
 101      * @override
 102      * @param {Object} entry
 103      */
 104     createItem: function(entry) {
 105       return new SupervisedUserListItem(entry);
 106     },
 107
 108     /** @override */
 109     decorate: function() {
 110       List.prototype.decorate.call(this);
 111       this.selectionModel = new ListSingleSelectionModel();
 112       this.autoExpands = true;
 113     },
 114   };
 115
 116   return {
 117     SupervisedUserListItem: SupervisedUserListItem,
 118     SupervisedUserList: SupervisedUserList,
 119   };
 120 });