AdminerSqlFormatter

AdminerSqlFormatter.php

<?php

/**
 * Add a 'Format SQL' button to query textarea.
 *
 * @link https://www.adminer.org/plugins/#use
 * @uses SQL Formatter, https://www.npmjs.com/package/sql-formatter
 * @author Craig Rodway
 * @license https://www.apache.org/licenses/LICENSE-2.0 Apache License, Version 2.0
 * @license https://www.gnu.org/licenses/gpl-2.0.html GNU General Public License, version 2 (one or other)
 */
class AdminerSqlFormatter
{

	/** @access protected */
	private $script;
	/** @access protected */
	private $options;
	/** @access protected */
	private $icon;


	function __construct($script = 'js/sql-formatter.min.js', $options = [])
	{
		// https://unpkg.com/browse/[email protected]/dist/sql-formatter.min.js
		$this->script = $script;

		$defaults = [
			// 'tabWidth' => 4,
		];

		$this->options = array_merge($defaults, $options);

		$this->icon = 'iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAHMSURBVDjLlZLBSyJhGMa/UxTUIWJ0ZVmlwxLLEiEhurCoKeqCOtZN7J4ZRZdd9rSG6NFbSOegDp5aqWWI3UGm6KBUxsq2LLj+CzV9jDOH8NlvJtqLjuXhBy/z8Xvel4chAMhTKGfOMeVsbqXf2wBp3s5Yf5hno8rp24YxS9PTVHq18mTAgzj3k4mCIs0cqZeLUCTHJ1q13VKRSz0v4PRNVr1KQfu9Aa31BZ2LKKg42aHfJ8ZNA9i5L9hWUZFeQ73kof3N42SPR6OyjFZ1FZ36AuQfo5CPyc7gDiRHttNYwsl+Apqmodvt4uJrCur1GmSB/GI4TAOo9JKjVasQi8VQr9ehqiqazSaqu1Fofz5C/kYow9M3gJVkp+JUJZFIIJ1Oo1gsolwu42hngcmfdfmecS4fki3TC3ieN2SPx4NAIIB4PA7lPIo70YY7YQJyhdhNS3yU3W43/H4/LBaLvnWbbbxnvGNyQz4gmb4ByWQShULBkH0+HziOg/6die+ZKOjzzQEZYXzoCYhEIsjn8z3yI0wKmf7KwWAQuVwOLpcLXq+3Rx4EyWQyaLfbcDqdCIVCQ8n/A2q1GkqlklHYMLIREA6HN/WzrVbr0LLOP1AMs7UPAa92AAAAAElFTkSuQmCC';
	}


	private function styles()
	{
		?>
		<style>
		.fmt-sql-btn {
			padding: 3px 7px;
			font-size: 12px;
			font-family: inherit;
		}
		.fmt-sql-btn img {
			vertical-align: -15%;
			margin-right: 4px;
		}
		</style>
		<?php
	}


	function head()
	{
		echo script_src($this->script);
		echo $this->styles();

		?>

		<script <?php echo nonce(); ?>>
			(function(document) {
				"use strict";

				const sqlFmtOpts = <?= json_encode($this->options ?? [], JSON_NUMERIC_CHECK) ?>;

				document.addEventListener("DOMContentLoaded", init, false);

				function init() {
					var queryTextarea = document.querySelectorAll('textarea[name=query]')[0];
					if (queryTextarea === undefined) return;
					addLink(queryTextarea);
				}

				function addLink(queryTextarea) {
					var actionsEl = queryTextarea.parentNode.nextSibling;
					var parentEl = queryTextarea.parentNode.parentNode;

					var formatBtn = document.createElement('button');
					formatBtn.type = 'button';
					formatBtn.className = 'fmt-sql-btn';
					formatBtn.addEventListener('click', function(e) {
						e.preventDefault();
						doFormatSql(queryTextarea);
					}, false);

					var lblEl = document.createTextNode('Format SQL');

					var iconEl = document.createElement('img');
					iconEl.src = "data:image/png;base64,<?=$this->icon?>";
					iconEl.alt = '';

					formatBtn.appendChild(iconEl);
					formatBtn.appendChild(lblEl);

					var formatP = document.createElement('p');
					formatP.appendChild(formatBtn);

					parentEl.insertBefore(formatP, actionsEl);
				}

				function doFormatSql(queryTextarea) {
					var fmtd = window.sqlFormatter.format(queryTextarea.value, getOptions(queryTextarea));
					var preEl = document.querySelectorAll('pre.sqlarea')[0];
					var tmtdEl = document.createTextNode(fmtd);
					preEl.innerText = fmtd;
					// trigger event for jush to update formatting/styles
					preEl.dispatchEvent(new Event("keyup"));
				}

				function getOptions(queryTextarea) {
					// @todo detect language in use by Adminer and override?
					var opts = sqlFmtOpts;
					return opts;
				}

			})(document);
		</script>

		<?php
	}


}