s434730/RandomSec
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Started client-side scaffolding for faceted browsing.

Browse Source 
git-svn-id: http://google-refine.googlecode.com/svn/trunk@12 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
David Huynh 2010-01-29 00:46:15 +00:00
parent e0365f45c8
commit dce2ec71aa
5 changed files with 49 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/main/java/com/metaweb/gridlock/commands/GetRowsCommand.java
View File

@ -20,7 +20,7 @@ import com.metaweb.gridlock.model.Row;
public class GetRowsCommand extends Command { public class GetRowsCommand extends Command {
@Override @Override
public void doGet(HttpServletRequest request, HttpServletResponse response) public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { throws ServletException, IOException {
try { try {
@ -47,9 +47,11 @@ public class GetRowsCommand extends Command {
} }
@Override @Override
public void internalVisit(Row row) { public void internalVisit(int rowIndex, Row row) {
try { try {
list.add(row.getJSON(options)); JSONObject ro = row.getJSON(options);
ro.put("i", rowIndex);
list.add(ro);
} catch (JSONException e) { } catch (JSONException e) {
} }
} }
@ -86,12 +88,12 @@ public class GetRowsCommand extends Command {
@Override @Override
public void visit(int rowIndex, Row row) { public void visit(int rowIndex, Row row) {
if (total >= start && total < start + limit) { if (total >= start && total < start + limit) {
internalVisit(row); internalVisit(rowIndex, row);
} }
total++; total++;
} }
protected void internalVisit(Row row) { protected void internalVisit(int rowIndex, Row row) {
} }
} }
} }

2
src/main/webapp/project.html
View File

@ -1 +1 @@
<html> <head> <title>Gridlock</title> <link rel="stylesheet" href="/styles/common.css" /> <link rel="stylesheet" href="/styles/project.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="text/javascript" src="scripts/util/url.js"></script> <script type="text/javascript" src="scripts/util/string.js"></script> <script type="text/javascript" src="scripts/util/ajax.js"></script> <script type="text/javascript" src="scripts/util/menu.js"></script> <script type="text/javascript" src="scripts/project.js"></script> <script type="text/javascript" src="scripts/project/data-table-view.js"></script> <script type="text/javascript" src="scripts/project/history-widget.js"></script> </head> <body> <div id="header"> <h1 id="title">Gridlock</h1> </div> <div id="body"> Loading ... </div> </body> </html> <html> <head> <title>Gridlock</title> <link rel="stylesheet" href="/styles/common.css" /> <link rel="stylesheet" href="/styles/project.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="text/javascript" src="scripts/util/url.js"></script> <script type="text/javascript" src="scripts/util/string.js"></script> <script type="text/javascript" src="scripts/util/ajax.js"></script> <script type="text/javascript" src="scripts/util/menu.js"></script> <script type="text/javascript" src="scripts/project.js"></script> <script type="text/javascript" src="scripts/project/browsing-engine.js"></script> <script type="text/javascript" src="scripts/project/data-table-view.js"></script> <script type="text/javascript" src="scripts/project/history-widget.js"></script> </head> <body> <div id="header"> <h1 id="title">Gridlock</h1> </div> <div id="body"> Loading ... </div> </body> </html>

12
src/main/webapp/scripts/project.js
View File

@ -5,10 +5,7 @@ function onLoad() {
var params = URL.getParameters(); var params = URL.getParameters();
if ("project" in params) { if ("project" in params) {
theProject = { theProject = {
id: parseInt(params.project), id: parseInt(params.project)
view: {
pageSize: 25
}
}; };
Ajax.chainGetJSON( Ajax.chainGetJSON(
@ -23,10 +20,6 @@ function onLoad() {
theProject.columnModel.columns[i].collapsed = false; theProject.columnModel.columns[i].collapsed = false;
} }
}, },
"/command/get-rows?" + $.param({ project: theProject.id, start: 0, limit: 25 }), null,
function(data) {
theProject.rowModel = data;
},
function() { function() {
initializeUI(); initializeUI();
} }
@ -56,6 +49,7 @@ function initializeUI() {
ui.facetPanel = $('<div></div>').appendTo(tdRight); ui.facetPanel = $('<div></div>').appendTo(tdRight);
ui.historyPanel = $('<div></div>').addClass("history-panel").appendTo(document.body); ui.historyPanel = $('<div></div>').addClass("history-panel").appendTo(document.body);
ui.dataTableView = new DataTableView(ui.viewPanel); ui.browsingEngine = new BrowsingEngine(ui.facetPanel);
ui.historyWidget = new HistoryWidget(ui.historyPanel); ui.historyWidget = new HistoryWidget(ui.historyPanel);
ui.dataTableView = new DataTableView(ui.viewPanel);
} }

19
src/main/webapp/scripts/project/browsing-engine.js Normal file
View File

@ -0,0 +1,19 @@
function BrowsingEngine(div) {
this._div = div;
this.render();
this._facets = [];
}
BrowsingEngine.prototype.render = function() {
var self = this;
var container = this._div.empty();
};
BrowsingEngine.prototype.getJSON = function() {
var a = { facets: [] };
for (var i = 0; i < this._facets.length; i++) {
a.facets.push(this._facets[i].getJSON());
}
return a;
};

28
src/main/webapp/scripts/project/data-table-view.js
View File

@ -1,6 +1,7 @@
function DataTableView(div) { function DataTableView(div) {
this._div = div; this._div = div;
this.render(); this._pageSize = 20;
this._showRows(0);
} }
DataTableView.prototype.render = function() { DataTableView.prototype.render = function() {
@ -11,8 +12,8 @@ DataTableView.prototype.render = function() {
$('<span>' + $('<span>' +
(theProject.rowModel.start + 1) + " to " + (theProject.rowModel.start + 1) + " to " +
(theProject.rowModel.start + theProject.rowModel.limit) + " of " + (theProject.rowModel.start + theProject.rowModel.limit) + " of " +
(theProject.rowModel.total) + (theProject.rowModel.filtered) + " filtered rows, " +
" rows total" + (theProject.rowModel.total) + " total rows" +
'</span>' '</span>'
).appendTo(divSummary); ).appendTo(divSummary);
@ -88,7 +89,7 @@ DataTableView.prototype.render = function() {
tr.className = (r % 2) == 1 ? "odd" : "even"; tr.className = (r % 2) == 1 ? "odd" : "even";
var td = tr.insertCell(tr.cells.length); var td = tr.insertCell(tr.cells.length);
$(td).html((theProject.rowModel.start + r + 1) + "."); $(td).html((row.i + 1) + ".");
for (var i = 0; i < columns.length; i++) { for (var i = 0; i < columns.length; i++) {
var column = columns[i]; var column = columns[i];
@ -107,29 +108,36 @@ DataTableView.prototype.render = function() {
DataTableView.prototype._showRows = function(start, onDone) { DataTableView.prototype._showRows = function(start, onDone) {
var self = this; var self = this;
Ajax.chainGetJSON(
"/command/get-rows?" + $.param({ project: theProject.id, start: start, limit: theProject.view.pageSize }), null, $.post(
"/command/get-rows?" + $.param({ project: theProject.id, start: start, limit: this._pageSize }),
{ engine: JSON.stringify(ui.browsingEngine.getJSON()) },
function(data) { function(data) {
theProject.rowModel = data; theProject.rowModel = data;
self.render(); self.render();
if (onDone) {
onDone();
} }
},
"json"
); );
}; };
DataTableView.prototype._onClickPreviousPage = function(elmt, evt) { DataTableView.prototype._onClickPreviousPage = function(elmt, evt) {
this._showRows(theProject.rowModel.start - theProject.view.pageSize); this._showRows(theProject.rowModel.start - this._pageSize);
}; };
DataTableView.prototype._onClickNextPage = function(elmt, evt) { DataTableView.prototype._onClickNextPage = function(elmt, evt) {
this._showRows(theProject.rowModel.start + theProject.view.pageSize); this._showRows(theProject.rowModel.start + this._pageSize);
}; };
DataTableView.prototype._onClickFirstPage = function(elmt, evt) { DataTableView.prototype._onClickFirstPage = function(elmt, evt) {
this._showRows(0, theProject.view.pageSize); this._showRows(0);
}; };
DataTableView.prototype._onClickLastPage = function(elmt, evt) { DataTableView.prototype._onClickLastPage = function(elmt, evt) {
this._showRows(Math.floor(theProject.rowModel.total / theProject.view.pageSize) * theProject.view.pageSize); this._showRows(Math.floor(theProject.rowModel.total / this._pageSize) * this._pageSize);
}; };
DataTableView.prototype._createMenuForAllColumns = function(elmt) { DataTableView.prototype._createMenuForAllColumns = function(elmt) {