Finished the Ajax panel redesign
This commit is contained in:
parent
fac5391dab
commit
acee052b68
@ -2,13 +2,13 @@
|
||||
|
||||
{% block toolbar %}
|
||||
{% set icon %}
|
||||
{{ include('@WebProfiler/Icon/ajax.svg.twig') }}
|
||||
<span class="sf-toolbar-value sf-toolbar-ajax-requests">0</span>
|
||||
<span class="sf-toolbar-label">ajax</span>
|
||||
{% endset %}
|
||||
|
||||
{% set text %}
|
||||
<div class="sf-toolbar-info-piece">
|
||||
<b>AJAX requests</b>
|
||||
<span class="sf-toolbar-ajax-info"></span>
|
||||
<b class="sf-toolbar-ajax-info"></b>
|
||||
</div>
|
||||
<div class="sf-toolbar-info-piece">
|
||||
<table class="sf-toolbar-ajax-requests">
|
||||
@ -24,5 +24,6 @@
|
||||
</table>
|
||||
</div>
|
||||
{% endset %}
|
||||
{% include '@WebProfiler/Profiler/toolbar_item.html.twig' with { 'link': false } %}
|
||||
|
||||
{{ include('@WebProfiler/Profiler/toolbar_item.html.twig', { link: false }) }}
|
||||
{% endblock %}
|
||||
|
@ -4,14 +4,19 @@
|
||||
{% set request_handler %}
|
||||
{% if collector.controller.class is defined %}
|
||||
{% set link = collector.controller.file|file_link(collector.controller.line) %}
|
||||
{% if link %}<a href="#" onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;">{% endif %}
|
||||
|
||||
<span class="sf-toolbar-info-class">
|
||||
{{ collector.controller.class|abbr_class }}
|
||||
</span>
|
||||
|
||||
{% if collector.controller.method %}
|
||||
<span class="sf-toolbar-info-class sf-toolbar-info-with-next-pointer">{{ collector.controller.class|abbr_class }}</span>
|
||||
<span class="sf-toolbar-info-method"{% if link %} onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;"{% endif %}>
|
||||
<span class="sf-toolbar-info-method">
|
||||
{{ collector.controller.method }}
|
||||
</span>
|
||||
{% else %}
|
||||
<span class="sf-toolbar-info-class"{% if link %} onclick="window.location='{{link|e('js')}}';window.event.stopPropagation();return false;"{% endif %}>{{ collector.controller.class|abbr_class }}</span>
|
||||
{% endif %}
|
||||
|
||||
{% if link %}</a>{% endif %}
|
||||
{% else %}
|
||||
<span class="sf-toolbar-info-class">{{ collector.controller }}</span>
|
||||
{% endif %}
|
||||
|
@ -4,7 +4,7 @@
|
||||
{% set time = collector.templatecount ? '%0.0f'|format(collector.time) : 'n/a' %}
|
||||
{% set icon %}
|
||||
<span>
|
||||
<img height="28" alt="Twig" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAcCAYAAACOGPReAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAbElEQVRIx2NgGAXUBowMDAwMaWlp/6ll4KxZsxhZYJy0tDRqGMjAwMDAwEQL77OgCxSXlJBsSG9PDwqfJi6lj/fRvTJ4XYocUTBXE4q8oRtRRBnKwsw8RFw6fA0lKkd1dnYOIpfCCthRMIIAAI0IFu9Hxh7ZAAAAAElFTkSuQmCC" />
|
||||
{{ include('@WebProfiler/Icon/twig.html.twig') }}
|
||||
<span class="sf-toolbar-value">{{ time }}</span>
|
||||
<span class="sf-toolbar-label">ms</span>
|
||||
</span>
|
||||
|
@ -165,7 +165,7 @@
|
||||
tbody.appendChild(rows);
|
||||
|
||||
if (infoSpan) {
|
||||
var text = requestStack.length + ' call' + (requestStack.length > 1 ? 's' : '');
|
||||
var text = requestStack.length + ' AJAX request' + (requestStack.length > 1 ? 's' : '');
|
||||
infoSpan.textContent = text;
|
||||
}
|
||||
} else {
|
||||
@ -181,15 +181,16 @@
|
||||
requestCounter[0].textContent = requestStack.length;
|
||||
|
||||
var className = 'sf-toolbar-ajax-requests sf-toolbar-value';
|
||||
if (state == 'ok') {
|
||||
className += ' sf-toolbar-status-green';
|
||||
} else if (state == 'error') {
|
||||
className += ' sf-toolbar-status-red';
|
||||
} else {
|
||||
className += ' sf-ajax-request-loading';
|
||||
}
|
||||
|
||||
requestCounter[0].className = className;
|
||||
|
||||
var ajaxToolbarPanel = document.querySelectorAll('.sf-toolbar-block-ajax');
|
||||
if (state == 'ok') {
|
||||
ajaxToolbarPanel.className = 'sf-toolbar-status-green';
|
||||
} else if (state == 'error') {
|
||||
ajaxToolbarPanel.className = 'sf-toolbar-status-red';
|
||||
} else {
|
||||
ajaxToolbarPanel.className = 'sf-ajax-request-loading';
|
||||
}
|
||||
};
|
||||
|
||||
var addEventListener;
|
||||
|
@ -92,12 +92,6 @@
|
||||
.sf-toolbar-block-config svg {
|
||||
padding-right: 4px;
|
||||
}
|
||||
.sf-toolbar-block-time {
|
||||
margin-right: 0;
|
||||
}
|
||||
.sf-toolbar-block-ajax {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.sf-toolbar-block span {
|
||||
display: inline-block;
|
||||
@ -140,7 +134,7 @@
|
||||
}
|
||||
|
||||
.sf-toolbar-block .sf-toolbar-info-piece a {
|
||||
color: #75D1EA;
|
||||
color: #99CDD8;
|
||||
text-decoration: underline;
|
||||
}
|
||||
.sf-toolbar-block .sf-toolbar-info-piece a:hover {
|
||||
@ -288,17 +282,13 @@
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.sf-toolbar-block .sf-toolbar-info-method {
|
||||
.sf-toolbar-block-time .sf-toolbar-icon {
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.sf-toolbar-block .sf-toolbar-info-method[onclick=""] {
|
||||
border-bottom: none;
|
||||
cursor: inherit;
|
||||
.sf-toolbar-block-memory .sf-toolbar-icon {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.sf-toolbar-info-php {}
|
||||
.sf-toolbar-info-php-ext {}
|
||||
|
||||
.sf-toolbar-info-php-ext .sf-toolbar-status + .sf-toolbar-status {
|
||||
margin-left: 4px;
|
||||
}
|
||||
@ -339,14 +329,26 @@
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.sf-toolbar-ajax-requests th, .sf-toolbar-ajax-requests td {
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 0 4px;
|
||||
color: #2f2f2f;
|
||||
background-color: #fff;
|
||||
.sf-toolbar-info-piece b.sf-toolbar-ajax-info {
|
||||
color: #F5F5F5;
|
||||
}
|
||||
.sf-toolbar-ajax-requests {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sf-toolbar-ajax-requests td {
|
||||
background-color: #444;
|
||||
border-bottom: 1px solid #777;
|
||||
color: #F5F5F5;
|
||||
font-size: 12px;
|
||||
padding: 4px;
|
||||
}
|
||||
.sf-toolbar-ajax-requests th {
|
||||
background-color: #eee;
|
||||
background-color: #222;
|
||||
border-bottom: 0;
|
||||
color: #AAA;
|
||||
font-size: 11px;
|
||||
padding: 4px;
|
||||
}
|
||||
.sf-ajax-request-url {
|
||||
max-width: 300px;
|
||||
@ -354,6 +356,12 @@
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.sf-toolbar-ajax-requests .sf-ajax-request-url a {
|
||||
text-decoration: none;
|
||||
}
|
||||
.sf-toolbar-ajax-requests .sf-ajax-request-url a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.sf-ajax-request-duration {
|
||||
text-align: right;
|
||||
}
|
||||
|
Reference in New Issue
Block a user