From 9542c1f254889154a2d7ec9750f79d89b5560989 Mon Sep 17 00:00:00 2001
From: David Huynh <dfhuynh@gmail.com>
Date: Thu, 14 Oct 2010 19:23:21 +0000
Subject: [PATCH] Converted list facet's "sorted by name/count" from radio
 buttons to links.

git-svn-id: http://google-refine.googlecode.com/svn/trunk@1537 7d457c2a-affb-35e4-300a-418c747d4874
---
 .../modules/core/scripts/facets/list-facet.js    | 16 +++++++---------
 .../modules/core/styles/project/browsing.less    | 13 +++++++++++++
 2 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/main/webapp/modules/core/scripts/facets/list-facet.js b/main/webapp/modules/core/scripts/facets/list-facet.js
index 8c09394e5..b4f01f49c 100644
--- a/main/webapp/modules/core/scripts/facets/list-facet.js
+++ b/main/webapp/modules/core/scripts/facets/list-facet.js
@@ -127,9 +127,9 @@ ListFacet.prototype._initializeUI = function() {
         '<div class="facet-expression" bind="expressionDiv"></div>' +
         '<div class="facet-controls" bind="controlsDiv" style="display:none;"><div class="grid-layout layout-tightest layout-full">' +
             '<table><tr>' +
-                '<td><a bind="choiceCountContainer" class="action" href="javascript:{}"></a> <span bind="sortGroup">sorted by ' +
-                    '<input bind="sortByNameLink" type="radio" id="' + facet_id + '-name-sort" name="' + facet_id + '-sort-radio" checked="checked" /><label for="' + facet_id + '-name-sort">name</label>' +
-                    '<input bind="sortByCountLink" type="radio" id="' + facet_id + '-count-sort" name="' + facet_id + '-sort-radio" /><label for="' + facet_id + '-count-sort">count</label>' +
+                '<td><a bind="choiceCountContainer" class="action" href="javascript:{}"></a> <span class="facet-controls-sortControls" bind="sortGroup">sorted by ' +
+                    '<a href="javascript:{}" bind="sortByNameLink">name</a>' +
+                    '<a href="javascript:{}" bind="sortByCountLink">count</a>' +
                 '</span></td>' +
                 '<td width="1%" nowrap=""><button bind="clusterLink">cluster</button></td>' +
             '</tr></table>' +
@@ -165,8 +165,6 @@ ListFacet.prototype._initializeUI = function() {
         }
     });
         
-    this._elmts.sortGroup.buttonset();
-    
     this._elmts.clusterLink.click(function() { self._doEdit(); }).button();
     if (this._config.expression != "value" && this._config.expression != "grel:value") {
         this._elmts.clusterLink.hide();
@@ -278,11 +276,11 @@ ListFacet.prototype._update = function(resetScroll) {
     }
     
     if (this._options.sort == "name") {
-        this._elmts.sortByNameLink.addClass("facet-mode-link-selected");
-        this._elmts.sortByCountLink.removeClass("facet-mode-link-selected");
+        this._elmts.sortByNameLink.removeClass("action").addClass("inaction");
+        this._elmts.sortByCountLink.removeClass("inaction").addClass("action");
     } else {
-        this._elmts.sortByNameLink.removeClass("facet-mode-link-selected");
-        this._elmts.sortByCountLink.addClass("facet-mode-link-selected");
+        this._elmts.sortByNameLink.removeClass("inaction").addClass("action");
+        this._elmts.sortByCountLink.removeClass("action").addClass("inaction");
     }
     
     var html = [];
diff --git a/main/webapp/modules/core/styles/project/browsing.less b/main/webapp/modules/core/styles/project/browsing.less
index c78ca0ca2..6ae1bc3f4 100644
--- a/main/webapp/modules/core/styles/project/browsing.less
+++ b/main/webapp/modules/core/styles/project/browsing.less
@@ -106,6 +106,19 @@ a.facet-title-remove:hover {
     padding: 0.1em 0.4em 0.2em;
 }
 
+.facet-controls-sortControls a {
+  margin: 0 2px;
+  padding: 2px 4px 3px 4px;
+  font-weight: bold;
+}
+.facet-controls-sortControls a.inaction {
+  background: #f8f8f8;
+  color: #777;
+  border: 1px solid #ff6a00;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+}
+
 .facet-body {
     padding: 1px;
 }