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:
David Huynh 2010-02-09 06:46:40 +00:00
parent f8a1daba62
commit c73ec864db
2 changed files with 114 additions and 3 deletions

View File

@ -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("&nbsp;");
$('<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];
}; };

View File

@ -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%;
}