Changeset 90393 in webkit


Ignore:
Timestamp:
Jul 5, 2011 5:50:58 AM (13 years ago)
Author:
caseq@chromium.org
Message:

2011-07-05 Andrey Kosyakov <​caseq@chromium.org>

Web Inspector: [refactoring] remove network-sidebar style, add network-log-grid
​https://bugs.webkit.org/show_bug.cgi?id=63913

Reviewed by Yury Semikhatsky.

  • inspector/front-end/NetworkPanel.js: (WebInspector.NetworkPanel): (WebInspector.NetworkPanel.prototype._createTable):
  • inspector/front-end/networkPanel.css: (.network-log-grid): (.network-log-grid table.data): (.network-log-grid.small table.data): (.network-log-grid td): (.network-log-grid.small td): (.network-log-grid th): (.network-log-grid.small th): (.network-log-grid th, .network.panel .data-grid th.sort-descending, .network.panel .data-grid th.sort-ascending): (.network-log-grid .data-container): (.network-log-grid.small .data-container): (.network-log-grid select): (.network-log-grid.small tr.offscreen): (.network-log-grid tr.offscreen): (.network-log-grid tr.offscreen td): (.network-log-grid tr.filler): (.network-log-grid tr:not(.filler) td.name-column): (.network.panel:not(.viewing-resource) .network-log-grid td.name-column:hover): (.network-log-grid td.time-column): (.network-log-grid.small .network-graph-side): (.network-log-grid th.sortable:active): (.network-log-grid tr.selected .network-cell-subtitle): (.network-log-grid .icon): (.network-log-grid.small .icon): (.network-log-grid .network-category-scripts .icon): (.network-log-grid.small .network-category-scripts .icon): (.network-log-grid .network-category-documents .icon): (.network-log-grid.small .network-category-documents .icon): (.network-log-grid .network-category-stylesheets .icon): (.network-log-grid.small .network-category-stylesheets .icon): (.network-log-grid .network-category-images .icon): (.network-log-grid.small .network-category-images .icon): (.network-log-grid .image-network-icon-preview): (.network-log-grid.small .image-network-icon-preview): (.network-timeline-grid.small .network-event-divider): (.network-log-grid .resources-dividers): (.network-log-grid .resources-dividers-label-bar): (.network-timeline-grid.small .resources-dividers-label-bar): (.network-timeline-grid .resources-divider-label): (.network-timeline-grid .resources-dividers-label-bar .resources-divider): (.network-timeline-grid.small .resources-dividers-label-bar .resources-divider): (.network-timeline-grid .resources-divider.first .resources-divider-label): (.network-timeline-grid .resources-dividers-label-bar .resources-divider.first): (.network-timeline-grid tr.filler td): (.network-summary-bar td): (.network.panel.viewing-resource .network-log-grid th): (.network-log-grid.full-grid-mode .viewer-column): (.network-log-grid.brief-grid-mode .time-column): (.network-log-grid.viewing-resource-mode .timeline-column): (.network.panel .sidebar): (.network.panel.viewing-resource .network-log-grid .data-grid-resizer):
