OLD | NEW |
---|---|
1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 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 var vrShellUi = (function() { | 5 var vrShellUi = (function() { |
6 'use strict'; | 6 'use strict'; |
7 | 7 |
8 let scene = new ui.Scene(); | 8 let scene = new ui.Scene(); |
9 let sceneManager; | 9 let sceneManager; |
10 | 10 |
11 let uiRootElement = document.querySelector('#ui'); | 11 let uiRootElement = document.querySelector('#ui'); |
12 let uiStyle = window.getComputedStyle(uiRootElement); | 12 let uiStyle = window.getComputedStyle(uiRootElement); |
13 let scaleFactor = uiStyle.getPropertyValue('--scaleFactor'); | |
14 /** @const */ var ANIM_DURATION = 150; | 13 /** @const */ var ANIM_DURATION = 150; |
15 | 14 |
16 function getStyleFloat(style, property) { | 15 function getStyleFloat(style, property) { |
17 let value = parseFloat(style.getPropertyValue(property)); | 16 let value = parseFloat(style.getPropertyValue(property)); |
18 return isNaN(value) ? 0 : value; | 17 return isNaN(value) ? 0 : value; |
19 } | 18 } |
20 | 19 |
21 class ContentQuad { | 20 class ContentQuad { |
22 constructor() { | 21 constructor() { |
23 /** @const */ this.SCREEN_HEIGHT = 1.6; | 22 /** @const */ this.SCREEN_HEIGHT = 1.6; |
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
63 let domElement = document.querySelector(domId); | 62 let domElement = document.querySelector(domId); |
64 | 63 |
65 // Pull copy rectangle from the position of the element. | 64 // Pull copy rectangle from the position of the element. |
66 let rect = domElement.getBoundingClientRect(); | 65 let rect = domElement.getBoundingClientRect(); |
67 let pixelX = Math.floor(rect.left); | 66 let pixelX = Math.floor(rect.left); |
68 let pixelY = Math.floor(rect.top); | 67 let pixelY = Math.floor(rect.top); |
69 let pixelWidth = Math.ceil(rect.right) - pixelX; | 68 let pixelWidth = Math.ceil(rect.right) - pixelX; |
70 let pixelHeight = Math.ceil(rect.bottom) - pixelY; | 69 let pixelHeight = Math.ceil(rect.bottom) - pixelY; |
71 | 70 |
72 let element = new api.UiElement(pixelX, pixelY, pixelWidth, pixelHeight); | 71 let element = new api.UiElement(pixelX, pixelY, pixelWidth, pixelHeight); |
73 element.setSize(scaleFactor * pixelWidth / 1000, | 72 element.setSize(pixelWidth / 1000, pixelHeight / 1000); |
74 scaleFactor * pixelHeight / 1000); | |
75 | 73 |
76 // Pull additional custom properties from CSS. | 74 // Pull additional custom properties from CSS. |
77 let style = window.getComputedStyle(domElement); | 75 let style = window.getComputedStyle(domElement); |
78 element.setTranslation( | 76 element.setTranslation( |
79 getStyleFloat(style, '--tranX'), | 77 getStyleFloat(style, '--tranX'), |
80 getStyleFloat(style, '--tranY'), | 78 getStyleFloat(style, '--tranY'), |
81 getStyleFloat(style, '--tranZ')); | 79 getStyleFloat(style, '--tranZ')); |
82 | 80 |
83 this.uiElementId = scene.addElement(element); | 81 this.uiElementId = scene.addElement(element); |
84 this.uiAnimationId = -1; | 82 this.uiAnimationId = -1; |
(...skipping 322 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
407 this.menuMode = menuMode; | 405 this.menuMode = menuMode; |
408 this.cinemaMode = cinemaMode; | 406 this.cinemaMode = cinemaMode; |
409 | 407 |
410 this.contentQuad.setEnabled(mode == api.Mode.STANDARD && !menuMode); | 408 this.contentQuad.setEnabled(mode == api.Mode.STANDARD && !menuMode); |
411 this.contentQuad.setCinemaMode(cinemaMode); | 409 this.contentQuad.setCinemaMode(cinemaMode); |
412 // TODO(crbug/643815): Set aspect ratio on content quad when available. | 410 // TODO(crbug/643815): Set aspect ratio on content quad when available. |
413 // TODO(amp): Don't show controls in CINEMA mode once MENU mode lands. | 411 // TODO(amp): Don't show controls in CINEMA mode once MENU mode lands. |
414 this.controls.setEnabled(mode == api.Mode.STANDARD && !menuMode); | 412 this.controls.setEnabled(mode == api.Mode.STANDARD && !menuMode); |
415 this.omnibox.setEnabled(mode == api.Mode.STANDARD && !menuMode); | 413 this.omnibox.setEnabled(mode == api.Mode.STANDARD && !menuMode); |
416 this.secureOriginWarnings.setEnabled(mode == api.Mode.WEB_VR); | 414 this.secureOriginWarnings.setEnabled(mode == api.Mode.WEB_VR); |
415 | |
416 let uiElement = document.querySelector('#ui'); | |
bshe
2016/11/30 23:00:46
nit: use uiRootElement directly?
mthiesse
2016/11/30 23:25:05
Done.
| |
417 api.setUiCssSize(uiElement.clientWidth, uiElement.clientHeight, 1.0); | |
417 } | 418 } |
418 | 419 |
419 setSecureOrigin(secure) { | 420 setSecureOrigin(secure) { |
420 this.secureOriginWarnings.setSecureOrigin(secure); | 421 this.secureOriginWarnings.setSecureOrigin(secure); |
421 this.omnibox.setSecureOrigin(secure); | 422 this.omnibox.setSecureOrigin(secure); |
422 } | 423 } |
423 | 424 |
424 setReloadUiEnabled(enabled) { | 425 setReloadUiEnabled(enabled) { |
425 this.controls.setReloadUiEnabled(enabled); | 426 this.controls.setReloadUiEnabled(enabled); |
426 } | 427 } |
(...skipping 26 matching lines...) Expand all Loading... | |
453 scene.flush(); | 454 scene.flush(); |
454 } | 455 } |
455 | 456 |
456 return { | 457 return { |
457 initialize: initialize, | 458 initialize: initialize, |
458 command: command, | 459 command: command, |
459 }; | 460 }; |
460 })(); | 461 })(); |
461 | 462 |
462 document.addEventListener('DOMContentLoaded', vrShellUi.initialize); | 463 document.addEventListener('DOMContentLoaded', vrShellUi.initialize); |
OLD | NEW |