Changeset 191740 in webkit


Ignore:
Timestamp:
Oct 29, 2015 11:35:17 AM (9 years ago)
Author:
timothy@apple.com
Message:

Web Inspector: Navigation bar icons are missing
​https://bugs.webkit.org/show_bug.cgi?id=150677

Reviewed by Joseph Pecoraro.

The glyph width and height were not being set correctly and it broke NavigationBar buttons.
The width and height attribute was being set on a div, when it should have used the style property.
Also remove the suppressEmboss flag, which is no longer used but the clients and subclasses still did.

  • UserInterface/Base/ImageUtilities.js:

(useSVGSymbol): Use style property instead of setting width and height. The attributes
didn't accomplish the same thing in all cases. Use title and className property on the
wrapper element and remove the comments, which applied when there wasn't a wrapper.

  • UserInterface/Views/ActivateButtonNavigationItem.js:

(WebInspector.ActivateButtonNavigationItem): Remove suppressEmboss.

  • UserInterface/Views/ActivateButtonToolbarItem.js:

(WebInspector.ActivateButtonToolbarItem): Remove suppressEmboss.

  • UserInterface/Views/ButtonNavigationItem.js:

(WebInspector.ButtonNavigationItem): Remove suppressEmboss.
(WebInspector.ButtonNavigationItem.prototype.set image): Use style property instead of setting
width and height attributes. This assumed the SVG element was the glyph element, which changed
at one point without me remembering to fix this client.

  • UserInterface/Views/ButtonToolbarItem.js:

(WebInspector.ButtonToolbarItem): Remove suppressEmboss.

  • UserInterface/Views/DebuggerDashboardView.js:

(WebInspector.DebuggerDashboardView): Remove suppressEmboss use.

  • UserInterface/Views/FilterBar.js:

(WebInspector.FilterBar.prototype.addFilterBarButton): Remove suppressEmboss.

  • UserInterface/Views/FilterBarButton.js:

(WebInspector.FilterBarButton): Remove suppressEmboss.

  • UserInterface/Views/TimelineSidebarPanel.js:

(WebInspector.TimelineSidebarPanel): Remove suppressEmboss use.

  • UserInterface/Views/ToggleButtonNavigationItem.js:

(WebInspector.ToggleButtonNavigationItem): Remove suppressEmboss.

