diff --git a/src/main/java/com/metaweb/gridworks/model/Project.java b/src/main/java/com/metaweb/gridworks/model/Project.java index 776790ae7..15e40f322 100644 --- a/src/main/java/com/metaweb/gridworks/model/Project.java +++ b/src/main/java/com/metaweb/gridworks/model/Project.java @@ -81,6 +81,7 @@ public class Project implements Serializable { lastNonBlankRowsByGroup[i] = -1; } + int recordIndex = 0; for (int r = 0; r < rows.size(); r++) { Row row = rows.get(r); row.contextRowSlots = null; @@ -109,6 +110,7 @@ public class Project implements Serializable { } if (row.contextRowSlots != null) { + row.recordIndex = -1; row.contextRows = new ArrayList(); for (int index : row.contextRowSlots) { if (index >= 0) { @@ -116,6 +118,8 @@ public class Project implements Serializable { } } Collections.sort(row.contextRows); + } else { + row.recordIndex = recordIndex++; } } } diff --git a/src/main/java/com/metaweb/gridworks/model/Row.java b/src/main/java/com/metaweb/gridworks/model/Row.java index 2d1c24341..458db850c 100644 --- a/src/main/java/com/metaweb/gridworks/model/Row.java +++ b/src/main/java/com/metaweb/gridworks/model/Row.java @@ -18,6 +18,7 @@ public class Row implements Serializable, HasFields, Jsonizable { public boolean starred; final public List cells; + transient public int recordIndex; // -1 for rows that are not main record rows transient public List contextRows; transient public int[] contextRowSlots; transient public int[] contextCellSlots; @@ -123,6 +124,10 @@ public class Row implements Serializable, HasFields, Jsonizable { } writer.endArray(); + if (recordIndex >= 0) { + writer.key("j"); writer.value(recordIndex); + } + if (options.containsKey("rowIndex")) { writer.key("i"); writer.value(options.get("rowIndex")); } diff --git a/src/main/webapp/scripts/project/data-table-cell-ui.js b/src/main/webapp/scripts/project/data-table-cell-ui.js index b5f9539da..f6b5c29b1 100644 --- a/src/main/webapp/scripts/project/data-table-cell-ui.js +++ b/src/main/webapp/scripts/project/data-table-cell-ui.js @@ -11,26 +11,27 @@ function DataTableCellUI(dataTableView, cell, rowIndex, cellIndex, td) { DataTableCellUI.prototype._render = function() { var self = this; var cell = this._cell; - var td = this._td; - $(td).empty(); + $(this._td).empty(); + var divContent = $('
').appendTo(this._td); if (cell == null || cell.v == null) { + $(divContent).html(" "); // TODO: content editing UI return; } if (!("r" in cell) || cell.r == null) { - $(td).html(cell.v); + $(divContent).html(cell.v); } else { var r = cell.r; if (r.j == "new") { - $(td).html(cell.v + " (new topic)"); + $(divContent).html(cell.v + " (new topic)"); - $(' ').appendTo(td); + $(' ').appendTo(divContent); $('re-match') .addClass("data-table-recon-action") - .appendTo(td).click(function(evt) { + .appendTo(divContent).click(function(evt) { self._doRematch(); }); } else if (r.j == "matched" && "m" in r && r.m != null) { @@ -39,26 +40,26 @@ DataTableCellUI.prototype._render = function() { .attr("href", "http://www.freebase.com/view" + match.id) .attr("target", "_blank") .text(match.name) - .appendTo(td); + .appendTo(divContent); - $(' ').appendTo(td); + $(' ').appendTo(divContent); $('re-match') .addClass("data-table-recon-action") - .appendTo(td).click(function(evt) { + .appendTo(divContent).click(function(evt) { self._doRematch(); }); } else { - $(td).html(cell.v); - $(' ').appendTo(td); + $(divContent).html(cell.v); + $(' ').appendTo(divContent); $('mark as new') .addClass("data-table-recon-action") - .appendTo(td).click(function(evt) { + .appendTo(divContent).click(function(evt) { self._doMarkAsNew(); }); if (this._dataTableView._showRecon && "c" in r && r.c.length > 0) { var candidates = r.c; - var ul = $('
    ').addClass("data-table-recon-candidates").appendTo(td); + var ul = $('
      ').addClass("data-table-recon-candidates").appendTo(divContent); var renderCandidate = function(candidate, index) { var li = $('
    • ').appendTo(ul); $('') diff --git a/src/main/webapp/scripts/project/data-table-view.js b/src/main/webapp/scripts/project/data-table-view.js index 588d14ff6..5c62b63b2 100644 --- a/src/main/webapp/scripts/project/data-table-view.js +++ b/src/main/webapp/scripts/project/data-table-view.js @@ -79,11 +79,16 @@ DataTableView.prototype.render = function() { * Data Table *============================================================ */ - var tableDiv = $('
      ').addClass("data-table-container").css("width", container.width() + "px").appendTo(container); + var tableDiv = $('
      ') + .addClass("data-table-container") + .css("width", container.width() + "px") + .appendTo(container); var table = document.createElement("table"); - table.className = "data-table"; - tableDiv.append(table); + $(table) + .attr("cellspacing", "0") + .addClass("data-table") + .appendTo(tableDiv); var columns = theProject.columnModel.columns; var columnGroups = theProject.columnModel.columnGroups; @@ -192,19 +197,28 @@ DataTableView.prototype.render = function() { */ var rows = theProject.rowModel.rows; + var even = true; for (var r = 0; r < rows.length; r++) { var row = rows[r]; var cells = row.cells; var tr = table.insertRow(table.rows.length); - tr.className = (r % 2) == 1 ? "odd" : "even"; + + var td = tr.insertCell(tr.cells.length); + if ("j" in row) { + even = !even; + + $(tr).addClass("record"); + $('
      ').html((row.j + 1) + ".").appendTo(td); + } else { + $('
      ').html(" ").appendTo(td); + } if ("contextual" in row && row.contextual) { $(tr).addClass("contextual"); } - var td = tr.insertCell(tr.cells.length); - $(td).html((row.i + 1) + "."); + $(tr).addClass(even ? "even" : "odd"); for (var i = 0; i < columns.length; i++) { var column = columns[i]; diff --git a/src/main/webapp/styles/data-table-view.css b/src/main/webapp/styles/data-table-view.css index 5191808e2..e5c4fa410 100644 --- a/src/main/webapp/styles/data-table-view.css +++ b/src/main/webapp/styles/data-table-view.css @@ -3,19 +3,28 @@ overflow-x: auto; } -table.data-table td { +table.data-table { +} + +table.data-table > tbody > tr > td { padding: 2px 5px; + border-top: 1px solid white; + border-right: 1px solid white; } -table.data-table tr.odd { +table.data-table > tbody > tr.odd > td { + border-top: 1px solid #ddd; } -table.data-table tr.even { - background: #eee; +table.data-table > tbody > tr.even > td { + background: #ddd; } -table.data-table tr.contextual { - opacity: 0.2; +table.data-table > tbody > tr.contextual > td > div { + opacity: 0.3; +} + +table.data-table > tbody > tr.record.contextual > td { } table.data-table td.column-header {