Location:
trunk/Source/WebCore
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebCore/ChangeLog

    r90392 r90393  
     12011-07-05  Andrey Kosyakov  <caseq@chromium.org>
     2
     3        Web Inspector: [refactoring] remove network-sidebar style, add network-log-grid
     4        https://bugs.webkit.org/show_bug.cgi?id=63913
     5
     6        Reviewed by Yury Semikhatsky.
     7
     8        * inspector/front-end/NetworkPanel.js:
     9        (WebInspector.NetworkPanel):
     10        (WebInspector.NetworkPanel.prototype._createTable):
     11        * inspector/front-end/networkPanel.css:
     12        (.network-log-grid):
     13        (.network-log-grid table.data):
     14        (.network-log-grid.small table.data):
     15        (.network-log-grid td):
     16        (.network-log-grid.small td):
     17        (.network-log-grid th):
     18        (.network-log-grid.small th):
     19        (.network-log-grid th, .network.panel .data-grid th.sort-descending, .network.panel .data-grid th.sort-ascending):
     20        (.network-log-grid .data-container):
     21        (.network-log-grid.small .data-container):
     22        (.network-log-grid select):
     23        (.network-log-grid.small tr.offscreen):
     24        (.network-log-grid tr.offscreen):
     25        (.network-log-grid tr.offscreen td):
     26        (.network-log-grid tr.filler):
     27        (.network-log-grid tr:not(.filler) td.name-column):
     28        (.network.panel:not(.viewing-resource) .network-log-grid td.name-column:hover):
     29        (.network-log-grid td.time-column):
     30        (.network-log-grid.small .network-graph-side):
     31        (.network-log-grid th.sortable:active):
     32        (.network-log-grid tr.selected .network-cell-subtitle):
     33        (.network-log-grid .icon):
     34        (.network-log-grid.small .icon):
     35        (.network-log-grid .network-category-scripts .icon):
     36        (.network-log-grid.small .network-category-scripts .icon):
     37        (.network-log-grid .network-category-documents .icon):
     38        (.network-log-grid.small .network-category-documents .icon):
     39        (.network-log-grid .network-category-stylesheets .icon):
     40        (.network-log-grid.small .network-category-stylesheets .icon):
     41        (.network-log-grid .network-category-images .icon):
     42        (.network-log-grid.small .network-category-images .icon):
     43        (.network-log-grid .image-network-icon-preview):
     44        (.network-log-grid.small .image-network-icon-preview):
     45        (.network-timeline-grid.small .network-event-divider):
     46        (.network-log-grid .resources-dividers):
     47        (.network-log-grid .resources-dividers-label-bar):
     48        (.network-timeline-grid.small .resources-dividers-label-bar):
     49        (.network-timeline-grid .resources-divider-label):
     50        (.network-timeline-grid .resources-dividers-label-bar .resources-divider):
     51        (.network-timeline-grid.small .resources-dividers-label-bar .resources-divider):
     52        (.network-timeline-grid .resources-divider.first .resources-divider-label):
     53        (.network-timeline-grid .resources-dividers-label-bar .resources-divider.first):
     54        (.network-timeline-grid tr.filler td):
     55        (.network-summary-bar td):
     56        (.network.panel.viewing-resource .network-log-grid th):
     57        (.network-log-grid.full-grid-mode .viewer-column):
     58        (.network-log-grid.brief-grid-mode .time-column):
     59        (.network-log-grid.viewing-resource-mode .timeline-column):
     60        (.network.panel .sidebar):
     61        (.network.panel.viewing-resource .network-log-grid .data-grid-resizer):
     62
    1632011-07-05  Alexandru Chiculita  <achicu@adobe.com>
    264

  • trunk/Source/WebCore/inspector/front-end/NetworkPanel.js

    r90365 r90393  
    4040
    4141    this.createSidebar();
    42     this.sidebarElement.className = "network-sidebar";
    4342
    4443    this._resources = [];
    … …  
    188187        this._dataGrid = new WebInspector.DataGrid(columns);
    189188        this._dataGrid.resizeMethod = WebInspector.DataGrid.ResizeMethod.Last;
     189        this._dataGrid.element.addStyleClass("network-log-grid");
    190190        this._dataGrid.element.addEventListener("contextmenu", this._contextMenu.bind(this), true);
    191191        this.containerElement.appendChild(this._dataGrid.element);

  • trunk/Source/WebCore/inspector/front-end/networkPanel.css

    r86950 r90393  
    33}
    44
    5 .network-sidebar .data-grid {
     5.network-log-grid {
    66    border: none;
    77    position: absolute;
    … …  
    1313}
    1414
    15 .network-sidebar .data-grid table.data {
     15.network-log-grid table.data {
    1616    -webkit-background-size: 1px 82px;
    1717    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(0.5, rgba(0, 0, 0, 0)), color-stop(0.5, rgba(0, 0, 0, 0.05)), to(rgba(0, 0, 0, 0.05)));
    … …  
    1919}
    2020
    21 .network-sidebar .data-grid.small table.data {
     21.network-log-grid.small table.data {
    2222    -webkit-background-size: 1px 42px;
    2323}
    2424
    25 .network-sidebar .data-grid td {
     25.network-log-grid td {
    2626    line-height: 17px;
    2727    height: 37px;
    … …  
    3030}
    3131
    32 .network-sidebar .data-grid.small td {
    33     height: 17px;
    34 }
    35 
    36 .network-sidebar .data-grid th {
     32.network-log-grid.small td {
     33    height: 17px !important;
     34}
     35
     36.network-log-grid th {
    3737    border-bottom: 1px solid rgb(64%, 64%, 64%);
    3838    height: 30px;
    … …  
    4141}
    4242
    43 .network-sidebar .data-grid.small th {
     43.network-log-grid.small th {
    4444    height: 22px;
    4545}
    4646
    47 .network-sidebar .data-grid th, .network.panel .data-grid th.sort-descending, .network.panel .data-grid th.sort-ascending {
     47.network-log-grid th, .network.panel .data-grid th.sort-descending, .network.panel .data-grid th.sort-ascending {
    4848    background: -webkit-gradient(linear, left top, left bottom, from(rgb(236, 236, 236)), to(rgb(217, 217, 217)));
    4949}
    5050
    51 .network-sidebar .data-grid .data-container {
     51.network-log-grid .data-container {
    5252    top: 31px;
    5353}
    5454
    55 .network-sidebar .data-grid.small .data-container {
     55.network-log-grid.small .data-container {
    5656    top: 23px;
    5757}
    5858
    59 .network-sidebar .data-grid select {
     59.network-log-grid select {
    6060    -webkit-appearance: none;
    6161    background-color: transparent;
    … …  
    6666}
    6767
    68 .network-sidebar .data-grid.small tr.offscreen {
     68.network-log-grid.small tr.offscreen {
    6969    height: 21px;
    7070}
    7171
    72 .network-sidebar .data-grid tr.offscreen {
     72.network-log-grid tr.offscreen {
    7373    height: 41px;
    7474}
    7575
    76 .network-sidebar .data-grid tr.offscreen td {
    77     display: none;
    78 }
    79 
    80 .network-sidebar .data-grid tr.filler {
     76.network-log-grid tr.offscreen td {
     77    display: none;
     78}
     79
     80.network-log-grid tr.filler {
    8181    background-color: white;
    8282}
    8383
    84 .network-sidebar .data-grid tr:not(.filler) td.name-column {
     84.network-log-grid tr:not(.filler) td.name-column {
    8585    font-weight: bold;
    8686    cursor: pointer;
    8787}
    8888
    89 .network.panel:not(.viewing-resource) .network-sidebar td.name-column:hover {
     89.network.panel:not(.viewing-resource) .network-log-grid td.name-column:hover {
    9090    text-decoration: underline;
    9191}
    9292
    93 .network-sidebar .data-grid td.method-column,
    94 .network-sidebar .data-grid td.status-column,
    95 .network-sidebar .data-grid td.type-column,
    96 .network-sidebar .data-grid td.size-column,
    97 .network-sidebar .data-grid td.time-column {
     93.network-log-grid td.method-column,
     94.network-log-grid td.status-column,
     95.network-log-grid td.type-column,
     96.network-log-grid td.size-column,
     97.network-log-grid td.time-column {
    9898    background-color: rgba(0, 0, 0, 0.07);
    9999}
    100100
    101 .network-sidebar .data-grid td.size-column,
    102 .network-sidebar .data-grid td.time-column {
     101.network-log-grid td.size-column,
     102.network-log-grid td.time-column {
    103103    text-align: right;
    104104}
    105105
    106 .network-sidebar .small .network-graph-side {
     106.network-log-grid.small .network-graph-side {
    107107    height: 14px;
    108108}
    109109
    110 .network-sidebar .data-grid th.sortable:active {
     110.network-log-grid th.sortable:active {
    111111    background-image: none;
    112112}
    … …  
    117117}
    118118
    119 .network-sidebar tr.selected .network-cell-subtitle {
     119.network-log-grid tr.selected .network-cell-subtitle {
    120120    color: white;
    121121}
    … …  
    125125}
    126126
    127 .network-sidebar .data-grid.small .network-cell-subtitle,
    128 .network-sidebar .data-grid.small .network-header-subtitle
     127.network-log-grid.small .network-cell-subtitle,
     128.network-log-grid.small .network-header-subtitle
    129129{
    130130    display: none;
    … …  
    133133/* Resource preview icons */
    134134
    135 .network-sidebar .data-grid .icon {
     135.network-log-grid .icon {
    136136    content: url(Images/resourcePlainIcon.png);
    137137}
    138138
    139 .network-sidebar .data-grid.small .icon {
     139.network-log-grid.small .icon {
    140140    content: url(Images/resourcePlainIconSmall.png);
    141141}
    142142
    143 .network-sidebar .network-category-scripts .icon {
     143.network-log-grid .network-category-scripts .icon {
    144144    content: url(Images/resourceJSIcon.png);
    145145}
    146146
    147 .network-sidebar .data-grid.small .network-category-scripts .icon {
     147.network-log-grid.small .network-category-scripts .icon {
    148148    content: url(Images/resourceDocumentIconSmall.png);
    149149}
    150150
    151 .network-sidebar .network-category-documents .icon {
     151.network-log-grid .network-category-documents .icon {
    152152    content: url(Images/resourceDocumentIcon.png);
    153153}
    154154
    155 .network-sidebar .data-grid.small .network-category-documents .icon {
     155.network-log-grid.small .network-category-documents .icon {
    156156    content: url(Images/resourceDocumentIconSmall.png);
    157157}
    158158
    159 .network-sidebar .network-category-stylesheets .icon {
     159.network-log-grid .network-category-stylesheets .icon {
    160160    content: url(Images/resourceCSSIcon.png);
    161161}
    162162
    163 .network-sidebar .data-grid.small .network-category-stylesheets .icon {
     163.network-log-grid.small .network-category-stylesheets .icon {
    164164    content: url(Images/resourceDocumentIconSmall.png);
    165165}
    166166
    167 .network-sidebar .network-category-images .icon {
     167.network-log-grid .network-category-images .icon {
    168168    position: relative;
    169169    background-image: url(Images/resourcePlainIcon.png);
    … …  
    172172}
    173173
    174 .network-sidebar .data-grid.small .network-category-images .icon {
     174.network-log-grid.small .network-category-images .icon {
    175175    background-image: url(Images/resourcePlainIconSmall.png);
    176176    content: "";
    177177}
    178178
    179 .network-sidebar .data-grid .icon {
     179.network-log-grid .icon {
    180180    float: left;
    181181    width: 32px;
    … …  
    185185}
    186186
    187 .network-sidebar .data-grid.small .icon {
     187.network-log-grid.small .icon {
    188188    width: 16px;
    189189    height: 16px;
    190190}
    191191
    192 .network-sidebar .image-network-icon-preview {
     192.network-log-grid .image-network-icon-preview {
    193193    position: absolute;
    194194    margin: auto;
    … …  
    203203}
    204204
    205 .network-sidebar .data-grid.small .image-network-icon-preview {
     205.network-log-grid.small .image-network-icon-preview {
    206206    top: 2px;
    207207    bottom: 1px;
    … …  
    425425}
    426426
    427 .network-sidebar .network-timeline-grid.small .network-event-divider {
     427.network-timeline-grid.small .network-event-divider {
    428428    top: 23px;
    429429}
    … …  
    437437}
    438438
    439 .network-sidebar .resources-dividers {
     439.network-log-grid .resources-dividers {
    440440    z-index: 0;
    441441}
    442442
    443 .network-sidebar .resources-dividers-label-bar {
     443.network-log-grid .resources-dividers-label-bar {
    444444    background-color: transparent;
    445445    border: none;
    … …  
    448448}
    449449
    450 .network-sidebar .network-timeline-grid.small .resources-dividers-label-bar {
     450.network-timeline-grid.small .resources-dividers-label-bar {
    451451    height: 23px;
    452452}
    453453
    454 .network-sidebar .resources-divider-label {
     454.network-timeline-grid .resources-divider-label {
    455455    top: 0px;
    456456    margin-top: -4px;
    … …  
    458458}
    459459
    460 .network-sidebar .resources-dividers-label-bar .resources-divider {
     460.network-timeline-grid .resources-dividers-label-bar .resources-divider {
    461461    top: 23px;
    462462}
    463463
    464 .network-sidebar .network-timeline-grid.small .resources-dividers-label-bar .resources-divider {
     464.network-timeline-grid.small .resources-dividers-label-bar .resources-divider {
    465465    top: 15px;
    466466}
    467467
    468 .network-sidebar .resources-divider.first .resources-divider-label {
    469     display: none;
    470 }
    471 
    472 .network-sidebar .resources-dividers-label-bar .resources-divider.first {
     468.network-timeline-grid .resources-divider.first .resources-divider-label {
     469    display: none;
     470}
     471
     472.network-timeline-grid .resources-dividers-label-bar .resources-divider.first {
    473473    background-color: transparent;
    474474}
    … …  
    497497/* Summary */
    498498
    499 .network-sidebar tr.filler td {
     499.network-timeline-grid tr.filler td {
    500500    padding-bottom: 20px !important;
    501501}
    … …  
    510510}
    511511
    512 .network-sidebar .data-grid .network-summary-bar td {
     512.network-summary-bar td {
    513513    color: white;
    514514    height: 20px;
    … …  
    529529/* Viewer */
    530530
    531 .network.panel.viewing-resource .network-sidebar .data-grid td,
    532 .network.panel.viewing-resource .network-sidebar .data-grid th {
     531.network.panel.viewing-resource .network-log-grid td,
     532.network.panel.viewing-resource .network-log-grid th {
    533533    border-right: none;
    534534}
    … …  
    593593
    594594
    595 .network-sidebar .data-grid.full-grid-mode .viewer-column {
    596     display: none;
    597 }
    598 
    599 .network-sidebar .data-grid.brief-grid-mode .viewer-column,
    600 .network-sidebar .data-grid.brief-grid-mode .method-column,
    601 .network-sidebar .data-grid.brief-grid-mode .status-column,
    602 .network-sidebar .data-grid.brief-grid-mode .type-column,
    603 .network-sidebar .data-grid.brief-grid-mode .size-column,
    604 .network-sidebar .data-grid.brief-grid-mode .time-column {
     595.network-log-grid.full-grid-mode .viewer-column {
     596    display: none;
     597}
     598
     599.network-log-grid.brief-grid-mode .viewer-column,
     600.network-log-grid.brief-grid-mode .method-column,
     601.network-log-grid.brief-grid-mode .status-column,
     602.network-log-grid.brief-grid-mode .type-column,
     603.network-log-grid.brief-grid-mode .size-column,
     604.network-log-grid.brief-grid-mode .time-column {
    605605    display: none;
    606606}
    … …  
    610610}
    611611
    612 .network-sidebar .data-grid.viewing-resource-mode .method-column,
    613 .network-sidebar .data-grid.viewing-resource-mode .status-column,
    614 .network-sidebar .data-grid.viewing-resource-mode .type-column,
    615 .network-sidebar .data-grid.viewing-resource-mode .size-column,
    616 .network-sidebar .data-grid.viewing-resource-mode .time-column,
    617 .network-sidebar .data-grid.viewing-resource-mode .timeline-column {
    618     display: none;
    619 }
    620 
    621 .network.panel .network-sidebar {
    622     position: absolute;
    623     top: 0;
    624     bottom: 0;
    625     left: 0;
    626     right: 0;
     612.network-log-grid.viewing-resource-mode .method-column,
     613.network-log-grid.viewing-resource-mode .status-column,
     614.network-log-grid.viewing-resource-mode .type-column,
     615.network-log-grid.viewing-resource-mode .size-column,
     616.network-log-grid.viewing-resource-mode .time-column,
     617.network-log-grid.viewing-resource-mode .timeline-column {
     618    display: none;
     619}
     620
     621.network.panel .sidebar {
     622    position: absolute;
     623    top: 0;
     624    bottom: 0;
     625    left: 0;
     626    right: 0;
     627    width: auto;
     628    border: none;
    627629}
    628630
    … …  
    631633}
    632634
    633 .network.panel.viewing-resource .network-sidebar .data-grid-resizer {
     635.network.panel.viewing-resource .network-log-grid .data-grid-resizer {
    634636    display: none;
    635637}
Note: See TracChangeset for help on using the changeset viewer.