Index: ui/file_manager/gallery/js/image_editor/image_editor.js |
diff --git a/ui/file_manager/gallery/js/image_editor/image_editor.js b/ui/file_manager/gallery/js/image_editor/image_editor.js |
index 9db0b9aaa2483838fbd7ffd5cf00855c8a1439cd..e9ddc4bd6728dc4ec118dd658f90c61857f22872 100644 |
--- a/ui/file_manager/gallery/js/image_editor/image_editor.js |
+++ b/ui/file_manager/gallery/js/image_editor/image_editor.js |
@@ -44,6 +44,11 @@ function ImageEditor( |
*/ |
this.settingUpNextMode_ = false; |
+ /** |
+ * @private {boolean} |
+ */ |
+ this.showingAlertDialog_ = false; |
+ |
ImageUtil.removeChildren(this.container_); |
this.viewport_ = viewport; |
@@ -679,6 +684,21 @@ ImageEditor.prototype.leaveModeInternal_ = function(commit, leaveToSwitchMode) { |
if (!this.currentMode_) |
return; |
+ // If the current mode is image-resize, and commit is required, |
+ // leaving mode should be stopped when an input value is not valid. |
+ if(commit && this.currentMode_.name === 'image-resize') { |
fukino
2016/09/05 13:44:34
I think this 'image-resize' should be 'resize'?
Th
harukam
2016/09/06 08:10:29
Sorry, thanks.
|
+ var resizeMode = /** @type {!ImageEditor.Mode.Resize} */ |
+ (this.currentMode_); |
+ if(!resizeMode.isInputValid()) { |
+ this.showingAlertDialog_ = true; |
+ |
+ resizeMode.showAlertDialog(function() { |
+ this.showingAlertDialog_ = false; |
+ }.bind(this)); |
+ return; |
+ } |
+ } |
+ |
this.modeToolbar_.show(false); |
// If it leaves to switch mode, do not restore screen size since the next mode |
@@ -751,6 +771,8 @@ ImageEditor.prototype.onKeyDown = function(event) { |
switch (util.getKeyModifiers(event) + event.key) { |
case 'Escape': |
case 'Enter': |
+ if (this.showingAlertDialog_) |
+ return false; |
if (this.getMode()) { |
this.leaveModeInternal_(event.key === 'Enter', |
false /* not to switch mode */); |
@@ -1298,6 +1320,77 @@ ImageEditor.Toolbar.prototype.addButton = function( |
}; |
/** |
+ * Add a checkbox |
+ * |
+ * @param {string} name Checkbox name |
+ * @param {string} title Checkbox title |
+ * @param {function(Event)} handler onChange handler |
+ * @param {boolean} value Default value |
+ * @return {!HTMLElement} Checkbox Element |
+ */ |
+ImageEditor.Toolbar.prototype.addCheckbox = function( |
+ name, title, handler, value) { |
+ |
+ var checkbox = /** @type {!HTMLElement} */ |
+ (document.createElement('paper-checkbox')); |
+ checkbox.textContent = strf(title); |
+ checkbox.addEventListener('change', handler, false); |
+ checkbox.checked = value; |
+ checkbox.classList.add('checkbox', name); |
+ |
+ this.add(checkbox); |
+ |
+ return checkbox; |
+}; |
+ |
+/** |
+ * Add a input field. |
+ * |
+ * @param {string} name Input name |
+ * @param {string} title Input title |
+ * @param {function(Event)} handler onInput and onChange handler |
+ * @param {string|number} value Default value |
+ * @param {string=} opt_unit Unit for an input field |
+ * @return {!HTMLElement} Input Element |
+ */ |
+ImageEditor.Toolbar.prototype.addInput = function( |
+ name, title, handler, value, opt_unit) { |
+ |
+ var input = /** @type {!HTMLElement} */ (document.createElement('div')); |
+ input.classList.add('input', name); |
+ |
+ var text = document.createElement('paper-input'); |
+ text.setAttribute('label', strf(title)); |
+ text.classList.add('text', name); |
+ text.value = value; |
+ |
+ // We should listen for not only 'change' event, but also 'input' because of |
fukino
2016/09/05 13:44:34
listen to
harukam
2016/09/06 08:10:29
Acknowledged.
|
+ // calling handler as fast as possible. |
fukino
2016/09/05 13:44:34
"because of calling..." doesn't sound saying purpo
harukam
2016/09/06 08:10:29
It's helpful, thanks.
|
+ text.addEventListener('input', handler, false); |
+ text.addEventListener('change', handler, false); |
harukam
2016/09/05 10:37:00
I set a handler listening for 'change' event to ad
|
+ input.appendChild(text); |
+ |
+ if(opt_unit) { |
+ var unit_label = document.createElement('span'); |
+ unit_label.textContent = opt_unit; |
+ unit_label.classList.add('unit_label'); |
+ input.appendChild(unit_label); |
+ } |
+ |
+ input.name = name; |
+ input.getValue = function(text) { |
+ return text.value; |
+ }.bind(this, text); |
+ input.setValue = function(text, value) { |
+ text.value = value; |
+ }.bind(this, text); |
+ |
+ this.add(input); |
+ |
+ return input; |
+}; |
+ |
+/** |
* Add a range control (scalar value picker). |
* |
* @param {string} name An option name. |