OLD | NEW |
---|---|
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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 * Apps v2 custom title bar implementation | 7 * Apps v2 custom title bar implementation |
8 */ | 8 */ |
9 | 9 |
10 'use strict'; | 10 'use strict'; |
11 | 11 |
12 /** @suppress {duplicate} */ | 12 /** @suppress {duplicate} */ |
13 var remoting = remoting || {}; | 13 var remoting = remoting || {}; |
14 | 14 |
15 /** | 15 /** |
16 * @param {HTMLElement} titleBar The root node of the title-bar DOM hierarchy. | 16 * @param {HTMLElement} titleBar The root node of the title-bar DOM hierarchy. |
17 * @constructor | 17 * @constructor |
18 */ | 18 */ |
19 remoting.WindowFrame = function(titleBar) { | 19 remoting.WindowFrame = function(titleBar) { |
20 /** | 20 /** |
21 * @type {boolean} | 21 * @type {remoting.ClientSession} |
22 * @private | 22 * @private |
23 */ | 23 */ |
24 this.isConnected_ = false; | 24 this.clientSession_ = null; |
25 | 25 |
26 /** | 26 /** |
27 * @type {HTMLElement} | 27 * @type {HTMLElement} |
28 * @private | 28 * @private |
29 */ | 29 */ |
30 this.titleBar_ = titleBar; | 30 this.titleBar_ = titleBar; |
31 | 31 |
32 /** | 32 /** |
33 * @type {HTMLElement} | 33 * @type {HTMLElement} |
34 * @private | 34 * @private |
35 */ | 35 */ |
36 this.hoverTarget_ = /** @type {HTMLElement} */ | 36 this.hoverTarget_ = /** @type {HTMLElement} */ |
37 (titleBar.querySelector('.window-controls-hover-target')); | 37 (titleBar.querySelector('.window-controls-hover-target')); |
38 base.debug.assert(this.hoverTarget_ != null); | 38 base.debug.assert(this.hoverTarget_ != null); |
39 | 39 |
40 /** | 40 /** |
41 * @type {remoting.OptionsMenu} | |
42 * @private | |
43 */ | |
44 this.optionsMenu_ = new remoting.OptionsMenu( | |
45 titleBar.querySelector('.menu-send-ctrl-alt-del'), | |
46 titleBar.querySelector('.menu-send-print-screen'), | |
47 titleBar.querySelector('.menu-resize-to-client'), | |
48 titleBar.querySelector('.menu-shrink-to-fit'), | |
49 titleBar.querySelector('.menu-new-connection'), | |
50 null); | |
51 | |
52 /** | |
41 * @type {HTMLElement} | 53 * @type {HTMLElement} |
42 * @private | 54 * @private |
43 */ | 55 */ |
56 this.title_ = /** @type {HTMLElement} */ | |
57 (titleBar.querySelector('.window-title')); | |
58 base.debug.assert(this.title_ != null); | |
59 | |
60 /** | |
61 * @type {HTMLElement} | |
62 * @private | |
63 */ | |
44 this.maximizeRestoreControl_ = /** @type {HTMLElement} */ | 64 this.maximizeRestoreControl_ = /** @type {HTMLElement} */ |
45 (titleBar.querySelector('.window-maximize-restore')); | 65 (titleBar.querySelector('.window-maximize-restore')); |
46 base.debug.assert(this.maximizeRestoreControl_ != null); | 66 base.debug.assert(this.maximizeRestoreControl_ != null); |
47 | 67 |
68 var optionsButton = titleBar.querySelector('.window-options'); | |
69 base.debug.assert(optionsButton != null); | |
70 this.optionMenuButton_ = new remoting.MenuButton( | |
71 optionsButton, | |
72 this.onShowOptionsMenu_.bind(this), | |
73 this.onHideOptionsMenu_.bind(this)); | |
74 | |
48 /** | 75 /** |
49 * @type {Array.<{cls:string, fn: function()}>} | 76 * @type {Array.<{cls:string, fn: function()}>} |
50 */ | 77 */ |
51 var handlers = [ | 78 var handlers = [ |
52 { cls: 'window-disconnect', fn: this.disconnectSession_.bind(this) }, | 79 { cls: 'window-disconnect', fn: this.disconnectSession_.bind(this) }, |
53 { cls: 'window-maximize-restore', | 80 { cls: 'window-maximize-restore', |
54 fn: this.maximizeOrRestoreWindow_.bind(this) }, | 81 fn: this.maximizeOrRestoreWindow_.bind(this) }, |
55 { cls: 'window-minimize', fn: this.minimizeWindow_.bind(this) }, | 82 { cls: 'window-minimize', fn: this.minimizeWindow_.bind(this) }, |
56 { cls: 'window-close', fn: window.close.bind(window) }, | 83 { cls: 'window-close', fn: window.close.bind(window) }, |
57 { cls: 'window-controls-stub', fn: this.toggleWindowControls_.bind(this) } | 84 { cls: 'window-controls-stub', fn: this.toggleWindowControls_.bind(this) } |
58 ]; | 85 ]; |
59 for (var i = 0; i < handlers.length; ++i) { | 86 for (var i = 0; i < handlers.length; ++i) { |
60 var element = titleBar.querySelector('.' + handlers[i].cls); | 87 var element = titleBar.querySelector('.' + handlers[i].cls); |
61 base.debug.assert(element != null); | 88 base.debug.assert(element != null); |
62 element.addEventListener('click', handlers[i].fn, false); | 89 element.addEventListener('click', handlers[i].fn, false); |
63 } | 90 } |
64 | 91 |
65 // Ensure that tool-tips are always correct. | 92 // Ensure that tool-tips are always correct. |
66 this.updateMaximizeOrRestoreIconTitle_(); | 93 this.updateMaximizeOrRestoreIconTitle_(); |
67 chrome.app.window.current().onMaximized.addListener( | 94 chrome.app.window.current().onMaximized.addListener( |
68 this.updateMaximizeOrRestoreIconTitle_.bind(this)); | 95 this.updateMaximizeOrRestoreIconTitle_.bind(this)); |
69 chrome.app.window.current().onRestored.addListener( | 96 chrome.app.window.current().onRestored.addListener( |
70 this.updateMaximizeOrRestoreIconTitle_.bind(this)); | 97 this.updateMaximizeOrRestoreIconTitle_.bind(this)); |
71 chrome.app.window.current().onFullscreened.addListener( | 98 chrome.app.window.current().onFullscreened.addListener( |
72 this.updateMaximizeOrRestoreIconTitle_.bind(this)); | 99 this.updateMaximizeOrRestoreIconTitle_.bind(this)); |
73 }; | 100 }; |
74 | 101 |
75 /** | 102 /** |
76 * @param {boolean} isConnected True if there is a connection active. | 103 * @param {remoting.ClientSession} clientSession The client session, or null if |
104 * there is no connection. | |
77 */ | 105 */ |
78 remoting.WindowFrame.prototype.setConnected = function(isConnected) { | 106 remoting.WindowFrame.prototype.setClientSession = function(clientSession) { |
79 this.isConnected_ = isConnected; | 107 this.optionsMenu_.setClientSession(clientSession); |
80 if (this.isConnected_) { | 108 this.clientSession_ = clientSession; |
kelvinp
2014/07/23 18:49:08
It seems like clientSession_ is only used as a boo
Jamie
2014/07/23 20:00:38
We need a ClientSession in order to set the window
| |
109 var windowTitle = document.head.querySelector('title'); | |
110 if (this.clientSession_) { | |
81 document.body.classList.add('connected'); | 111 document.body.classList.add('connected'); |
112 this.title_.innerText = clientSession.getHostDisplayName(); | |
113 windowTitle.innerText = clientSession.getHostDisplayName() + ' - ' + | |
114 chrome.i18n.getMessage(/*i18n-content*/'PRODUCT_NAME'); | |
82 } else { | 115 } else { |
83 document.body.classList.remove('connected'); | 116 document.body.classList.remove('connected'); |
117 this.title_.innerHTML = ' '; | |
118 windowTitle.innerText = | |
119 chrome.i18n.getMessage(/*i18n-content*/'PRODUCT_NAME'); | |
84 } | 120 } |
85 this.updateMaximizeOrRestoreIconTitle_(); | 121 this.updateMaximizeOrRestoreIconTitle_(); |
86 }; | 122 }; |
87 | 123 |
88 /** | 124 /** |
89 * @return {{width: number, height: number}} The size of the window, ignoring | 125 * @return {{width: number, height: number}} The size of the window, ignoring |
90 * the title-bar and window borders, if visible. | 126 * the title-bar and window borders, if visible. |
91 */ | 127 */ |
92 remoting.WindowFrame.prototype.getClientArea = function() { | 128 remoting.WindowFrame.prototype.getClientArea = function() { |
93 if (chrome.app.window.current().isFullscreen()) { | 129 if (chrome.app.window.current().isFullscreen()) { |
(...skipping 28 matching lines...) Expand all Loading... | |
122 remoting.WindowFrame.prototype.maximizeOrRestoreWindow_ = function() { | 158 remoting.WindowFrame.prototype.maximizeOrRestoreWindow_ = function() { |
123 /** @type {boolean} */ | 159 /** @type {boolean} */ |
124 var restore = | 160 var restore = |
125 chrome.app.window.current().isFullscreen() || | 161 chrome.app.window.current().isFullscreen() || |
126 chrome.app.window.current().isMaximized(); | 162 chrome.app.window.current().isMaximized(); |
127 if (restore) { | 163 if (restore) { |
128 // Restore twice: once to exit full-screen and once to exit maximized. | 164 // Restore twice: once to exit full-screen and once to exit maximized. |
129 // If the app is not full-screen, or went full-screen without first | 165 // If the app is not full-screen, or went full-screen without first |
130 // being maximized, then the second restore has no effect. | 166 // being maximized, then the second restore has no effect. |
131 chrome.app.window.current().restore(); | 167 chrome.app.window.current().restore(); |
132 } else if (this.isConnected_) { | 168 chrome.app.window.current().restore(); |
169 } else if (this.clientSession_) { | |
133 chrome.app.window.current().fullscreen(); | 170 chrome.app.window.current().fullscreen(); |
134 } else { | 171 } else { |
135 chrome.app.window.current().maximize(); | 172 chrome.app.window.current().maximize(); |
136 } | 173 } |
137 }; | 174 }; |
138 | 175 |
139 /** | 176 /** |
140 * @private | 177 * @private |
141 */ | 178 */ |
142 remoting.WindowFrame.prototype.minimizeWindow_ = function() { | 179 remoting.WindowFrame.prototype.minimizeWindow_ = function() { |
(...skipping 13 matching lines...) Expand all Loading... | |
156 * | 193 * |
157 * @private | 194 * @private |
158 */ | 195 */ |
159 remoting.WindowFrame.prototype.updateMaximizeOrRestoreIconTitle_ = function() { | 196 remoting.WindowFrame.prototype.updateMaximizeOrRestoreIconTitle_ = function() { |
160 /** @type {string} */ | 197 /** @type {string} */ |
161 var tag = ''; | 198 var tag = ''; |
162 if (chrome.app.window.current().isFullscreen()) { | 199 if (chrome.app.window.current().isFullscreen()) { |
163 tag = /*i18n-content*/'EXIT_FULL_SCREEN'; | 200 tag = /*i18n-content*/'EXIT_FULL_SCREEN'; |
164 } else if (chrome.app.window.current().isMaximized()) { | 201 } else if (chrome.app.window.current().isMaximized()) { |
165 tag = /*i18n-content*/'RESTORE_WINDOW'; | 202 tag = /*i18n-content*/'RESTORE_WINDOW'; |
166 } else if (this.isConnected_) { | 203 } else if (this.clientSession_) { |
167 tag = /*i18n-content*/'FULL_SCREEN'; | 204 tag = /*i18n-content*/'FULL_SCREEN'; |
168 } else { | 205 } else { |
169 tag = /*i18n-content*/'MAXIMIZE_WINDOW'; | 206 tag = /*i18n-content*/'MAXIMIZE_WINDOW'; |
170 } | 207 } |
171 this.maximizeRestoreControl_.title = l10n.getTranslationOrError(tag); | 208 this.maximizeRestoreControl_.title = l10n.getTranslationOrError(tag); |
172 }; | 209 }; |
173 | 210 |
211 /** | |
212 * Callback invoked when the options menu is shown. | |
213 * @private | |
214 */ | |
215 remoting.WindowFrame.prototype.onShowOptionsMenu_ = function() { | |
216 this.optionsMenu_.onShow(); | |
217 this.hoverTarget_.classList.add('menu-opened'); | |
218 }; | |
219 | |
220 /** | |
221 * Callback invoked when the options menu is shown. | |
222 * @private | |
223 */ | |
224 remoting.WindowFrame.prototype.onHideOptionsMenu_ = function() { | |
225 this.hoverTarget_.classList.remove('menu-opened'); | |
226 }; | |
227 | |
228 | |
174 /** @type {remoting.WindowFrame} */ | 229 /** @type {remoting.WindowFrame} */ |
175 remoting.windowFrame = null; | 230 remoting.windowFrame = null; |
OLD | NEW |