Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(214)

Side by Side Diff: ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js

Issue 2788673003: WebUI: For cr-dialog, make Enter click the action-button, if it exists. (Closed)
Patch Set: change closure annotations Created 3 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « chrome/test/data/webui/cr_elements/cr_dialog_test.js ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 // Copyright 2016 The Chromium Authors. All rights reserved. 1 // Copyright 2016 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 'cr-dialog' is a component for showing a modal dialog. If the 6 * @fileoverview 'cr-dialog' is a component for showing a modal dialog. If the
7 * dialog is closed via close(), a 'close' event is fired. If the dialog is 7 * dialog is closed via close(), a 'close' event is fired. If the dialog is
8 * canceled via cancel(), a 'cancel' event is fired followed by a 'close' event. 8 * canceled via cancel(), a 'cancel' event is fired followed by a 'close' event.
9 * Additionally clients can inspect the dialog's |returnValue| property inside 9 * Additionally clients can inspect the dialog's |returnValue| property inside
10 * the 'close' event listener to determine whether it was canceled or just 10 * the 'close' event listener to determine whether it was canceled or just
(...skipping 12 matching lines...) Expand all
23 23
24 /** 24 /**
25 * True if the dialog should remain open on 'popstate' events. This is used 25 * True if the dialog should remain open on 'popstate' events. This is used
26 * for navigable dialogs that have their separate navigation handling code. 26 * for navigable dialogs that have their separate navigation handling code.
27 */ 27 */
28 ignorePopstate: { 28 ignorePopstate: {
29 type: Boolean, 29 type: Boolean,
30 value: false, 30 value: false,
31 }, 31 },
32 32
33 /**
34 * True if the dialog should ignore 'Enter' keypresses.
35 */
36 ignoreEnterKey: {
37 type: Boolean,
38 value: false,
39 },
40
33 showScrollBorders: { 41 showScrollBorders: {
34 type: Boolean, 42 type: Boolean,
35 value: false, 43 value: false,
36 reflectToAttribute: true, 44 reflectToAttribute: true,
37 }, 45 },
38 }, 46 },
39 47
40 /** @private {?IntersectionObserver} */ 48 /** @private {?IntersectionObserver} */
41 intersectionObserver_: null, 49 intersectionObserver_: null,
42 50
43 /** @override */ 51 /** @override */
44 ready: function() { 52 ready: function() {
45 // If the active history entry changes (i.e. user clicks back button), 53 // If the active history entry changes (i.e. user clicks back button),
46 // all open dialogs should be cancelled. 54 // all open dialogs should be cancelled.
47 window.addEventListener('popstate', function() { 55 window.addEventListener('popstate', function() {
48 if (!this.ignorePopstate && this.open) 56 if (!this.ignorePopstate && this.open)
49 this.cancel(); 57 this.cancel();
50 }.bind(this)); 58 }.bind(this));
59
60 if (!this.ignoreEnterKey)
61 this.addEventListener('keypress', this.onKeypress_.bind(this));
51 }, 62 },
52 63
53 /** @override */ 64 /** @override */
54 attached: function() { 65 attached: function() {
55 if (this.showScrollBorders) { 66 if (this.showScrollBorders) {
56 var bodyContainer = this.$$('.body-container'); 67 var bodyContainer = this.$$('.body-container');
57 68
58 var callback = function(entries) { 69 var callback = function(entries) {
59 assert(entries.length == 1); 70 assert(entries.length == 1);
60 bodyContainer.classList.toggle( 71 bodyContainer.classList.toggle(
(...skipping 28 matching lines...) Expand all
89 * @override 100 * @override
90 */ 101 */
91 close: function(opt_returnValue) { 102 close: function(opt_returnValue) {
92 HTMLDialogElement.prototype.close.call(this, 'success'); 103 HTMLDialogElement.prototype.close.call(this, 'success');
93 }, 104 },
94 105
95 /** @return {!PaperIconButtonElement} */ 106 /** @return {!PaperIconButtonElement} */
96 getCloseButton: function() { 107 getCloseButton: function() {
97 return this.$.close; 108 return this.$.close;
98 }, 109 },
110
111 /**
112 * @param {!Event} e
113 * @private
114 */
115 onKeypress_: function(e) {
116 if (e.target != this)
117 return;
118 if (e.key != 'Enter')
119 return;
120
121 var actionButton = this.querySelector('.action-button');
122 if (actionButton && !actionButton.disabled) {
123 actionButton.click();
124 e.preventDefault();
125 }
126 },
99 }); 127 });
OLDNEW
« no previous file with comments | « chrome/test/data/webui/cr_elements/cr_dialog_test.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698