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 * ImageEditor is the top level object that holds together and connects | 6 * ImageEditor is the top level object that holds together and connects |
7 * everything needed for image editing. | 7 * everything needed for image editing. |
8 * | 8 * |
9 * @param {!Viewport} viewport The viewport. | 9 * @param {!Viewport} viewport The viewport. |
10 * @param {!ImageView} imageView The ImageView containing the images to edit. | 10 * @param {!ImageView} imageView The ImageView containing the images to edit. |
(...skipping 501 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
512 ImageEditor.Mode.prototype.markUpdated = function() { | 512 ImageEditor.Mode.prototype.markUpdated = function() { |
513 this.updated_ = true; | 513 this.updated_ = true; |
514 }; | 514 }; |
515 | 515 |
516 /** | 516 /** |
517 * @return {boolean} True if the mode controls changed. | 517 * @return {boolean} True if the mode controls changed. |
518 */ | 518 */ |
519 ImageEditor.Mode.prototype.isUpdated = function() { return this.updated_; }; | 519 ImageEditor.Mode.prototype.isUpdated = function() { return this.updated_; }; |
520 | 520 |
521 /** | 521 /** |
522 * @return {boolean} True if a key event should be consumed by the mode. | |
523 */ | |
524 ImageEditor.Mode.prototype.isConsumingKeyEvents = function() { return false; }; | |
525 | |
526 /** | |
522 * Resets the mode to a clean state. | 527 * Resets the mode to a clean state. |
523 */ | 528 */ |
524 ImageEditor.Mode.prototype.reset = function() { | 529 ImageEditor.Mode.prototype.reset = function() { |
525 this.editor_.modeToolbar_.reset(); | 530 this.editor_.modeToolbar_.reset(); |
526 this.updated_ = false; | 531 this.updated_ = false; |
527 }; | 532 }; |
528 | 533 |
529 /** | 534 /** |
530 * @return {Command} Command. | 535 * @return {Command} Command. |
531 */ | 536 */ |
(...skipping 140 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
672 /** | 677 /** |
673 * The user clicked on 'OK' or 'Cancel' or on a different mode button. | 678 * The user clicked on 'OK' or 'Cancel' or on a different mode button. |
674 * @param {boolean} commit True if commit is required. | 679 * @param {boolean} commit True if commit is required. |
675 * @param {boolean} leaveToSwitchMode True if it leaves to change mode. | 680 * @param {boolean} leaveToSwitchMode True if it leaves to change mode. |
676 * @private | 681 * @private |
677 */ | 682 */ |
678 ImageEditor.prototype.leaveModeInternal_ = function(commit, leaveToSwitchMode) { | 683 ImageEditor.prototype.leaveModeInternal_ = function(commit, leaveToSwitchMode) { |
679 if (!this.currentMode_) | 684 if (!this.currentMode_) |
680 return; | 685 return; |
681 | 686 |
687 // If the current mode is 'Resize', and commit is required, | |
688 // leaving mode should be stopped when an input value is not valid. | |
689 if(commit && this.currentMode_.name === 'resize') { | |
690 var resizeMode = /** @type {!ImageEditor.Mode.Resize} */ | |
691 (this.currentMode_); | |
692 if(!resizeMode.isInputValid()) { | |
693 resizeMode.showAlertDialog(); | |
694 return; | |
695 } | |
696 } | |
697 | |
682 this.modeToolbar_.show(false); | 698 this.modeToolbar_.show(false); |
683 | 699 |
684 // If it leaves to switch mode, do not restore screen size since the next mode | 700 // If it leaves to switch mode, do not restore screen size since the next mode |
685 // might change screen size. We should avoid to show intermediate animation | 701 // might change screen size. We should avoid to show intermediate animation |
686 // which tries to restore screen size. | 702 // which tries to restore screen size. |
687 if (!leaveToSwitchMode) { | 703 if (!leaveToSwitchMode) { |
688 this.getViewport().setScreenTop(ImageEditor.Toolbar.HEIGHT); | 704 this.getViewport().setScreenTop(ImageEditor.Toolbar.HEIGHT); |
689 this.getViewport().setScreenBottom(ImageEditor.Toolbar.HEIGHT); | 705 this.getViewport().setScreenBottom(ImageEditor.Toolbar.HEIGHT); |
690 this.getImageView().applyViewportChange(); | 706 this.getImageView().applyViewportChange(); |
691 } | 707 } |
(...skipping 49 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
741 } | 757 } |
742 console.error('Mode "' + name + '" not found.'); | 758 console.error('Mode "' + name + '" not found.'); |
743 }; | 759 }; |
744 | 760 |
745 /** | 761 /** |
746 * Key down handler. | 762 * Key down handler. |
747 * @param {!Event} event The keydown event. | 763 * @param {!Event} event The keydown event. |
748 * @return {boolean} True if handled. | 764 * @return {boolean} True if handled. |
749 */ | 765 */ |
750 ImageEditor.prototype.onKeyDown = function(event) { | 766 ImageEditor.prototype.onKeyDown = function(event) { |
767 if (this.currentMode_ && this.currentMode_.isConsumingKeyEvents()) { | |
fukino
2016/09/16 02:24:49
{} is not necessary
harukam
2016/09/16 05:21:58
Done.
| |
768 return false; | |
fukino
2016/09/16 02:24:49
The key is handled in currentMode, so returning tr
harukam
2016/09/16 05:21:58
The event cannot be consumed by preventDefault() i
| |
769 } | |
770 | |
751 switch (util.getKeyModifiers(event) + event.key) { | 771 switch (util.getKeyModifiers(event) + event.key) { |
752 case 'Escape': | 772 case 'Escape': |
753 case 'Enter': | 773 case 'Enter': |
754 if (this.getMode()) { | 774 if (this.getMode()) { |
755 this.leaveModeInternal_(event.key === 'Enter', | 775 this.leaveModeInternal_(event.key === 'Enter', |
756 false /* not to switch mode */); | 776 false /* not to switch mode */); |
757 return true; | 777 return true; |
758 } | 778 } |
759 break; | 779 break; |
760 | 780 |
(...skipping 530 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
1291 */ | 1311 */ |
1292 ImageEditor.Toolbar.prototype.addButton = function( | 1312 ImageEditor.Toolbar.prototype.addButton = function( |
1293 title, type, handler, opt_class) { | 1313 title, type, handler, opt_class) { |
1294 var button = ImageEditor.Toolbar.createButton_( | 1314 var button = ImageEditor.Toolbar.createButton_( |
1295 title, type, handler, opt_class); | 1315 title, type, handler, opt_class); |
1296 this.add(button); | 1316 this.add(button); |
1297 return button; | 1317 return button; |
1298 }; | 1318 }; |
1299 | 1319 |
1300 /** | 1320 /** |
1321 * Add a input field. | |
1322 * | |
1323 * @param {string} name Input name | |
1324 * @param {string} title Input title | |
1325 * @param {function(Event)} handler onInput and onChange handler | |
1326 * @param {string|number} value Default value | |
1327 * @param {string=} opt_unit Unit for an input field | |
1328 * @return {!HTMLElement} Input Element | |
1329 */ | |
1330 ImageEditor.Toolbar.prototype.addInput = function( | |
1331 name, title, handler, value, opt_unit) { | |
1332 | |
1333 var input = /** @type {!HTMLElement} */ (document.createElement('div')); | |
1334 input.classList.add('input', name); | |
1335 | |
1336 var text = document.createElement('paper-input'); | |
1337 text.setAttribute('label', strf(title)); | |
1338 text.classList.add('text', name); | |
1339 text.value = value; | |
1340 | |
1341 // We should listen to not only 'change' event, but also 'input' because we | |
1342 // want to update values as soon as the user types characters. | |
1343 text.addEventListener('input', handler, false); | |
1344 text.addEventListener('change', handler, false); | |
1345 input.appendChild(text); | |
1346 | |
1347 if(opt_unit) { | |
1348 var unit_label = document.createElement('span'); | |
1349 unit_label.textContent = opt_unit; | |
1350 unit_label.classList.add('unit_label'); | |
1351 input.appendChild(unit_label); | |
1352 } | |
1353 | |
1354 input.name = name; | |
1355 input.getValue = function(text) { | |
1356 return text.value; | |
1357 }.bind(this, text); | |
1358 input.setValue = function(text, value) { | |
1359 text.value = value; | |
1360 }.bind(this, text); | |
1361 | |
1362 this.add(input); | |
1363 | |
1364 return input; | |
1365 }; | |
1366 | |
1367 /** | |
1301 * Add a range control (scalar value picker). | 1368 * Add a range control (scalar value picker). |
1302 * | 1369 * |
1303 * @param {string} name An option name. | 1370 * @param {string} name An option name. |
1304 * @param {string} title An option title. | 1371 * @param {string} title An option title. |
1305 * @param {number} min Min value of the option. | 1372 * @param {number} min Min value of the option. |
1306 * @param {number} value Default value of the option. | 1373 * @param {number} value Default value of the option. |
1307 * @param {number} max Max value of the options. | 1374 * @param {number} max Max value of the options. |
1308 * @param {number=} opt_scale A number to multiply by when setting | 1375 * @param {number=} opt_scale A number to multiply by when setting |
1309 * min/value/max in DOM. | 1376 * min/value/max in DOM. |
1310 * @param {boolean=} opt_showNumeric True if numeric value should be displayed. | 1377 * @param {boolean=} opt_showNumeric True if numeric value should be displayed. |
(...skipping 217 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
1528 | 1595 |
1529 /** | 1596 /** |
1530 * Hide the prompt. | 1597 * Hide the prompt. |
1531 */ | 1598 */ |
1532 ImageEditor.Prompt.prototype.hide = function() { | 1599 ImageEditor.Prompt.prototype.hide = function() { |
1533 if (!this.prompt_) return; | 1600 if (!this.prompt_) return; |
1534 this.prompt_.setAttribute('state', 'fadeout'); | 1601 this.prompt_.setAttribute('state', 'fadeout'); |
1535 // Allow some time for the animation to play out. | 1602 // Allow some time for the animation to play out. |
1536 this.setTimer(this.reset.bind(this), 500); | 1603 this.setTimer(this.reset.bind(this), 500); |
1537 }; | 1604 }; |
OLD | NEW |