Draggable tables in schema
git-svn-id: https://adminer.svn.sourceforge.net/svnroot/adminer/trunk@265 7c3ca157-0c34-0410-bff1-cbf682f78f5c
This commit is contained in:
jakubvrana
parent
7a2cac6487
commit
6636a611e0
|
|
@ -1,4 +1,4 @@
|
|||
BODY { color: Black; background-color: White; }
|
||||
BODY { color: Black; background-color: White; line-height: 1.25em; }
|
||||
A { color: Blue; }
|
||||
A:visited { color: Navy; }
|
||||
H1 { font-size: 150%; margin-top: 0; }
|
||||
|
|
@ -18,5 +18,5 @@ IMG { vertical-align: middle; }
|
|||
#menu { position: absolute; top: 8px; left: 8px; width: 15em; overflow: auto; overflow-y: hidden; white-space: nowrap; }
|
||||
#content { margin-left: 16em; }
|
||||
#schema { margin-left: 60px; position: relative; }
|
||||
#schema DIV { position: absolute; }
|
||||
#schema .table { border: 1px solid Silver; line-height: 1.25em; padding: 0 2px; }
|
||||
#schema .table { border: 1px solid Silver; padding: 0 2px; cursor: move; position: absolute; }
|
||||
#schema .references { position: absolute; }
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ function page_header($title, $breadcrumb = array(), $title2 = "") {
|
|||
<?php
|
||||
if (isset($breadcrumb)) {
|
||||
$link = substr(preg_replace('~db=[^&]*&~', '', $SELF), 0, -1);
|
||||
echo '<p><a href="' . (strlen($link) ? htmlspecialchars($link) : ".") . '">' . (isset($_GET["server"]) ? htmlspecialchars($_GET["server"]) : lang('Server')) . '</a> > ';
|
||||
echo '<p id="breadcrumb"><a href="' . (strlen($link) ? htmlspecialchars($link) : ".") . '">' . (isset($_GET["server"]) ? htmlspecialchars($_GET["server"]) : lang('Server')) . '</a> > ';
|
||||
if (is_array($breadcrumb)) {
|
||||
if (strlen($_GET["db"])) {
|
||||
echo '<a href="' . substr($SELF, 0, -1) . '">' . htmlspecialchars($_GET["db"]) . '</a> > ';
|
||||
|
|
|
|||
|
|
@ -1,31 +1,83 @@
|
|||
<?php
|
||||
page_header(lang('Database schema'), array(), $_GET["db"]);
|
||||
page_header(lang('Database schema') . ": " . htmlspecialchars($_GET["db"]));
|
||||
|
||||
$table_pos = array();
|
||||
$table_pos_js = array();
|
||||
preg_match_all('~([^:]+):([-0-9.]+)x([-0-9.]+)(_|$)~', $_COOKIE["schema"], $matches, PREG_SET_ORDER); //! ':' in table name
|
||||
foreach ($matches as $i => $match) {
|
||||
$table_pos[$match[1]] = "$match[2]em; left: $match[3]";
|
||||
$table_pos_js[] = "\n\t'" . addcslashes($match[1], "\r\n'\\") . "': [ $match[2], $match[3] ]";
|
||||
}
|
||||
|
||||
$top = 0;
|
||||
$left = -14;
|
||||
$schema = array();
|
||||
$referenced = array();
|
||||
$result = $mysql->query("SHOW TABLE STATUS");
|
||||
while ($row = $result->fetch_assoc()) {
|
||||
if (!isset($row["Engine"])) { // view
|
||||
continue;
|
||||
}
|
||||
$schema[$row["Name"]]["fields"] = fields($row["Name"]);
|
||||
$pos = 0;
|
||||
$schema[$row["Name"]]["fields"] = array();
|
||||
foreach (fields($row["Name"]) as $name => $field) {
|
||||
$pos += 1.25;
|
||||
$field["pos"] = $pos;
|
||||
$schema[$row["Name"]]["fields"][$name] = $field;
|
||||
}
|
||||
$schema[$row["Name"]]["pos"] = ($table_pos[$row["Name"]] ? $table_pos[$row["Name"]] : $top);
|
||||
if ($row["Engine"] == "InnoDB") {
|
||||
foreach (foreign_keys($row["Name"]) as $val) {
|
||||
if (!$val["db"]) {
|
||||
$schema[$row["Name"]]["references"][$val["table"]][] = array_combine($val["source"], $val["target"]);
|
||||
$schema[$row["Name"]]["references"][$val["table"]][$left] = array_combine($val["source"], $val["target"]);
|
||||
$referenced[$val["table"]][$left] = $val["target"];
|
||||
$left -= 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
$top = max($top, $schema[$row["Name"]]["pos"] + 2.5 + $pos);
|
||||
}
|
||||
$result->free();
|
||||
|
||||
?>
|
||||
<div id="schema">
|
||||
<script type="text/javascript">
|
||||
var that, x, y, em;
|
||||
var table_pos = {<?php echo implode(",", $table_pos_js) . "\n"; ?>};
|
||||
|
||||
function mousedown(el, event) {
|
||||
that = el;
|
||||
em = document.getElementById('breadcrumb').offsetHeight / 1.25;
|
||||
x = event.clientX - el.offsetLeft;
|
||||
y = event.clientY - el.offsetTop;
|
||||
}
|
||||
function mousemove(event) {
|
||||
if (that !== undefined) {
|
||||
that.style.left = (event.clientX - x) / em + 'em';
|
||||
that.style.top = (event.clientY - y) / em + 'em';
|
||||
//! drag lines
|
||||
}
|
||||
}
|
||||
function mouseup(event) {
|
||||
if (that !== undefined) {
|
||||
table_pos[that.firstChild.firstChild.firstChild.data] = [ (event.clientY - y) / em, (event.clientX - x) / em ];
|
||||
that = undefined;
|
||||
var date = new Date();
|
||||
date.setMonth(date.getMonth() + 1);
|
||||
var s = '';
|
||||
for (var key in table_pos) {
|
||||
s += '_' + key + ':' + Math.round(table_pos[key][0] * 10000) / 10000 + 'x' + Math.round(table_pos[key][1] * 10000) / 10000;
|
||||
}
|
||||
document.cookie = 'schema=' + encodeURIComponent(s.substr(1)) + '; expires=' + date + '; path=' + location.pathname + location.search;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div id="schema" style="height: <?php echo $top; ?>em;" onmousemove="mousemove(event);" onmouseup="mouseup(event);">
|
||||
<?php
|
||||
$top = 0;
|
||||
$positions = array();
|
||||
foreach ($schema as $name => $table) {
|
||||
echo "<div class='table' style='top: $top" . "em;'>\n";
|
||||
echo "<div class='table' style='top: $table[pos]em;' onmousedown='mousedown(this, event);'>";
|
||||
echo '<a href="' . htmlspecialchars($SELF) . 'table=' . urlencode($name) . '"><strong>' . htmlspecialchars($name) . "</strong></a><br />\n";
|
||||
foreach (fields($name) as $field) {
|
||||
foreach ($table["fields"] as $field) {
|
||||
$val = htmlspecialchars($field["field"]);
|
||||
if (preg_match('~char|text~', $field["type"])) {
|
||||
$val = "<span class='char'>$val</span>";
|
||||
|
|
@ -37,31 +89,35 @@ foreach ($schema as $name => $table) {
|
|||
$val = "<span class='enum'>$val</span>";
|
||||
}
|
||||
echo ($field["primary"] ? "<em>$val</em>" : $val) . "<br />\n";
|
||||
$top += 1.25;
|
||||
$positions[$name][$field["field"]] = $top;
|
||||
}
|
||||
foreach ((array) $table["references"] as $target_name => $refs) {
|
||||
foreach ($refs as $left => $columns) {
|
||||
foreach ($columns as $source => $target) {
|
||||
echo "<div class='references' style='left: " . ($left+1) . "px; top: " . $table["fields"][$source]["pos"] . "em; padding-top: .5em;'><div style='border-top: 1px solid Black; width: " . (-$left-2) . "px;'></div></div>\n";
|
||||
}
|
||||
}
|
||||
}
|
||||
foreach ((array) $referenced[$name] as $left => $columns) {
|
||||
foreach ($columns as $target) {
|
||||
echo "<div class='references' style='left: " . ($left+1) . "px; top: " . $table["fields"][$target]["pos"] . "em; width: " . (-$left-2) . "px; height: 1.25em; background: url(arrow.gif) no-repeat right center;'><div style='height: .5em; border-bottom: 1px solid Black; width: " . (-$left-14) . "px;'></div></div>\n";
|
||||
}
|
||||
}
|
||||
echo "</div>\n";
|
||||
$top += 2.5;
|
||||
}
|
||||
$left = -14;
|
||||
foreach ($schema as $name => $table) {
|
||||
foreach ((array) $table["references"] as $target_name => $refs) {
|
||||
foreach ($refs as $ref) {
|
||||
foreach ($refs as $left => $ref) {
|
||||
$min_pos = $top;
|
||||
$max_pos = 0;
|
||||
$max_pos = -10;
|
||||
foreach ($ref as $source => $target) {
|
||||
$pos1 = $positions[$name][$source];
|
||||
$pos2 = $positions[$target_name][$target];
|
||||
$pos1 = $table["pos"] + $table["fields"][$source]["pos"];
|
||||
$pos2 = $schema[$target_name]["pos"] + $schema[$target_name]["fields"][$target]["pos"];
|
||||
$min_pos = min($min_pos, $pos1, $pos2);
|
||||
$max_pos = max($max_pos, $pos1, $pos2);
|
||||
echo "<div style='left: " . ($left+1) . "px; top: $pos1" . "em; padding-top: .5em;'><div style='border-top: 1px solid Black; width: " . (-$left-2) . "px;'></div></div>\n";
|
||||
echo "<div style='left: " . ($left+1) . "px; top: $pos2" . "em; width: " . (-$left-2) . "px; height: 1.25em; background: url(arrow.gif) no-repeat right center;'><div style='height: .5em; border-bottom: 1px solid Black; width: " . (-$left-14) . "px;'></div></div>\n";
|
||||
}
|
||||
echo "<div style='left: $left" . "px; top: $min_pos" . "em; padding: .5em 0;' /><div style='border-right: 1px solid Black; height: " . ($max_pos - $min_pos) . "em;'></div></div>\n";
|
||||
$left -= 2;
|
||||
echo "<div class='references' style='left: $left" . "px; top: $min_pos" . "em; padding: .5em 0;' /><div style='border-right: 1px solid Black; height: " . ($max_pos - $min_pos) . "em;'></div></div>\n";
|
||||
}
|
||||
}
|
||||
}
|
||||
//! JavaScript for dragging tables
|
||||
?>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue