src/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 {cr.ui.DeletableItemList}
  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   var IgnoredHandlersList = cr.ui.define('list');
  54
  55   IgnoredHandlersList.prototype = {
  56     __proto__: DeletableItemList.prototype,
  57
  58     createItem: function(entry) {
  59       return new IgnoredHandlersListItem(entry);
  60     },
  61
  62     deleteItemAtIndex: function(index) {
  63       chrome.send('removeIgnoredHandler', [this.dataModel.item(index)]);
  64     },
  65
  66     /**
  67      * The length of the list.
  68      */
  69     get length() {
  70       return this.dataModel.length;
  71     },
  72
  73     /**
  74      * Set the protocol handlers displayed by this list.  See
  75      * IgnoredHandlersListItem for an example of the format the list should
  76      * take.
  77      *
  78      * @param {Object} list A list of ignored protocol handlers.
  79      */
  80     setHandlers: function(list) {
  81       this.dataModel = new ArrayDataModel(list);
  82     },
  83   };
  84
  85
  86
  87   /**
  88    * Creates a new protocol / content handler list item.
  89    *
  90    * Accepts values in the form
  91    * { protocol: 'mailto',
  92    *   handlers: [
  93    *     ['mailto', 'http://www.thesite.com/%s', 'www.thesite.com'],
  94    *     ...,
  95    *   ],
  96    * }
  97    * @param {Object} entry A dictionary describing the handlers for a given
  98    *     protocol.
  99    * @constructor
 100    * @extends {cr.ui.ListItem}
 101    */
 102   function HandlerListItem(entry) {
 103     var el = cr.doc.createElement('div');
 104     el.dataItem = entry;
 105     el.__proto__ = HandlerListItem.prototype;
 106     el.decorate();
 107     return el;
 108   }
 109
 110   HandlerListItem.prototype = {
 111     __proto__: ListItem.prototype,
 112
 113     buildWidget_: function(data, delegate) {
 114       // Protocol.
 115       var protocolElement = document.createElement('div');
 116       protocolElement.textContent = data.protocol;
 117       protocolElement.className = 'handlers-type-column';
 118       this.appendChild(protocolElement);
 119
 120       // Handler selection.
 121       var handlerElement = document.createElement('div');
 122       var selectElement = document.createElement('select');
 123       var defaultOptionElement = document.createElement('option');
 124       defaultOptionElement.selected = data.default_handler == -1;
 125       defaultOptionElement.textContent =
 126           loadTimeData.getString('handlers_none_handler');
 127       defaultOptionElement.value = -1;
 128       selectElement.appendChild(defaultOptionElement);
 129
 130       for (var i = 0; i < data.handlers.length; ++i) {
 131         var optionElement = document.createElement('option');
 132         optionElement.selected = i == data.default_handler;
 133         optionElement.textContent = data.handlers[i][2];
 134         optionElement.value = i;
 135         selectElement.appendChild(optionElement);
 136       }
 137
 138       selectElement.addEventListener('change', function(e) {
 139         var index = e.target.value;
 140         if (index == -1) {
 141           this.classList.add('none');
 142           delegate.clearDefault(data.protocol);
 143         } else {
 144           handlerElement.classList.remove('none');
 145           delegate.setDefault(data.handlers[index]);
 146         }
 147       });
 148       handlerElement.appendChild(selectElement);
 149       handlerElement.className = 'handlers-site-column';
 150       if (data.default_handler == -1)
 151         this.classList.add('none');
 152       this.appendChild(handlerElement);
 153
 154       // Remove link.
 155       var removeElement = document.createElement('div');
 156       removeElement.textContent =
 157           loadTimeData.getString('handlers_remove_link');
 158       removeElement.addEventListener('click', function(e) {
 159         var value = selectElement ? selectElement.value : 0;
 160         delegate.removeHandler(value, data.handlers[value]);
 161       });
 162       removeElement.className = 'handlers-remove-column handlers-remove-link';
 163       this.appendChild(removeElement);
 164     },
 165
 166     /** @override */
 167     decorate: function() {
 168       ListItem.prototype.decorate.call(this);
 169
 170       var delegate = {
 171         removeHandler: function(index, handler) {
 172           chrome.send('removeHandler', [handler]);
 173         },
 174         setDefault: function(handler) {
 175           chrome.send('setDefault', [handler]);
 176         },
 177         clearDefault: function(protocol) {
 178           chrome.send('clearDefault', [protocol]);
 179         },
 180       };
 181
 182       this.buildWidget_(this.dataItem, delegate);
 183     },
 184   };
 185
 186   /**
 187    * Create a new passwords list.
 188    * @constructor
 189    * @extends {cr.ui.List}
 190    */
 191   var HandlersList = cr.ui.define('list');
 192
 193   HandlersList.prototype = {
 194     __proto__: List.prototype,
 195
 196     /** @override */
 197     createItem: function(entry) {
 198       return new HandlerListItem(entry);
 199     },
 200
 201     /**
 202      * The length of the list.
 203      */
 204     get length() {
 205       return this.dataModel.length;
 206     },
 207
 208     /**
 209      * Set the protocol handlers displayed by this list.
 210      * See HandlerListItem for an example of the format the list should take.
 211      *
 212      * @param {Object} list A list of protocols with their registered handlers.
 213      */
 214     setHandlers: function(list) {
 215       this.dataModel = new ArrayDataModel(list);
 216     },
 217   };
 218
 219   return {
 220     IgnoredHandlersListItem: IgnoredHandlersListItem,
 221     IgnoredHandlersList: IgnoredHandlersList,
 222     HandlerListItem: HandlerListItem,
 223     HandlersList: HandlersList,
 224   };
 225 });