Skip to content

Commit 68a69b3

Browse files
authored
Display name in badge (#602)
* Page name includes query string * Badge: align columns, display page name * Move page_name into its own method * Requests also include query string * Always display totals control (so URL/name is hidden) * Whitespace
1 parent c83223f commit 68a69b3

File tree

7 files changed

+71
-11
lines changed

7 files changed

+71
-11
lines changed

lib/html/includes.css

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,8 @@
105105
.profiler-result .profiler-unit {
106106
font-family: Consolas, monospace, serif; }
107107
.profiler-result .profiler-number {
108-
color: #111; }
108+
color: #111;
109+
display: inline-block; }
109110
.profiler-result .profiler-info {
110111
text-align: right; }
111112
.profiler-result .profiler-info .profiler-name {
@@ -235,6 +236,19 @@
235236
.profiler-results {
236237
z-index: 2147483643;
237238
position: fixed; }
239+
.profiler-results.profiler-left .profiler-button {
240+
text-align: left; }
241+
.profiler-results.profiler-right .profiler-button {
242+
text-align: right; }
243+
.profiler-results .profiler-button > .profiler-duration-milliseconds {
244+
min-width: 70px; }
245+
.profiler-results .profiler-button > .profiler-sql-count {
246+
min-width: 55px; }
247+
.profiler-results .profiler-button > .profiler-name {
248+
min-width: 190px;
249+
margin-left: 3px; }
250+
.profiler-results .profiler-button > .profiler-number {
251+
text-align: right; }
238252
.profiler-results.profiler-top {
239253
top: 0px; }
240254
.profiler-results.profiler-top.profiler-left {
@@ -285,8 +299,10 @@
285299
background-color: maroon; }
286300
.profiler-results .profiler-button.profiler-button-active .profiler-number,
287301
.profiler-results .profiler-button.profiler-button-active .profiler-nuclear,
302+
.profiler-results .profiler-button.profiler-button-active .profiler-name,
288303
.profiler-results .profiler-controls.profiler-button-active .profiler-number,
289-
.profiler-results .profiler-controls.profiler-button-active .profiler-nuclear {
304+
.profiler-results .profiler-controls.profiler-button-active .profiler-nuclear,
305+
.profiler-results .profiler-controls.profiler-button-active .profiler-name {
290306
color: #fff;
291307
font-weight: bold; }
292308
.profiler-results .profiler-button.profiler-button-active .profiler-unit,

lib/html/includes.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,7 @@ var _MiniProfiler = (function() {
220220
totalSqlCount += parseInt(json.sql_count);
221221
reqs++;
222222

223-
if (!controls && reqs > 1 && options.collapseResults && !expandedResults) {
223+
if (!controls && options.collapseResults && !expandedResults) {
224224
if (!totalsControl) {
225225
toArray(container.querySelectorAll(".profiler-result")).forEach(
226226
function(el) {

lib/html/includes.scss

Lines changed: 31 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,7 @@ $zindex: 2147483640; // near 32bit max 2147483647
103103

104104
.profiler-number {
105105
color: $numberColor;
106+
display: inline-block;
106107
}
107108

108109
.profiler-info {
@@ -317,6 +318,34 @@ $zindex: 2147483640; // near 32bit max 2147483647
317318

318319
$radius: 10px;
319320

321+
&.profiler-left {
322+
.profiler-button {
323+
text-align: left;
324+
}
325+
}
326+
327+
&.profiler-right {
328+
.profiler-button {
329+
text-align: right;
330+
}
331+
}
332+
333+
.profiler-button {
334+
> .profiler-duration-milliseconds {
335+
min-width: 70px;
336+
}
337+
> .profiler-sql-count {
338+
min-width: 55px;
339+
}
340+
> .profiler-name {
341+
min-width: 190px;
342+
margin-left: 3px;
343+
}
344+
> .profiler-number {
345+
text-align: right;
346+
}
347+
}
348+
320349
&.profiler-top {
321350
top: 0px;
322351

@@ -399,7 +428,8 @@ $zindex: 2147483640; // near 32bit max 2147483647
399428
background-color: maroon;
400429

401430
.profiler-number,
402-
.profiler-nuclear {
431+
.profiler-nuclear,
432+
.profiler-name {
403433
color: #fff;
404434
font-weight: bold;
405435
}

lib/html/includes.tmpl

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,21 @@
22
<div class="profiler-result">
33
<div class="profiler-button {{? it.has_duplicate_sql_timings}}profiler-warning{{?}}">
44
{{? it.has_duplicate_sql_timings}}<span class="profiler-nuclear">!</span>{{?}}
5-
<span class="profiler-number">
5+
<span class="profiler-number profiler-duration-milliseconds">
66
{{= MiniProfiler.formatDuration(it.duration_milliseconds)}} <span class="profiler-unit">ms</span>
77
</span>
88
{{? MiniProfiler.showTotalSqlCount()}}
9-
<span class="profiler-number">
9+
<span class="profiler-number profiler-sql-count">
1010
{{= it.sql_count}} <span class="profiler-unit">sql</span>
1111
</span>
1212
{{?}}
13+
<span class="profiler-name">
14+
{{? it.name.length >= 30 }}
15+
{{= it.name.substring(0,15) + "..." + it.name.slice(-15) }}
16+
{{??}}
17+
{{= it.name}}
18+
{{?}}
19+
</span>
1320
</div>
1421

1522
<div class="profiler-popup">

lib/html/vendor.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
MiniProfiler.templates = {};
88
MiniProfiler.templates["profilerTemplate"] = function anonymous(it
99
) {
10-
var out=' <div class="profiler-result"> <div class="profiler-button ';if(it.has_duplicate_sql_timings){out+='profiler-warning';}out+='"> ';if(it.has_duplicate_sql_timings){out+='<span class="profiler-nuclear">!</span>';}out+=' <span class="profiler-number"> '+( MiniProfiler.formatDuration(it.duration_milliseconds))+' <span class="profiler-unit">ms</span> </span> ';if(MiniProfiler.showTotalSqlCount()){out+=' <span class="profiler-number"> '+( it.sql_count)+' <span class="profiler-unit">sql</span> </span> ';}out+=' </div> <div class="profiler-popup"> <div class="profiler-info"> <span class="profiler-name"> '+( it.name)+' <span class="profiler-overall-duration">('+( MiniProfiler.formatDuration(it.duration_milliseconds))+' ms)</span> </span> <span class="profiler-server-time">'+( it.machine_name)+' on '+( MiniProfiler.renderDate(it.started_formatted))+'</span> </div> <div class="profiler-output"> <table class="profiler-timings"> <thead> <tr> <th>event</th> <th>duration (ms)</th> <th class="profiler-duration-with-children">with children (ms)</th> <th class="time-from-start">from start (ms)</th> ';if(it.has_sql_timings){out+=' <th colspan="2">query time (ms)</th> ';}out+=' ';var arr1=it.custom_timing_names;if(arr1){var value,i1=-1,l1=arr1.length-1;while(i1<l1){value=arr1[i1+=1];out+=' <th colspan="2">'+( value.toLowerCase() )+' (ms)</th> ';} } out+=' </tr> </thead> <tbody> '+( MiniProfiler.templates.timingTemplate({timing: it.root, page: it}) )+' </tbody> <tfoot> <tr> <td colspan="3"> ';if(!it.client_timings){out+=' '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' ';}out+=' <a class="profiler-toggle-duration-with-children" title="toggles column with aggregate child durations">show time with children</a> <a class="profiler-snapshots-page-link" title="Go to snapshots page" href="'+( MiniProfiler.options.path )+'snapshots">snapshots</a> </td> ';if(it.has_sql_timings){out+=' <td colspan="2" class="profiler-number profiler-percent-in-sql" title="'+( MiniProfiler.getSqlTimingsCount(it.root) )+' queries spent '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql) )+' ms of total request time"> '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) )+' <span class="profiler-unit">% in sql</span> </td> ';}out+=' ';var arr2=it.custom_timing_names;if(arr2){var value,i2=-1,l2=arr2.length-1;while(i2<l2){value=arr2[i2+=1];out+=' <td colspan="2" class="profiler-number profiler-percentage-in-sql" title="'+( it.custom_timing_stats[value].count )+' '+( value.toLowerCase() )+' invocations spent '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration) )+' ms of total request time"> '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) )+' <span class="profiler-unit">% in '+( value.toLowerCase() )+'</span> </td> ';} } out+=' </tr> </tfoot> </table> ';if(it.client_timings){out+=' <table class="profiler-timings profiler-client-timings"> <thead> <tr> <th>client event</th> <th>duration (ms)</th> <th>from start (ms)</th> </tr> </thead> <tbody> ';var arr3=MiniProfiler.getClientTimings(it.client_timings);if(arr3){var value,i3=-1,l3=arr3.length-1;while(i3<l3){value=arr3[i3+=1];out+=' <tr class="';if(value.isTrivial){out+='profiler-trivial';}out+='"> <td class="profiler-label">'+( value.name )+'</td> <td class="profiler-duration"> ';if(value.duration >= 0){out+=' <span class="profiler-unit"></span>'+( MiniProfiler.formatDuration(value.duration) )+' ';}out+=' </td> <td class="profiler-duration time-from-start"> <span class="profiler-unit">+</span>'+( MiniProfiler.formatDuration(value.start) )+' </td> </tr> ';} } out+=' </tbody> <tfoot> <td colspan="3"> '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' </td> </tfoot> </table> ';}out+=' ';if(it.custom_fields && Object.keys(it.custom_fields).length > 0){out+=' <p class="custom-fields-title">Snapshot custom fields</p> <table class="profiler-timings"> <tbody> ';var arr4=Object.keys(it.custom_fields);if(arr4){var key,i4=-1,l4=arr4.length-1;while(i4<l4){key=arr4[i4+=1];out+=' <tr> <td class="profiler-label">'+( key )+'</td> <td class="profiler-label">'+( it.custom_fields[key] )+'</td> </tr> ';} } out+=' </tbody> </table> ';}out+=' </div> </div> ';if(it.has_sql_timings){out+=' <div class="profiler-queries"> <table> <thead> <tr> <th class="ta-right">step<br />time from start<br />query type<br />duration</th> <th class="ta-left">call stack<br />query</th> </tr> </thead> <tbody> ';var arr5=MiniProfiler.getSqlTimings(it.root);if(arr5){var value,index=-1,l5=arr5.length-1;while(index<l5){value=arr5[index+=1];out+=' '+( MiniProfiler.templates.sqlGapTemplate({g: value.prevGap}) )+' '+( MiniProfiler.templates.sqlTimingTemplate({i: index, s: value}) )+' ';if(value.nextGap){out+=' '+( MiniProfiler.templates.sqlGapTemplate({g: value.nextGap}) )+' ';}out+=' ';} } out+=' </tbody> </table> <p class="profiler-trivial-gap-container"> <a class="profiler-toggle-trivial-gaps">show trivial gaps</a> </p> </div> ';}out+=' </div>';return out;
10+
var out=' <div class="profiler-result"> <div class="profiler-button ';if(it.has_duplicate_sql_timings){out+='profiler-warning';}out+='"> ';if(it.has_duplicate_sql_timings){out+='<span class="profiler-nuclear">!</span>';}out+=' <span class="profiler-number profiler-duration-milliseconds"> '+( MiniProfiler.formatDuration(it.duration_milliseconds))+' <span class="profiler-unit">ms</span> </span> ';if(MiniProfiler.showTotalSqlCount()){out+=' <span class="profiler-number profiler-sql-count"> '+( it.sql_count)+' <span class="profiler-unit">sql</span> </span> ';}out+=' <span class="profiler-name"> ';if(it.name.length >= 30){out+=' '+( it.name.substring(0,15) + "..." + it.name.slice(-15) )+' ';}else{out+=' '+( it.name)+' ';}out+=' </span> </div> <div class="profiler-popup"> <div class="profiler-info"> <span class="profiler-name"> '+( it.name)+' <span class="profiler-overall-duration">('+( MiniProfiler.formatDuration(it.duration_milliseconds))+' ms)</span> </span> <span class="profiler-server-time">'+( it.machine_name)+' on '+( MiniProfiler.renderDate(it.started_formatted))+'</span> </div> <div class="profiler-output"> <table class="profiler-timings"> <thead> <tr> <th>event</th> <th>duration (ms)</th> <th class="profiler-duration-with-children">with children (ms)</th> <th class="time-from-start">from start (ms)</th> ';if(it.has_sql_timings){out+=' <th colspan="2">query time (ms)</th> ';}out+=' ';var arr1=it.custom_timing_names;if(arr1){var value,i1=-1,l1=arr1.length-1;while(i1<l1){value=arr1[i1+=1];out+=' <th colspan="2">'+( value.toLowerCase() )+' (ms)</th> ';} } out+=' </tr> </thead> <tbody> '+( MiniProfiler.templates.timingTemplate({timing: it.root, page: it}) )+' </tbody> <tfoot> <tr> <td colspan="3"> ';if(!it.client_timings){out+=' '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' ';}out+=' <a class="profiler-toggle-duration-with-children" title="toggles column with aggregate child durations">show time with children</a> <a class="profiler-snapshots-page-link" title="Go to snapshots page" href="'+( MiniProfiler.options.path )+'snapshots">snapshots</a> </td> ';if(it.has_sql_timings){out+=' <td colspan="2" class="profiler-number profiler-percent-in-sql" title="'+( MiniProfiler.getSqlTimingsCount(it.root) )+' queries spent '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql) )+' ms of total request time"> '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) )+' <span class="profiler-unit">% in sql</span> </td> ';}out+=' ';var arr2=it.custom_timing_names;if(arr2){var value,i2=-1,l2=arr2.length-1;while(i2<l2){value=arr2[i2+=1];out+=' <td colspan="2" class="profiler-number profiler-percentage-in-sql" title="'+( it.custom_timing_stats[value].count )+' '+( value.toLowerCase() )+' invocations spent '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration) )+' ms of total request time"> '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) )+' <span class="profiler-unit">% in '+( value.toLowerCase() )+'</span> </td> ';} } out+=' </tr> </tfoot> </table> ';if(it.client_timings){out+=' <table class="profiler-timings profiler-client-timings"> <thead> <tr> <th>client event</th> <th>duration (ms)</th> <th>from start (ms)</th> </tr> </thead> <tbody> ';var arr3=MiniProfiler.getClientTimings(it.client_timings);if(arr3){var value,i3=-1,l3=arr3.length-1;while(i3<l3){value=arr3[i3+=1];out+=' <tr class="';if(value.isTrivial){out+='profiler-trivial';}out+='"> <td class="profiler-label">'+( value.name )+'</td> <td class="profiler-duration"> ';if(value.duration >= 0){out+=' <span class="profiler-unit"></span>'+( MiniProfiler.formatDuration(value.duration) )+' ';}out+=' </td> <td class="profiler-duration time-from-start"> <span class="profiler-unit">+</span>'+( MiniProfiler.formatDuration(value.start) )+' </td> </tr> ';} } out+=' </tbody> <tfoot> <td colspan="3"> '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' </td> </tfoot> </table> ';}out+=' ';if(it.custom_fields && Object.keys(it.custom_fields).length > 0){out+=' <p class="custom-fields-title">Snapshot custom fields</p> <table class="profiler-timings"> <tbody> ';var arr4=Object.keys(it.custom_fields);if(arr4){var key,i4=-1,l4=arr4.length-1;while(i4<l4){key=arr4[i4+=1];out+=' <tr> <td class="profiler-label">'+( key )+'</td> <td class="profiler-label">'+( it.custom_fields[key] )+'</td> </tr> ';} } out+=' </tbody> </table> ';}out+=' </div> </div> ';if(it.has_sql_timings){out+=' <div class="profiler-queries"> <table> <thead> <tr> <th class="ta-right">step<br />time from start<br />query type<br />duration</th> <th class="ta-left">call stack<br />query</th> </tr> </thead> <tbody> ';var arr5=MiniProfiler.getSqlTimings(it.root);if(arr5){var value,index=-1,l5=arr5.length-1;while(index<l5){value=arr5[index+=1];out+=' '+( MiniProfiler.templates.sqlGapTemplate({g: value.prevGap}) )+' '+( MiniProfiler.templates.sqlTimingTemplate({i: index, s: value}) )+' ';if(value.nextGap){out+=' '+( MiniProfiler.templates.sqlGapTemplate({g: value.nextGap}) )+' ';}out+=' ';} } out+=' </tbody> </table> <p class="profiler-trivial-gap-container"> <a class="profiler-toggle-trivial-gaps">show trivial gaps</a> </p> </div> ';}out+=' </div>';return out;
1111
}
1212
MiniProfiler.templates["linksTemplate"] = function anonymous(it
1313
) {

lib/mini_profiler/asset_version.rb

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# frozen_string_literal: true
22
module Rack
33
class MiniProfiler
4-
ASSET_VERSION = 'c336b1303a50b21f5222bc23262ca7bf'
4+
ASSET_VERSION = '116e2a6fd81c286e004e2a0afb03baa1'
55
end
66
end

lib/mini_profiler/timer_struct/page.rb

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -59,13 +59,12 @@ def symbolize_array(array)
5959

6060
def initialize(env)
6161
timer_id = MiniProfiler.generate_id
62-
page_name = env['PATH_INFO']
6362
started_at = (Time.now.to_f * 1000).to_i
6463
started = (Process.clock_gettime(Process::CLOCK_MONOTONIC) * 1000).to_i
6564
machine_name = env['SERVER_NAME']
6665
super(
6766
id: timer_id,
68-
name: page_name,
67+
name: page_name(env),
6968
started: started,
7069
started_at: started_at,
7170
machine_name: machine_name,
@@ -93,14 +92,22 @@ def initialize(env)
9392
)
9493
self[:request_method] = env['REQUEST_METHOD']
9594
self[:request_path] = env['PATH_INFO']
96-
name = "#{env['REQUEST_METHOD']} http://#{env['SERVER_NAME']}:#{env['SERVER_PORT']}#{env['SCRIPT_NAME']}#{env['PATH_INFO']}"
95+
name = "#{env['REQUEST_METHOD']} http://#{env['SERVER_NAME']}:#{env['SERVER_PORT']}#{env['SCRIPT_NAME']}#{page_name(env)}"
9796
self[:root] = TimerStruct::Request.createRoot(name, self)
9897
end
9998

10099
def name
101100
@attributes[:name]
102101
end
103102

103+
def page_name(env)
104+
if env['QUERY_STRING'] && env['QUERY_STRING'] != ""
105+
env['PATH_INFO'] + "?" + env['QUERY_STRING']
106+
else
107+
env['PATH_INFO']
108+
end
109+
end
110+
104111
def duration_ms
105112
@attributes[:root][:duration_milliseconds]
106113
end

0 commit comments

Comments
 (0)