chrome/browser/resources/options/handler_options_list.js

   1 // Copyright (c) 2012 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', function() {
   6   /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
   7   /** @const */ var List = cr.ui.List;
   8   /** @const */ var ListItem = cr.ui.ListItem;
   9   /** @const */ var DeletableItem = options.DeletableItem;
  10   /** @const */ var DeletableItemList = options.DeletableItemList;
  11
  12   /**
  13    * Creates a new ignored protocol / content handler list item.
  14    *
  15    * Accepts values in the form
  16    *   ['mailto', 'http://www.thesite.com/%s', 'www.thesite.com'],
  17    * @param {Object} entry A dictionary describing the handlers for a given
  18    *     protocol.
  19    * @constructor
  20    * @extends {options.DeletableItem}
  21    */
  22   function IgnoredHandlersListItem(entry) {
  23     var el = cr.doc.createElement('div');
  24     el.dataItem = entry;
  25     el.__proto__ = IgnoredHandlersListItem.prototype;
  26     el.decorate();
  27     return el;
  28   }
  29
  30   IgnoredHandlersListItem.prototype = {
  31     __proto__: DeletableItem.prototype,
  32
  33     /** @override */
  34     decorate: function() {
  35       DeletableItem.prototype.decorate.call(this);
  36
  37       // Protocol.
  38       var protocolElement = document.createElement('div');
  39       protocolElement.textContent = this.dataItem[0];
  40       protocolElement.className = 'handlers-type-column';
  41       this.contentElement_.appendChild(protocolElement);
  42
  43       // Host name.
  44       var hostElement = document.createElement('div');
  45       hostElement.textContent = this.dataItem[2];
  46       hostElement.className = 'handlers-site-column';
  47       hostElement.title = this.dataItem[1];
  48       this.contentElement_.appendChild(hostElement);
  49     },
  50   };
  51
  52   /**
  53    * @constructor
  54    * @extends {options.DeletableItemList}
  55    */
  56   var IgnoredHandlersList = cr.ui.define('list');
  57
  58   IgnoredHandlersList.prototype = {
  59     __proto__: DeletableItemList.prototype,
  60
  61     /**
  62      * @override
  63      * @param {Object} entry
  64      */
  65     createItem: function(entry) {
  66       return new IgnoredHandlersListItem(entry);
  67     },
  68
  69     deleteItemAtIndex: function(index) {
  70       chrome.send('removeIgnoredHandler', [this.dataModel.item(index)]);
  71     },
  72
  73     /**
  74      * The length of the list.
  75      */
  76     get length() {
  77       return this.dataModel.length;
  78     },
  79
  80     /**
  81      * Set the protocol handlers displayed by this list.  See
  82      * IgnoredHandlersListItem for an example of the format the list should
  83      * take.
  84      *
  85      * @param {!Array} list A list of ignored protocol handlers.
  86      */
  87     setHandlers: function(list) {
  88       this.dataModel = new ArrayDataModel(list);
  89     },
  90   };
  91
  92   /**
  93    * Creates a new protocol / content handler list item.
  94    *
  95    * Accepts values in the form
  96    * { protocol: 'mailto',
  97    *   handlers: [
  98    *     ['mailto', 'http://www.thesite.com/%s', 'www.thesite.com'],
  99    *     ...,
 100    *   ],
 101    * }
 102    * @param {Object} entry A dictionary describing the handlers for a given
 103    *     protocol.
 104    * @constructor
 105    * @extends {cr.ui.ListItem}
 106    */
 107   function HandlerListItem(entry) {
 108     var el = cr.doc.createElement('div');
 109     el.dataItem = entry;
 110     el.__proto__ = HandlerListItem.prototype;
 111     el.decorate();
 112     return el;
 113   }
 114
 115   HandlerListItem.prototype = {
 116     __proto__: ListItem.prototype,
 117
 118     /**
 119      * @param {Handlers} data
 120      * @param {{removeHandler: Function, setDefault: Function,
 121      *          clearDefault: Function}} delegate
 122      */
 123     buildWidget_: function(data, delegate) {
 124       // Protocol.
 125       var protocolElement = document.createElement('div');
 126       protocolElement.textContent = data.protocol;
 127       protocolElement.className = 'handlers-type-column';
 128       this.appendChild(protocolElement);
 129
 130       // Handler selection.
 131       var handlerElement = document.createElement('div');
 132       var selectElement = document.createElement('select');
 133       var defaultOptionElement = document.createElement('option');
 134       defaultOptionElement.selected = data.default_handler == -1;
 135       defaultOptionElement.textContent =
 136           loadTimeData.getString('handlers_none_handler');
 137       defaultOptionElement.value = -1;
 138       selectElement.appendChild(defaultOptionElement);
 139
 140       for (var i = 0; i < data.handlers.length; ++i) {
 141         var optionElement = document.createElement('option');
 142         optionElement.selected = i == data.default_handler;
 143         optionElement.textContent = data.handlers[i][2];
 144         optionElement.value = i;
 145         selectElement.appendChild(optionElement);
 146       }
 147
 148       selectElement.addEventListener('change', function(e) {
 149         var index = e.target.value;
 150         if (index == -1) {
 151           this.classList.add('none');
 152           delegate.clearDefault(data.protocol);
 153         } else {
 154           handlerElement.classList.remove('none');
 155           delegate.setDefault(data.handlers[index]);
 156         }
 157       });
 158       handlerElement.appendChild(selectElement);
 159       handlerElement.className = 'handlers-site-column';
 160       if (data.default_handler == -1)
 161         this.classList.add('none');
 162       this.appendChild(handlerElement);
 163
 164       if (data.has_policy_recommendations) {
 165         // Create an indicator to show that the handler has policy
 166         // recommendations.
 167         var indicator = new options.ControlledSettingIndicator();
 168         if (data.is_default_handler_set_by_user || data.default_handler == -1) {
 169           // The default handler is registered by the user or set to none, which
 170           // indicates that the user setting has overridden a policy
 171           // recommendation. Show the appropriate bubble.
 172           indicator.controlledBy = 'hasRecommendation';
 173           indicator.resetHandler = function() {
 174             // If there is a policy recommendation, data.handlers.length >= 1.
 175             // Setting the default handler to 0 ensures that it won't be 'none',
 176             // and there *is* a user registered handler created by setDefault,
 177             // which is required for a change notification.
 178             // The user-registered handlers are removed in a loop. Note that if
 179             // a handler is installed by policy, removeHandler does nothing.
 180             delegate.setDefault(data.handlers[0]);
 181             for (var i = 0; i < data.handlers.length; ++i) {
 182               delegate.removeHandler(i, data.handlers[i]);
 183             }
 184           };
 185         } else {
 186           indicator.controlledBy = 'recommended';
 187         }
 188         this.appendChild(indicator);
 189       }
 190
 191       if (data.is_default_handler_set_by_user) {
 192         // Remove link.
 193         var removeElement = document.createElement('div');
 194         removeElement.textContent =
 195             loadTimeData.getString('handlers_remove_link');
 196         removeElement.addEventListener('click', function(e) {
 197           var value = selectElement ? selectElement.value : 0;
 198           delegate.removeHandler(value, data.handlers[value]);
 199         });
 200         removeElement.className =
 201             'handlers-remove-column handlers-remove-link';
 202         this.appendChild(removeElement);
 203       }
 204     },
 205
 206     /** @override */
 207     decorate: function() {
 208       ListItem.prototype.decorate.call(this);
 209
 210       var delegate = {
 211         removeHandler: function(index, handler) {
 212           chrome.send('removeHandler', [handler]);
 213         },
 214         setDefault: function(handler) {
 215           chrome.send('setDefault', [handler]);
 216         },
 217         clearDefault: function(protocol) {
 218           chrome.send('clearDefault', [protocol]);
 219         },
 220       };
 221
 222       this.buildWidget_(this.dataItem, delegate);
 223     },
 224   };
 225
 226   /**
 227    * Create a new passwords list.
 228    * @constructor
 229    * @extends {cr.ui.List}
 230    */
 231   var HandlersList = cr.ui.define('list');
 232
 233   HandlersList.prototype = {
 234     __proto__: List.prototype,
 235
 236     /**
 237      * @override
 238      * @param {Object} entry
 239      */
 240     createItem: function(entry) {
 241       return new HandlerListItem(entry);
 242     },
 243
 244     /**
 245      * The length of the list.
 246      */
 247     get length() {
 248       return this.dataModel.length;
 249     },
 250
 251     /**
 252      * Set the protocol handlers displayed by this list.
 253      * See HandlerListItem for an example of the format the list should take.
 254      *
 255      * @param {!Array} list A list of protocols with their registered handlers.
 256      */
 257     setHandlers: function(list) {
 258       this.dataModel = new ArrayDataModel(list);
 259     },
 260   };
 261
 262   return {
 263     IgnoredHandlersListItem: IgnoredHandlersListItem,
 264     IgnoredHandlersList: IgnoredHandlersList,
 265     HandlerListItem: HandlerListItem,
 266     HandlersList: HandlersList,
 267   };
 268 });