Better debug

public_html/media/css/core.css

@@ -391,14 +391,6 @@ ul.tagit input {
 	margin: -1px 0 0 0;
 }
 
-pre.debug {
-	margin-left: 1em;
-	text-align: left;
-	color: black;
-	white-space: normal;
-	text-indent: -1em;
-}
-
 .spoiler:before,
 .spoiler:after {
 	color: gray;

public_html/media/css/debug.css

@@ -0,0 +1,30 @@
+div.debug {
+	background: #f5f5f5;
+	font-size: 90%;
+	margin: 1em 0;
+	padding: 1em;
+	color: black;
+	text-align: left;
+}
+div.debug pre {
+	margin-left: 1em;
+	white-space: normal;
+	text-indent: -1em;
+}
+div.debug pre.query {
+	color: maroon;
+}
+div.debug pre.bindings {
+	color: gray;
+}
+div.debug pre.bindings .value {
+	color: green;
+	font-weight: bold;
+	margin-right: 1em;
+}
+div.debug pre.query span {
+	background: rgba(255, 0, 0, 0.05);
+}
+div.debug pre.query span:hover {
+	background: white;
+}

src/Database.php

@@ -2,7 +2,7 @@
 class Database
 {
 	protected static $pdo = null;
-	protected static $queries = [];
+	protected static $queryLogs = [];
 
 	public static function connect($driver, $location, $user, $pass)
 	{
@@ -51,38 +51,52 @@ class Database
 		return self::$pdo !== null;
 	}
 
-	public static function exec(SqlStatement $stmt)
+	private static function execInternal(SqlStatement $stmt, $callback)
 	{
 		if (!self::connected())
 			throw new Exception('Database is not connected');
+
 		$stmtPdo = self::convertStatement($stmt);
 		try
 		{
+			$timeStart = microtime(true);
 			$stmtPdo->execute();
+			$timeExec = microtime(true) - $timeStart;
+
+			$timeStart = microtime(true);
+			$ret = $callback($stmtPdo);
+			$timeFetch = microtime(true) - $timeStart;
 		}
 		catch (Exception $e)
 		{
 			throw new Exception('Problem with ' . $stmt->getAsString() . ' execution (' . $e->getMessage() . ')');
 		}
-		self::$queries []= $stmt;
-		return $stmtPdo;
+		$queryLog = new StdClass();
+		$queryLog->statement = $stmt;
+		$queryLog->timeExec = $timeExec;
+		$queryLog->timeFetch = $timeFetch;
+		self::$queryLogs []= $queryLog;
+		return $ret;
+	}
+
+	public static function exec(SqlStatement $stmt)
+	{
+		return self::execInternal($stmt, function($stmtPdo) { });
 	}
 
 	public static function fetchOne(SqlStatement $stmt)
 	{
-		$stmtPdo = self::exec($stmt);
-		return $stmtPdo->fetch();
+		return self::execInternal($stmt, function($stmtPdo) { return $stmtPdo->fetch(); });
 	}
 
 	public static function fetchAll(SqlStatement $stmt)
 	{
-		$stmtPdo = self::exec($stmt);
-		return $stmtPdo->fetchAll();
+		return self::execInternal($stmt, function($stmtPdo) { return $stmtPdo->fetchAll(); });
 	}
 
 	public static function getLogs()
 	{
-		return self::$queries;
+		return self::$queryLogs;
 	}
 
 	public static function inTransaction()

src/Views/debug.phtml

@@ -0,0 +1,24 @@
+<?php LayoutHelper::addStylesheet('debug.css') ?>
+<div class="main-wrapper">
+	<?php foreach (Database::getLogs() as $log): ?>
+		<div class="debug">
+			<?php
+				$query = $log->statement->getAsString();
+				$query = str_replace('(', '<span>(', $query);
+				$query = str_replace(')', ')</span>', $query);
+			?>
+			<pre class="query"><?php echo $query ?></pre>
+
+			<pre class="bindings"><?php echo join(', ', array_map(function($key) use ($log)
+				{
+					return $key . '=<span class="value">' . $log->statement->getBindings()[$key] . '</span>';
+				},
+				array_keys($log->statement->getBindings()))) ?></pre>
+
+			<table>
+				<tr><td>Execution:</td><td><?php echo sprintf('%.05fs', $log->timeExec) ?></td></tr>
+				<tr><td>Retrieval:</td><td><?php echo sprintf('%.05fs', $log->timeFetch) ?></td></tr>
+			</table>
+		</div>
+	<?php endforeach ?>
+</div>

src/Views/layout-normal.phtml

@@ -43,18 +43,13 @@ LayoutHelper::addScript('core.js');
 					<span><a href="<?php echo \Chibi\UrlHelper::route('log', 'list') ?>">Logs</a></span>
 				<?php endif ?>
 				<hr>
-				<?php if ($this->config->misc->debugQueries): ?>
-					<?php foreach (Database::getLogs() as $query)
-					{
-						$bindings = [];
-						foreach ($query->getBindings() as $k => $v)
-							$bindings []= $k . '=' . $v;
-						printf('<pre class="debug">%s [%s]</pre>', htmlspecialchars($query->getAsString()), join(', ', $bindings));
-					} ?>
-				<?php endif ?>
 			</div>
 		</footer>
 
+		<?php if ($this->config->misc->debugQueries): ?>
+			<?php echo $this->renderFile('debug') ?>
+		<?php endif ?>
+
 		<div id="small-screen"></div>
 	</body>
 </html>