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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/ui/InplaceEditor.js

Issue 2493373002: DevTools: rename WebInspector into modules. (Closed)
Patch Set: for bots Created 4 years, 1 month 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
OLDNEW
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 * @unrestricted 5 * @unrestricted
6 */ 6 */
7 WebInspector.InplaceEditor = class { 7 UI.InplaceEditor = class {
8 /** 8 /**
9 * @param {!Element} element 9 * @param {!Element} element
10 * @param {!WebInspector.InplaceEditor.Config=} config 10 * @param {!UI.InplaceEditor.Config=} config
11 * @return {?WebInspector.InplaceEditor.Controller} 11 * @return {?UI.InplaceEditor.Controller}
12 */ 12 */
13 static startEditing(element, config) { 13 static startEditing(element, config) {
14 if (!WebInspector.InplaceEditor._defaultInstance) 14 if (!UI.InplaceEditor._defaultInstance)
15 WebInspector.InplaceEditor._defaultInstance = new WebInspector.InplaceEdit or(); 15 UI.InplaceEditor._defaultInstance = new UI.InplaceEditor();
16 return WebInspector.InplaceEditor._defaultInstance.startEditing(element, con fig); 16 return UI.InplaceEditor._defaultInstance.startEditing(element, config);
17 } 17 }
18 18
19 /** 19 /**
20 * @param {!Element} element 20 * @param {!Element} element
21 * @param {!WebInspector.InplaceEditor.Config=} config 21 * @param {!UI.InplaceEditor.Config=} config
22 * @return {!Promise.<!WebInspector.InplaceEditor.Controller>} 22 * @return {!Promise.<!UI.InplaceEditor.Controller>}
23 */ 23 */
24 static startMultilineEditing(element, config) { 24 static startMultilineEditing(element, config) {
25 return self.runtime.extension(WebInspector.InplaceEditor).instance().then(st artEditing); 25 return self.runtime.extension(UI.InplaceEditor).instance().then(startEditing );
26 26
27 /** 27 /**
28 * @param {!Object} inplaceEditor 28 * @param {!Object} inplaceEditor
29 * @return {!WebInspector.InplaceEditor.Controller|!Promise.<!WebInspector.I nplaceEditor.Controller>} 29 * @return {!UI.InplaceEditor.Controller|!Promise.<!UI.InplaceEditor.Control ler>}
30 */ 30 */
31 function startEditing(inplaceEditor) { 31 function startEditing(inplaceEditor) {
32 var controller = /** @type {!WebInspector.InplaceEditor} */ (inplaceEditor ).startEditing(element, config); 32 var controller = /** @type {!UI.InplaceEditor} */ (inplaceEditor).startEdi ting(element, config);
33 if (!controller) 33 if (!controller)
34 return Promise.reject(new Error('Editing is already in progress')); 34 return Promise.reject(new Error('Editing is already in progress'));
35 return controller; 35 return controller;
36 } 36 }
37 } 37 }
38 38
39 /** 39 /**
40 * @return {string} 40 * @return {string}
41 */ 41 */
42 editorContent(editingContext) { 42 editorContent(editingContext) {
43 var element = editingContext.element; 43 var element = editingContext.element;
44 if (element.tagName === 'INPUT' && element.type === 'text') 44 if (element.tagName === 'INPUT' && element.type === 'text')
45 return element.value; 45 return element.value;
46 46
47 return element.textContent; 47 return element.textContent;
48 } 48 }
49 49
50 setUpEditor(editingContext) { 50 setUpEditor(editingContext) {
51 var element = editingContext.element; 51 var element = editingContext.element;
52 element.classList.add('editing'); 52 element.classList.add('editing');
53 53
54 var oldTabIndex = element.getAttribute('tabIndex'); 54 var oldTabIndex = element.getAttribute('tabIndex');
55 if (typeof oldTabIndex !== 'number' || oldTabIndex < 0) 55 if (typeof oldTabIndex !== 'number' || oldTabIndex < 0)
56 element.tabIndex = 0; 56 element.tabIndex = 0;
57 this._focusRestorer = new WebInspector.ElementFocusRestorer(element); 57 this._focusRestorer = new UI.ElementFocusRestorer(element);
58 editingContext.oldTabIndex = oldTabIndex; 58 editingContext.oldTabIndex = oldTabIndex;
59 } 59 }
60 60
61 closeEditor(editingContext) { 61 closeEditor(editingContext) {
62 var element = editingContext.element; 62 var element = editingContext.element;
63 element.classList.remove('editing'); 63 element.classList.remove('editing');
64 64
65 if (typeof editingContext.oldTabIndex !== 'number') 65 if (typeof editingContext.oldTabIndex !== 'number')
66 element.removeAttribute('tabIndex'); 66 element.removeAttribute('tabIndex');
67 else 67 else
68 element.tabIndex = editingContext.oldTabIndex; 68 element.tabIndex = editingContext.oldTabIndex;
69 element.scrollTop = 0; 69 element.scrollTop = 0;
70 element.scrollLeft = 0; 70 element.scrollLeft = 0;
71 } 71 }
72 72
73 cancelEditing(editingContext) { 73 cancelEditing(editingContext) {
74 var element = editingContext.element; 74 var element = editingContext.element;
75 if (element.tagName === 'INPUT' && element.type === 'text') 75 if (element.tagName === 'INPUT' && element.type === 'text')
76 element.value = editingContext.oldText; 76 element.value = editingContext.oldText;
77 else 77 else
78 element.textContent = editingContext.oldText; 78 element.textContent = editingContext.oldText;
79 } 79 }
80 80
81 augmentEditingHandle(editingContext, handle) { 81 augmentEditingHandle(editingContext, handle) {
82 } 82 }
83 83
84 /** 84 /**
85 * @param {!Element} element 85 * @param {!Element} element
86 * @param {!WebInspector.InplaceEditor.Config=} config 86 * @param {!UI.InplaceEditor.Config=} config
87 * @return {?WebInspector.InplaceEditor.Controller} 87 * @return {?UI.InplaceEditor.Controller}
88 */ 88 */
89 startEditing(element, config) { 89 startEditing(element, config) {
90 if (!WebInspector.markBeingEdited(element, true)) 90 if (!UI.markBeingEdited(element, true))
91 return null; 91 return null;
92 92
93 config = config || new WebInspector.InplaceEditor.Config(function() {}, func tion() {}); 93 config = config || new UI.InplaceEditor.Config(function() {}, function() {}) ;
94 var editingContext = {element: element, config: config}; 94 var editingContext = {element: element, config: config};
95 var committedCallback = config.commitHandler; 95 var committedCallback = config.commitHandler;
96 var cancelledCallback = config.cancelHandler; 96 var cancelledCallback = config.cancelHandler;
97 var pasteCallback = config.pasteHandler; 97 var pasteCallback = config.pasteHandler;
98 var context = config.context; 98 var context = config.context;
99 var isMultiline = config.multiline || false; 99 var isMultiline = config.multiline || false;
100 var moveDirection = ''; 100 var moveDirection = '';
101 var self = this; 101 var self = this;
102 102
103 /** 103 /**
(...skipping 11 matching lines...) Expand all
115 * @param {!Event=} e 115 * @param {!Event=} e
116 */ 116 */
117 function blurEventListener(e) { 117 function blurEventListener(e) {
118 if (config.blurHandler && !config.blurHandler(element, e)) 118 if (config.blurHandler && !config.blurHandler(element, e))
119 return; 119 return;
120 if (!isMultiline || !e || !e.relatedTarget || !e.relatedTarget.isSelfOrDes cendant(element)) 120 if (!isMultiline || !e || !e.relatedTarget || !e.relatedTarget.isSelfOrDes cendant(element))
121 editingCommitted.call(element); 121 editingCommitted.call(element);
122 } 122 }
123 123
124 function cleanUpAfterEditing() { 124 function cleanUpAfterEditing() {
125 WebInspector.markBeingEdited(element, false); 125 UI.markBeingEdited(element, false);
126 126
127 element.removeEventListener('blur', blurEventListener, isMultiline); 127 element.removeEventListener('blur', blurEventListener, isMultiline);
128 element.removeEventListener('keydown', keyDownEventListener, true); 128 element.removeEventListener('keydown', keyDownEventListener, true);
129 if (pasteCallback) 129 if (pasteCallback)
130 element.removeEventListener('paste', pasteEventListener, true); 130 element.removeEventListener('paste', pasteEventListener, true);
131 131
132 if (self._focusRestorer) 132 if (self._focusRestorer)
133 self._focusRestorer.restore(); 133 self._focusRestorer.restore();
134 self.closeEditor(editingContext); 134 self.closeEditor(editingContext);
135 } 135 }
(...skipping 10 matching lines...) Expand all
146 cleanUpAfterEditing(); 146 cleanUpAfterEditing();
147 147
148 committedCallback(this, self.editorContent(editingContext), editingContext .oldText, context, moveDirection); 148 committedCallback(this, self.editorContent(editingContext), editingContext .oldText, context, moveDirection);
149 } 149 }
150 150
151 /** 151 /**
152 * @param {!Event} event 152 * @param {!Event} event
153 * @return {string} 153 * @return {string}
154 */ 154 */
155 function defaultFinishHandler(event) { 155 function defaultFinishHandler(event) {
156 var isMetaOrCtrl = WebInspector.isMac() ? event.metaKey && !event.shiftKey && !event.ctrlKey && !event.altKey : 156 var isMetaOrCtrl = Host.isMac() ? event.metaKey && !event.shiftKey && !eve nt.ctrlKey && !event.altKey :
157 event.ctrlKey && !event.shiftKey && !event.metaKey && !event.altKey; 157 event.ctrlKey && !event.shiftKey && !event.metaKey && !event.altKey;
158 if (isEnterKey(event) && (event.isMetaOrCtrlForTest || !isMultiline || isM etaOrCtrl)) 158 if (isEnterKey(event) && (event.isMetaOrCtrlForTest || !isMultiline || isM etaOrCtrl))
159 return 'commit'; 159 return 'commit';
160 else if (event.keyCode === WebInspector.KeyboardShortcut.Keys.Esc.code || event.key === 'Escape') 160 else if (event.keyCode === UI.KeyboardShortcut.Keys.Esc.code || event.key === 'Escape')
161 return 'cancel'; 161 return 'cancel';
162 else if (!isMultiline && event.key === 'Tab') 162 else if (!isMultiline && event.key === 'Tab')
163 return 'move-' + (event.shiftKey ? 'backward' : 'forward'); 163 return 'move-' + (event.shiftKey ? 'backward' : 'forward');
164 return ''; 164 return '';
165 } 165 }
166 166
167 function handleEditingResult(result, event) { 167 function handleEditingResult(result, event) {
168 if (result === 'commit') { 168 if (result === 'commit') {
169 editingCommitted.call(element); 169 editingCommitted.call(element);
170 event.consume(true); 170 event.consume(true);
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
203 203
204 var handle = {cancel: editingCancelled.bind(element), commit: editingCommitt ed.bind(element), setWidth() {}}; 204 var handle = {cancel: editingCancelled.bind(element), commit: editingCommitt ed.bind(element), setWidth() {}};
205 this.augmentEditingHandle(editingContext, handle); 205 this.augmentEditingHandle(editingContext, handle);
206 return handle; 206 return handle;
207 } 207 }
208 }; 208 };
209 209
210 /** 210 /**
211 * @typedef {{cancel: function(), commit: function(), setWidth: function(number) }} 211 * @typedef {{cancel: function(), commit: function(), setWidth: function(number) }}
212 */ 212 */
213 WebInspector.InplaceEditor.Controller; 213 UI.InplaceEditor.Controller;
214 214
215 215
216 /** 216 /**
217 * @template T 217 * @template T
218 * @unrestricted 218 * @unrestricted
219 */ 219 */
220 WebInspector.InplaceEditor.Config = class { 220 UI.InplaceEditor.Config = class {
221 /** 221 /**
222 * @param {function(!Element,string,string,T,string)} commitHandler 222 * @param {function(!Element,string,string,T,string)} commitHandler
223 * @param {function(!Element,T)} cancelHandler 223 * @param {function(!Element,T)} cancelHandler
224 * @param {T=} context 224 * @param {T=} context
225 * @param {function(!Element,!Event):boolean=} blurHandler 225 * @param {function(!Element,!Event):boolean=} blurHandler
226 */ 226 */
227 constructor(commitHandler, cancelHandler, context, blurHandler) { 227 constructor(commitHandler, cancelHandler, context, blurHandler) {
228 this.commitHandler = commitHandler; 228 this.commitHandler = commitHandler;
229 this.cancelHandler = cancelHandler; 229 this.cancelHandler = cancelHandler;
230 this.context = context; 230 this.context = context;
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after
266 this.smartIndent = smartIndent; 266 this.smartIndent = smartIndent;
267 } 267 }
268 268
269 /** 269 /**
270 * @param {function(!Event):string} postKeydownFinishHandler 270 * @param {function(!Event):string} postKeydownFinishHandler
271 */ 271 */
272 setPostKeydownFinishHandler(postKeydownFinishHandler) { 272 setPostKeydownFinishHandler(postKeydownFinishHandler) {
273 this.postKeydownFinishHandler = postKeydownFinishHandler; 273 this.postKeydownFinishHandler = postKeydownFinishHandler;
274 } 274 }
275 }; 275 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698