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 26WebInspector.DetailsSection = function(identifier, title, groups, optionsElement, defaultCollapsedSettingValue) { 27 WebInspector.Object.call(this); 28 29 console.assert(identifier); 30 31 this._element = document.createElement("div"); 32 this._element.className = WebInspector.DetailsSection.StyleClassName; 33 this._element.classList.add(identifier); 34 35 this._headerElement = document.createElement("div"); 36 this._headerElement.addEventListener("click", this._headerElementClicked.bind(this)); 37 this._headerElement.className = WebInspector.DetailsSection.HeaderElementStyleClassName; 38 this._element.appendChild(this._headerElement); 39 40 if (optionsElement instanceof HTMLElement) { 41 this._optionsElement = optionsElement; 42 this._optionsElement.addEventListener("mousedown", this._optionsElementMouseDown.bind(this)); 43 this._optionsElement.addEventListener("mouseup", this._optionsElementMouseUp.bind(this)); 44 this._headerElement.appendChild(this._optionsElement); 45 } 46 47 this._titleElement = document.createElement("span"); 48 this._headerElement.appendChild(this._titleElement); 49 50 this._contentElement = document.createElement("div"); 51 this._contentElement.className = WebInspector.DetailsSection.ContentElementStyleClassName; 52 this._element.appendChild(this._contentElement); 53 54 this._generateDisclosureTrianglesIfNeeded(); 55 56 this._identifier = identifier; 57 this.title = title; 58 this.groups = groups || [new WebInspector.DetailsSectionGroup]; 59 60 this._collapsedSetting = new WebInspector.Setting(identifier + "-details-section-collapsed", !!defaultCollapsedSettingValue); 61 this.collapsed = this._collapsedSetting.value; 62}; 63 64WebInspector.DetailsSection.StyleClassName = "details-section"; 65WebInspector.DetailsSection.HeaderElementStyleClassName = "header"; 66WebInspector.DetailsSection.TitleElementStyleClassName = "title"; 67WebInspector.DetailsSection.ContentElementStyleClassName = "content"; 68WebInspector.DetailsSection.CollapsedStyleClassName = "collapsed"; 69WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName = "mouse-over-options-element"; 70WebInspector.DetailsSection.DisclosureTriangleOpenCanvasIdentifier = "details-section-disclosure-triangle-open"; 71WebInspector.DetailsSection.DisclosureTriangleClosedCanvasIdentifier = "details-section-disclosure-triangle-closed"; 72WebInspector.DetailsSection.DisclosureTriangleNormalCanvasIdentifierSuffix = "-normal"; 73WebInspector.DetailsSection.DisclosureTriangleActiveCanvasIdentifierSuffix = "-active"; 74 75WebInspector.DetailsSection.prototype = { 76 constructor: WebInspector.DetailsSection, 77 78 // Public 79 80 get element() 81 { 82 return this._element; 83 }, 84 85 get identifier() 86 { 87 return this._identifier; 88 }, 89 90 get title() 91 { 92 return this._titleElement.textContent; 93 }, 94 95 set title(title) 96 { 97 this._titleElement.textContent = title; 98 }, 99 100 get collapsed() 101 { 102 return this._element.classList.contains(WebInspector.DetailsSection.CollapsedStyleClassName); 103 }, 104 105 set collapsed(flag) 106 { 107 if (flag) 108 this._element.classList.add(WebInspector.DetailsSection.CollapsedStyleClassName); 109 else 110 this._element.classList.remove(WebInspector.DetailsSection.CollapsedStyleClassName); 111 112 this._collapsedSetting.value = flag || false; 113 }, 114 115 get groups() 116 { 117 return this._groups; 118 }, 119 120 set groups(groups) 121 { 122 this._contentElement.removeChildren(); 123 124 this._groups = groups || []; 125 126 for (var i = 0; i < this._groups.length; ++i) 127 this._contentElement.appendChild(this._groups[i].element); 128 }, 129 130 // Private 131 132 _headerElementClicked: function(event) 133 { 134 if (event.target.isSelfOrDescendant(this._optionsElement)) 135 return; 136 137 this.collapsed = !this.collapsed; 138 139 this._element.scrollIntoViewIfNeeded(false); 140 }, 141 142 _optionsElementMouseDown: function(event) 143 { 144 this._headerElement.classList.add(WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName); 145 }, 146 147 _optionsElementMouseUp: function(event) 148 { 149 this._headerElement.classList.remove(WebInspector.DetailsSection.MouseOverOptionsElementStyleClassName); 150 }, 151 152 _generateDisclosureTrianglesIfNeeded: function() 153 { 154 if (WebInspector.DetailsSection._generatedDisclosureTriangles) 155 return; 156 157 // Set this early instead of in _generateDisclosureTriangle because we don't want multiple sections that are 158 // created at the same time to duplicate the work (even though it would be harmless.) 159 WebInspector.DetailsSection._generatedDisclosureTriangles = true; 160 161 var specifications = {}; 162 specifications[WebInspector.DetailsSection.DisclosureTriangleNormalCanvasIdentifierSuffix] = { 163 fillColor: [134, 134, 134] 164 }; 165 166 specifications[WebInspector.DetailsSection.DisclosureTriangleActiveCanvasIdentifierSuffix] = { 167 fillColor: [57, 57, 57] 168 }; 169 170 generateColoredImagesForCSS("Images/DisclosureTriangleSmallOpen.svg", specifications, 13, 13, WebInspector.DetailsSection.DisclosureTriangleOpenCanvasIdentifier); 171 generateColoredImagesForCSS("Images/DisclosureTriangleSmallClosed.svg", specifications, 13, 13, WebInspector.DetailsSection.DisclosureTriangleClosedCanvasIdentifier); 172 } 173}; 174 175WebInspector.DetailsSection.prototype.__proto__ = WebInspector.Object.prototype; 176