Changeset 143325 in webkit


Ignore:
Timestamp:
Feb 19, 2013 6:31:43 AM (11 years ago)
Author:
aandrey@chromium.org
Message:

Web Inspector: [Canvas] do not replace replay image with spinner icon
https://bugs.webkit.org/show_bug.cgi?id=110213

Reviewed by Pavel Feldman.

Otherwise it's visually hard to see changes in the replay image. Instead show a small spinner icon in the bottom right corner.

  • inspector/front-end/CanvasProfileView.js:

(WebInspector.CanvasProfileView):
(WebInspector.CanvasProfileView.prototype._enableWaitIcon):

  • inspector/front-end/canvasProfiler.css:

(#canvas-replay-image-container):
(.canvas-debug-info):
(.canvas-spinner-icon):

Location:
trunk/Source/WebCore
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • trunk/Source/WebCore/ChangeLog

    r143324 r143325  
     12013-02-19  Andrey Adaikin  <aandrey@chromium.org>
     2
     3        Web Inspector: [Canvas] do not replace replay image with spinner icon
     4        https://bugs.webkit.org/show_bug.cgi?id=110213
     5
     6        Reviewed by Pavel Feldman.
     7
     8        Otherwise it's visually hard to see changes in the replay image. Instead show a small spinner icon in the bottom right corner.
     9
     10        * inspector/front-end/CanvasProfileView.js:
     11        (WebInspector.CanvasProfileView):
     12        (WebInspector.CanvasProfileView.prototype._enableWaitIcon):
     13        * inspector/front-end/canvasProfiler.css:
     14        (#canvas-replay-image-container):
     15        (.canvas-debug-info):
     16        (.canvas-spinner-icon):
     17
    1182013-02-19  Andrey Adaikin  <aandrey@chromium.org>
    219
  • trunk/Source/WebCore/inspector/front-end/CanvasProfileView.js

    r143324 r143325  
    4848    replayImageContainer.id = "canvas-replay-image-container";
    4949    this._replayImageElement = replayImageContainer.createChild("image", "canvas-replay-image");
    50     this._debugInfoElement = replayImageContainer.createChild("div");
     50    this._debugInfoElement = replayImageContainer.createChild("div", "canvas-debug-info hidden");
     51    this._spinnerIcon = replayImageContainer.createChild("img", "canvas-spinner-icon hidden");
    5152
    5253    var replayInfoContainer = this._splitView.secondElement();
     
    239240    _enableWaitIcon: function(enable)
    240241    {
    241         function showWaitIcon()
    242         {
    243             this._replayImageElement.addStyleClass("wait");
    244             this._debugInfoElement.addStyleClass("hidden");
    245             delete this._showWaitIconTimer;
    246         }
    247 
    248         if (enable && this._replayImageElement.src && !this._showWaitIconTimer)
    249             this._showWaitIconTimer = setTimeout(showWaitIcon.bind(this), 250);
    250         else {
    251             if (this._showWaitIconTimer) {
    252                 clearTimeout(this._showWaitIconTimer);
    253                 delete this._showWaitIconTimer;
    254             }
    255             this._replayImageElement.enableStyleClass("wait", enable);
    256             this._debugInfoElement.enableStyleClass("hidden", enable);
    257         }
     242        this._spinnerIcon.enableStyleClass("hidden", !enable);
     243        this._debugInfoElement.enableStyleClass("hidden", enable);
    258244    },
    259245
  • trunk/Source/WebCore/inspector/front-end/canvasProfiler.css

    r140428 r143325  
    4242    background-color: black;
    4343    overflow: hidden;
    44     padding: 5px;
     44    padding: 5px 5px 10px 5px;
    4545    color: white;
    4646}
     
    5656}
    5757
    58 .canvas-replay-image.wait {
     58.canvas-debug-info {
     59    position: absolute;
     60    left: 0;
     61    right: 0;
     62    bottom: 6px;
     63}
     64
     65.canvas-spinner-icon {
    5966    content: url(Images/spinnerActiveSelected.gif);
    60     zoom: inherit;
    6167    position: absolute;
    62     top: 50%;
    63     left: 50%;
    64     margin: -16px 0 0 -16px;
     68    width: 16px;
     69    right: 4px;
     70    bottom: 4px;
    6571}
    6672
Note: See TracChangeset for help on using the changeset viewer.