Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 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 | 2 // Use of this source code is governed by a BSD-style license that can be |
| 3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
| 4 | 4 |
| 5 cr.define('options', function() { | 5 cr.define('options', function() { |
| 6 var OptionsPage = options.OptionsPage; | 6 var OptionsPage = options.OptionsPage; |
| 7 | 7 |
| 8 // The scale ratio of the display rectangle to its original size. | 8 // The scale ratio of the display rectangle to its original size. |
| 9 /** @const */ var VISUAL_SCALE = 1 / 10; | 9 /** @const */ var VISUAL_SCALE = 1 / 10; |
| 10 | 10 |
| (...skipping 208 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 219 this.displays_view_.onmousedown = this.onMouseDown_.bind(this); | 219 this.displays_view_.onmousedown = this.onMouseDown_.bind(this); |
| 220 this.displays_view_.onmouseup = this.onMouseUp_.bind(this); | 220 this.displays_view_.onmouseup = this.onMouseUp_.bind(this); |
| 221 displays_view_host.appendChild(this.displays_view_); | 221 displays_view_host.appendChild(this.displays_view_); |
| 222 }, | 222 }, |
| 223 | 223 |
| 224 /** | 224 /** |
| 225 * Lays out the display rectangles for mirroring. | 225 * Lays out the display rectangles for mirroring. |
| 226 * @private | 226 * @private |
| 227 */ | 227 */ |
| 228 layoutMirroringDisplays_: function() { | 228 layoutMirroringDisplays_: function() { |
| 229 // Offset pixels for secondary display rectangles. | |
| 230 /** @const */ var MIRRORING_OFFSET_PIXELS = 2; | |
| 231 | |
| 229 // The width/height should be same as the primary display: | 232 // The width/height should be same as the primary display: |
| 230 var width = this.displays_[0].width * VISUAL_SCALE; | 233 var width = this.displays_[0].width * VISUAL_SCALE; |
| 231 var height = this.displays_[0].height * VISUAL_SCALE; | 234 var height = this.displays_[0].height * VISUAL_SCALE; |
| 232 | 235 |
| 236 // Always show two displays because there must be two displays when | |
| 237 // the display_options is enabled. Don't rely on displays_.length because | |
| 238 // there is only one display from chrome's perspective in mirror mode. | |
| 239 var num_displays = Math.max(2, this.displays_.length); | |
|
James Hawkins
2012/07/30 03:14:35
Optional nit: Pull this two into a const, e.g., MI
Jun Mukai
2012/07/30 07:58:41
Done.
| |
| 240 | |
| 233 this.displays_view_.style.height = | 241 this.displays_view_.style.height = |
| 234 height + this.displays_.length * 2 + 'px'; | 242 height + num_displays * MIRRORING_OFFSET_PIXELS + 'px'; |
| 235 | 243 |
| 236 for (var i = 0; i < this.displays_.length; i++) { | 244 for (var i = 0; i < num_displays; i++) { |
| 237 var div = document.createElement('div'); | 245 var div = document.createElement('div'); |
| 238 this.displays_[i].div = div; | |
| 239 div.className = 'displays-display'; | 246 div.className = 'displays-display'; |
| 240 div.style.top = i * 2 + 'px'; | 247 div.style.top = i * MIRRORING_OFFSET_PIXELS + 'px'; |
| 241 div.style.left = i * 2 + 'px'; | 248 div.style.left = i * MIRRORING_OFFSET_PIXELS + 'px'; |
| 242 div.style.width = width + 'px'; | 249 div.style.width = width + 'px'; |
| 243 div.style.height = height + 'px'; | 250 div.style.height = height + 'px'; |
| 244 div.style.zIndex = i; | 251 div.style.zIndex = i; |
| 245 if (i == this.displays_.length - 1) | 252 if (i == num_displays - 1) |
| 246 div.className += ' displays-primary'; | 253 div.className += ' displays-primary'; |
| 247 this.displays_view_.appendChild(div); | 254 this.displays_view_.appendChild(div); |
| 248 } | 255 } |
| 249 }, | 256 }, |
| 250 | 257 |
| 251 /** | 258 /** |
| 252 * Layouts the display rectangles according to the current layout_. | 259 * Layouts the display rectangles according to the current layout_. |
| 253 * @private | 260 * @private |
| 254 */ | 261 */ |
| 255 layoutDisplays_: function() { | 262 layoutDisplays_: function() { |
| (...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 323 loadTimeData.getString( | 330 loadTimeData.getString( |
| 324 this.mirroring_ ? 'stopMirroring' : 'startMirroring'); | 331 this.mirroring_ ? 'stopMirroring' : 'startMirroring'); |
| 325 | 332 |
| 326 // Focus to the first display next to the primary one when |displays| list | 333 // Focus to the first display next to the primary one when |displays| list |
| 327 // is updated. | 334 // is updated. |
| 328 if (this.displays_.length != displays.length) | 335 if (this.displays_.length != displays.length) |
| 329 this.focused_index_ = 1; | 336 this.focused_index_ = 1; |
| 330 | 337 |
| 331 this.displays_ = displays; | 338 this.displays_ = displays; |
| 332 | 339 |
| 333 if (this.displays_.length <= 1) | |
| 334 return; | |
| 335 | |
| 336 this.resetDisplaysView_(); | 340 this.resetDisplaysView_(); |
| 337 if (this.mirroring_) | 341 if (this.mirroring_) |
| 338 this.layoutMirroringDisplays_(); | 342 this.layoutMirroringDisplays_(); |
| 339 else | 343 else |
| 340 this.layoutDisplays_(); | 344 this.layoutDisplays_(); |
| 341 }, | 345 }, |
| 342 }; | 346 }; |
| 343 | 347 |
| 344 DisplayOptions.setDisplayInfo = function(mirroring, displays, layout) { | 348 DisplayOptions.setDisplayInfo = function(mirroring, displays, layout) { |
| 345 DisplayOptions.getInstance().onDisplayChanged_(mirroring, displays, layout); | 349 DisplayOptions.getInstance().onDisplayChanged_(mirroring, displays, layout); |
| 346 }; | 350 }; |
| 347 | 351 |
| 348 // Export | 352 // Export |
| 349 return { | 353 return { |
| 350 DisplayOptions: DisplayOptions | 354 DisplayOptions: DisplayOptions |
| 351 }; | 355 }; |
| 352 }); | 356 }); |
| OLD | NEW |