| OLD | NEW |
| 1 // Copyright 2015 The Chromium Authors. All rights reserved. | 1 // Copyright 2015 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 /** | 5 /** |
| 6 * @fileoverview | 6 * @fileoverview |
| 7 * Class handling user-facing aspects of the client session. | 7 * Class handling user-facing aspects of the client session. |
| 8 */ | 8 */ |
| 9 | 9 |
| 10 'use strict'; | 10 'use strict'; |
| (...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 53 | 53 |
| 54 /** @type {string} @private */ | 54 /** @type {string} @private */ |
| 55 this.defaultRemapKeys_ = defaultRemapKeys; | 55 this.defaultRemapKeys_ = defaultRemapKeys; |
| 56 | 56 |
| 57 /** | 57 /** |
| 58 * Called when the UI is finished initializing. | 58 * Called when the UI is finished initializing. |
| 59 * @type {function(remoting.Error, remoting.ClientPlugin):void} | 59 * @type {function(remoting.Error, remoting.ClientPlugin):void} |
| 60 */ | 60 */ |
| 61 this.onInitialized_ = onInitialized; | 61 this.onInitialized_ = onInitialized; |
| 62 | 62 |
| 63 /** @type {function(boolean=):void} @private */ | |
| 64 this.callOnFullScreenChanged_ = this.onFullScreenChanged_.bind(this) | |
| 65 | |
| 66 /** @private */ | 63 /** @private */ |
| 67 this.callPluginLostFocus_ = this.pluginLostFocus_.bind(this); | 64 this.callPluginLostFocus_ = this.pluginLostFocus_.bind(this); |
| 68 /** @private */ | 65 /** @private */ |
| 69 this.callPluginGotFocus_ = this.pluginGotFocus_.bind(this); | 66 this.callPluginGotFocus_ = this.pluginGotFocus_.bind(this); |
| 70 /** @type {Element} @private */ | 67 /** @type {Element} @private */ |
| 71 this.debugRegionContainer_ = | 68 this.debugRegionContainer_ = |
| 72 this.container_.querySelector('.debug-region-container'); | 69 this.container_.querySelector('.debug-region-container'); |
| 73 | 70 |
| 74 /** @type {Element} @private */ | 71 /** @type {Element} @private */ |
| 75 this.mouseCursorOverlay_ = | 72 this.mouseCursorOverlay_ = |
| 76 this.container_.querySelector('.mouse-cursor-overlay'); | 73 this.container_.querySelector('.mouse-cursor-overlay'); |
| 77 | 74 |
| 78 /** @private {remoting.DesktopViewport} */ | 75 /** @private {remoting.DesktopViewport} */ |
| 79 this.viewport_ = null; | 76 this.viewport_ = null; |
| 80 | 77 |
| 81 /** @type {Element} */ | 78 /** @type {Element} */ |
| 82 var img = this.mouseCursorOverlay_; | 79 var img = this.mouseCursorOverlay_; |
| 83 /** @param {Event} event @private */ | 80 /** @param {Event} event @private */ |
| 84 this.updateMouseCursorPosition_ = function(event) { | 81 this.updateMouseCursorPosition_ = function(event) { |
| 85 img.style.top = event.offsetY + 'px'; | 82 img.style.top = event.offsetY + 'px'; |
| 86 img.style.left = event.offsetX + 'px'; | 83 img.style.left = event.offsetX + 'px'; |
| 87 }; | 84 }; |
| 88 | 85 |
| 89 /** @type {remoting.VideoFrameRecorder} @private */ | 86 /** @type {remoting.VideoFrameRecorder} @private */ |
| 90 this.videoFrameRecorder_ = null; | 87 this.videoFrameRecorder_ = null; |
| 88 |
| 89 /** private {base.Disposable} */ |
| 90 this.eventHooks_ = null; |
| 91 }; | 91 }; |
| 92 | 92 |
| 93 // The mode of this session. | 93 // The mode of this session. |
| 94 /** @enum {number} */ | 94 /** @enum {number} */ |
| 95 remoting.DesktopConnectedView.Mode = { | 95 remoting.DesktopConnectedView.Mode = { |
| 96 IT2ME: 0, | 96 IT2ME: 0, |
| 97 ME2ME: 1, | 97 ME2ME: 1, |
| 98 APP_REMOTING: 2 | 98 APP_REMOTING: 2 |
| 99 }; | 99 }; |
| 100 | 100 |
| (...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 215 | 215 |
| 216 this.plugin_.setMouseCursorHandler(this.updateMouseCursorImage_.bind(this)); | 216 this.plugin_.setMouseCursorHandler(this.updateMouseCursorImage_.bind(this)); |
| 217 | 217 |
| 218 this.onInitialized_(remoting.Error.NONE, this.plugin_); | 218 this.onInitialized_(remoting.Error.NONE, this.plugin_); |
| 219 }; | 219 }; |
| 220 | 220 |
| 221 /** | 221 /** |
| 222 * This is a callback that gets called when the window is resized. | 222 * This is a callback that gets called when the window is resized. |
| 223 * | 223 * |
| 224 * @return {void} Nothing. | 224 * @return {void} Nothing. |
| 225 * @private. |
| 225 */ | 226 */ |
| 226 remoting.DesktopConnectedView.prototype.onResize = function() { | 227 remoting.DesktopConnectedView.prototype.onResize_ = function() { |
| 227 if (this.viewport_) { | 228 if (this.viewport_) { |
| 228 this.viewport_.onResize(); | 229 this.viewport_.onResize(); |
| 229 } | 230 } |
| 230 }; | 231 }; |
| 231 | 232 |
| 232 /** | 233 /** |
| 234 * Called when the app window is hidden. |
| 235 * @return {void} Nothing. |
| 236 */ |
| 237 remoting.DesktopConnectedView.prototype.onVisibilityChanged_ = function() { |
| 238 this.pauseVideo(document.hidden); |
| 239 }; |
| 240 |
| 241 /** |
| 233 * Callback that the plugin invokes to indicate when the connection is | 242 * Callback that the plugin invokes to indicate when the connection is |
| 234 * ready. | 243 * ready. |
| 235 * | 244 * |
| 236 * @param {boolean} ready True if the connection is ready. | 245 * @param {boolean} ready True if the connection is ready. |
| 237 */ | 246 */ |
| 238 remoting.DesktopConnectedView.prototype.onConnectionReady = function(ready) { | 247 remoting.DesktopConnectedView.prototype.onConnectionReady = function(ready) { |
| 239 if (!ready) { | 248 if (!ready) { |
| 240 this.container_.classList.add('session-client-inactive'); | 249 this.container_.classList.add('session-client-inactive'); |
| 241 } else { | 250 } else { |
| 242 this.container_.classList.remove('session-client-inactive'); | 251 this.container_.classList.remove('session-client-inactive'); |
| (...skipping 19 matching lines...) Expand all Loading... |
| 262 | 271 |
| 263 this.updateClientSessionUi_(null); | 272 this.updateClientSessionUi_(null); |
| 264 }; | 273 }; |
| 265 | 274 |
| 266 /** | 275 /** |
| 267 * @param {remoting.ClientSession} clientSession The active session, or null if | 276 * @param {remoting.ClientSession} clientSession The active session, or null if |
| 268 * there is no connection. | 277 * there is no connection. |
| 269 */ | 278 */ |
| 270 remoting.DesktopConnectedView.prototype.updateClientSessionUi_ = function( | 279 remoting.DesktopConnectedView.prototype.updateClientSessionUi_ = function( |
| 271 clientSession) { | 280 clientSession) { |
| 272 if (clientSession == null) { | 281 if (clientSession === null) { |
| 273 if (remoting.windowFrame) { | 282 if (remoting.windowFrame) { |
| 274 remoting.windowFrame.setDesktopConnectedView(null); | 283 remoting.windowFrame.setDesktopConnectedView(null); |
| 275 } | 284 } |
| 276 if (remoting.toolbar) { | 285 if (remoting.toolbar) { |
| 277 remoting.toolbar.setDesktopConnectedView(null); | 286 remoting.toolbar.setDesktopConnectedView(null); |
| 278 } | 287 } |
| 279 if (remoting.optionsMenu) { | 288 if (remoting.optionsMenu) { |
| 280 remoting.optionsMenu.setDesktopConnectedView(null); | 289 remoting.optionsMenu.setDesktopConnectedView(null); |
| 281 } | 290 } |
| 282 | 291 |
| 283 document.body.classList.remove('connected'); | 292 document.body.classList.remove('connected'); |
| 284 this.container_.removeEventListener( | 293 this.container_.removeEventListener( |
| 285 'mousemove', this.updateMouseCursorPosition_, true); | 294 'mousemove', this.updateMouseCursorPosition_, true); |
| 286 // Stop listening for full-screen events. | 295 base.dispose(this.eventHooks_); |
| 287 remoting.fullscreen.removeListener(this.callOnFullScreenChanged_); | 296 this.eventHooks_ = null; |
| 288 | |
| 289 base.dispose(this.viewport_); | 297 base.dispose(this.viewport_); |
| 290 this.viewport_ = null; | 298 this.viewport_ = null; |
| 291 } else { | 299 } else { |
| 292 var scrollerElement = document.getElementById('scroller'); | 300 var scrollerElement = document.getElementById('scroller'); |
| 293 this.viewport_ = new remoting.DesktopViewport( | 301 this.viewport_ = new remoting.DesktopViewport( |
| 294 scrollerElement || document.body, | 302 scrollerElement || document.body, |
| 295 this.plugin_.hostDesktop(), | 303 this.plugin_.hostDesktop(), |
| 296 this.host_.options); | 304 this.host_.options); |
| 297 if (remoting.windowFrame) { | 305 if (remoting.windowFrame) { |
| 298 remoting.windowFrame.setDesktopConnectedView(this); | 306 remoting.windowFrame.setDesktopConnectedView(this); |
| 299 } | 307 } |
| 300 if (remoting.toolbar) { | 308 if (remoting.toolbar) { |
| 301 remoting.toolbar.setDesktopConnectedView(this); | 309 remoting.toolbar.setDesktopConnectedView(this); |
| 302 } | 310 } |
| 303 if (remoting.optionsMenu) { | 311 if (remoting.optionsMenu) { |
| 304 remoting.optionsMenu.setDesktopConnectedView(this); | 312 remoting.optionsMenu.setDesktopConnectedView(this); |
| 305 } | 313 } |
| 306 | 314 |
| 307 document.body.classList.add('connected'); | 315 document.body.classList.add('connected'); |
| 308 this.container_.addEventListener( | 316 this.container_.addEventListener( |
| 309 'mousemove', this.updateMouseCursorPosition_, true); | 317 'mousemove', this.updateMouseCursorPosition_, true); |
| 310 | |
| 311 // Activate full-screen related UX. | 318 // Activate full-screen related UX. |
| 312 remoting.fullscreen.addListener(this.callOnFullScreenChanged_); | 319 this.setFocusHandlers_(); |
| 320 this.eventHooks_ = new base.Disposables( |
| 321 new base.DomEventHook(window, 'resize', this.onResize_.bind(this), false), |
| 322 new base.DomEventHook(document, 'visibilitychange', |
| 323 this.onVisibilityChanged_.bind(this), false), |
| 324 new remoting.Fullscreen.EventHook(this.onFullScreenChanged_.bind(this)) |
| 325 ); |
| 313 this.onFullScreenChanged_(remoting.fullscreen.isActive()); | 326 this.onFullScreenChanged_(remoting.fullscreen.isActive()); |
| 314 this.setFocusHandlers_(); | |
| 315 } | 327 } |
| 316 }; | 328 }; |
| 317 | 329 |
| 318 /** | 330 /** |
| 319 * Constrains the focus to the plugin element. | 331 * Constrains the focus to the plugin element. |
| 320 * @private | 332 * @private |
| 321 */ | 333 */ |
| 322 remoting.DesktopConnectedView.prototype.setFocusHandlers_ = function() { | 334 remoting.DesktopConnectedView.prototype.setFocusHandlers_ = function() { |
| 323 this.plugin_.element().addEventListener( | 335 this.plugin_.element().addEventListener( |
| 324 'focus', this.callPluginGotFocus_, false); | 336 'focus', this.callPluginGotFocus_, false); |
| (...skipping 24 matching lines...) Expand all Loading... |
| 349 * Called when the full-screen status has changed, either via the | 361 * Called when the full-screen status has changed, either via the |
| 350 * remoting.Fullscreen class, or via a system event such as the Escape key | 362 * remoting.Fullscreen class, or via a system event such as the Escape key |
| 351 * | 363 * |
| 352 * @param {boolean=} fullscreen True if the app is entering full-screen mode; | 364 * @param {boolean=} fullscreen True if the app is entering full-screen mode; |
| 353 * false if it is leaving it. | 365 * false if it is leaving it. |
| 354 * @private | 366 * @private |
| 355 */ | 367 */ |
| 356 remoting.DesktopConnectedView.prototype.onFullScreenChanged_ = function ( | 368 remoting.DesktopConnectedView.prototype.onFullScreenChanged_ = function ( |
| 357 fullscreen) { | 369 fullscreen) { |
| 358 if (this.viewport_) { | 370 if (this.viewport_) { |
| 371 // When a window goes full-screen, a resize event is triggered, but the |
| 372 // Fullscreen.isActive call is not guaranteed to return true until the |
| 373 // full-screen event is triggered. In apps v2, the size of the window's |
| 374 // client area is calculated differently in full-screen mode, so register |
| 375 // for both events. |
| 376 this.viewport_.onResize(); |
| 359 this.viewport_.enableBumpScroll(Boolean(fullscreen)); | 377 this.viewport_.enableBumpScroll(Boolean(fullscreen)); |
| 360 } | 378 } |
| 361 }; | 379 }; |
| 362 | 380 |
| 363 /** | 381 /** |
| 364 * Callback function called when the plugin element gets focus. | 382 * Callback function called when the plugin element gets focus. |
| 365 */ | 383 */ |
| 366 remoting.DesktopConnectedView.prototype.pluginGotFocus_ = function() { | 384 remoting.DesktopConnectedView.prototype.pluginGotFocus_ = function() { |
| 367 remoting.clipboard.initiateToHost(); | 385 remoting.clipboard.initiateToHost(); |
| 368 }; | 386 }; |
| (...skipping 206 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 575 for (var i = 0; i < rects.length; ++i) { | 593 for (var i = 0; i < rects.length; ++i) { |
| 576 var rect = document.createElement('div'); | 594 var rect = document.createElement('div'); |
| 577 rect.classList.add('debug-region-rect'); | 595 rect.classList.add('debug-region-rect'); |
| 578 rect.style.left = rects[i][0] + 'px'; | 596 rect.style.left = rects[i][0] + 'px'; |
| 579 rect.style.top = rects[i][1] +'px'; | 597 rect.style.top = rects[i][1] +'px'; |
| 580 rect.style.width = rects[i][2] +'px'; | 598 rect.style.width = rects[i][2] +'px'; |
| 581 rect.style.height = rects[i][3] + 'px'; | 599 rect.style.height = rects[i][3] + 'px'; |
| 582 this.debugRegionContainer_.appendChild(rect); | 600 this.debugRegionContainer_.appendChild(rect); |
| 583 } | 601 } |
| 584 } | 602 } |
| 585 } | 603 }; |
| OLD | NEW |