Location:
trunk/Source/WebInspectorUI
Files:
11 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r191732 r191740  
     12015-10-29  Timothy Hatcher  <timothy@apple.com>
     2
     3        Web Inspector: Navigation bar icons are missing
     4        https://bugs.webkit.org/show_bug.cgi?id=150677
     5
     6        Reviewed by Joseph Pecoraro.
     7
     8        The glyph width and height were not being set correctly and it broke NavigationBar buttons.
     9        The width and height attribute was being set on a div, when it should have used the style property.
     10        Also remove the suppressEmboss flag, which is no longer used but the clients and subclasses still did.
     11
     12        * UserInterface/Base/ImageUtilities.js:
     13        (useSVGSymbol): Use style property instead of setting width and height. The attributes
     14        didn't accomplish the same thing in all cases. Use title and className property on the
     15        wrapper element and remove the comments, which applied when there wasn't a wrapper.
     16
     17        * UserInterface/Views/ActivateButtonNavigationItem.js:
     18        (WebInspector.ActivateButtonNavigationItem): Remove suppressEmboss.
     19        * UserInterface/Views/ActivateButtonToolbarItem.js:
     20        (WebInspector.ActivateButtonToolbarItem): Remove suppressEmboss.
     21
     22        * UserInterface/Views/ButtonNavigationItem.js:
     23        (WebInspector.ButtonNavigationItem): Remove suppressEmboss.
     24        (WebInspector.ButtonNavigationItem.prototype.set image): Use style property instead of setting
     25        width and height attributes. This assumed the SVG element was the glyph element, which changed
     26        at one point without me remembering to fix this client.
     27
     28        * UserInterface/Views/ButtonToolbarItem.js:
     29        (WebInspector.ButtonToolbarItem):  Remove suppressEmboss.
     30        * UserInterface/Views/DebuggerDashboardView.js:
     31        (WebInspector.DebuggerDashboardView): Remove suppressEmboss use.
     32        * UserInterface/Views/FilterBar.js:
     33        (WebInspector.FilterBar.prototype.addFilterBarButton): Remove suppressEmboss.
     34        * UserInterface/Views/FilterBarButton.js:
     35        (WebInspector.FilterBarButton): Remove suppressEmboss.
     36        * UserInterface/Views/TimelineSidebarPanel.js:
     37        (WebInspector.TimelineSidebarPanel):  Remove suppressEmboss use.
     38        * UserInterface/Views/ToggleButtonNavigationItem.js:
     39        (WebInspector.ToggleButtonNavigationItem): Remove suppressEmboss.
     40
    1412015-10-29  Joseph Pecoraro  <pecoraro@apple.com>
    242

  • trunk/Source/WebInspectorUI/UserInterface/Base/ImageUtilities.js

    r191693 r191740  
    3030
    3131    let svgElement = document.createElementNS(svgNamespace, "svg");
    32     svgElement.setAttribute("width", "100%");
    33     svgElement.setAttribute("height", "100%");
     32    svgElement.style.width = "100%";
     33    svgElement.style.height = "100%";
    3434
    3535    // URL must contain a fragment reference to a graphical element, like a symbol. If none is given
    … …  
    4646
    4747    if (className)
    48         wrapper.setAttribute("class", className); // Can't use className property since this is the SVG DOM.
     48        wrapper.className = className;
    4949    if (title)
    50         wrapper.setAttribute("title", title); // Can't use title property since this is the SVG DOM.
     50        wrapper.title = title;
    5151
    5252    return wrapper;

  • trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js

    r191693 r191740  
    2626WebInspector.ActivateButtonNavigationItem = class ActivateButtonNavigationItem extends WebInspector.ButtonNavigationItem
    2727{
    28     constructor(identifier, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss, role)
     28    constructor(identifier, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, role)
    2929    {
    30         super(identifier, defaultToolTip, image, imageWidth, imageHeight, suppressEmboss, role);
     30        super(identifier, defaultToolTip, image, imageWidth, imageHeight, role);
    3131
    3232        this._defaultToolTip = defaultToolTip;

  • trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonToolbarItem.js

    r187519 r191740  
    2626WebInspector.ActivateButtonToolbarItem = class ActivateButtonToolbarItem extends WebInspector.ActivateButtonNavigationItem
    2727{
    28     constructor(identifier, defaultToolTip, activatedToolTip, label, image, suppressEmboss, role)
     28    constructor(identifier, defaultToolTip, activatedToolTip, label, image, role)
    2929    {
    30         super(identifier, defaultToolTip, activatedToolTip, image, 32, 32, suppressEmboss, role);
     30        super(identifier, defaultToolTip, activatedToolTip, image, 16, 16, role);
    3131
    3232        if (typeof label === "string") {

  • trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js

    r191693 r191740  
    2626WebInspector.ButtonNavigationItem = class ButtonNavigationItem extends WebInspector.NavigationItem
    2727{
    28     constructor(identifier, toolTipOrLabel, image, imageWidth, imageHeight, suppressEmboss, role, label)
     28    constructor(identifier, toolTipOrLabel, image, imageWidth, imageHeight, role, label)
    2929    {
    3030        super(identifier);
    … …  
    9898
    9999        this._glyphElement = useSVGSymbol(this._image, "glyph");
    100         this._glyphElement.setAttribute("width", this._imageWidth + "px");
    101         this._glyphElement.setAttribute("height", this._imageHeight + "px");
     100        this._glyphElement.style.width = this._imageWidth + "px";
     101        this._glyphElement.style.height = this._imageHeight + "px";
    102102        this._element.appendChild(this._glyphElement);
    103103    }

  • trunk/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.js

    r187519 r191740  
    2626WebInspector.ButtonToolbarItem = class ButtonToolbarItem extends WebInspector.ButtonNavigationItem
    2727{
    28     constructor(identifier, toolTip, label, image, suppressEmboss, role)
     28    constructor(identifier, toolTip, label, image, role)
    2929    {
    30         super(identifier, toolTip, image, 16, 16, suppressEmboss, role);
     30        super(identifier, toolTip, image, 16, 16, role);
    3131
    3232        if (typeof label === "string") {

  • trunk/Source/WebInspectorUI/UserInterface/Views/DebuggerDashboardView.js

    r187402 r191740  
    3636
    3737        var tooltip = WebInspector.UIString("Continue script execution (%s or %s)").format(WebInspector.pauseOrResumeKeyboardShortcut.displayName, WebInspector.pauseOrResumeAlternateKeyboardShortcut.displayName);
    38         this._debuggerResumeButtonItem = new WebInspector.ActivateButtonNavigationItem("debugger-dashboard-pause", tooltip, tooltip, "Images/Resume.svg", 15, 15, true);
     38        this._debuggerResumeButtonItem = new WebInspector.ActivateButtonNavigationItem("debugger-dashboard-pause", tooltip, tooltip, "Images/Resume.svg", 15, 15);
    3939        this._debuggerResumeButtonItem.activated = true;
    4040        this._debuggerResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._resumeButtonClicked, this);

  • trunk/Source/WebInspectorUI/UserInterface/Views/FilterBar.js

    r185723 r191740  
    8585    }
    8686
    87     addFilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss)
     87    addFilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight)
    8888    {
    89         var filterBarButton = new WebInspector.FilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss);
     89        var filterBarButton = new WebInspector.FilterBarButton(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight);
    9090        filterBarButton.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._handleFilterBarButtonClicked, this);
    9191        filterBarButton.addEventListener(WebInspector.FilterBarButton.Event.ActivatedStateToggled, this._handleFilterButtonToggled, this);

  • trunk/Source/WebInspectorUI/UserInterface/Views/FilterBarButton.js

    r182055 r191740  
    2626WebInspector.FilterBarButton = class FilterBarButton extends WebInspector.ActivateButtonNavigationItem
    2727{
    28     constructor(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss, role)
     28    constructor(identifier, filterFunction, activatedByDefault, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, role)
    2929    {
    30         super(identifier, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, suppressEmboss, role);
     30        super(identifier, defaultToolTip, activatedToolTip, image, imageWidth, imageHeight, role);
    3131
    3232        this._filterFunction = filterFunction;

  • trunk/Source/WebInspectorUI/UserInterface/Views/TimelineSidebarPanel.js

    r191693 r191740  
    149149        toolTip = WebInspector.UIString("Start Playback");
    150150        altToolTip = WebInspector.UIString("Pause Playback");
    151         this._replayPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("replay-pause-resume", toolTip, altToolTip, "Images/Resume.svg", "Images/Pause.svg", 15, 15, true);
     151        this._replayPauseResumeButtonItem = new WebInspector.ToggleButtonNavigationItem("replay-pause-resume", toolTip, altToolTip, "Images/Resume.svg", "Images/Pause.svg", 15, 15);
    152152        this._replayPauseResumeButtonItem.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._replayPauseResumeButtonClicked, this);
    153153        this._replayPauseResumeButtonItem.enabled = false;

  • trunk/Source/WebInspectorUI/UserInterface/Views/ToggleButtonNavigationItem.js

    r191693 r191740  
    2626WebInspector.ToggleButtonNavigationItem = class ToggleButtonNavigationItem extends WebInspector.ButtonNavigationItem
    2727{
    28     constructor(identifier, defaultToolTip, alternateToolTip, defaultImage, alternateImage, imageWidth, imageHeight, suppressEmboss)
     28    constructor(identifier, defaultToolTip, alternateToolTip, defaultImage, alternateImage, imageWidth, imageHeight)
    2929    {
    30         super(identifier, defaultToolTip, defaultImage, imageWidth, imageHeight, suppressEmboss);
     30        super(identifier, defaultToolTip, defaultImage, imageWidth, imageHeight);
    3131
    3232        this._toggled = false;
Note: See TracChangeset for help on using the changeset viewer.