Settings > Display: Use a single div

Using a separate name div breaks dragging when the name is dragged
and isn't necessary.

Bug: 833036
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Ia9bcc8556018e9dd6d76e0dac6221ecbf85997c7
Reviewed-on: https://chromium-review.googlesource.com/1014624
Commit-Queue: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Weidong Guo <weidongg@chromium.org>
Cr-Commit-Position: refs/heads/master@{#551426}

chrome/browser/resources/settings/device_page/display_layout.html

@@ -70,12 +70,8 @@
             draggable="[[dragEnabled]]" on-click="onSelectDisplayTap_"
             style$="[[getDivStyle_(item.id, item.bounds, visualScale)]]"
             selected$="[[isSelected_(item, selectedDisplay)]]">
-          <div hidden$="[[mirroring]]">
-            [[item.name]]
-          </div>
-          <div hidden$="[[!mirroring]]">
-            $i18n{displayMirrorDisplayName}
-          </div>
+          [[getDisplayName_(mirroring, item.name,
+                            '$i18nPolymer{displayMirrorDisplayName}')]]
         </div>
       </template>
     </div>

chrome/browser/resources/settings/device_page/display_layout.js

@@ -190,6 +190,17 @@ Polymer({
         (mirroringDestinationDisplayNum - mirroringDestinationIndex) * -4);
   },
 
+  /**
+   * @param {boolean} mirroring
+   * @param {string} displayName
+   * @param {string} mirroringName
+   * @return {string}
+   * @private
+   */
+  getDisplayName_: function(mirroring, displayName, mirroringName) {
+    return mirroring ? mirroringName : displayName;
+  },
+
   /**
    * @param {!chrome.system.display.DisplayUnitInfo} display
    * @param {!chrome.system.display.DisplayUnitInfo} selectedDisplay