Split the Media settings UI into separate microphone and camera sections.

chrome/browser/resources/options/content_settings_exceptions_area.js

 // Copyright (c) 2012 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.
 
 cr.define('options.contentSettings', function() {
   /** @const */ var ControlledSettingIndicator =
                     options.ControlledSettingIndicator;
   /** @const */ var InlineEditableItemList = options.InlineEditableItemList;
   /** @const */ var InlineEditableItem = options.InlineEditableItem;
   /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
 
   /**
    * Returns whether exceptions list for the type is editable.
    *
    * @param {string} contentType The type of the list.
    */
   function IsEditableType(contentType) {
     // Exceptions of the following lists are not editable for now.
     return !(contentType == 'notifications' ||
              contentType == 'location' ||
              contentType == 'fullscreen' ||
-             contentType == 'media-stream' ||
+             contentType == 'media-stream-mic' ||
+             contentType == 'media-stream-camera' ||
              contentType == 'midi-sysex' ||
              contentType == 'zoomlevels');
   }
 
   /**
    * Creates a new exceptions list item.
    *
    * @param {string} contentType The type of the list.
    * @param {string} mode The browser mode, 'otr' or 'normal'.
    * @param {Object} exception A dictionary that contains the data of the
@@ skipping 86 matching lines @@
       if (this.contentType != 'zoomlevels') {
         this.addEditField(select, this.settingLabel);
         this.contentElement.appendChild(select);
       }
       select.className = 'exception-setting';
       select.setAttribute('aria-labelledby', 'exception-behavior-column');
 
       if (this.pattern)
         select.setAttribute('displaymode', 'edit');
 
-      if (this.contentType == 'media-stream') {
-        this.settingLabel.classList.add('media-audio-setting');
-
-        var videoSettingLabel = cr.doc.createElement('span');
-        videoSettingLabel.textContent = this.videoSettingForDisplay();
-        videoSettingLabel.className = 'exception-setting';
-        videoSettingLabel.classList.add('media-video-setting');
-        videoSettingLabel.setAttribute('displaymode', 'static');
-        this.contentElement.appendChild(videoSettingLabel);
-      }
-
       if (this.contentType == 'zoomlevels') {
         this.deletable = true;
 
         var zoomLabel = cr.doc.createElement('span');
         zoomLabel.textContent = this.dataItem.zoom;
         zoomLabel.className = 'exception-setting';
         zoomLabel.setAttribute('displaymode', 'static');
         zoomLabel.setAttribute('aria-labelledby', 'exception-zoom-column');
         this.contentElement.appendChild(zoomLabel);
         this.zoomLabel = zoomLabel;
@@ skipping 107 matching lines @@
     /**
      * Gets a human-readable setting string.
      *
      * @return {string} The display string.
      */
     settingForDisplay: function() {
       return this.getDisplayStringForSetting(this.setting);
     },
 
     /**
-     * media video specific function.
-     * Gets a human-readable video setting string.
-     *
-     * @return {string} The display string.
-     */
-    videoSettingForDisplay: function() {
-      return this.getDisplayStringForSetting(this.dataItem.video);
-    },
-
-    /**
      * Gets a human-readable display string for setting.
      *
      * @param {string} setting The setting to be displayed.
      * @return {string} The display string.
      */
     getDisplayStringForSetting: function(setting) {
       if (setting == 'allow')
         return loadTimeData.getString('allowException');
       else if (setting == 'block')
         return loadTimeData.getString('blockException');
@@ skipping 346 matching lines @@
       header.textContent = loadTimeData.getString(camelCasedType + 'Header');
 
       var divs = this.pageDiv.querySelectorAll('div[contentType]');
       for (var i = 0; i < divs.length; i++) {
         if (divs[i].getAttribute('contentType') == type)
           divs[i].hidden = false;
         else
           divs[i].hidden = true;
       }
 
-      var mediaHeader = this.pageDiv.querySelector('.media-header');
-      mediaHeader.hidden = type != 'media-stream';
-
       $('exception-behavior-column').hidden = type == 'zoomlevels';
       $('exception-zoom-column').hidden = type != 'zoomlevels';
     },
 
     /**
      * Called after the page has been shown. Show the content type for the
      * location's hash.
      */
     didShowPage: function() {
       if (this.hash)
@@ skipping 22 matching lines @@
     }
   };
 
   return {
     ExceptionsListItem: ExceptionsListItem,
     ExceptionsAddRowListItem: ExceptionsAddRowListItem,
     ExceptionsList: ExceptionsList,
     ContentSettingsExceptionsArea: ContentSettingsExceptionsArea,
   };
 });