Forgot a console.log() in history-widget.js.

Updated view header to look like James' new design.

git-svn-id: http://google-refine.googlecode.com/svn/trunk@467 7d457c2a-affb-35e4-300a-418c747d4874

src/main/webapp/scripts/views/data-table-view.js

@@ -8,7 +8,7 @@ function DataTableView(div) {
 }
 
 DataTableView.prototype.resize = function() {
-    var topHeight = this._div.find(".viewPanel-summary").outerHeight(true) + this._div.find(".viewPanel-pagingControls").outerHeight(true);
+    var topHeight = this._div.find(".viewPanel-header").outerHeight(true);
     
     this._div.find(".data-table-container")
         .css("height", (this._div.innerHeight() - topHeight - 1) + "px")
@@ -26,14 +26,19 @@ DataTableView.prototype.render = function() {
     var scrollLeft = (oldTableDiv.length > 0) ? oldTableDiv[0].scrollLeft : 0;
     
     var html = $(
-        '<div bind="summaryDiv" class="viewPanel-summary"></div>' +
+        '<table class="viewPanel-header">' +
-        '<table bind="pagingControls" width="100%" class="viewPanel-pagingControls"><tr><td align="right"></td><td align="right"></td></tr></table>' +
+            '<tr>' +
+                '<td bind="summary"></td>' +
+                '<td bind="pageSizeControls" align="right"></td>' +
+                '<td bind="pagingControls" align="right"></td>' +
+            '</tr>' +
+        '</table>' +
         '<div bind="dataTableContainer" class="data-table-container" style="display: none;"><table bind="table" class="data-table" cellspacing="0"></table></div>'
     );
     var elmts = DOM.bind(html);
     
-    this._renderSummaryText(elmts.summaryDiv);
+    this._renderSummaryText(elmts.summary);
-    this._renderPagingControls(elmts.pagingControls[0]);
+    this._renderPagingControls(elmts.pageSizeControls, elmts.pagingControls);
     this._renderDataTable(elmts.table[0]);
     
     this._div.empty().append(html);
@@ -57,14 +62,11 @@ DataTableView.prototype._renderSummaryText = function(elmt) {
     $('<span>').html(summaryText).appendTo(elmt);
 };
 
-DataTableView.prototype._renderPagingControls = function(table) {
+DataTableView.prototype._renderPagingControls = function(pageSizeControls, pagingControls) {
     var self = this;
     
-    var pagingControls0 = table.rows[0].cells[0];
+    var firstPage = $('<a href="javascript:{}">&laquo; first</a>').appendTo(pagingControls);
-    var pagingControls1 = table.rows[0].cells[1];
+    var previousPage = $('<a href="javascript:{}">&laquo; previous</a>').appendTo(pagingControls);
-    
-    var firstPage = $('<a href="javascript:{}">&laquo; first</a>').appendTo(pagingControls0);
-    var previousPage = $('<a href="javascript:{}">&laquo; previous</a>').appendTo(pagingControls0);
     if (theProject.rowModel.start > 0) {
         firstPage.addClass("action").click(function(evt) { self._onClickFirstPage(this, evt); });
         previousPage.addClass("action").click(function(evt) { self._onClickPreviousPage(this, evt); });
@@ -72,9 +74,9 @@ DataTableView.prototype._renderPagingControls = function(table) {
         firstPage.addClass("inaction");
         previousPage.addClass("inaction");
     }
-    $('<span> &bull; </span>').appendTo(pagingControls0);
+    $('<span> &bull; </span>').appendTo(pagingControls);
-    var nextPage = $('<a href="javascript:{}">next page &raquo;</a>').appendTo(pagingControls0);
+    var nextPage = $('<a href="javascript:{}">next page &raquo;</a>').appendTo(pagingControls);
-    var lastPage = $('<a href="javascript:{}">last &raquo;</a>').appendTo(pagingControls0);
+    var lastPage = $('<a href="javascript:{}">last &raquo;</a>').appendTo(pagingControls);
     if (theProject.rowModel.start + theProject.rowModel.limit < theProject.rowModel.filtered) {
         nextPage.addClass("action").click(function(evt) { self._onClickNextPage(this, evt); });
         lastPage.addClass("action").click(function(evt) { self._onClickLastPage(this, evt); });
@@ -83,11 +85,11 @@ DataTableView.prototype._renderPagingControls = function(table) {
         lastPage.addClass("inaction");
     }
     
-    $('<span>page size: </span>').appendTo(pagingControls1);
+    $('<span>Show </span>').appendTo(pageSizeControls);
-    var sizes = [ 5, 10, 15, 20, 25, 50 ];
+    var sizes = [ 10, 20, 25, 50 ];
     var renderPageSize = function(index) {
         var pageSize = sizes[index];
-        var a = $('<a href="javascript:{}"></a>').appendTo(pagingControls1);
+        var a = $('<a href="javascript:{}"></a>').appendTo(pageSizeControls);
         if (pageSize == self._pageSize) {
             a.text("[" + pageSize + "]").addClass("inaction");
         } else {
@@ -100,6 +102,7 @@ DataTableView.prototype._renderPagingControls = function(table) {
     for (var i = 0; i < sizes.length; i++) {
         renderPageSize(i);
     }
+    $('<span> rows</span>').appendTo(pageSizeControls);
 };
 
 DataTableView.prototype._renderDataTable = function(table) {

src/main/webapp/scripts/widgets/history-widget.js

@@ -7,7 +7,7 @@ function HistoryWidget(div, tabHeader) {
 HistoryWidget.prototype.resize = function() {
     var body = this._div.find(".history-panel-body");
     var footer = this._div.find(".history-panel-footer");
-    console.log(this._div.height());
+    
     body.css("height", (this._div.height() - footer.innerHeight(true)) + "px");
 };
 

src/main/webapp/styles/views/data-table-view.css

@@ -81,19 +81,16 @@ a.column-header-menu:hover {
 }
 
 
-.viewPanel-summary {
-    margin: 1em 2em 0em 2em;
-}
 .viewPanel-summary-row-count {
     font-size: 150%;
     font-weight: bold;
 }
-
+table.viewPanel-header {
-.viewPanel-pagingControls {
+    border-collapse: collapse;
-    text-align: center;
+    width: 100%;
 }
-.viewPanel-pagingControls td {
+table.viewPanel-header td {
-    padding: 1em 2em;
+    padding: 1em 1em 1em 0;
 }
 
 div.data-table-cell-content {