Web Inspector: Remove redundant tooltips
[WebKit-https.git] / Source / WebInspectorUI / UserInterface / Views / ButtonNavigationItem.js
1 /*
2  * Copyright (C) 2013, 2015 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
26 WI.ButtonNavigationItem = class ButtonNavigationItem extends WI.NavigationItem
27 {
28     constructor(identifier, toolTipOrLabel, image, imageWidth, imageHeight, role, label)
29     {
30         super(identifier, role || "button");
31
32         console.assert(identifier);
33         console.assert(toolTipOrLabel);
34
35         this._enabled = true;
36
37         this.element.addEventListener("click", this._mouseClicked.bind(this));
38
39         if (label)
40             this.element.setAttribute("aria-label", label);
41
42         this._buttonStyle = null;
43         this._disabled = false;
44         this._image = image || null;
45         this._imageWidth = imageWidth || 16;
46         this._imageHeight = imageHeight || 16;
47         this._label = toolTipOrLabel;
48
49         this.buttonStyle = this._image ? WI.ButtonNavigationItem.Style.Image : WI.ButtonNavigationItem.Style.Text;
50
51         if (this.buttonStyle === WI.ButtonNavigationItem.Style.Image)
52             this.tooltip = toolTipOrLabel;
53     }
54
55     // Public
56
57     get label()
58     {
59         return this._label;
60     }
61
62     set label(newLabel)
63     {
64         newLabel = newLabel || "";
65         if (this._label === newLabel)
66             return;
67
68         this._label = newLabel;
69         this._update();
70
71         if (this.parentNavigationBar)
72             this.parentNavigationBar.needsLayout();
73     }
74
75     get image()
76     {
77         return this._image;
78     }
79
80     set image(newImage)
81     {
82         newImage = newImage || null;
83         if (this._image === newImage)
84             return;
85
86         this._image = newImage;
87         this._update();
88     }
89
90     get enabled()
91     {
92         return this._enabled;
93     }
94
95     set enabled(flag)
96     {
97         flag = !!flag;
98         if (this._enabled === flag)
99             return;
100
101         this._enabled = flag;
102         this.element.classList.toggle("disabled", !this._enabled);
103     }
104
105     get buttonStyle()
106     {
107         return this._buttonStyle;
108     }
109
110     set buttonStyle(newButtonStyle)
111     {
112         newButtonStyle = newButtonStyle || WI.ButtonNavigationItem.Style.Image;
113         if (this._buttonStyle === newButtonStyle)
114             return;
115
116         this.element.classList.remove(...Object.values(WI.ButtonNavigationItem.Style));
117         this.element.classList.add(newButtonStyle);
118
119         this._buttonStyle = newButtonStyle;
120         this._update();
121
122         if (this.parentNavigationBar)
123             this.parentNavigationBar.needsLayout();
124     }
125
126     // Protected
127
128     get additionalClassNames()
129     {
130         return ["button"];
131     }
132
133     // Private
134
135     _mouseClicked(event)
136     {
137         if (!this.enabled)
138             return;
139         this.dispatchEventToListeners(WI.ButtonNavigationItem.Event.Clicked, {nativeEvent: event});
140     }
141
142     _update()
143     {
144         this.element.removeChildren();
145
146         if (this._buttonStyle === WI.ButtonNavigationItem.Style.Text)
147             this.element.textContent = this._label;
148         else {
149             let glyphElement = WI.ImageUtilities.useSVGSymbol(this._image, "glyph");
150             glyphElement.style.width = this._imageWidth + "px";
151             glyphElement.style.height = this._imageHeight + "px";
152             this.element.appendChild(glyphElement);
153
154             if (this._buttonStyle === WI.ButtonNavigationItem.Style.ImageAndText) {
155                 let labelElement = this.element.appendChild(document.createElement("span"));
156                 labelElement.textContent = this._label;
157             }
158         }
159     }
160 };
161
162 WI.ButtonNavigationItem.Event = {
163     Clicked: "button-navigation-item-clicked"
164 };
165
166 WI.ButtonNavigationItem.Style = {
167     Image: "image-only",
168     Text: "text-only",
169     ImageAndText: "image-and-text",
170 };