From 68a69b3cbf073e00214f5f05fff5161a944de103 Mon Sep 17 00:00:00 2001 From: Nate Berkopec Date: Tue, 2 Jan 2024 09:30:51 +0900 Subject: [PATCH] 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 --- lib/html/includes.css | 20 ++++++++++++++-- lib/html/includes.js | 2 +- lib/html/includes.scss | 32 +++++++++++++++++++++++++- lib/html/includes.tmpl | 11 +++++++-- lib/html/vendor.js | 2 +- lib/mini_profiler/asset_version.rb | 2 +- lib/mini_profiler/timer_struct/page.rb | 13 ++++++++--- 7 files changed, 71 insertions(+), 11 deletions(-) diff --git a/lib/html/includes.css b/lib/html/includes.css index e34bc4c2..d875257d 100644 --- a/lib/html/includes.css +++ b/lib/html/includes.css @@ -105,7 +105,8 @@ .profiler-result .profiler-unit { font-family: Consolas, monospace, serif; } .profiler-result .profiler-number { - color: #111; } + color: #111; + display: inline-block; } .profiler-result .profiler-info { text-align: right; } .profiler-result .profiler-info .profiler-name { @@ -235,6 +236,19 @@ .profiler-results { z-index: 2147483643; position: fixed; } + .profiler-results.profiler-left .profiler-button { + text-align: left; } + .profiler-results.profiler-right .profiler-button { + text-align: right; } + .profiler-results .profiler-button > .profiler-duration-milliseconds { + min-width: 70px; } + .profiler-results .profiler-button > .profiler-sql-count { + min-width: 55px; } + .profiler-results .profiler-button > .profiler-name { + min-width: 190px; + margin-left: 3px; } + .profiler-results .profiler-button > .profiler-number { + text-align: right; } .profiler-results.profiler-top { top: 0px; } .profiler-results.profiler-top.profiler-left { @@ -285,8 +299,10 @@ background-color: maroon; } .profiler-results .profiler-button.profiler-button-active .profiler-number, .profiler-results .profiler-button.profiler-button-active .profiler-nuclear, + .profiler-results .profiler-button.profiler-button-active .profiler-name, .profiler-results .profiler-controls.profiler-button-active .profiler-number, - .profiler-results .profiler-controls.profiler-button-active .profiler-nuclear { + .profiler-results .profiler-controls.profiler-button-active .profiler-nuclear, + .profiler-results .profiler-controls.profiler-button-active .profiler-name { color: #fff; font-weight: bold; } .profiler-results .profiler-button.profiler-button-active .profiler-unit, diff --git a/lib/html/includes.js b/lib/html/includes.js index 9fd679eb..4b57ad9f 100644 --- a/lib/html/includes.js +++ b/lib/html/includes.js @@ -220,7 +220,7 @@ var _MiniProfiler = (function() { totalSqlCount += parseInt(json.sql_count); reqs++; - if (!controls && reqs > 1 && options.collapseResults && !expandedResults) { + if (!controls && options.collapseResults && !expandedResults) { if (!totalsControl) { toArray(container.querySelectorAll(".profiler-result")).forEach( function(el) { diff --git a/lib/html/includes.scss b/lib/html/includes.scss index 477bc717..6557eec6 100644 --- a/lib/html/includes.scss +++ b/lib/html/includes.scss @@ -103,6 +103,7 @@ $zindex: 2147483640; // near 32bit max 2147483647 .profiler-number { color: $numberColor; + display: inline-block; } .profiler-info { @@ -317,6 +318,34 @@ $zindex: 2147483640; // near 32bit max 2147483647 $radius: 10px; + &.profiler-left { + .profiler-button { + text-align: left; + } + } + + &.profiler-right { + .profiler-button { + text-align: right; + } + } + + .profiler-button { + > .profiler-duration-milliseconds { + min-width: 70px; + } + > .profiler-sql-count { + min-width: 55px; + } + > .profiler-name { + min-width: 190px; + margin-left: 3px; + } + > .profiler-number { + text-align: right; + } + } + &.profiler-top { top: 0px; @@ -399,7 +428,8 @@ $zindex: 2147483640; // near 32bit max 2147483647 background-color: maroon; .profiler-number, - .profiler-nuclear { + .profiler-nuclear, + .profiler-name { color: #fff; font-weight: bold; } diff --git a/lib/html/includes.tmpl b/lib/html/includes.tmpl index 42ec6393..6f51cc34 100644 --- a/lib/html/includes.tmpl +++ b/lib/html/includes.tmpl @@ -2,14 +2,21 @@
{{? it.has_duplicate_sql_timings}}!{{?}} - + {{= MiniProfiler.formatDuration(it.duration_milliseconds)}} ms {{? MiniProfiler.showTotalSqlCount()}} - + {{= it.sql_count}} sql {{?}} + + {{? it.name.length >= 30 }} + {{= it.name.substring(0,15) + "..." + it.name.slice(-15) }} + {{??}} + {{= it.name}} + {{?}} +
diff --git a/lib/html/vendor.js b/lib/html/vendor.js index 8e239433..8091abc1 100644 --- a/lib/html/vendor.js +++ b/lib/html/vendor.js @@ -7,7 +7,7 @@ MiniProfiler.templates = {}; MiniProfiler.templates["profilerTemplate"] = function anonymous(it ) { -var out='
';if(it.has_duplicate_sql_timings){out+='!';}out+=' '+( MiniProfiler.formatDuration(it.duration_milliseconds))+' ms ';if(MiniProfiler.showTotalSqlCount()){out+=' '+( it.sql_count)+' sql ';}out+='
'+( it.name)+' ('+( MiniProfiler.formatDuration(it.duration_milliseconds))+' ms) '+( it.machine_name)+' on '+( MiniProfiler.renderDate(it.started_formatted))+'
';if(it.has_sql_timings){out+=' ';}out+=' ';var arr1=it.custom_timing_names;if(arr1){var value,i1=-1,l1=arr1.length-1;while(i1'+( value.toLowerCase() )+' (ms) ';} } out+=' '+( MiniProfiler.templates.timingTemplate({timing: it.root, page: it}) )+' ';if(it.has_sql_timings){out+=' ';}out+=' ';var arr2=it.custom_timing_names;if(arr2){var value,i2=-1,l2=arr2.length-1;while(i2 '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) )+' % in '+( value.toLowerCase() )+' ';} } out+='
event duration (ms) with children (ms) from start (ms)query time (ms)
';if(!it.client_timings){out+=' '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' ';}out+=' show time with children snapshots '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) )+' % in sql
';if(it.client_timings){out+=' ';var arr3=MiniProfiler.getClientTimings(it.client_timings);if(arr3){var value,i3=-1,l3=arr3.length-1;while(i3 ';} } out+='
client event duration (ms) from start (ms)
'+( value.name )+' ';if(value.duration >= 0){out+=' '+( MiniProfiler.formatDuration(value.duration) )+' ';}out+=' +'+( MiniProfiler.formatDuration(value.start) )+'
'+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+'
';}out+=' ';if(it.custom_fields && Object.keys(it.custom_fields).length > 0){out+='

Snapshot custom fields

';var arr4=Object.keys(it.custom_fields);if(arr4){var key,i4=-1,l4=arr4.length-1;while(i4 ';} } out+='
'+( key )+' '+( it.custom_fields[key] )+'
';}out+='
';if(it.has_sql_timings){out+='
';var arr5=MiniProfiler.getSqlTimings(it.root);if(arr5){var value,index=-1,l5=arr5.length-1;while(indexms ';if(MiniProfiler.showTotalSqlCount()){out+=' '+( it.sql_count)+' sql ';}out+=' ';if(it.name.length >= 30){out+=' '+( it.name.substring(0,15) + "..." + it.name.slice(-15) )+' ';}else{out+=' '+( it.name)+' ';}out+='
'+( it.name)+' ('+( MiniProfiler.formatDuration(it.duration_milliseconds))+' ms) '+( it.machine_name)+' on '+( MiniProfiler.renderDate(it.started_formatted))+'
step
time from start
query type
duration		 call stack
query
';if(it.has_sql_timings){out+=' ';}out+=' ';var arr1=it.custom_timing_names;if(arr1){var value,i1=-1,l1=arr1.length-1;while(i1'+( value.toLowerCase() )+' (ms) ';} } out+=' '+( MiniProfiler.templates.timingTemplate({timing: it.root, page: it}) )+' ';if(it.has_sql_timings){out+=' ';}out+=' ';var arr2=it.custom_timing_names;if(arr2){var value,i2=-1,l2=arr2.length-1;while(i2 '+( MiniProfiler.formatDuration(it.custom_timing_stats[value].duration / it.duration_milliseconds * 100) )+' % in '+( value.toLowerCase() )+' ';} } out+='
event duration (ms) with children (ms) from start (ms)query time (ms)
';if(!it.client_timings){out+=' '+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+' ';}out+=' show time with children snapshots '+( MiniProfiler.formatDuration(it.duration_milliseconds_in_sql / it.duration_milliseconds * 100) )+' % in sql
';if(it.client_timings){out+=' ';var arr3=MiniProfiler.getClientTimings(it.client_timings);if(arr3){var value,i3=-1,l3=arr3.length-1;while(i3 ';} } out+='
client event duration (ms) from start (ms)
'+( value.name )+' ';if(value.duration >= 0){out+=' '+( MiniProfiler.formatDuration(value.duration) )+' ';}out+=' +'+( MiniProfiler.formatDuration(value.start) )+'
'+( MiniProfiler.templates.linksTemplate({timing: it.root, page: it}) )+'
';}out+=' ';if(it.custom_fields && Object.keys(it.custom_fields).length > 0){out+='

Snapshot custom fields

';var arr4=Object.keys(it.custom_fields);if(arr4){var key,i4=-1,l4=arr4.length-1;while(i4 ';} } out+='
'+( key )+' '+( it.custom_fields[key] )+'
';}out+='
';if(it.has_sql_timings){out+='
';var arr5=MiniProfiler.getSqlTimings(it.root);if(arr5){var value,index=-1,l5=arr5.length-1;while(index
step
time from start
query type
duration		 call stack
query