OLD | NEW |
1 /* | 1 /* |
2 * Copyright (C) 2010 Google Inc. All rights reserved. | 2 * Copyright (C) 2010 Google Inc. All rights reserved. |
3 * | 3 * |
4 * Redistribution and use in source and binary forms, with or without | 4 * Redistribution and use in source and binary forms, with or without |
5 * modification, are permitted provided that the following conditions are | 5 * modification, are permitted provided that the following conditions are |
6 * met: | 6 * met: |
7 * | 7 * |
8 * * Redistributions of source code must retain the above copyright | 8 * * Redistributions of source code must retain the above copyright |
9 * notice, this list of conditions and the following disclaimer. | 9 * notice, this list of conditions and the following disclaimer. |
10 * * Redistributions in binary form must reproduce the above | 10 * * Redistributions in binary form must reproduce the above |
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
44 this._tabSlider = createElementWithClass('div', 'tabbed-pane-tab-slider'); | 44 this._tabSlider = createElementWithClass('div', 'tabbed-pane-tab-slider'); |
45 this._tabsElement = this._headerContentsElement.createChild('div', 'tabbed-p
ane-header-tabs'); | 45 this._tabsElement = this._headerContentsElement.createChild('div', 'tabbed-p
ane-header-tabs'); |
46 this._tabsElement.setAttribute('role', 'tablist'); | 46 this._tabsElement.setAttribute('role', 'tablist'); |
47 this._contentElement = this.contentElement.createChild('div', 'tabbed-pane-c
ontent'); | 47 this._contentElement = this.contentElement.createChild('div', 'tabbed-pane-c
ontent'); |
48 this._contentElement.setAttribute('role', 'tabpanel'); | 48 this._contentElement.setAttribute('role', 'tabpanel'); |
49 this._contentElement.createChild('content'); | 49 this._contentElement.createChild('content'); |
50 /** @type {!Array.<!UI.TabbedPaneTab>} */ | 50 /** @type {!Array.<!UI.TabbedPaneTab>} */ |
51 this._tabs = []; | 51 this._tabs = []; |
52 /** @type {!Array.<!UI.TabbedPaneTab>} */ | 52 /** @type {!Array.<!UI.TabbedPaneTab>} */ |
53 this._tabsHistory = []; | 53 this._tabsHistory = []; |
54 /** @type {!Object.<string, !UI.TabbedPaneTab>} */ | 54 /** @type {!Map<string, !UI.TabbedPaneTab>} */ |
55 this._tabsById = {}; | 55 this._tabsById = new Map(); |
56 this._currentTabLocked = false; | 56 this._currentTabLocked = false; |
57 this._autoSelectFirstItemOnShow = true; | 57 this._autoSelectFirstItemOnShow = true; |
58 | 58 |
59 this._dropDownButton = this._createDropDownButton(); | 59 this._dropDownButton = this._createDropDownButton(); |
60 UI.zoomManager.addEventListener(UI.ZoomManager.Events.ZoomChanged, this._zoo
mChanged, this); | 60 UI.zoomManager.addEventListener(UI.ZoomManager.Events.ZoomChanged, this._zoo
mChanged, this); |
61 } | 61 } |
62 | 62 |
63 /** | 63 /** |
64 * @param {boolean} locked | 64 * @param {boolean} locked |
65 */ | 65 */ |
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
102 */ | 102 */ |
103 tabViews() { | 103 tabViews() { |
104 return this._tabs.map(tab => tab.view); | 104 return this._tabs.map(tab => tab.view); |
105 } | 105 } |
106 | 106 |
107 /** | 107 /** |
108 * @param {string} tabId | 108 * @param {string} tabId |
109 * @return {?UI.Widget} | 109 * @return {?UI.Widget} |
110 */ | 110 */ |
111 tabView(tabId) { | 111 tabView(tabId) { |
112 return this._tabsById[tabId] ? this._tabsById[tabId].view : null; | 112 return this._tabsById.has(tabId) ? this._tabsById.get(tabId).view : null; |
113 } | 113 } |
114 | 114 |
115 /** | 115 /** |
116 * @return {?string} | 116 * @return {?string} |
117 */ | 117 */ |
118 get selectedTabId() { | 118 get selectedTabId() { |
119 return this._currentTab ? this._currentTab.id : null; | 119 return this._currentTab ? this._currentTab.id : null; |
120 } | 120 } |
121 | 121 |
122 /** | 122 /** |
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
157 */ | 157 */ |
158 headerElement() { | 158 headerElement() { |
159 return this._headerElement; | 159 return this._headerElement; |
160 } | 160 } |
161 | 161 |
162 /** | 162 /** |
163 * @param {string} id | 163 * @param {string} id |
164 * @return {boolean} | 164 * @return {boolean} |
165 */ | 165 */ |
166 isTabCloseable(id) { | 166 isTabCloseable(id) { |
167 var tab = this._tabsById[id]; | 167 var tab = this._tabsById.get(id); |
168 return tab ? tab.isCloseable() : false; | 168 return tab ? tab.isCloseable() : false; |
169 } | 169 } |
170 | 170 |
171 /** | 171 /** |
172 * @param {!UI.TabbedPaneTabDelegate} delegate | 172 * @param {!UI.TabbedPaneTabDelegate} delegate |
173 */ | 173 */ |
174 setTabDelegate(delegate) { | 174 setTabDelegate(delegate) { |
175 var tabs = this._tabs.slice(); | 175 var tabs = this._tabs.slice(); |
176 for (var i = 0; i < tabs.length; ++i) | 176 for (var i = 0; i < tabs.length; ++i) |
177 tabs[i].setDelegate(delegate); | 177 tabs[i].setDelegate(delegate); |
178 this._delegate = delegate; | 178 this._delegate = delegate; |
179 } | 179 } |
180 | 180 |
181 /** | 181 /** |
182 * @param {string} id | 182 * @param {string} id |
183 * @param {string} tabTitle | 183 * @param {string} tabTitle |
184 * @param {!UI.Widget} view | 184 * @param {!UI.Widget} view |
185 * @param {string=} tabTooltip | 185 * @param {string=} tabTooltip |
186 * @param {boolean=} userGesture | 186 * @param {boolean=} userGesture |
187 * @param {boolean=} isCloseable | 187 * @param {boolean=} isCloseable |
188 * @param {number=} index | 188 * @param {number=} index |
189 */ | 189 */ |
190 appendTab(id, tabTitle, view, tabTooltip, userGesture, isCloseable, index) { | 190 appendTab(id, tabTitle, view, tabTooltip, userGesture, isCloseable, index) { |
191 isCloseable = typeof isCloseable === 'boolean' ? isCloseable : this._closeab
leTabs; | 191 isCloseable = typeof isCloseable === 'boolean' ? isCloseable : this._closeab
leTabs; |
192 var tab = new UI.TabbedPaneTab(this, id, tabTitle, isCloseable, view, tabToo
ltip); | 192 var tab = new UI.TabbedPaneTab(this, id, tabTitle, isCloseable, view, tabToo
ltip); |
193 tab.setDelegate(this._delegate); | 193 tab.setDelegate(this._delegate); |
194 console.assert(!this._tabsById[id], `Tabbed pane already contains a tab with
id '${id}'`); | 194 console.assert(!this._tabsById.has(id), `Tabbed pane already contains a tab
with id '${id}'`); |
195 this._tabsById[id] = tab; | 195 this._tabsById.set(id, tab); |
196 if (index !== undefined) | 196 if (index !== undefined) |
197 this._tabs.splice(index, 0, tab); | 197 this._tabs.splice(index, 0, tab); |
198 else | 198 else |
199 this._tabs.push(tab); | 199 this._tabs.push(tab); |
200 this._tabsHistory.push(tab); | 200 this._tabsHistory.push(tab); |
201 view.attach(this); | 201 view.attach(this); |
202 if (this._tabsHistory[0] === tab && this.isShowing()) | 202 if (this._tabsHistory[0] === tab && this.isShowing()) |
203 this.selectTab(tab.id, userGesture); | 203 this.selectTab(tab.id, userGesture); |
204 this._updateTabElements(); | 204 this._updateTabElements(); |
205 } | 205 } |
(...skipping 19 matching lines...) Expand all Loading... |
225 this.selectTab(this._tabsHistory[0].id, false); | 225 this.selectTab(this._tabsHistory[0].id, false); |
226 if (focused) | 226 if (focused) |
227 this.focus(); | 227 this.focus(); |
228 } | 228 } |
229 | 229 |
230 /** | 230 /** |
231 * @param {string} id | 231 * @param {string} id |
232 * @param {boolean=} userGesture | 232 * @param {boolean=} userGesture |
233 */ | 233 */ |
234 _innerCloseTab(id, userGesture) { | 234 _innerCloseTab(id, userGesture) { |
235 if (!this._tabsById[id]) | 235 if (!this._tabsById.has(id)) |
236 return; | 236 return; |
237 if (userGesture && !this._tabsById[id]._closeable) | 237 if (userGesture && !this._tabsById.get(id)._closeable) |
238 return; | 238 return; |
239 if (this._currentTab && this._currentTab.id === id) | 239 if (this._currentTab && this._currentTab.id === id) |
240 this._hideCurrentTab(); | 240 this._hideCurrentTab(); |
241 | 241 |
242 var tab = this._tabsById[id]; | 242 var tab = this._tabsById.get(id); |
243 delete this._tabsById[id]; | 243 this._tabsById.delete(id); |
244 | 244 |
245 this._tabsHistory.splice(this._tabsHistory.indexOf(tab), 1); | 245 this._tabsHistory.splice(this._tabsHistory.indexOf(tab), 1); |
246 this._tabs.splice(this._tabs.indexOf(tab), 1); | 246 this._tabs.splice(this._tabs.indexOf(tab), 1); |
247 if (tab._shown) | 247 if (tab._shown) |
248 this._hideTabElement(tab); | 248 this._hideTabElement(tab); |
249 tab.view.detach(); | 249 tab.view.detach(); |
250 | 250 |
251 var eventData = {tabId: id, view: tab.view, isUserGesture: userGesture}; | 251 var eventData = {tabId: id, view: tab.view, isUserGesture: userGesture}; |
252 this.dispatchEventToListeners(UI.TabbedPane.Events.TabClosed, eventData); | 252 this.dispatchEventToListeners(UI.TabbedPane.Events.TabClosed, eventData); |
253 return true; | 253 return true; |
254 } | 254 } |
255 | 255 |
256 /** | 256 /** |
257 * @param {string} tabId | 257 * @param {string} tabId |
258 * @return {boolean} | 258 * @return {boolean} |
259 */ | 259 */ |
260 hasTab(tabId) { | 260 hasTab(tabId) { |
261 return !!this._tabsById[tabId]; | 261 return this._tabsById.has(tabId); |
262 } | 262 } |
263 | 263 |
264 /** | 264 /** |
265 * @return {!Array.<string>} | 265 * @return {!Array.<string>} |
266 */ | 266 */ |
267 allTabs() { | 267 allTabs() { |
268 return this._tabs.map(function(tab) { | 268 return this._tabs.map(function(tab) { |
269 return tab.id; | 269 return tab.id; |
270 }); | 270 }); |
271 } | 271 } |
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
304 | 304 |
305 /** | 305 /** |
306 * @param {string} id | 306 * @param {string} id |
307 * @param {boolean=} userGesture | 307 * @param {boolean=} userGesture |
308 * @return {boolean} | 308 * @return {boolean} |
309 */ | 309 */ |
310 selectTab(id, userGesture) { | 310 selectTab(id, userGesture) { |
311 if (this._currentTabLocked) | 311 if (this._currentTabLocked) |
312 return false; | 312 return false; |
313 var focused = this.hasFocus(); | 313 var focused = this.hasFocus(); |
314 var tab = this._tabsById[id]; | 314 var tab = this._tabsById.get(id); |
315 if (!tab) | 315 if (!tab) |
316 return false; | 316 return false; |
317 if (this._currentTab && this._currentTab.id === id) | 317 if (this._currentTab && this._currentTab.id === id) |
318 return true; | 318 return true; |
319 | 319 |
320 this.suspendInvalidations(); | 320 this.suspendInvalidations(); |
321 this._hideCurrentTab(); | 321 this._hideCurrentTab(); |
322 this._showTab(tab); | 322 this._showTab(tab); |
323 this.resumeInvalidations(); | 323 this.resumeInvalidations(); |
324 this._currentTab = tab; | 324 this._currentTab = tab; |
(...skipping 21 matching lines...) Expand all Loading... |
346 | 346 |
347 return this._tabsHistory.slice(0, tabsCount).map(tabToTabId); | 347 return this._tabsHistory.slice(0, tabsCount).map(tabToTabId); |
348 } | 348 } |
349 | 349 |
350 /** | 350 /** |
351 * @param {string} id | 351 * @param {string} id |
352 * @param {string} iconType | 352 * @param {string} iconType |
353 * @param {string=} iconTooltip | 353 * @param {string=} iconTooltip |
354 */ | 354 */ |
355 setTabIcon(id, iconType, iconTooltip) { | 355 setTabIcon(id, iconType, iconTooltip) { |
356 var tab = this._tabsById[id]; | 356 var tab = this._tabsById.get(id); |
357 if (tab._setIconType(iconType, iconTooltip)) | 357 if (tab._setIconType(iconType, iconTooltip)) |
358 this._updateTabElements(); | 358 this._updateTabElements(); |
359 } | 359 } |
360 | 360 |
361 /** | 361 /** |
362 * @param {string} id | 362 * @param {string} id |
363 * @param {boolean} enabled | 363 * @param {boolean} enabled |
364 */ | 364 */ |
365 setTabEnabled(id, enabled) { | 365 setTabEnabled(id, enabled) { |
366 var tab = this._tabsById[id]; | 366 var tab = this._tabsById.get(id); |
367 tab.tabElement.classList.toggle('disabled', !enabled); | 367 tab.tabElement.classList.toggle('disabled', !enabled); |
368 } | 368 } |
369 | 369 |
370 /** | 370 /** |
371 * @param {string} id | 371 * @param {string} id |
372 * @param {string} className | 372 * @param {string} className |
373 * @param {boolean=} force | 373 * @param {boolean=} force |
374 */ | 374 */ |
375 toggleTabClass(id, className, force) { | 375 toggleTabClass(id, className, force) { |
376 var tab = this._tabsById[id]; | 376 var tab = this._tabsById.get(id); |
377 if (tab._toggleClass(className, force)) | 377 if (tab._toggleClass(className, force)) |
378 this._updateTabElements(); | 378 this._updateTabElements(); |
379 } | 379 } |
380 | 380 |
381 /** | 381 /** |
382 * @param {!Common.Event} event | 382 * @param {!Common.Event} event |
383 */ | 383 */ |
384 _zoomChanged(event) { | 384 _zoomChanged(event) { |
385 for (var i = 0; i < this._tabs.length; ++i) | 385 for (var i = 0; i < this._tabs.length; ++i) |
386 delete this._tabs[i]._measuredWidth; | 386 delete this._tabs[i]._measuredWidth; |
387 if (this.isShowing()) | 387 if (this.isShowing()) |
388 this._updateTabElements(); | 388 this._updateTabElements(); |
389 } | 389 } |
390 | 390 |
391 /** | 391 /** |
392 * @param {string} id | 392 * @param {string} id |
393 * @param {string} tabTitle | 393 * @param {string} tabTitle |
394 * @param {string=} tabTooltip | 394 * @param {string=} tabTooltip |
395 */ | 395 */ |
396 changeTabTitle(id, tabTitle, tabTooltip) { | 396 changeTabTitle(id, tabTitle, tabTooltip) { |
397 var tab = this._tabsById[id]; | 397 var tab = this._tabsById.get(id); |
398 if (tabTooltip !== undefined) | 398 if (tabTooltip !== undefined) |
399 tab.tooltip = tabTooltip; | 399 tab.tooltip = tabTooltip; |
400 if (tab.title !== tabTitle) { | 400 if (tab.title !== tabTitle) { |
401 tab.title = tabTitle; | 401 tab.title = tabTitle; |
402 this._updateTabElements(); | 402 this._updateTabElements(); |
403 } | 403 } |
404 } | 404 } |
405 | 405 |
406 /** | 406 /** |
407 * @param {string} id | 407 * @param {string} id |
408 * @param {!UI.Widget} view | 408 * @param {!UI.Widget} view |
409 */ | 409 */ |
410 changeTabView(id, view) { | 410 changeTabView(id, view) { |
411 var tab = this._tabsById[id]; | 411 var tab = this._tabsById.get(id); |
412 if (tab.view === view) | 412 if (tab.view === view) |
413 return; | 413 return; |
414 | 414 |
415 var shouldFocus = tab.view.hasFocus(); | 415 var shouldFocus = tab.view.hasFocus(); |
416 | 416 |
417 this.suspendInvalidations(); | 417 this.suspendInvalidations(); |
418 | 418 |
419 var isSelected = this._currentTab && this._currentTab.id === id; | 419 var isSelected = this._currentTab && this._currentTab.id === id; |
420 if (isSelected) | 420 if (isSelected) |
421 this._hideTab(tab); | 421 this._hideTab(tab); |
(...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
536 this._dropDownMenu.addEventListener(UI.DropDownMenu.Events.ItemSelected, thi
s._dropDownMenuItemSelected, this); | 536 this._dropDownMenu.addEventListener(UI.DropDownMenu.Events.ItemSelected, thi
s._dropDownMenuItemSelected, this); |
537 | 537 |
538 return dropDownContainer; | 538 return dropDownContainer; |
539 } | 539 } |
540 | 540 |
541 /** | 541 /** |
542 * @param {!Common.Event} event | 542 * @param {!Common.Event} event |
543 */ | 543 */ |
544 _dropDownMenuItemSelected(event) { | 544 _dropDownMenuItemSelected(event) { |
545 var tabId = /** @type {string} */ (event.data); | 545 var tabId = /** @type {string} */ (event.data); |
546 this._lastSelectedOverflowTab = this._tabsById[tabId]; | 546 this._lastSelectedOverflowTab = this._tabsById.get(tabId); |
547 this.selectTab(tabId, true); | 547 this.selectTab(tabId, true); |
548 } | 548 } |
549 | 549 |
550 _totalWidth() { | 550 _totalWidth() { |
551 return this._headerContentsElement.getBoundingClientRect().width; | 551 return this._headerContentsElement.getBoundingClientRect().width; |
552 } | 552 } |
553 | 553 |
554 /** | 554 /** |
555 * @return {number} | 555 * @return {number} |
556 */ | 556 */ |
(...skipping 654 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1211 * @param {!Array.<string>} ids | 1211 * @param {!Array.<string>} ids |
1212 */ | 1212 */ |
1213 closeTabs(tabbedPane, ids) {}, | 1213 closeTabs(tabbedPane, ids) {}, |
1214 | 1214 |
1215 /** | 1215 /** |
1216 * @param {string} tabId | 1216 * @param {string} tabId |
1217 * @param {!UI.ContextMenu} contextMenu | 1217 * @param {!UI.ContextMenu} contextMenu |
1218 */ | 1218 */ |
1219 onContextMenu(tabId, contextMenu) {} | 1219 onContextMenu(tabId, contextMenu) {} |
1220 }; | 1220 }; |
OLD | NEW |