RadioButtonNavigationItem.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. /*
  2. * Copyright (C) 2013 Apple Inc. All rights reserved.
  3. *
  4. * Redistribution and use in source and binary forms, with or without
  5. * modification, are permitted provided that the following conditions
  6. * are met:
  7. * 1. Redistributions of source code must retain the above copyright
  8. * notice, this list of conditions and the following disclaimer.
  9. * 2. Redistributions in binary form must reproduce the above copyright
  10. * notice, this list of conditions and the following disclaimer in the
  11. * documentation and/or other materials provided with the distribution.
  12. *
  13. * THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
  14. * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
  15. * THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
  16. * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
  17. * BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
  18. * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
  19. * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
  20. * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
  21. * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
  22. * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
  23. * THE POSSIBILITY OF SUCH DAMAGE.
  24. */
  25. WebInspector.RadioButtonNavigationItem = function(identifier, toolTip, image, imageWidth, imageHeight) {
  26. WebInspector.ButtonNavigationItem.call(this, identifier, toolTip, image, imageWidth, imageHeight, null, "tab");
  27. };
  28. WebInspector.RadioButtonNavigationItem.StyleClassName = "radio";
  29. WebInspector.RadioButtonNavigationItem.ActiveStyleClassName = "active";
  30. WebInspector.RadioButtonNavigationItem.SelectedStyleClassName = "selected";
  31. WebInspector.RadioButtonNavigationItem.prototype = {
  32. constructor: WebInspector.RadioButtonNavigationItem,
  33. // Public
  34. get selected()
  35. {
  36. return this.element.classList.contains(WebInspector.RadioButtonNavigationItem.SelectedStyleClassName);
  37. },
  38. set selected(flag)
  39. {
  40. if (flag) {
  41. this.element.classList.add(WebInspector.RadioButtonNavigationItem.SelectedStyleClassName);
  42. this.element.setAttribute("aria-selected", "true");
  43. } else {
  44. this.element.classList.remove(WebInspector.RadioButtonNavigationItem.SelectedStyleClassName);
  45. this.element.setAttribute("aria-selected", "false");
  46. }
  47. },
  48. get active()
  49. {
  50. return this.element.classList.contains(WebInspector.RadioButtonNavigationItem.ActiveStyleClassName);
  51. },
  52. set active(flag)
  53. {
  54. if (flag)
  55. this.element.classList.add(WebInspector.RadioButtonNavigationItem.ActiveStyleClassName);
  56. else
  57. this.element.classList.remove(WebInspector.RadioButtonNavigationItem.ActiveStyleClassName);
  58. },
  59. generateStyleText: function(parentSelector)
  60. {
  61. var classNames = this._classNames.join(".");
  62. // Default state.
  63. var styleText = parentSelector + " ." + classNames + " > .glyph { background-image: -webkit-canvas(" + this._canvasIdentifier() + "); background-size: " + this._imageWidth + "px " + this._imageHeight + "px; }\n";
  64. // Selected state.
  65. styleText += parentSelector + " ." + classNames + ".selected:not(.disabled) > .glyph { background-image: -webkit-canvas(" + this._canvasIdentifier(WebInspector.ButtonNavigationItem.States.Focus) + "); }\n";
  66. // Selected and pressed state.
  67. styleText += parentSelector + " ." + classNames + ".selected:not(.disabled):active > .glyph { background-image: -webkit-canvas(" + this._canvasIdentifier(WebInspector.ButtonNavigationItem.States.ActiveFocus) + "); }\n";
  68. return styleText;
  69. },
  70. updateLayout: function(expandOnly)
  71. {
  72. if (expandOnly)
  73. return;
  74. var isSelected = this.selected;
  75. if (!isSelected) {
  76. this.element.classList.add(WebInspector.RadioButtonNavigationItem.SelectedStyleClassName);
  77. this.element.setAttribute("aria-selected", "true");
  78. }
  79. var selectedWidth = this.element.offsetWidth;
  80. if (selectedWidth)
  81. this.element.style.minWidth = selectedWidth + "px";
  82. if (!isSelected) {
  83. this.element.classList.remove(WebInspector.RadioButtonNavigationItem.SelectedStyleClassName);
  84. this.element.setAttribute("aria-selected", "false");
  85. }
  86. },
  87. // Private
  88. _additionalClassNames: [WebInspector.RadioButtonNavigationItem.StyleClassName, WebInspector.ButtonNavigationItem.StyleClassName],
  89. };
  90. WebInspector.RadioButtonNavigationItem.prototype.__proto__ = WebInspector.ButtonNavigationItem.prototype;