Integrate tables-filter plugin into the base code

adminer/include/adminer.inc.php

@@ -1062,6 +1062,7 @@ bodyLoad('<?php echo (is_object($connection) ? preg_replace('~^(\d\.?\d).*~s', '
 				if (!$tables) {
 					echo "<p class='message'>" . lang('No tables.') . "\n";
 				} else {
+					$this->printTablesFilter();
 					$this->tablesPrint($tables);
 				}
 			}
@@ -1106,28 +1107,51 @@ bodyLoad('<?php echo (is_object($connection) ? preg_replace('~^(\d\.?\d).*~s', '
 		echo "</p></form>\n";
 	}
 
-	/** Prints table list in menu
-	* @param array result of table_status('', true)
-	* @return null
-	*/
-	function tablesPrint($tables) {
+	function printTablesFilter()
+	{
+		global $adminer;
+
+		echo "<div class='tables-filter jsonly'>"
+			. "<input id='tables-filter' autocomplete='off' placeholder='" . lang('Table') . "'>"
+			. script("initTablesFilter(" . json_encode($adminer->database()) . ");")
+			. "</div>\n";
+	}
+
+	/**
+	 * Prints table list in menu.
+	 *
+	 * @param array $tables Result of table_status('', true)
+	 * @return null
+	 */
+	function tablesPrint(array $tables) {
 		echo "<ul id='tables'>" . script("mixin(qs('#tables'), {onmouseover: menuOver, onmouseout: menuOut});");
+
 		foreach ($tables as $table => $status) {
 			$name = $this->tableName($status);
 			if ($name != "") {
+				$active = $table == $_GET["select"] || $table == $_GET["edit"];
+
 				echo '<li><a href="' . h(ME) . 'select=' . urlencode($table) . '"'
-					. bold($_GET["select"] == $table || $_GET["edit"] == $table, "select")
-					. " title='" . lang('Select data') . "'>" . lang('select') . "</a> "
-				;
-				echo (support("table") || support("indexes")
-					? '<a href="' . h(ME) . 'table=' . urlencode($table) . '"'
-						. bold(in_array($table, array($_GET["table"], $_GET["create"], $_GET["indexes"], $_GET["foreign"], $_GET["trigger"])), (is_view($status) ? "view" : "structure"))
-						. " title='" . lang('Show structure') . "'>$name</a>"
-					: "<span>$name</span>"
-				) . "\n";
+					. bold($active, "select")
+					. " title='" . lang('Select data') . "'>" . lang('select') . "</a> ";
+
+				if (support("table") || support("indexes")) {
+					$active = in_array($table, [$_GET["table"], $_GET["create"], $_GET["indexes"], $_GET["foreign"], $_GET["trigger"]]);
+					$class = is_view($status) ? "view" : "structure";
+
+					echo '<a href="' . h(ME) . 'table=' . urlencode($table) . '"' . bold($active, $class)
+						. " title='" . lang('Show structure') . "' data-main='true'>$name</a>";
+				} else {
+					echo "<span data-main='true'>$name</span>";
+				}
+
+				echo "</li>\n";
 			}
 		}
+
 		echo "</ul>\n";
+
+		return null;
 	}
 
 }

adminer/static/default.css

@@ -31,6 +31,7 @@ input.default { box-shadow: 1px 1px 1px #777; }
 input.required { box-shadow: 1px 1px 1px red; }
 input.maxlength { box-shadow: 1px 1px 1px red; }
 input.wayoff { left: -1000px; position: absolute; }
+input::placeholder { color: #000; opacity: 0.4; }
 .center { text-align: center; }
 .block { display: block; }
 .version { color: #777; font-size: 67%; }
@@ -68,6 +69,7 @@ input.wayoff { left: -1000px; position: absolute; }
 .links a { white-space: nowrap; margin-right: 20px; }
 .logout { margin-top: .5em; position: absolute; top: 0; right: 0; }
 .loadmore { margin-left: 1ex; }
+.tables-filter { padding: .8em 1em 0; }
 /* .edit used in designs */
 #menu { position: absolute; margin: 10px 0 0; padding: 0 0 30px 0; top: 2em; left: 0; width: 19em; }
 #menu p, #logins, #tables { padding: .8em 1em; margin: 0; border-bottom: 1px solid #ccc; }
@@ -83,6 +85,7 @@ input.wayoff { left: -1000px; position: absolute; }
 #schema { margin-left: 60px; position: relative; -moz-user-select: none; -webkit-user-select: none; }
 #schema .table { border: 1px solid silver; padding: 0 2px; cursor: move; position: absolute; }
 #schema .references { position: absolute; }
+#tables-filter { width: 100%; }
 #help { position: absolute; border: 1px solid #999; background: #eee; padding: 5px; font-family: monospace; z-index: 1; }
 
 .rtl h2 { margin: 0 -18px 20px 0; }

adminer/static/functions.js

@@ -357,7 +357,78 @@ function pageClick(href, page) {
 	}
 }
 
+let tablesFilterTimeout = null;
+let tablesFilterValue = '';
 
+function initTablesFilter(dbName) {
+	if (sessionStorage) {
+		document.addEventListener('DOMContentLoaded', function () {
+			if (dbName === sessionStorage.getItem('adminer_tables_filter_db') && sessionStorage.getItem('adminer_tables_filter')) {
+				qs('#tables-filter').value = sessionStorage.getItem('adminer_tables_filter');
+				filterTables();
+			} else {
+				sessionStorage.removeItem('adminer_tables_filter');
+			}
+
+			sessionStorage.setItem('adminer_tables_filter_db', dbName);
+		});
+	}
+
+	const filterInput = qs('#tables-filter');
+	filterInput.addEventListener('input', function () {
+		window.clearTimeout(tablesFilterTimeout);
+		tablesFilterTimeout = window.setTimeout(filterTables, 200);
+	});
+
+	document.body.addEventListener('keydown', function(event) {
+		if (isCtrl(event) && event.shiftKey && event.key.toUpperCase() === 'F') {
+			filterInput.focus();
+			filterInput.select();
+
+			event.preventDefault();
+		}
+	});
+}
+
+function filterTables() {
+	const value = qs('#tables-filter').value.toLowerCase();
+	if (value === tablesFilterValue) {
+		return;
+	}
+	tablesFilterValue = value;
+
+	let reg
+	if (value !== '') {
+		const valueExp = (`${value}`).replace(/[\\.+*?\[^\]$(){}=!<>|:]/g, '\\$&');
+		reg = new RegExp(`(${valueExp})`, 'gi');
+	}
+
+	if (sessionStorage) {
+		sessionStorage.setItem('adminer_tables_filter', value);
+	}
+
+	const tables = qsa('#tables li');
+	for (let i = 0; i < tables.length; i++) {
+		let a = qs('a[data-main="true"], span[data-main="true"]', tables[i]);
+
+		let tableName = tables[i].dataset.tableName;
+		if (tableName == null) {
+			tableName = a.innerHTML.trim();
+
+			tables[i].dataset.tableName = tableName;
+		}
+
+		if (value === "") {
+			tables[i].classList.remove('hidden');
+			a.innerHTML = tableName;
+		} else if (tableName.toLowerCase().indexOf(value) >= 0) {
+			tables[i].classList.remove('hidden');
+			a.innerHTML = tableName.replace(reg, '<strong>$1</strong>');
+		} else {
+			tables[i].classList.add('hidden');
+		}
+	}
+}
 
 /** Display items in menu
 * @param MouseEvent