Added "reset" and "remove" links to facet panel.

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

src/main/webapp/scripts/facets/list-facet.js

@@ -20,6 +20,12 @@ ListFacet.reconstruct = function(div, uiState) {
     return new ListFacet(div, uiState.c, uiState.o, uiState.s);
 };
 
+ListFacet.prototype.reset = function() {
+    this._selection = [];
+    this._blankChoice = null;
+    this._errorChoice = null;
+};
+
 ListFacet.prototype.getUIState = function() {
     var json = {
         c: this.getJSON(),

src/main/webapp/scripts/facets/range-facet.js

@@ -20,23 +20,28 @@ function RangeFacet(div, config, options) {
     this._initializedUI = false;
 }
 
-RangeFacet.prototype._setDefaults = function() {
+RangeFacet.prototype.reset = function() {
     switch (this._config.mode) {
     case "min":
         this._from = this._config.min;
+        this._sliderDiv.slider("value", this._from);
         break;
     case "max":
         this._to = this._config.max;
+        this._sliderDiv.slider("value", this._to);
         break;
     default:
         this._from = this._config.min;
         this._to = this._config.max;
+        this._sliderDiv.slider("values", 0, this._from);
+        this._sliderDiv.slider("values", 1, this._to);
     }
-    
     this._selectNumeric = true;
     this._selectNonNumeric = true;
     this._selectBlank = true;
     this._selectError = true;
+    
+    this._setRangeIndicators();
 };
 
 RangeFacet.reconstruct = function(div, uiState) {
@@ -104,27 +109,7 @@ RangeFacet.prototype._initializeUI = function() {
     $('<span></span>').text(this._config.name).appendTo(headerDiv);
     
     var resetButton = $('<a href="javascript:{}"></a>').addClass("facet-choice-link").text("reset").click(function() {
-        switch (self._config.mode) {
+        self.reset();
-        case "min":
-            self._from = self._config.min;
-            self._sliderDiv.slider("value", self._from);
-            break;
-        case "max":
-            self._to = self._config.max;
-            self._sliderDiv.slider("value", self._to);
-            break;
-        default:
-            self._from = self._config.min;
-            self._to = self._config.max;
-            self._sliderDiv.slider("values", 0, self._from);
-            self._sliderDiv.slider("values", 1, self._to);
-        }
-        self._selectNumeric = true;
-        self._selectNonNumeric = true;
-        self._selectBlank = true;
-        self._selectError = true;
-        
-        self._setRangeIndicators();
         self._updateRest();
     }).prependTo(headerDiv);
     
@@ -355,11 +340,6 @@ RangeFacet.prototype.render = function() {
     this._renderOtherChoices();
 };
 
-RangeFacet.prototype._reset = function() {
-    this._setDefaults();
-    this._updateRest();
-};
-
 RangeFacet.prototype._remove = function() {
     ui.browsingEngine.removeFacet(this);
     

src/main/webapp/scripts/facets/text-search-facet.js

@@ -13,6 +13,11 @@ TextSearchFacet.reconstruct = function(div, uiState) {
     return new TextSearchFacet(div, uiState.c, uiState.o);
 };
 
+TextSearchFacet.prototype.reset = function() {
+    this._query = null;
+    this._div.find(".input-container input").each(function() { this.value = ""; });
+};
+
 TextSearchFacet.prototype.getUIState = function() {
     var json = {
         c: this.getJSON(),

src/main/webapp/scripts/project/browsing-engine.js

@@ -44,10 +44,16 @@ BrowsingEngine.prototype._initializeUI = function() {
     var self = this;
     
     this._div.html(
-        '<div class="browsing-panel-indicator" bind="indicator"><img src="images/small-spinner.gif" /> refreshing facets ...</div>' +
+        '<div class="browsing-panel-header">' +
-        '<div class="browsing-panel-controls" bind="controls">' +
+            '<div class="browsing-panel-indicator" bind="indicator"><img src="images/small-spinner.gif" /> refreshing facets ...</div>' +
-            '<input type="checkbox" bind="includeDependentRowsCheck" /> show dependent rows &bull; ' +
+            '<div class="browsing-panel-controls" bind="controls">' +
-            '<a href="javascript:{}" bind="refreshLink">refresh</a></div>' +
+                '<p>' +
+                    '<a href="javascript:{}" bind="refreshLink" title="Make sure all facets are up-to-date">refresh</a> &bull; ' +
+                    '<a href="javascript:{}" bind="resetLink" title="Clear selection in all facets">reset</a> &bull; ' +
+                    '<a href="javascript:{}" bind="removeLink" title="Remove all facets">remove</a> all facets' +
+                '</p>' +
+                '<p><input type="checkbox" class="inline" bind="includeDependentRowsCheck" /> show dependent rows</p>' +
+            '</div>' +
         '</div>' +
         '<ul bind="facets" class="facets-container"></ul>'
     );
@@ -65,6 +71,8 @@ BrowsingEngine.prototype._initializeUI = function() {
     });
     
     this._elmts.refreshLink.click(function() { self.update(); });
+    this._elmts.resetLink.click(function() { self.reset(); });
+    this._elmts.removeLink.click(function() { self.remove(); });
 };
 
 BrowsingEngine.prototype._updateFacetOrder = function() {
@@ -170,3 +178,28 @@ BrowsingEngine.prototype.update = function(onDone) {
         "json"
     );
 };
+
+BrowsingEngine.prototype.reset = function() {
+    for (var i = 0; i < this._facets.length; i++) {
+        this._facets[i].facet.reset();
+    }
+    
+    Gridworks.update({ engineChanged: true });
+};
+
+BrowsingEngine.prototype.remove = function() {
+    var oldFacets = this._facets;
+    
+    this._facets = [];
+    
+    for (var i = 0; i < oldFacets.length; i++) {
+        oldFacets[i].elmt.hide();
+    }
+    window.setTimeout(function() {
+        for (var i = 0; i < oldFacets.length; i++) {
+            oldFacets[i].elmt.remove();
+        }
+    }, 300);
+    
+    Gridworks.update({ engineChanged: true });
+};

src/main/webapp/styles/common.css

@@ -74,6 +74,9 @@ div.grid-layout.layout-looser > table {
 input[type="checkbox"], input[type="radio"] {
     vertical-align: baseline;
 }
+input.inline {
+    vertical-align: middle;
+}
 
 div.input-container {
     padding: 3px;

src/main/webapp/styles/project/browsing.css

@@ -1,14 +1,15 @@
-.browsing-panel-indicator {
+.browsing-panel-header {
-    display: none;
     margin: 0 1em;
     margin-top: 50px;
+    height: 5em;
     text-align: center;
 }
+
+.browsing-panel-indicator {
+    display: none;
+}
 .browsing-panel-controls {
     display: none;
-    margin: 0 1em;
-    margin-top: 50px;
-    text-align: center;
 }
 
 ul.facets-container {