diff --git a/src/main/webapp/project.html b/src/main/webapp/project.html index df3c319da..37f491c75 100644 --- a/src/main/webapp/project.html +++ b/src/main/webapp/project.html @@ -1,2 +1,2 @@ - Gridworks -
starting up ...
\ No newline at end of file + Gridworks +
starting up ...
\ No newline at end of file diff --git a/src/main/webapp/scripts/dialogs/facet-based-edit-dialog.js b/src/main/webapp/scripts/dialogs/facet-based-edit-dialog.js new file mode 100644 index 000000000..52e700fad --- /dev/null +++ b/src/main/webapp/scripts/dialogs/facet-based-edit-dialog.js @@ -0,0 +1,147 @@ +function FacetBasedEditDialog(columnName, entries) { + this._columnName = columnName; + this._entries = entries; + + this._createDialog(); + this._cluster(); +} + +FacetBasedEditDialog.prototype._createDialog = function() { + var self = this; + var frame = DialogSystem.createDialog(); + frame.width("800px"); + + var header = $('
').addClass("dialog-header").text("Facet-based edit of column " + this._columnName).appendTo(frame); + var body = $('
').addClass("dialog-body").appendTo(frame); + var footer = $('
').addClass("dialog-footer").appendTo(frame); + + var html = $( + '
' + + '
' + + '
' + + ' ' + + ' ' + + '
' + + '
' + ).appendTo(body); + + this._elmts = DOM.bind(html); + this._elmts.clusterButton.click(function() { self._cluster(); }); + this._elmts.unclusterButton.click(function() { self._uncluster(); }); + + $('').text("OK").click(function() { self._onOK(); }).appendTo(footer); + $('').text("Cancel").click(function() { self._dismiss(); }).appendTo(footer); + + this._level = DialogSystem.showDialog(frame); + + $("#recon-dialog-tabs").tabs(); + $("#recon-dialog-tabs-strict").css("display", ""); +}; + +FacetBasedEditDialog.prototype._renderTable = function() { + var self = this; + var container = this._elmts.tableContainer.empty(); + + var table = $('
').addClass("facet-based-edit-dialog-entry-table").appendTo(container)[0]; + + var trHead = table.insertRow(table.rows.length); + trHead.className = "header"; + $(trHead.insertCell(0)).text("Current facet choices"); + $(trHead.insertCell(1)).text("Edit?"); + $(trHead.insertCell(2)).text("New cell value"); + + var renderCluster = function(cluster) { + var tr = table.insertRow(table.rows.length); + tr.className = table.rows.length % 2 == 0 ? "odd" : "even"; + + var ul = $(tr.insertCell(0)); + var choices = cluster.choices; + for (var c = 0; c < choices.length; c++) { + var choice = choices[c]; + var li = $('
  • ').appendTo(ul); + $('').text(choice.v.l).appendTo(li); + $('').text(" (" + choice.c + ")").appendTo(li); + } + + var editCheck = $('') + .appendTo(tr.insertCell(1)) + .click(function() { + cluster.edit = !cluster.edit; + }); + if (cluster.edit) { + editCheck.attr("checked", "true"); + } + + var input = $('') + .attr("value", cluster.value) + .appendTo(tr.insertCell(2)) + .keyup(function() { + cluster.value = this.value; + }); + }; + for (var i = 0; i < this._clusters.length; i++) { + renderCluster(this._clusters[i]); + } +}; + +FacetBasedEditDialog.prototype._onOK = function() { +}; + +FacetBasedEditDialog.prototype._dismiss = function() { + DialogSystem.dismissUntil(this._level - 1); +}; + +FacetBasedEditDialog.prototype._cluster = function() { + var clusters = []; + var map = {}; + $.each(this._entries, function() { + var choice = { + v: this.v, + c: this.c + }; + + var s = this.v.l.toLowerCase().replace(/\W/g, ' ').replace(/\s+/g, ' ').split(" ").sort().join(" "); + if (s in map) { + map[s].choices.push(choice); + } else { + map[s] = { + edit: false, + choices: [ choice ] + }; + clusters.push(map[s]); + } + }); + + $.each(clusters, function() { + this.choices.sort(function(a, b) { + var c = b.c - a.c; + return c != 0 ? c : a.v.l.localeCompare(b.v.l); + }); + this.value = this.choices[0].v.l; + }); + clusters.sort(function(a, b) { + var c = b.choices.length - a.choices.length; + return c != 0 ? c : a.value.localeCompare(b.value); + }); + + this._clusters = clusters; + this._renderTable(); +}; + +FacetBasedEditDialog.prototype._uncluster = function() { + var clusters = []; + $.each(this._entries, function() { + var cluster = { + edit: false, + choices: [{ + v: this.v, + c: this.c + }], + value: this.v.l + }; + clusters.push(cluster); + }); + + this._clusters = clusters; + this._renderTable(); +}; diff --git a/src/main/webapp/scripts/facets/list-facet.js b/src/main/webapp/scripts/facets/list-facet.js index 8449380a8..e46d1f6ca 100644 --- a/src/main/webapp/scripts/facets/list-facet.js +++ b/src/main/webapp/scripts/facets/list-facet.js @@ -203,9 +203,26 @@ ListFacet.prototype.render = function() { self.render(); }).appendTo(footerDiv); } + + $('').html(" • ").appendTo(footerDiv); + $('').addClass("action").text("edit").click(function() { + self._doEdit(); + }).appendTo(footerDiv); } }; +ListFacet.prototype._doEdit = function() { + var entries = []; + for (var i = 0; i < this._data.choices.length; i++) { + var choice = this._data.choices[i]; + entries.push({ + v: choice.v, + c: choice.c + }); + } + new FacetBasedEditDialog(this._config.columnName, entries); +}; + ListFacet.prototype._select = function(choice, only) { if (only) { this._selection = []; diff --git a/src/main/webapp/scripts/util/dom.js b/src/main/webapp/scripts/util/dom.js index c7b373bac..0e397f67d 100644 --- a/src/main/webapp/scripts/util/dom.js +++ b/src/main/webapp/scripts/util/dom.js @@ -3,7 +3,9 @@ var DOM = {}; DOM.bind = function(elmt) { var map = {}; - DOM._bindDOMChildren(elmt[0], map); + for (var i = 0; i < elmt.length; i++) { + DOM._bindDOMElement(elmt[i], map); + } return map; }; diff --git a/src/main/webapp/styles/facet-based-edit-dialog.css b/src/main/webapp/styles/facet-based-edit-dialog.css new file mode 100644 index 000000000..4ac1561c5 --- /dev/null +++ b/src/main/webapp/styles/facet-based-edit-dialog.css @@ -0,0 +1,46 @@ +table.facet-based-edit-dialog-main-layout { + border-collapse: collapse; +} +table.facet-based-edit-dialog-main-layout > tbody > tr > td { + padding: 0px; + padding-right: 10px; + padding-bottom: 10px; +} +table.facet-based-edit-dialog-main-layout > tbody > tr > td:last-child { + padding-right: 0px; +} +table.facet-based-edit-dialog-main-layout > tbody > tr:last-child > td { + padding-bottom: 0px; +} + +.facet-based-edit-dialog-table-container { + height: 450px; + overflow: auto; + border: 1px solid #aaa; +} + +table.facet-based-edit-dialog-entry-table { + border-collapse: collapse; + width: 100%; +} + +table.facet-based-edit-dialog-entry-table > tbody > tr.header { + background: #ccc; + font-weight: bold; +} + +table.facet-based-edit-dialog-entry-table > tbody > tr > td { + padding: 2px 5px; +} + +table.facet-based-edit-dialog-entry-table > tbody > tr.odd > td { + background: #eee; +} + +table.facet-based-edit-dialog-entry-table > tbody > tr.even > td { + background: white; +} + +table.facet-based-edit-dialog-entry-table input { + border: none; +} \ No newline at end of file