OLD | NEW |
1 // Copyright 2014 The ChromeOS IME Authors. All Rights Reserved. | 1 // Copyright 2014 The ChromeOS IME Authors. All Rights Reserved. |
2 // limitations under the License. | 2 // limitations under the License. |
3 // See the License for the specific language governing permissions and | 3 // See the License for the specific language governing permissions and |
4 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | 4 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
5 // distributed under the License is distributed on an "AS-IS" BASIS, | 5 // distributed under the License is distributed on an "AS-IS" BASIS, |
6 // Unless required by applicable law or agreed to in writing, software | 6 // Unless required by applicable law or agreed to in writing, software |
7 // | 7 // |
8 // http://www.apache.org/licenses/LICENSE-2.0 | 8 // http://www.apache.org/licenses/LICENSE-2.0 |
9 // | 9 // |
10 // You may obtain a copy of the License at | 10 // You may obtain a copy of the License at |
11 // you may not use this file except in compliance with the License. | 11 // you may not use this file except in compliance with the License. |
12 // Licensed under the Apache License, Version 2.0 (the "License"); | 12 // Licensed under the Apache License, Version 2.0 (the "License"); |
13 // | 13 // |
14 goog.provide('i18n.input.chrome.inputview.KeyboardContainer'); | 14 goog.provide('i18n.input.chrome.inputview.KeyboardContainer'); |
15 | 15 |
16 goog.require('goog.dom.TagName'); | 16 goog.require('goog.dom.TagName'); |
17 goog.require('goog.dom.classlist'); | 17 goog.require('goog.dom.classlist'); |
18 goog.require('goog.i18n.bidi'); | 18 goog.require('goog.i18n.bidi'); |
19 goog.require('i18n.input.chrome.inputview.Css'); | 19 goog.require('i18n.input.chrome.inputview.Css'); |
20 goog.require('i18n.input.chrome.inputview.GlobalFlags'); | |
21 goog.require('i18n.input.chrome.inputview.elements.Element'); | 20 goog.require('i18n.input.chrome.inputview.elements.Element'); |
22 goog.require('i18n.input.chrome.inputview.elements.ElementType'); | 21 goog.require('i18n.input.chrome.inputview.elements.ElementType'); |
23 goog.require('i18n.input.chrome.inputview.elements.content.AltDataView'); | 22 goog.require('i18n.input.chrome.inputview.elements.content.AltDataView'); |
24 goog.require('i18n.input.chrome.inputview.elements.content.CandidateView'); | 23 goog.require('i18n.input.chrome.inputview.elements.content.CandidateView'); |
25 goog.require('i18n.input.chrome.inputview.elements.content.EmojiView'); | 24 goog.require('i18n.input.chrome.inputview.elements.content.EmojiView'); |
26 goog.require('i18n.input.chrome.inputview.elements.content.ExpandedCandidateView
'); | 25 goog.require('i18n.input.chrome.inputview.elements.content.ExpandedCandidateView
'); |
| 26 goog.require('i18n.input.chrome.inputview.elements.content.FloatingView'); |
27 goog.require('i18n.input.chrome.inputview.elements.content.GestureCanvasView'); | 27 goog.require('i18n.input.chrome.inputview.elements.content.GestureCanvasView'); |
| 28 goog.require('i18n.input.chrome.inputview.elements.content.GesturePreviewView'); |
28 goog.require('i18n.input.chrome.inputview.elements.content.HandwritingView'); | 29 goog.require('i18n.input.chrome.inputview.elements.content.HandwritingView'); |
29 goog.require('i18n.input.chrome.inputview.elements.content.KeysetView'); | 30 goog.require('i18n.input.chrome.inputview.elements.content.KeysetView'); |
30 goog.require('i18n.input.chrome.inputview.elements.content.MenuView'); | 31 goog.require('i18n.input.chrome.inputview.elements.content.MenuView'); |
31 goog.require('i18n.input.chrome.inputview.elements.content.SelectView'); | 32 goog.require('i18n.input.chrome.inputview.elements.content.SelectView'); |
32 goog.require('i18n.input.chrome.inputview.elements.content.SwipeView'); | 33 goog.require('i18n.input.chrome.inputview.elements.content.SwipeView'); |
33 goog.require('i18n.input.chrome.inputview.elements.content.VoiceView'); | 34 goog.require('i18n.input.chrome.inputview.elements.content.VoiceView'); |
34 | 35 |
35 | 36 |
36 | 37 |
37 goog.scope(function() { | 38 goog.scope(function() { |
(...skipping 21 matching lines...) Expand all Loading... |
59 function(adapter, soundController, opt_eventTarget) { | 60 function(adapter, soundController, opt_eventTarget) { |
60 goog.base(this, '', ElementType.KEYBOARD_CONTAINER_VIEW, opt_eventTarget); | 61 goog.base(this, '', ElementType.KEYBOARD_CONTAINER_VIEW, opt_eventTarget); |
61 | 62 |
62 /** @type {!content.CandidateView} */ | 63 /** @type {!content.CandidateView} */ |
63 this.candidateView = new content.CandidateView( | 64 this.candidateView = new content.CandidateView( |
64 'candidateView', adapter, this); | 65 'candidateView', adapter, this); |
65 | 66 |
66 /** @type {!content.AltDataView} */ | 67 /** @type {!content.AltDataView} */ |
67 this.altDataView = new content.AltDataView(this); | 68 this.altDataView = new content.AltDataView(this); |
68 | 69 |
| 70 /** @type {!content.GesturePreviewView} */ |
| 71 this.gesturePreviewView = new content.GesturePreviewView(this); |
| 72 |
69 /** @type {!content.SwipeView} */ | 73 /** @type {!content.SwipeView} */ |
70 this.swipeView = new content.SwipeView(adapter, this); | 74 this.swipeView = new content.SwipeView(adapter, this.candidateView, this); |
71 | 75 |
72 /** @type {!content.SelectView} */ | 76 /** @type {!content.SelectView} */ |
73 this.selectView = new content.SelectView(this); | 77 this.selectView = new content.SelectView(this); |
74 | 78 |
75 if (adapter.isGestureTypingEnabled()) { | |
76 /** @type {!content.GestureCanvasView} */ | |
77 this.gestureCanvasView = new content.GestureCanvasView(this); | |
78 } | |
79 | |
80 /** @type {!content.MenuView} */ | 79 /** @type {!content.MenuView} */ |
81 this.menuView = new content.MenuView(this); | 80 this.menuView = new content.MenuView(this); |
82 | 81 |
83 /** @type {!content.VoiceView} */ | 82 /** @type {!content.VoiceView} */ |
84 this.voiceView = new content.VoiceView(this, adapter, soundController); | 83 this.voiceView = new content.VoiceView(this, adapter, soundController); |
85 | 84 |
86 /** @type {!content.ExpandedCandidateView} */ | 85 /** @type {!content.ExpandedCandidateView} */ |
87 this.expandedCandidateView = new content.ExpandedCandidateView(this); | 86 this.expandedCandidateView = new content.ExpandedCandidateView(this); |
88 | 87 |
89 /** | 88 /** |
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
129 | 128 |
130 | 129 |
131 /** | 130 /** |
132 * An div to wrapper candidate view and keyboard set view. | 131 * An div to wrapper candidate view and keyboard set view. |
133 * | 132 * |
134 * @private {Element} | 133 * @private {Element} |
135 */ | 134 */ |
136 KeyboardContainer.prototype.wrapperDiv_ = null; | 135 KeyboardContainer.prototype.wrapperDiv_ = null; |
137 | 136 |
138 | 137 |
| 138 /** |
| 139 * The gesture canvas view. |
| 140 * |
| 141 * @type {content.GestureCanvasView} |
| 142 */ |
| 143 KeyboardContainer.prototype.gestureCanvasView = null; |
| 144 |
| 145 |
| 146 /** |
| 147 * The gesture canvas view. |
| 148 * |
| 149 * @type {content.FloatingView} |
| 150 */ |
| 151 KeyboardContainer.prototype.floatingView = null; |
| 152 |
| 153 |
139 /** @override */ | 154 /** @override */ |
140 KeyboardContainer.prototype.createDom = function() { | 155 KeyboardContainer.prototype.createDom = function() { |
141 goog.base(this, 'createDom'); | 156 goog.base(this, 'createDom'); |
142 | 157 |
143 var elem = this.getElement(); | 158 var elem = this.getElement(); |
144 var dom = this.getDomHelper(); | 159 var dom = this.getDomHelper(); |
145 this.wrapperDiv_ = dom.createDom(goog.dom.TagName.DIV, Css.WRAPPER); | 160 this.wrapperDiv_ = dom.createDom(goog.dom.TagName.DIV, Css.WRAPPER); |
146 this.candidateView.render(this.wrapperDiv_); | 161 this.candidateView.render(this.wrapperDiv_); |
147 dom.appendChild(elem, this.wrapperDiv_); | 162 dom.appendChild(elem, this.wrapperDiv_); |
148 this.altDataView.render(); | 163 this.altDataView.render(); |
| 164 this.gesturePreviewView.render(); |
149 this.swipeView.render(); | 165 this.swipeView.render(); |
150 this.selectView.render(); | 166 this.selectView.render(); |
151 this.menuView.render(); | 167 this.menuView.render(); |
152 this.voiceView.render(); | 168 this.voiceView.render(); |
153 this.voiceView.setVisible(false); | 169 this.voiceView.setVisible(false); |
154 this.expandedCandidateView.render(this.wrapperDiv_); | 170 this.expandedCandidateView.render(this.wrapperDiv_); |
155 this.expandedCandidateView.setVisible(false); | 171 this.expandedCandidateView.setVisible(false); |
156 if (this.adapter_.isGestureTypingEnabled()) { | 172 if (this.adapter_.isFloatingVirtualKeyboardEnabled()) { |
157 this.gestureCanvasView.render(this.wrapperDiv_); | 173 this.floatingView = new content.FloatingView(this); |
| 174 this.floatingView.render(); |
158 } | 175 } |
| 176 this.gestureCanvasView = new content.GestureCanvasView(this); |
| 177 this.gestureCanvasView.render(this.wrapperDiv_); |
159 goog.dom.classlist.add(elem, Css.CONTAINER); | 178 goog.dom.classlist.add(elem, Css.CONTAINER); |
160 }; | 179 }; |
161 | 180 |
162 | 181 |
163 /** @override */ | 182 /** @override */ |
164 KeyboardContainer.prototype.update = function() { | 183 KeyboardContainer.prototype.update = function() { |
165 this.currentKeysetView && this.currentKeysetView.update(); | 184 this.currentKeysetView && this.currentKeysetView.update(); |
166 }; | 185 }; |
167 | 186 |
168 | 187 |
(...skipping 75 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
244 this.currentKeysetView.deactivate(lastRawkeyset); | 263 this.currentKeysetView.deactivate(lastRawkeyset); |
245 } | 264 } |
246 this.currentKeysetView = view; | 265 this.currentKeysetView = view; |
247 } | 266 } |
248 this.candidateView.updateByKeyset(rawKeyset, isPasswordBox, | 267 this.candidateView.updateByKeyset(rawKeyset, isPasswordBox, |
249 goog.i18n.bidi.isRtlLanguage(languageCode)); | 268 goog.i18n.bidi.isRtlLanguage(languageCode)); |
250 } else { | 269 } else { |
251 view.setVisible(false); | 270 view.setVisible(false); |
252 } | 271 } |
253 } | 272 } |
254 | 273 var isCompact = keyset.indexOf('compact') >= 0; |
| 274 this.selectView.setKeysetSupported(isCompact); |
| 275 this.swipeView.setKeysetSupported(isCompact); |
255 return true; | 276 return true; |
256 }; | 277 }; |
257 | 278 |
258 | 279 |
259 /** | 280 /** |
260 * Resizes the whole keyboard. | 281 * Resizes the whole keyboard. |
261 * | 282 * |
262 * @param {number} width . | 283 * @param {number} width . |
263 * @param {number} height . | 284 * @param {number} height . |
264 * @param {number} widthPercent . | 285 * @param {number} widthPercent . |
265 * @param {number} candidateViewHeight . | 286 * @param {number} candidateViewHeight . |
266 */ | 287 */ |
267 KeyboardContainer.prototype.setContainerSize = function(width, height, | 288 KeyboardContainer.prototype.setContainerSize = function(width, height, |
268 widthPercent, candidateViewHeight) { | 289 widthPercent, candidateViewHeight) { |
269 if (!this.currentKeysetView) { | 290 if (!this.currentKeysetView) { |
270 return; | 291 return; |
271 } | 292 } |
272 var elem = this.getElement(); | 293 var elem = this.getElement(); |
273 | 294 |
274 var h = height; | 295 var h = height; |
275 var wrapperMargin = 0; | 296 var wrapperMargin = 0; |
276 if (this.currentKeysetView.isTabStyle()) { | |
277 h = height - 2 * KeyboardContainer.TAB_MARGIN_; | |
278 wrapperMargin = KeyboardContainer.TAB_MARGIN_; | |
279 } | |
280 this.wrapperDiv_.style.marginTop = this.wrapperDiv_.style.marginBottom = | 297 this.wrapperDiv_.style.marginTop = this.wrapperDiv_.style.marginBottom = |
281 wrapperMargin + 'px'; | 298 wrapperMargin + 'px'; |
282 h -= KeyboardContainer.PADDING_BOTTOM_; | 299 h -= KeyboardContainer.PADDING_BOTTOM_; |
283 elem.style.paddingBottom = KeyboardContainer.PADDING_BOTTOM_ + 'px'; | 300 elem.style.paddingBottom = KeyboardContainer.PADDING_BOTTOM_ + 'px'; |
284 | 301 |
285 var padding = Math.round((width - width * widthPercent) / 2); | 302 var padding = Math.round((width - width * widthPercent) / 2); |
286 var w = width - 2 * padding; | 303 var w = width - 2 * padding; |
287 | 304 |
288 // Reduce height if candidate view is enabled | 305 // Reduce height if candidate view is enabled |
289 h = this.currentKeysetView.disableCandidateView ? h : | 306 h = this.currentKeysetView.disableCandidateView ? h : |
290 h - candidateViewHeight; | 307 h - candidateViewHeight; |
291 | 308 |
292 var backspaceWeight = this.currentKeysetView.backspaceKey ? | 309 var backspaceWeight = this.currentKeysetView.backspaceKey ? |
293 this.currentKeysetView.backspaceKey.getParent().getWidthInWeight() : 0; | 310 this.currentKeysetView.backspaceKey.getParent().getWidthInWeight() : 0; |
294 this.candidateView.setWidthInWeight( | 311 this.candidateView.setWidthInWeight( |
295 this.currentKeysetView.getWidthInWeight(), backspaceWeight); | 312 this.currentKeysetView.getWidthInWeight(), backspaceWeight); |
296 this.candidateView.resize(w, candidateViewHeight); | 313 this.candidateView.resize(w, candidateViewHeight); |
297 this.expandedCandidateView.setWidthInWeight( | 314 this.expandedCandidateView.setWidthInWeight( |
298 this.currentKeysetView.getWidthInWeight(), backspaceWeight); | 315 this.currentKeysetView.getWidthInWeight(), backspaceWeight); |
299 this.expandedCandidateView.resize(w, h); | 316 this.expandedCandidateView.resize(w, h); |
300 if (i18n.input.chrome.inputview.GlobalFlags.isQPInputView) { | 317 var candidateElem = this.candidateView.getElement(); |
301 var candidateElem = this.candidateView.getElement(); | 318 candidateElem.style.paddingLeft = candidateElem.style.paddingRight = |
302 candidateElem.style.paddingLeft = candidateElem.style.paddingRight = | 319 padding + 'px'; |
303 padding + 'px'; | 320 this.currentKeysetView.resize(width, h, widthPercent); |
304 this.currentKeysetView.resize(width, h, widthPercent); | 321 var expandViewElem = this.expandedCandidateView.getElement(); |
305 var expandViewElem = this.expandedCandidateView.getElement(); | 322 expandViewElem.style.marginLeft = expandViewElem.style.marginRight = |
306 expandViewElem.style.marginLeft = expandViewElem.style.marginRight = | 323 padding + 'px'; |
307 padding + 'px'; | |
308 } else { | |
309 this.currentKeysetView.resize(w, h, 1); | |
310 elem.style.paddingLeft = elem.style.paddingRight = padding + 'px'; | |
311 } | |
312 if (this.expandedCandidateView.isVisible()) { | 324 if (this.expandedCandidateView.isVisible()) { |
313 // Closes the expanded candidate view if it's visible. | 325 // Closes the expanded candidate view if it's visible. |
314 // This is to avoid mis-layout issue for the expanded candidate when screen | 326 // This is to avoid mis-layout issue for the expanded candidate when screen |
315 // is rotated. | 327 // is rotated. |
316 this.expandedCandidateView.state = content.ExpandedCandidateView.State.NONE; | 328 this.expandedCandidateView.state = content.ExpandedCandidateView.State.NONE; |
317 this.candidateView.switchToIcon( | 329 this.candidateView.switchToIcon( |
318 content.CandidateView.IconType.EXPAND_CANDIDATES, true); | 330 content.CandidateView.IconType.EXPAND_CANDIDATES, true); |
319 this.expandedCandidateView.setVisible(false); | 331 this.expandedCandidateView.setVisible(false); |
320 this.currentKeysetView.setVisible(true); | 332 this.currentKeysetView.setVisible(true); |
321 } | 333 } |
322 this.altDataView.resize(screen.width, height); | 334 this.altDataView.resize(width, height); |
323 this.swipeView.resize(screen.width, height); | 335 this.gesturePreviewView.resize(width, height); |
324 this.selectView.resize(screen.width, height); | 336 this.swipeView.resize(width, height); |
325 this.menuView.resize(screen.width, height); | 337 this.selectView.resize(width, height); |
| 338 this.menuView.resize(width, height); |
326 this.voiceView.resize(w + padding, height); | 339 this.voiceView.resize(w + padding, height); |
327 if (this.adapter_.isGestureTypingEnabled()) { | 340 if (this.floatingView) { |
328 this.gestureCanvasView.resize(screen.width, height); | 341 this.floatingView.resize(width, height); |
329 } | 342 } |
| 343 this.gestureCanvasView.resize(width, height); |
330 }; | 344 }; |
331 | 345 |
332 | 346 |
333 /** @override */ | 347 /** @override */ |
334 KeyboardContainer.prototype.disposeInternal = function() { | 348 KeyboardContainer.prototype.disposeInternal = function() { |
335 goog.dispose(this.candidateView); | 349 goog.dispose(this.candidateView); |
336 goog.dispose(this.altDataView); | 350 goog.dispose(this.altDataView); |
| 351 goog.dispose(this.gesturePreviewView); |
337 goog.dispose(this.swipeView); | 352 goog.dispose(this.swipeView); |
338 goog.dispose(this.selectView); | 353 goog.dispose(this.selectView); |
339 goog.dispose(this.menuView); | 354 goog.dispose(this.menuView); |
340 goog.dispose(this.voiceView); | 355 goog.dispose(this.voiceView); |
341 if (this.adapter_.isGestureTypingEnabled()) { | 356 if (this.floatingView) { |
342 goog.dispose(this.gestureCanvasView); | 357 goog.dispose(this.floatingView); |
343 } | 358 } |
| 359 goog.dispose(this.gestureCanvasView); |
344 for (var key in this.keysetViewMap) { | 360 for (var key in this.keysetViewMap) { |
345 goog.dispose(this.keysetViewMap[key]); | 361 goog.dispose(this.keysetViewMap[key]); |
346 } | 362 } |
347 | 363 |
348 goog.base(this, 'disposeInternal'); | 364 goog.base(this, 'disposeInternal'); |
349 }; | 365 }; |
350 | 366 |
351 | 367 |
352 /** | 368 /** |
353 * Whether there are strokes on canvas. | 369 * Whether there are strokes on canvas. |
(...skipping 12 matching lines...) Expand all Loading... |
366 /** | 382 /** |
367 * Cleans the stokes. | 383 * Cleans the stokes. |
368 */ | 384 */ |
369 KeyboardContainer.prototype.cleanStroke = function() { | 385 KeyboardContainer.prototype.cleanStroke = function() { |
370 if (this.currentKeysetView) { | 386 if (this.currentKeysetView) { |
371 this.currentKeysetView.cleanStroke(); | 387 this.currentKeysetView.cleanStroke(); |
372 } | 388 } |
373 }; | 389 }; |
374 | 390 |
375 }); // goog.scope | 391 }); // goog.scope |
OLD | NEW |