condense status and controls in the list facet on a single line and use jquery_ui small radio buttons to make it look more coherent with the other facets

git-svn-id: http://google-refine.googlecode.com/svn/trunk@531 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
Stefano Mazzocchi 2010-04-24 07:07:58 +00:00
parent c9e4214a89
commit 909156dc70
2 changed files with 18 additions and 34 deletions

View File

@ -105,28 +105,23 @@ ListFacet.prototype._reSortChoices = function() {
ListFacet.prototype._initializeUI = function() {
var self = this;
var facet_id = this._div.attr("id");
this._div.empty().show().html(
'<div class="facet-title">' +
'<img src="images/close.png" title="Remove this facet" class="facet-choice-link" bind="removeButton"/>' +
'<a href="javascript:{}" class="facet-choice-link" bind="resetButton">reset</a>' +
'<a href="javascript:{}" class="facet-choice-link" bind="changeButton">change</a>' +
'<span bind="titleSpan"></span>' +
'</div>' +
'<div class="facet-expression" bind="expressionDiv"></div>' +
'<div class="facet-status" bind="statusDiv" style="display:none;"><div class="grid-layout layout-tightest layout-full">' +
'<table><tr>' +
'<td bind="choiceCountContainer"></td>' +
'<td width="1%"><a href="javascript:{}" class="action" bind="clusterLink">Cluster</a></td>' +
'</tr></table>' +
'</div></div>' +
'<div class="facet-controls" bind="controlsDiv" style="display:none;"><div class="grid-layout layout-tightest layout-full">' +
'<table><tr>' +
'<td>Sort by: ' +
'<a href="javascript:{}" bind="sortByNameLink" class="facet-mode-link">Name</a> ' +
'<a href="javascript:{}" bind="sortByCountLink" class="facet-mode-link">Count</a>' +
'</td>' +
'<td width="1%">' +
'<a href="javascript:{}" class="action" bind="resetButton">Reset</a>' +
'</td>' +
'<td><span bind="sortGroup">Sort by: ' +
'<input bind="sortByNameLink" type="radio" id="' + facet_id + '-name-sort" name="radio" checked="checked" /><label for="' + facet_id + '-name-sort">name</label>' +
'<input bind="sortByCountLink" type="radio" id="' + facet_id + '-count-sort" name="radio" /><label for="' + facet_id + '-count-sort">count</label>' +
'</span></td>' +
'<td width="1%" nowrap=""><span bind="choiceCountContainer"></span> <button bind="clusterLink">cluster</button></td>' +
'</tr></table>' +
'</div></div>' +
'<div class="facet-body" bind="bodyDiv">' +
@ -158,8 +153,10 @@ ListFacet.prototype._initializeUI = function() {
}
});
this._elmts.sortGroup.buttonset();
if (this._config.expression == "value") {
this._elmts.clusterLink.click(function() { self._doEdit(); });
this._elmts.clusterLink.click(function() { self._doEdit(); }).button();
} else {
this._elmts.clusterLink.hide();
}
@ -180,14 +177,14 @@ ListFacet.prototype._update = function(resetScroll) {
var self = this;
if (!this._data) {
this._elmts.statusDiv.hide();
//this._elmts.statusDiv.hide();
this._elmts.controlsDiv.hide();
this._elmts.bodyInnerDiv.empty().append(
$('<div>').text("Loading...").addClass("facet-body-message"));
return;
} else if ("error" in this._data) {
this._elmts.statusDiv.hide();
//this._elmts.statusDiv.hide();
this._elmts.controlsDiv.hide();
this._elmts.bodyInnerDiv.empty().append(
$('<div>').text(this._data.error).addClass("facet-body-message"));
@ -204,7 +201,7 @@ ListFacet.prototype._update = function(resetScroll) {
}
this._elmts.bodyInnerDiv.empty();
this._elmts.statusDiv.show();
//this._elmts.statusDiv.show();
this._elmts.controlsDiv.show();
var choices = this._data.choices;

View File

@ -81,25 +81,12 @@ li.facet-container {
}
.facet-controls {
font-size: 90%;
padding: 5px 5px;
padding: 4px 5px 4px 5px;
background: #F4F7FA;
border-bottom: 1px solid #eee;
border-bottom: 1px solid #ccc;
}
a.facet-mode-link {
text-decoration: none;
padding: 1px 3px 2px 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
a.facet-mode-link:hover {
background: #f8f8f8;
color: #FF6A00;
}
a.facet-mode-link.facet-mode-link-selected {
background: #f8f8f8;
color: #FF6A00;
border: 1px solid #ccc;
.facet-controls .ui-button-text {
padding: 0.1em 0.4em 0.2em;
}
.facet-body {