Refactored SQL panel to use datetime objects and added a visual display of both duration and sequence to the SQL template.

4 files changed, 16 insertions, 11 deletions

diff --git a/debug_toolbar/templates/debug_toolbar/panels/sql.html b/debug_toolbar/templates/debug_toolbar/panels/sql.html
index 7aa4c2d..9c8bfa6 100644
--- a/debug_toolbar/templates/debug_toolbar/panels/sql.html
+++ b/debug_toolbar/templates/debug_toolbar/panels/sql.html
@@ -11,13 +11,13 @@
 	<tbody>
 		{% for query in queries %}
 			<tr class="{% cycle 'djDebugOdd' 'djDebugEven' %}">
-				<td>{{ query.time|floatformat:"2" }}</td>
+				<td>{{ query.duration|floatformat:"2" }}</td>
 				<td>
 				{% if query.params %}
-					<a class="remoteCall" href="/__debug__/sql_select/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&time={{ query.time|floatformat:"2"|urlencode }}&hash={{ query.hash }}">SELECT</a>
-					<a class="remoteCall" href="/__debug__/sql_explain/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&time={{ query.time|floatformat:"2"|urlencode }}&hash={{ query.hash }}">EXPLAIN</a>
+					<a class="remoteCall" href="/__debug__/sql_select/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&duration={{ query.duration|floatformat:"2"|urlencode }}&hash={{ query.hash }}">SELECT</a>
+					<a class="remoteCall" href="/__debug__/sql_explain/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&duration={{ query.duration|floatformat:"2"|urlencode }}&hash={{ query.hash }}">EXPLAIN</a>
 					{% if is_mysql %}
-						<a class="remoteCall" href="/__debug__/sql_profile/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&time={{ query.time|floatformat:"2"|urlencode }}&hash={{ query.hash }}">PROFILE</a>
+						<a class="remoteCall" href="/__debug__/sql_profile/?sql={{ query.raw_sql|urlencode }}&params={{ query.params|urlencode }}&duration={{ query.duration|floatformat:"2"|urlencode }}&hash={{ query.hash }}">PROFILE</a>
 					{% endif %}
 				{% endif %}
 				</td>
@@ -42,7 +42,12 @@
 					</div>
 					{% endif %}
 				</td>
-				<td class="syntax">{{ query.sql|safe }}</td>
+				<td class="syntax">
+					<div class="djDebugSqlWrap">
+						<div class="djDebugSql">{{ query.sql|safe }}</div>
+						<span class="djDebugLineChart{% if query.is_slow %} djDebugLineChartWarning{% endif %}" style="width:{{ query.width_ratio }}%; left:{{ query.start_offset }}%;"</span>
+					</div>
+				</td>
 			</tr>
 		{% endfor %}
 	</tbody>
diff --git a/debug_toolbar/templates/debug_toolbar/panels/sql_explain.html b/debug_toolbar/templates/debug_toolbar/panels/sql_explain.html
index 38249b3..a21ec59 100644
--- a/debug_toolbar/templates/debug_toolbar/panels/sql_explain.html
+++ b/debug_toolbar/templates/debug_toolbar/panels/sql_explain.html
@@ -6,9 +6,9 @@
 <div class="djDebugPanelContent">
 	<dl>
 		<dt>{% trans "Executed SQL" %}</dt>
-		<dd><pre>{{ sql|safe }}</pre></dd>
+		<dd>{{ sql|safe }}</dd>
 		<dt>{% trans "Time" %}</dt>
-		<dd>{{ time }} ms</dd>
+		<dd>{{ duration }} ms</dd>
 	</dl>
 	<table>
 		<thead>
diff --git a/debug_toolbar/templates/debug_toolbar/panels/sql_profile.html b/debug_toolbar/templates/debug_toolbar/panels/sql_profile.html
index 0dcb0b9..a15574e 100644
--- a/debug_toolbar/templates/debug_toolbar/panels/sql_profile.html
+++ b/debug_toolbar/templates/debug_toolbar/panels/sql_profile.html
@@ -7,9 +7,9 @@
 	{% if result %}
 		<dl>
 			<dt>{% trans "Executed SQL" %}</dt>
-			<dd><pre>{{ sql|safe }}</pre></dd>
+			<dd>{{ sql|safe }}</dd>
 			<dt>{% trans "Time" %}</dt>
-			<dd>{{ time }} ms</dd>
+			<dd>{{ duration }} ms</dd>
 		</dl>
 		<table>
 			<thead>
diff --git a/debug_toolbar/templates/debug_toolbar/panels/sql_select.html b/debug_toolbar/templates/debug_toolbar/panels/sql_select.html
index e4d6027..66835c8 100644
--- a/debug_toolbar/templates/debug_toolbar/panels/sql_select.html
+++ b/debug_toolbar/templates/debug_toolbar/panels/sql_select.html
@@ -6,9 +6,9 @@
 <div class="djDebugPanelContent">
 	<dl>
 		<dt>{% trans "Executed SQL" %}</dt>
-		<dd><pre>{{ sql|safe }}</pre></dd>
+		<dd>{{ sql|safe }}</dd>
 		<dt>{% trans "Time" %}</dt>
-		<dd>{{ time }} ms</dd>
+		<dd>{{ duration }} ms</dd>
 	</dl>
 	{% if result %}
 	<table>