Skip to content

Commit f3cd2a4

Browse files
committed
added copy to clipboard for sql panels
1 parent 6cb31f5 commit f3cd2a4

File tree

4 files changed

+205
-32
lines changed

4 files changed

+205
-32
lines changed

resources/assets/js/App.js

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -252,4 +252,27 @@ window.cbdShowTimelineOrmQueries = function() {
252252
$cb( "#cbdButtonGroupedOrmQueries" ).removeClass( "cbd-selected" );
253253
$cb( "#cbdTimelineOrmQueries" ).slideDown();
254254
$cb( "#cbdGroupedOrmQueries" ).slideUp();
255+
};
256+
257+
/**
258+
* Copy a div's code to the clipboard
259+
* @param {*} id The id of the element's content to copy to the clipboard
260+
*/
261+
window.copyToClipboard = function( id ) {
262+
var elm = document.getElementById( id );
263+
// for Internet Explorer
264+
if ( document.body.createTextRange ) {
265+
var range = document.body.createTextRange();
266+
range.moveToElementText( elm );
267+
range.select();
268+
document.execCommand( "Copy" );
269+
} else if ( window.getSelection ) {
270+
// other browsers
271+
var selection = window.getSelection();
272+
var range = document.createRange();
273+
range.selectNodeContents( elm );
274+
selection.removeAllRanges();
275+
selection.addRange( range );
276+
document.execCommand( "Copy" );
277+
}
255278
};

resources/assets/sass/App.scss

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,21 @@
99
clear: both;
1010

1111
code {
12+
padding: 0px;
13+
width: 100%;
14+
display: block;
15+
background-color: black;
1216
pre {
17+
font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
1318
background-color: #000000;
1419
color: chartreuse;
1520
padding: 10px 5px;
1621
line-height: 1.3;
1722
border-radius: 5px;
23+
border: none;
1824
overflow: auto;
1925
max-height: 300px;
26+
font-size: 12px;
2027
}
2128
}
2229

