A bit more prep work on rendering protograph nodes.
git-svn-id: http://google-refine.googlecode.com/svn/trunk@78 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
parent
f8a1daba62
commit
c73ec864db
@ -91,10 +91,10 @@ SchemaAlignment._cleanName = function(s) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function SchemaAlignmentDialog(protograph) {
|
function SchemaAlignmentDialog(protograph) {
|
||||||
var protograph = {
|
this._originalProtograph = {
|
||||||
rootNodes: [
|
rootNodes: [
|
||||||
{
|
{
|
||||||
nodeType: "existing",
|
nodeType: "cell-as-topic",
|
||||||
column: "name",
|
column: "name",
|
||||||
linkages: [
|
linkages: [
|
||||||
]
|
]
|
||||||
@ -138,4 +138,94 @@ SchemaAlignmentDialog.prototype._renderBody = function(body) {
|
|||||||
var self = this;
|
var self = this;
|
||||||
|
|
||||||
this._canvas = $('<div></div>').addClass("schema-alignment-dialog-canvas").appendTo(body);
|
this._canvas = $('<div></div>').addClass("schema-alignment-dialog-canvas").appendTo(body);
|
||||||
|
this._nodeTable = $('<table></table>').appendTo(this._canvas)[0];
|
||||||
|
|
||||||
|
for (var i = 0; i < this._originalProtograph.rootNodes.length; i++) {
|
||||||
|
new SchemaAlignmentDialog.UINode(
|
||||||
|
this._originalProtograph.rootNodes[i],
|
||||||
|
this._nodeTable,
|
||||||
|
true
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode = function(node, table, expanded) {
|
||||||
|
this._originalNode = node;
|
||||||
|
this._newNode = {
|
||||||
|
nodeType: node.nodeType
|
||||||
|
};
|
||||||
|
this._detailsRendered = false;
|
||||||
|
|
||||||
|
this._tr = table.insertRow(table.rows.length);
|
||||||
|
this._tdMain = this._tr.insertCell(0);
|
||||||
|
this._tdToggle = this._tr.insertCell(1);
|
||||||
|
this._tdDetails = this._tr.insertCell(2);
|
||||||
|
|
||||||
|
$(this._tdMain).addClass("schema-alignment-node-main").attr("width", "250");
|
||||||
|
$(this._tdToggle).addClass("schema-alignment-node-toggle").attr("width", "1%").hide();
|
||||||
|
$(this._tdDetails).addClass("schema-alignment-node-details").attr("width", "90%").hide();
|
||||||
|
|
||||||
|
this._renderMain();
|
||||||
|
|
||||||
|
this._expanded = expanded;
|
||||||
|
if (this._isExpandable()) {
|
||||||
|
this._showExpandable();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode.prototype._isExpandable = function() {
|
||||||
|
return this._newNode.nodeType != "existing-content" && this._newNode.nodeType != "cell-as-content";
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode.prototype._renderMain = function() {
|
||||||
|
$(this._tdMain).empty().html(this._newNode.nodeType);
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode.prototype._showExpandable = function() {
|
||||||
|
$(this._tdToggle).show();
|
||||||
|
$(this._tdDetails).show();
|
||||||
|
|
||||||
|
if (this._detailsRendered) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this._detailsRendered = true;
|
||||||
|
|
||||||
|
this._collapsedDetailDiv = $('<div></div>').appendTo(this._tdDetails).html("...");
|
||||||
|
this._expandedDetailDiv = $('<div></div>').appendTo(this._tdDetails).html("details");
|
||||||
|
|
||||||
|
this._renderDetails();
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
var show = function() {
|
||||||
|
if (self._expanded) {
|
||||||
|
self._collapsedDetailDiv.hide();
|
||||||
|
self._expandedDetailDiv.show();
|
||||||
|
} else {
|
||||||
|
self._collapsedDetailDiv.show();
|
||||||
|
self._expandedDetailDiv.hide();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
show();
|
||||||
|
|
||||||
|
$(this._tdToggle).html(" ");
|
||||||
|
|
||||||
|
$('<img />')
|
||||||
|
.attr("src", this._expanded ? "images/down-arrow.png" : "images/right-arrow.png")
|
||||||
|
.appendTo(this._tdToggle)
|
||||||
|
.click(function() {
|
||||||
|
self._expanded = !self._expanded;
|
||||||
|
|
||||||
|
$(this).attr("src", self._expanded ? "images/down-arrow.png" : "images/right-arrow.png");
|
||||||
|
|
||||||
|
show();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode.prototype._hideExpandable = function() {
|
||||||
|
$(this._tdToggle).hide();
|
||||||
|
$(this._tdDetails).hide();
|
||||||
|
};
|
||||||
|
|
||||||
|
SchemaAlignmentDialog.UINode.prototype._renderDetails = function() {
|
||||||
|
var tableDetails = $('<table></table>').appendTo(this._tdDetails)[0];
|
||||||
};
|
};
|
||||||
|
@ -3,3 +3,24 @@
|
|||||||
overflow: auto;
|
overflow: auto;
|
||||||
border: 1px solid #aaa;
|
border: 1px solid #aaa;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
td.schema-alignment-node-main {
|
||||||
|
white-space: pre;
|
||||||
|
width: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.schema-alignment-node-toggle {
|
||||||
|
white-space: pre;
|
||||||
|
width: 1%;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.schema-alignment-node-toggle img {
|
||||||
|
cursor: pointer;
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.schema-alignment-node-details {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user