| OLD | NEW |
| 1 /* | 1 /* |
| 2 * Copyright (C) 2009 Google Inc. All rights reserved. | 2 * Copyright (C) 2009 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 26 matching lines...) Expand all Loading... |
| 37 { | 37 { |
| 38 /** @type {!Array.<!WebInspector.ToolbarItem>} */ | 38 /** @type {!Array.<!WebInspector.ToolbarItem>} */ |
| 39 this._items = []; | 39 this._items = []; |
| 40 this._reverse = false; | 40 this._reverse = false; |
| 41 this.element = parentElement ? parentElement.createChild("div") : createElem
ent("div"); | 41 this.element = parentElement ? parentElement.createChild("div") : createElem
ent("div"); |
| 42 this.element.className = className; | 42 this.element.className = className; |
| 43 this.element.classList.add("toolbar"); | 43 this.element.classList.add("toolbar"); |
| 44 this._shadowRoot = WebInspector.createShadowRootWithCoreStyles(this.element,
"ui/toolbar.css"); | 44 this._shadowRoot = WebInspector.createShadowRootWithCoreStyles(this.element,
"ui/toolbar.css"); |
| 45 this._contentElement = this._shadowRoot.createChild("div", "toolbar-shadow")
; | 45 this._contentElement = this._shadowRoot.createChild("div", "toolbar-shadow")
; |
| 46 this._insertionPoint = this._contentElement.createChild("content"); | 46 this._insertionPoint = this._contentElement.createChild("content"); |
| 47 } | 47 }; |
| 48 | 48 |
| 49 WebInspector.Toolbar.prototype = { | 49 WebInspector.Toolbar.prototype = { |
| 50 /** | 50 /** |
| 51 * @param {boolean=} reverse | 51 * @param {boolean=} reverse |
| 52 */ | 52 */ |
| 53 makeWrappable: function(reverse) | 53 makeWrappable: function(reverse) |
| 54 { | 54 { |
| 55 this._contentElement.classList.add("wrappable"); | 55 this._contentElement.classList.add("wrappable"); |
| 56 this._reverse = !!reverse; | 56 this._reverse = !!reverse; |
| 57 if (reverse) | 57 if (reverse) |
| (...skipping 158 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 216 */ | 216 */ |
| 217 function appendItemsInOrder(items) | 217 function appendItemsInOrder(items) |
| 218 { | 218 { |
| 219 for (var i = 0; i < items.length; ++i) { | 219 for (var i = 0; i < items.length; ++i) { |
| 220 var item = items[i]; | 220 var item = items[i]; |
| 221 if (item) | 221 if (item) |
| 222 this.appendToolbarItem(item); | 222 this.appendToolbarItem(item); |
| 223 } | 223 } |
| 224 } | 224 } |
| 225 } | 225 } |
| 226 } | 226 }; |
| 227 | 227 |
| 228 /** | 228 /** |
| 229 * @constructor | 229 * @constructor |
| 230 * @extends {WebInspector.Object} | 230 * @extends {WebInspector.Object} |
| 231 * @param {!Element} element | 231 * @param {!Element} element |
| 232 */ | 232 */ |
| 233 WebInspector.ToolbarItem = function(element) | 233 WebInspector.ToolbarItem = function(element) |
| 234 { | 234 { |
| 235 this.element = element; | 235 this.element = element; |
| 236 this.element.classList.add("toolbar-item"); | 236 this.element.classList.add("toolbar-item"); |
| 237 this._visible = true; | 237 this._visible = true; |
| 238 this._enabled = true; | 238 this._enabled = true; |
| 239 this.element.addEventListener("mouseenter", this._mouseEnter.bind(this), fal
se); | 239 this.element.addEventListener("mouseenter", this._mouseEnter.bind(this), fal
se); |
| 240 this.element.addEventListener("mouseleave", this._mouseLeave.bind(this), fal
se); | 240 this.element.addEventListener("mouseleave", this._mouseLeave.bind(this), fal
se); |
| 241 } | 241 }; |
| 242 | 242 |
| 243 WebInspector.ToolbarItem.prototype = { | 243 WebInspector.ToolbarItem.prototype = { |
| 244 /** | 244 /** |
| 245 * @param {string} title | 245 * @param {string} title |
| 246 */ | 246 */ |
| 247 setTitle: function(title) | 247 setTitle: function(title) |
| 248 { | 248 { |
| 249 if (this._title === title) | 249 if (this._title === title) |
| 250 return; | 250 return; |
| 251 this._title = title; | 251 this._title = title; |
| (...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 293 { | 293 { |
| 294 if (this._visible === x) | 294 if (this._visible === x) |
| 295 return; | 295 return; |
| 296 this.element.classList.toggle("hidden", !x); | 296 this.element.classList.toggle("hidden", !x); |
| 297 this._visible = x; | 297 this._visible = x; |
| 298 if (this._toolbar && !(this instanceof WebInspector.ToolbarSeparator)) | 298 if (this._toolbar && !(this instanceof WebInspector.ToolbarSeparator)) |
| 299 this._toolbar._hideSeparatorDupes(); | 299 this._toolbar._hideSeparatorDupes(); |
| 300 }, | 300 }, |
| 301 | 301 |
| 302 __proto__: WebInspector.Object.prototype | 302 __proto__: WebInspector.Object.prototype |
| 303 } | 303 }; |
| 304 | 304 |
| 305 /** | 305 /** |
| 306 * @constructor | 306 * @constructor |
| 307 * @extends {WebInspector.ToolbarItem} | 307 * @extends {WebInspector.ToolbarItem} |
| 308 * @param {string=} text | 308 * @param {string=} text |
| 309 */ | 309 */ |
| 310 WebInspector.ToolbarText = function(text) | 310 WebInspector.ToolbarText = function(text) |
| 311 { | 311 { |
| 312 WebInspector.ToolbarItem.call(this, createElementWithClass("div", "toolbar-t
ext")); | 312 WebInspector.ToolbarItem.call(this, createElementWithClass("div", "toolbar-t
ext")); |
| 313 this.element.classList.add("toolbar-text"); | 313 this.element.classList.add("toolbar-text"); |
| 314 this.setText(text || ""); | 314 this.setText(text || ""); |
| 315 } | 315 }; |
| 316 | 316 |
| 317 WebInspector.ToolbarText.prototype = { | 317 WebInspector.ToolbarText.prototype = { |
| 318 /** | 318 /** |
| 319 * @param {string} text | 319 * @param {string} text |
| 320 */ | 320 */ |
| 321 setText: function(text) | 321 setText: function(text) |
| 322 { | 322 { |
| 323 this.element.textContent = text; | 323 this.element.textContent = text; |
| 324 }, | 324 }, |
| 325 | 325 |
| 326 __proto__: WebInspector.ToolbarItem.prototype | 326 __proto__: WebInspector.ToolbarItem.prototype |
| 327 } | 327 }; |
| 328 | 328 |
| 329 /** | 329 /** |
| 330 * @constructor | 330 * @constructor |
| 331 * @extends {WebInspector.ToolbarItem} | 331 * @extends {WebInspector.ToolbarItem} |
| 332 * @param {string} title | 332 * @param {string} title |
| 333 * @param {string=} glyph | 333 * @param {string=} glyph |
| 334 * @param {string=} text | 334 * @param {string=} text |
| 335 */ | 335 */ |
| 336 WebInspector.ToolbarButton = function(title, glyph, text) | 336 WebInspector.ToolbarButton = function(title, glyph, text) |
| 337 { | 337 { |
| 338 WebInspector.ToolbarItem.call(this, createElementWithClass("button", "toolba
r-button")); | 338 WebInspector.ToolbarItem.call(this, createElementWithClass("button", "toolba
r-button")); |
| 339 this.element.addEventListener("click", this._clicked.bind(this), false); | 339 this.element.addEventListener("click", this._clicked.bind(this), false); |
| 340 this.element.addEventListener("mousedown", this._mouseDown.bind(this), false
); | 340 this.element.addEventListener("mousedown", this._mouseDown.bind(this), false
); |
| 341 this.element.addEventListener("mouseup", this._mouseUp.bind(this), false); | 341 this.element.addEventListener("mouseup", this._mouseUp.bind(this), false); |
| 342 | 342 |
| 343 this._glyphElement = this.element.createChild("div", "toolbar-glyph hidden")
; | 343 this._glyphElement = this.element.createChild("div", "toolbar-glyph hidden")
; |
| 344 this._textElement = this.element.createChild("div", "toolbar-text hidden"); | 344 this._textElement = this.element.createChild("div", "toolbar-text hidden"); |
| 345 | 345 |
| 346 this.setTitle(title); | 346 this.setTitle(title); |
| 347 if (glyph) | 347 if (glyph) |
| 348 this.setGlyph(glyph); | 348 this.setGlyph(glyph); |
| 349 this.setText(text || ""); | 349 this.setText(text || ""); |
| 350 this._state = ""; | 350 this._state = ""; |
| 351 this._title = ""; | 351 this._title = ""; |
| 352 } | 352 }; |
| 353 | 353 |
| 354 WebInspector.ToolbarButton.prototype = { | 354 WebInspector.ToolbarButton.prototype = { |
| 355 /** | 355 /** |
| 356 * @param {string} text | 356 * @param {string} text |
| 357 */ | 357 */ |
| 358 setText: function(text) | 358 setText: function(text) |
| 359 { | 359 { |
| 360 if (this._text === text) | 360 if (this._text === text) |
| 361 return; | 361 return; |
| 362 this._textElement.textContent = text; | 362 this._textElement.textContent = text; |
| (...skipping 75 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 438 | 438 |
| 439 /** | 439 /** |
| 440 * @param {!Event} event | 440 * @param {!Event} event |
| 441 */ | 441 */ |
| 442 _mouseUp: function(event) | 442 _mouseUp: function(event) |
| 443 { | 443 { |
| 444 this.dispatchEventToListeners("mouseup", event); | 444 this.dispatchEventToListeners("mouseup", event); |
| 445 }, | 445 }, |
| 446 | 446 |
| 447 __proto__: WebInspector.ToolbarItem.prototype | 447 __proto__: WebInspector.ToolbarItem.prototype |
| 448 } | 448 }; |
| 449 | 449 |
| 450 /** | 450 /** |
| 451 * @constructor | 451 * @constructor |
| 452 * @extends {WebInspector.ToolbarItem} | 452 * @extends {WebInspector.ToolbarItem} |
| 453 * @param {string=} placeholder | 453 * @param {string=} placeholder |
| 454 * @param {number=} growFactor | 454 * @param {number=} growFactor |
| 455 */ | 455 */ |
| 456 WebInspector.ToolbarInput = function(placeholder, growFactor) | 456 WebInspector.ToolbarInput = function(placeholder, growFactor) |
| 457 { | 457 { |
| 458 WebInspector.ToolbarItem.call(this, createElementWithClass("input", "toolbar
-item")); | 458 WebInspector.ToolbarItem.call(this, createElementWithClass("input", "toolbar
-item")); |
| 459 this.element.addEventListener("input", this._onChangeCallback.bind(this), fa
lse); | 459 this.element.addEventListener("input", this._onChangeCallback.bind(this), fa
lse); |
| 460 if (growFactor) | 460 if (growFactor) |
| 461 this.element.style.flexGrow = growFactor; | 461 this.element.style.flexGrow = growFactor; |
| 462 if (placeholder) | 462 if (placeholder) |
| 463 this.element.setAttribute("placeholder", placeholder); | 463 this.element.setAttribute("placeholder", placeholder); |
| 464 this._value = ""; | 464 this._value = ""; |
| 465 } | 465 }; |
| 466 | 466 |
| 467 WebInspector.ToolbarInput.Event = { | 467 WebInspector.ToolbarInput.Event = { |
| 468 TextChanged: "TextChanged" | 468 TextChanged: "TextChanged" |
| 469 }; | 469 }; |
| 470 | 470 |
| 471 WebInspector.ToolbarInput.prototype = { | 471 WebInspector.ToolbarInput.prototype = { |
| 472 /** | 472 /** |
| 473 * @param {string} value | 473 * @param {string} value |
| 474 */ | 474 */ |
| 475 setValue: function(value) | 475 setValue: function(value) |
| 476 { | 476 { |
| 477 this._value = value; | 477 this._value = value; |
| 478 this.element.value = value; | 478 this.element.value = value; |
| 479 }, | 479 }, |
| 480 | 480 |
| 481 /** | 481 /** |
| 482 * @return {string} | 482 * @return {string} |
| 483 */ | 483 */ |
| 484 value: function() | 484 value: function() |
| 485 { | 485 { |
| 486 return this.element.value; | 486 return this.element.value; |
| 487 }, | 487 }, |
| 488 | 488 |
| 489 _onChangeCallback: function() | 489 _onChangeCallback: function() |
| 490 { | 490 { |
| 491 this.dispatchEventToListeners(WebInspector.ToolbarInput.Event.TextChange
d, this.element.value); | 491 this.dispatchEventToListeners(WebInspector.ToolbarInput.Event.TextChange
d, this.element.value); |
| 492 }, | 492 }, |
| 493 | 493 |
| 494 __proto__: WebInspector.ToolbarItem.prototype | 494 __proto__: WebInspector.ToolbarItem.prototype |
| 495 } | 495 }; |
| 496 | 496 |
| 497 /** | 497 /** |
| 498 * @constructor | 498 * @constructor |
| 499 * @extends {WebInspector.ToolbarButton} | 499 * @extends {WebInspector.ToolbarButton} |
| 500 * @param {string} title | 500 * @param {string} title |
| 501 * @param {string=} glyph | 501 * @param {string=} glyph |
| 502 * @param {string=} text | 502 * @param {string=} text |
| 503 */ | 503 */ |
| 504 WebInspector.ToolbarToggle = function(title, glyph, text) | 504 WebInspector.ToolbarToggle = function(title, glyph, text) |
| 505 { | 505 { |
| 506 WebInspector.ToolbarButton.call(this, title, glyph, text); | 506 WebInspector.ToolbarButton.call(this, title, glyph, text); |
| 507 this._toggled = false; | 507 this._toggled = false; |
| 508 this.setState("off"); | 508 this.setState("off"); |
| 509 } | 509 }; |
| 510 | 510 |
| 511 WebInspector.ToolbarToggle.prototype = { | 511 WebInspector.ToolbarToggle.prototype = { |
| 512 /** | 512 /** |
| 513 * @return {boolean} | 513 * @return {boolean} |
| 514 */ | 514 */ |
| 515 toggled: function() | 515 toggled: function() |
| 516 { | 516 { |
| 517 return this._toggled; | 517 return this._toggled; |
| 518 }, | 518 }, |
| 519 | 519 |
| 520 /** | 520 /** |
| 521 * @param {boolean} toggled | 521 * @param {boolean} toggled |
| 522 */ | 522 */ |
| 523 setToggled: function(toggled) | 523 setToggled: function(toggled) |
| 524 { | 524 { |
| 525 if (this._toggled === toggled) | 525 if (this._toggled === toggled) |
| 526 return; | 526 return; |
| 527 this._toggled = toggled; | 527 this._toggled = toggled; |
| 528 this.setState(toggled ? "on" : "off"); | 528 this.setState(toggled ? "on" : "off"); |
| 529 }, | 529 }, |
| 530 | 530 |
| 531 __proto__: WebInspector.ToolbarButton.prototype | 531 __proto__: WebInspector.ToolbarButton.prototype |
| 532 } | 532 }; |
| 533 | 533 |
| 534 /** | 534 /** |
| 535 * @param {!WebInspector.Action} action | 535 * @param {!WebInspector.Action} action |
| 536 * @param {!Array<!WebInspector.ToolbarButton>=} toggledOptions | 536 * @param {!Array<!WebInspector.ToolbarButton>=} toggledOptions |
| 537 * @param {!Array<!WebInspector.ToolbarButton>=} untoggledOptions | 537 * @param {!Array<!WebInspector.ToolbarButton>=} untoggledOptions |
| 538 * @return {!WebInspector.ToolbarItem} | 538 * @return {!WebInspector.ToolbarItem} |
| 539 */ | 539 */ |
| 540 WebInspector.Toolbar.createActionButton = function(action, toggledOptions, untog
gledOptions) | 540 WebInspector.Toolbar.createActionButton = function(action, toggledOptions, untog
gledOptions) |
| 541 { | 541 { |
| 542 var button = new WebInspector.ToolbarToggle(action.title(), action.icon()); | 542 var button = new WebInspector.ToolbarToggle(action.title(), action.icon()); |
| (...skipping 118 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 661 | 661 |
| 662 for (var i = 0; i < buttons.length; ++i) { | 662 for (var i = 0; i < buttons.length; ++i) { |
| 663 if (buttons[i].element.classList.contains("emulate-active")) { | 663 if (buttons[i].element.classList.contains("emulate-active")) { |
| 664 buttons[i].element.classList.remove("emulate-active"); | 664 buttons[i].element.classList.remove("emulate-active"); |
| 665 buttons[i]._clicked(e); | 665 buttons[i]._clicked(e); |
| 666 break; | 666 break; |
| 667 } | 667 } |
| 668 } | 668 } |
| 669 } | 669 } |
| 670 } | 670 } |
| 671 } | 671 }; |
| 672 | 672 |
| 673 /** | 673 /** |
| 674 * @param {string} actionId | 674 * @param {string} actionId |
| 675 * @return {?WebInspector.ToolbarItem} | 675 * @return {?WebInspector.ToolbarItem} |
| 676 */ | 676 */ |
| 677 WebInspector.Toolbar.createActionButtonForId = function(actionId) | 677 WebInspector.Toolbar.createActionButtonForId = function(actionId) |
| 678 { | 678 { |
| 679 var action = WebInspector.actionRegistry.action(actionId); | 679 var action = WebInspector.actionRegistry.action(actionId); |
| 680 return /** @type {?WebInspector.ToolbarItem} */(action ? WebInspector.Toolba
r.createActionButton(action) : null); | 680 return /** @type {?WebInspector.ToolbarItem} */(action ? WebInspector.Toolba
r.createActionButton(action) : null); |
| 681 } | 681 }; |
| 682 | 682 |
| 683 /** | 683 /** |
| 684 * @constructor | 684 * @constructor |
| 685 * @extends {WebInspector.ToolbarButton} | 685 * @extends {WebInspector.ToolbarButton} |
| 686 * @param {function(!WebInspector.ContextMenu)} contextMenuHandler | 686 * @param {function(!WebInspector.ContextMenu)} contextMenuHandler |
| 687 * @param {boolean=} useSoftMenu | 687 * @param {boolean=} useSoftMenu |
| 688 */ | 688 */ |
| 689 WebInspector.ToolbarMenuButton = function(contextMenuHandler, useSoftMenu) | 689 WebInspector.ToolbarMenuButton = function(contextMenuHandler, useSoftMenu) |
| 690 { | 690 { |
| 691 WebInspector.ToolbarButton.call(this, "", "menu-toolbar-item"); | 691 WebInspector.ToolbarButton.call(this, "", "menu-toolbar-item"); |
| 692 this._contextMenuHandler = contextMenuHandler; | 692 this._contextMenuHandler = contextMenuHandler; |
| 693 this._useSoftMenu = !!useSoftMenu; | 693 this._useSoftMenu = !!useSoftMenu; |
| 694 } | 694 }; |
| 695 | 695 |
| 696 WebInspector.ToolbarMenuButton.prototype = { | 696 WebInspector.ToolbarMenuButton.prototype = { |
| 697 /** | 697 /** |
| 698 * @override | 698 * @override |
| 699 * @param {!Event} event | 699 * @param {!Event} event |
| 700 */ | 700 */ |
| 701 _mouseDown: function(event) | 701 _mouseDown: function(event) |
| 702 { | 702 { |
| 703 if (event.buttons !== 1) { | 703 if (event.buttons !== 1) { |
| 704 WebInspector.ToolbarButton.prototype._mouseDown.call(this, event); | 704 WebInspector.ToolbarButton.prototype._mouseDown.call(this, event); |
| (...skipping 24 matching lines...) Expand all Loading... |
| 729 */ | 729 */ |
| 730 _clicked: function(event) | 730 _clicked: function(event) |
| 731 { | 731 { |
| 732 if (!this._triggerTimeout) | 732 if (!this._triggerTimeout) |
| 733 return; | 733 return; |
| 734 clearTimeout(this._triggerTimeout); | 734 clearTimeout(this._triggerTimeout); |
| 735 this._trigger(event); | 735 this._trigger(event); |
| 736 }, | 736 }, |
| 737 | 737 |
| 738 __proto__: WebInspector.ToolbarButton.prototype | 738 __proto__: WebInspector.ToolbarButton.prototype |
| 739 } | 739 }; |
| 740 | 740 |
| 741 /** | 741 /** |
| 742 * @constructor | 742 * @constructor |
| 743 * @extends {WebInspector.ToolbarToggle} | 743 * @extends {WebInspector.ToolbarToggle} |
| 744 * @param {!WebInspector.Setting} setting | 744 * @param {!WebInspector.Setting} setting |
| 745 * @param {string} glyph | 745 * @param {string} glyph |
| 746 * @param {string} title | 746 * @param {string} title |
| 747 * @param {string=} toggledTitle | 747 * @param {string=} toggledTitle |
| 748 */ | 748 */ |
| 749 WebInspector.ToolbarSettingToggle = function(setting, glyph, title, toggledTitle
) | 749 WebInspector.ToolbarSettingToggle = function(setting, glyph, title, toggledTitle
) |
| 750 { | 750 { |
| 751 WebInspector.ToolbarToggle.call(this, title, glyph); | 751 WebInspector.ToolbarToggle.call(this, title, glyph); |
| 752 this._defaultTitle = title; | 752 this._defaultTitle = title; |
| 753 this._toggledTitle = toggledTitle || title; | 753 this._toggledTitle = toggledTitle || title; |
| 754 this._setting = setting; | 754 this._setting = setting; |
| 755 this._settingChanged(); | 755 this._settingChanged(); |
| 756 this._setting.addChangeListener(this._settingChanged, this); | 756 this._setting.addChangeListener(this._settingChanged, this); |
| 757 } | 757 }; |
| 758 | 758 |
| 759 WebInspector.ToolbarSettingToggle.prototype = { | 759 WebInspector.ToolbarSettingToggle.prototype = { |
| 760 _settingChanged: function() | 760 _settingChanged: function() |
| 761 { | 761 { |
| 762 var toggled = this._setting.get(); | 762 var toggled = this._setting.get(); |
| 763 this.setToggled(toggled); | 763 this.setToggled(toggled); |
| 764 this.setTitle(toggled ? this._toggledTitle : this._defaultTitle); | 764 this.setTitle(toggled ? this._toggledTitle : this._defaultTitle); |
| 765 }, | 765 }, |
| 766 | 766 |
| 767 /** | 767 /** |
| 768 * @override | 768 * @override |
| 769 * @param {!Event} event | 769 * @param {!Event} event |
| 770 */ | 770 */ |
| 771 _clicked: function(event) | 771 _clicked: function(event) |
| 772 { | 772 { |
| 773 this._setting.set(!this.toggled()); | 773 this._setting.set(!this.toggled()); |
| 774 WebInspector.ToolbarToggle.prototype._clicked.call(this, event); | 774 WebInspector.ToolbarToggle.prototype._clicked.call(this, event); |
| 775 }, | 775 }, |
| 776 | 776 |
| 777 __proto__: WebInspector.ToolbarToggle.prototype | 777 __proto__: WebInspector.ToolbarToggle.prototype |
| 778 } | 778 }; |
| 779 | 779 |
| 780 /** | 780 /** |
| 781 * @constructor | 781 * @constructor |
| 782 * @extends {WebInspector.ToolbarItem} | 782 * @extends {WebInspector.ToolbarItem} |
| 783 * @param {boolean=} spacer | 783 * @param {boolean=} spacer |
| 784 */ | 784 */ |
| 785 WebInspector.ToolbarSeparator = function(spacer) | 785 WebInspector.ToolbarSeparator = function(spacer) |
| 786 { | 786 { |
| 787 WebInspector.ToolbarItem.call(this, createElementWithClass("div", spacer ? "
toolbar-spacer" : "toolbar-divider")); | 787 WebInspector.ToolbarItem.call(this, createElementWithClass("div", spacer ? "
toolbar-spacer" : "toolbar-divider")); |
| 788 } | 788 }; |
| 789 | 789 |
| 790 WebInspector.ToolbarSeparator.prototype = { | 790 WebInspector.ToolbarSeparator.prototype = { |
| 791 __proto__: WebInspector.ToolbarItem.prototype | 791 __proto__: WebInspector.ToolbarItem.prototype |
| 792 } | 792 }; |
| 793 | 793 |
| 794 /** | 794 /** |
| 795 * @interface | 795 * @interface |
| 796 */ | 796 */ |
| 797 WebInspector.ToolbarItem.Provider = function() | 797 WebInspector.ToolbarItem.Provider = function() |
| 798 { | 798 { |
| 799 } | 799 }; |
| 800 | 800 |
| 801 WebInspector.ToolbarItem.Provider.prototype = { | 801 WebInspector.ToolbarItem.Provider.prototype = { |
| 802 /** | 802 /** |
| 803 * @return {?WebInspector.ToolbarItem} | 803 * @return {?WebInspector.ToolbarItem} |
| 804 */ | 804 */ |
| 805 item: function() {} | 805 item: function() {} |
| 806 } | 806 }; |
| 807 | 807 |
| 808 /** | 808 /** |
| 809 * @interface | 809 * @interface |
| 810 */ | 810 */ |
| 811 WebInspector.ToolbarItem.ItemsProvider = function() | 811 WebInspector.ToolbarItem.ItemsProvider = function() |
| 812 { | 812 { |
| 813 } | 813 }; |
| 814 | 814 |
| 815 WebInspector.ToolbarItem.ItemsProvider.prototype = { | 815 WebInspector.ToolbarItem.ItemsProvider.prototype = { |
| 816 /** | 816 /** |
| 817 * @return {!Array<!WebInspector.ToolbarItem>} | 817 * @return {!Array<!WebInspector.ToolbarItem>} |
| 818 */ | 818 */ |
| 819 toolbarItems: function() {} | 819 toolbarItems: function() {} |
| 820 } | 820 }; |
| 821 | 821 |
| 822 /** | 822 /** |
| 823 * @constructor | 823 * @constructor |
| 824 * @extends {WebInspector.ToolbarItem} | 824 * @extends {WebInspector.ToolbarItem} |
| 825 * @param {?function(!Event)} changeHandler | 825 * @param {?function(!Event)} changeHandler |
| 826 * @param {string=} className | 826 * @param {string=} className |
| 827 */ | 827 */ |
| 828 WebInspector.ToolbarComboBox = function(changeHandler, className) | 828 WebInspector.ToolbarComboBox = function(changeHandler, className) |
| 829 { | 829 { |
| 830 WebInspector.ToolbarItem.call(this, createElementWithClass("span", "toolbar-
select-container")); | 830 WebInspector.ToolbarItem.call(this, createElementWithClass("span", "toolbar-
select-container")); |
| 831 | 831 |
| 832 this._selectElement = this.element.createChild("select", "toolbar-item"); | 832 this._selectElement = this.element.createChild("select", "toolbar-item"); |
| 833 this.element.createChild("div", "toolbar-dropdown-arrow"); | 833 this.element.createChild("div", "toolbar-dropdown-arrow"); |
| 834 if (changeHandler) | 834 if (changeHandler) |
| 835 this._selectElement.addEventListener("change", changeHandler, false); | 835 this._selectElement.addEventListener("change", changeHandler, false); |
| 836 if (className) | 836 if (className) |
| 837 this._selectElement.classList.add(className); | 837 this._selectElement.classList.add(className); |
| 838 } | 838 }; |
| 839 | 839 |
| 840 WebInspector.ToolbarComboBox.prototype = { | 840 WebInspector.ToolbarComboBox.prototype = { |
| 841 /** | 841 /** |
| 842 * @return {!HTMLSelectElement} | 842 * @return {!HTMLSelectElement} |
| 843 */ | 843 */ |
| 844 selectElement: function() | 844 selectElement: function() |
| 845 { | 845 { |
| 846 return /** @type {!HTMLSelectElement} */ (this._selectElement); | 846 return /** @type {!HTMLSelectElement} */ (this._selectElement); |
| 847 }, | 847 }, |
| 848 | 848 |
| (...skipping 95 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 944 | 944 |
| 945 /** | 945 /** |
| 946 * @param {number} width | 946 * @param {number} width |
| 947 */ | 947 */ |
| 948 setMaxWidth: function(width) | 948 setMaxWidth: function(width) |
| 949 { | 949 { |
| 950 this._selectElement.style.maxWidth = width + "px"; | 950 this._selectElement.style.maxWidth = width + "px"; |
| 951 }, | 951 }, |
| 952 | 952 |
| 953 __proto__: WebInspector.ToolbarItem.prototype | 953 __proto__: WebInspector.ToolbarItem.prototype |
| 954 } | 954 }; |
| 955 | 955 |
| 956 /** | 956 /** |
| 957 * @constructor | 957 * @constructor |
| 958 * @extends {WebInspector.ToolbarItem} | 958 * @extends {WebInspector.ToolbarItem} |
| 959 * @param {string} text | 959 * @param {string} text |
| 960 * @param {string=} title | 960 * @param {string=} title |
| 961 * @param {!WebInspector.Setting=} setting | 961 * @param {!WebInspector.Setting=} setting |
| 962 * @param {function()=} listener | 962 * @param {function()=} listener |
| 963 */ | 963 */ |
| 964 WebInspector.ToolbarCheckbox = function(text, title, setting, listener) | 964 WebInspector.ToolbarCheckbox = function(text, title, setting, listener) |
| 965 { | 965 { |
| 966 WebInspector.ToolbarItem.call(this, createCheckboxLabel(text)); | 966 WebInspector.ToolbarItem.call(this, createCheckboxLabel(text)); |
| 967 this.element.classList.add("checkbox"); | 967 this.element.classList.add("checkbox"); |
| 968 this.inputElement = this.element.checkboxElement; | 968 this.inputElement = this.element.checkboxElement; |
| 969 if (title) | 969 if (title) |
| 970 this.element.title = title; | 970 this.element.title = title; |
| 971 if (setting) | 971 if (setting) |
| 972 WebInspector.SettingsUI.bindCheckbox(this.inputElement, setting); | 972 WebInspector.SettingsUI.bindCheckbox(this.inputElement, setting); |
| 973 if (listener) | 973 if (listener) |
| 974 this.inputElement.addEventListener("click", listener, false); | 974 this.inputElement.addEventListener("click", listener, false); |
| 975 } | 975 }; |
| 976 | 976 |
| 977 WebInspector.ToolbarCheckbox.prototype = { | 977 WebInspector.ToolbarCheckbox.prototype = { |
| 978 /** | 978 /** |
| 979 * @return {boolean} | 979 * @return {boolean} |
| 980 */ | 980 */ |
| 981 checked: function() | 981 checked: function() |
| 982 { | 982 { |
| 983 return this.inputElement.checked; | 983 return this.inputElement.checked; |
| 984 }, | 984 }, |
| 985 | 985 |
| 986 /** | 986 /** |
| 987 * @param {boolean} value | 987 * @param {boolean} value |
| 988 */ | 988 */ |
| 989 setChecked: function(value) | 989 setChecked: function(value) |
| 990 { | 990 { |
| 991 this.inputElement.checked = value; | 991 this.inputElement.checked = value; |
| 992 }, | 992 }, |
| 993 | 993 |
| 994 __proto__: WebInspector.ToolbarItem.prototype | 994 __proto__: WebInspector.ToolbarItem.prototype |
| 995 } | 995 }; |
| 996 | 996 |
| OLD | NEW |