@@ -105,7 +112,7 @@
105112
font-size: 11px;
106113
border:1px outset #93C2FF;
107114
background-color: #eeeeee;
108-
border-radius: 5px;
115+
border-radius: 10px;
109116
width: 100%;
110117
margin-left:auto;
111118
margin-right:auto;
@@ -118,6 +125,7 @@
118125
}
119126
tr{
120127
background-color: white;
128+
border-bottom: 1px solid #93C2FF;
121129
}
122130
tr:hover{
123131
background-color: #caeefe;
@@ -126,6 +134,7 @@
126134
background-color: #EFF6FF;
127135
}
128136
td{
137+
vertical-align: top;
129138
padding: 5px 5px;
130139
}
131140
td.key{
@@ -276,6 +285,7 @@
276285
.cbd-text-orange{ color: #C09853 !important; }
277286
.cbd-text-purple{ color: #67306A !important;}
278287
.cbd-text-white{ color:white !important; }
288+
.cbd-text-pre{ color: chartreuse !important; }
279289

280290
.cbd-text-right { text-align:right !important; }
281291
.cbd-text-left { text-align:left !important; }

views/main/panels/cbormPanel.cfm

Lines changed: 101 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,19 @@
101101
</div>
102102
</td>
103103
<td>
104-
<code>
104+
<code id="cborm-groupsql-#sqlHash#">
105+
<svg
106+
xmlns="http://www.w3.org/2000/svg"
107+
class="h-6 w-6 cbd-floatRight cbd-text-pre mt5"
108+
fill="none"
109+
viewBox="0 0 24 24"
110+
stroke="currentColor"
111+
title="Copy SQL to Clipboard"
112+
style="width: 50px; height: 50px; cursor: pointer;"
113+
onclick="copyToClipboard( 'cborm-groupsql-#sqlHash#' )"
114+
>
115+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
116+
</svg>
105117
#sqlFormatter.formatSql(
106118
args.profiler.cborm.grouped[ sqlHash ].sql
107119
)#
@@ -123,6 +135,7 @@
123135
</thead>
124136
<tbody>
125137
<cfloop array="#args.profiler.cborm.grouped[ sqlHash ].records#" index="q">
138+
<cfset q.id = createUUID()>
126139
<tr>
127140
<td align="center">
128141
#TimeFormat( q.timestamp, "hh:MM:SS.l tt" )#
@@ -134,6 +147,8 @@
134147
#q.type#
135148
</td>
136149
<td>
150+
151+
<!--- Show Template Caller if not empty --->
137152
<cfif q.caller.template.len()>
138153
<div class="mb10 mt10 cbd-params">
139154
<!--- Title --->
@@ -163,8 +178,23 @@
163178
</div>
164179
</cfif>
165180

181+
<!--- Params --->
166182
<cfif NOT q.params.isEmpty()>
167-
<code><pre>#jsonFormatter.formatJSON( json : q.params, spaceAfterColon : true )#</pre></code>
183+
<code id="cborm-groupsql-params-#q.id#">
184+
<svg
185+
xmlns="http://www.w3.org/2000/svg"
186+
class="h-6 w-6 cbd-floatRight cbd-text-pre mt5"
187+
fill="none"
188+
viewBox="0 0 24 24"
189+
stroke="currentColor"
190+
title="Copy Params to Clipboard"
191+
style="width: 50px; height: 50px; cursor: pointer;"
192+
onclick="copyToClipboard( 'cborm-groupsql-params-#q.id#' )"
193+
>
194+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
195+
</svg>
196+
<pre>#jsonFormatter.formatJSON( json : q.params, spaceAfterColon : true )#</pre>
197+
</code>
168198
</cfif>
169199
</td>
170200
</tr>
@@ -184,26 +214,35 @@
184214
<table border="0" align="center" cellpadding="0" cellspacing="1" class="cbd-tables">
185215
<thead>
186216
<tr>
187-
<th width="125">Timestamp</th>
188-
<th width="100">Type</th>
189-
<th>Query</th>
217+
<th width="125" align="center">Timestamp</th>
218+
<th width="100" align="center">Type</th>
190219
<th width="100" align="center">Execution Time</th>
220+
<th>Query</th>
191221
</tr>
192222
</thead>
223+
193224
<tbody>
194225
<cfloop array="#args.profiler.cborm.all#" index="q">
226+
<cfset q.id = createUUID()>
195227
<tr>
196228
<td align="center">
197229
#TimeFormat( q.timestamp,"hh:MM:SS.l tt" )#
198230
</td>
231+
199232
<td align="center">
200233
#q.type#
201234
</td>
235+
236+
<td align="center">
237+
#q.executionTime# ms
238+
</td>
239+
202240
<td>
203241
<cfif q.caller.template.len()>
204242
<div class="mb10 mt10 cbd-params">
205243
<!--- Title --->
206244
<strong>Called From: </strong>
245+
207246
<!--- Open in Editor--->
208247
<cfif exceptionBean.openInEditorURL( event, q.caller ) NEQ "">
209248
<div class="cbd-floatRight">
@@ -220,6 +259,7 @@
220259
</a>
221260
</div>
222261
</cfif>
262+
223263
<!--- Line --->
224264
<div>
225265
<strong>
@@ -229,20 +269,47 @@
229269
</div>
230270
</cfif>
231271

232-
<code>#sqlFormatter.formatSql( q.sql )#</code>
272+
<!--- Formatted SQL --->
273+
<code id="cborm-timelinesql-#q.id#">
274+
<svg
275+
xmlns="http://www.w3.org/2000/svg"
276+
class="h-6 w-6 cbd-floatRight cbd-text-pre mt5"
277+
fill="none"
278+
viewBox="0 0 24 24"
279+
stroke="currentColor"
280+
title="Copy SQL to Clipboard"
281+
style="width: 50px; height: 50px; cursor: pointer;"
282+
onclick="copyToClipboard( 'cborm-timelinesql-#q.id#' )"
283+
>
284+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
285+
</svg>
286+
#sqlFormatter.formatSql( q.sql )#
287+
</code>
233288

289+
<!--- Binding Params --->
234290
<cfif NOT q.params.isEmpty()>
235291
<div class="mt10 mb5 cbd-params">
236292
<div class="mb10">
237293
<strong>Params: </strong>
238294
</div>
239-
<code><pre>#jsonFormatter.formatJSON( json : q.params, spaceAfterColon : true )#</pre></code>
295+
<code id="cborm-timelinesql-params-#q.id#">
296+
<svg
297+
xmlns="http://www.w3.org/2000/svg"
298+
class="h-6 w-6 cbd-floatRight cbd-text-pre mt5"
299+
fill="none"
300+
viewBox="0 0 24 24"
301+
stroke="currentColor"
302+
title="Copy SQL to Clipboard"
303+
style="width: 50px; height: 50px; cursor: pointer;"
304+
onclick="copyToClipboard( 'cborm-timelinesql-params-#q.id#' )"
305+
>
306+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
307+
</svg>
308+
<pre>#jsonFormatter.formatJSON( json : q.params, spaceAfterColon : true )#</pre>
309+
</code>
240310
</div>
241311
</cfif>
242312
</td>
243-
<td align="center">
244-
#q.executionTime# ms
245-
</td>
246313
</tr>
247314
</cfloop>
248315
</tbody>
@@ -271,18 +338,30 @@
271338
#args.profiler.cborm.totalQueries#
272339
</td>
273340
</tr>
274-
<cfset stats = args.profiler.cborm.sessionStats.keyArray()>
275-
<cfset stats.sort( "textnocase" )>
276-
<cfloop array="#stats#" item="thisItem" >
277-
<tr>
278-
<th width="200" align="right">
279-
#thisItem# :
280-
</th>
281-
<td>
282-
#args.profiler.cborm.sessionStats[ thisItem ]#
283-
</td>
284-
</tr>
285-
</cfloop>
341+
<tr>
342+
<th width="200" align="right">
343+
Total Execution Time:
344+
</th>
345+
<td>
346+
#args.profiler.cborm.totalExecutionTime#
347+
</td>
348+
</tr>
349+
<tr>
350+
<th width="200" align="right">
351+
Collection Count:
352+
</th>
353+
<td>
354+
#args.profiler.cborm.sessionStats.collectionCount#
355+
</td>
356+
</tr>
357+
<tr>
358+
<th width="200" align="right">
359+
Entity Count:
360+
</th>
361+
<td>
362+
#args.profiler.cborm.sessionStats.entityCount#
363+
</td>
364+
</tr>
286365
</table>
287366
</div>
288367
</div>

0 commit comments

Comments
 (0)