2010-02-02 02:36:02 +01:00
|
|
|
function RangeFacet(div, config, options) {
|
|
|
|
this._div = div;
|
|
|
|
this._config = config;
|
|
|
|
this._options = options;
|
|
|
|
|
2010-02-05 21:05:44 +01:00
|
|
|
this._from = ("from" in this._config) ? this._config.from : null;
|
|
|
|
this._to = ("to" in this._config) ? this._config.to : null;
|
2010-03-10 09:48:04 +01:00
|
|
|
|
|
|
|
this._selectNumeric = ("selectNumeric" in this._config) ? this._config.selectNumeric : true;
|
2010-03-10 09:15:01 +01:00
|
|
|
this._selectNonNumeric = ("selectNonNumeric" in this._config) ? this._config.selectNonNumeric : true;
|
|
|
|
this._selectBlank = ("selectBlank" in this._config) ? this._config.selectBlank : true;
|
|
|
|
this._selectError = ("selectError" in this._config) ? this._config.selectError : true;
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-04-11 10:19:05 +02:00
|
|
|
this._baseNumericCount = 0;
|
|
|
|
this._baseNonNumericCount = 0;
|
|
|
|
this._baseBlankCount = 0;
|
|
|
|
this._baseErrorCount = 0;
|
|
|
|
|
2010-03-10 09:48:04 +01:00
|
|
|
this._numericCount = 0;
|
2010-03-10 07:02:36 +01:00
|
|
|
this._nonNumericCount = 0;
|
|
|
|
this._blankCount = 0;
|
|
|
|
this._errorCount = 0;
|
2010-02-02 02:36:02 +01:00
|
|
|
|
2010-02-26 22:56:41 +01:00
|
|
|
this._error = false;
|
2010-02-05 21:05:44 +01:00
|
|
|
this._initializedUI = false;
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
|
2010-03-23 19:53:29 +01:00
|
|
|
RangeFacet.prototype.reset = function() {
|
2010-02-02 02:36:02 +01:00
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._from = this._config.min;
|
2010-03-23 19:53:29 +01:00
|
|
|
this._sliderDiv.slider("value", this._from);
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._to = this._config.max;
|
2010-03-23 19:53:29 +01:00
|
|
|
this._sliderDiv.slider("value", this._to);
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
this._from = this._config.min;
|
|
|
|
this._to = this._config.max;
|
2010-03-23 19:53:29 +01:00
|
|
|
this._sliderDiv.slider("values", 0, this._from);
|
|
|
|
this._sliderDiv.slider("values", 1, this._to);
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
2010-03-10 09:48:04 +01:00
|
|
|
this._selectNumeric = true;
|
2010-03-10 07:02:36 +01:00
|
|
|
this._selectNonNumeric = true;
|
|
|
|
this._selectBlank = true;
|
|
|
|
this._selectError = true;
|
2010-03-23 19:53:29 +01:00
|
|
|
|
|
|
|
this._setRangeIndicators();
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
|
2010-02-27 01:16:44 +01:00
|
|
|
RangeFacet.reconstruct = function(div, uiState) {
|
|
|
|
return new RangeFacet(div, uiState.c, uiState.o);
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.getUIState = function() {
|
|
|
|
var json = {
|
|
|
|
c: this.getJSON(),
|
|
|
|
o: this._options
|
|
|
|
};
|
|
|
|
|
|
|
|
return json;
|
2010-04-08 21:52:23 +02:00
|
|
|
};
|
2010-02-27 01:16:44 +01:00
|
|
|
|
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
RangeFacet.prototype.getJSON = function() {
|
2010-02-19 00:27:40 +01:00
|
|
|
var o = {
|
|
|
|
type: "range",
|
|
|
|
name: this._config.name,
|
|
|
|
mode: this._config.mode,
|
|
|
|
expression: this._config.expression,
|
2010-03-10 07:02:36 +01:00
|
|
|
columnName: this._config.columnName,
|
2010-03-10 09:48:04 +01:00
|
|
|
selectNumeric: this._selectNumeric,
|
2010-03-10 07:02:36 +01:00
|
|
|
selectNonNumeric: this._selectNonNumeric,
|
|
|
|
selectBlank: this._selectBlank,
|
|
|
|
selectError: this._selectError
|
2010-02-19 00:27:40 +01:00
|
|
|
};
|
2010-02-02 02:36:02 +01:00
|
|
|
|
2010-02-05 21:05:44 +01:00
|
|
|
if (this._config.mode == "min" || this._config.mode == "range") {
|
2010-04-09 03:00:44 +02:00
|
|
|
if (this._from !== null) {
|
2010-02-05 21:05:44 +01:00
|
|
|
o.from = this._from;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if (this._config.mode == "max" || this._config.mode == "range") {
|
2010-04-09 03:00:44 +02:00
|
|
|
if (this._to !== null) {
|
2010-02-03 01:20:42 +01:00
|
|
|
o.to = this._to;
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return o;
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.hasSelection = function() {
|
2010-03-10 09:48:04 +01:00
|
|
|
if (!this._selectNumeric || !this._selectNonNumeric || !this._selectBlank || !this._selectError) {
|
2010-03-10 07:02:36 +01:00
|
|
|
return true;
|
|
|
|
}
|
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-04-09 03:00:44 +02:00
|
|
|
return this._from !== null && (!this._initializedUI || this._from > this._config.min);
|
2010-02-02 02:36:02 +01:00
|
|
|
case "max":
|
2010-04-09 03:00:44 +02:00
|
|
|
return this._to !== null && (!this._initializedUI || this._to < this._config.max);
|
2010-02-02 02:36:02 +01:00
|
|
|
default:
|
2010-04-09 03:00:44 +02:00
|
|
|
return (this._from !== null && (!this._initializedUI || this._from > this._config.min)) ||
|
|
|
|
(this._to !== null && (!this._initializedUI || this._to < this._config.max));
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._initializeUI = function() {
|
|
|
|
var self = this;
|
|
|
|
var container = this._div.empty();
|
|
|
|
|
|
|
|
var headerDiv = $('<div></div>').addClass("facet-title").appendTo(container);
|
|
|
|
$('<span></span>').text(this._config.name).appendTo(headerDiv);
|
|
|
|
|
2010-02-05 21:05:44 +01:00
|
|
|
var resetButton = $('<a href="javascript:{}"></a>').addClass("facet-choice-link").text("reset").click(function() {
|
2010-03-23 19:53:29 +01:00
|
|
|
self.reset();
|
2010-03-09 08:01:13 +01:00
|
|
|
self._updateRest();
|
2010-02-05 21:05:44 +01:00
|
|
|
}).prependTo(headerDiv);
|
|
|
|
|
2010-03-09 08:01:13 +01:00
|
|
|
var removeButton = $('<img>')
|
|
|
|
.attr("src", "images/close.png")
|
|
|
|
.attr("title", "Remove this facet")
|
|
|
|
.addClass("facet-choice-link")
|
|
|
|
.click(function() {
|
|
|
|
self._remove();
|
|
|
|
}).prependTo(headerDiv);
|
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
var bodyDiv = $('<div></div>').addClass("facet-range-body").appendTo(container);
|
2010-02-03 01:20:42 +01:00
|
|
|
|
2010-03-12 21:08:50 +01:00
|
|
|
this._messageDiv = $('<div>').text("Loading...").addClass("facet-range-message").appendTo(bodyDiv);
|
|
|
|
this._histogramDiv = $('<div>').addClass("facet-range-histogram").appendTo(bodyDiv);
|
|
|
|
this._sliderDiv = $('<div>').addClass("facet-range-slider").appendTo(bodyDiv);
|
|
|
|
this._statusDiv = $('<div>').addClass("facet-range-status").appendTo(bodyDiv);
|
|
|
|
this._otherChoicesDiv = $('<div>').addClass("facet-range-other-choices").appendTo(bodyDiv);
|
2010-02-02 02:36:02 +01:00
|
|
|
|
2010-03-18 23:58:06 +01:00
|
|
|
this._histogram = new HistogramWidget(this._histogramDiv, { binColors: [ "#ccccff", "#6666ff" ] });
|
2010-03-18 21:45:52 +01:00
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
var onSlide = function(event, ui) {
|
|
|
|
switch (self._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
self._from = ui.value;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
self._to = ui.value;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
self._from = ui.values[0];
|
|
|
|
self._to = ui.values[1];
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
self._setRangeIndicators();
|
2010-03-09 23:53:53 +01:00
|
|
|
};
|
|
|
|
var onStop = function() {
|
2010-03-10 09:48:04 +01:00
|
|
|
self._selectNumeric = true;
|
2010-03-09 08:01:13 +01:00
|
|
|
self._updateRest();
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
var sliderConfig = {
|
|
|
|
min: this._config.min,
|
|
|
|
max: this._config.max,
|
2010-03-09 23:53:53 +01:00
|
|
|
stop: onStop,
|
|
|
|
slide: onSlide
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
|
|
|
sliderConfig.range = "max";
|
2010-03-12 21:08:50 +01:00
|
|
|
sliderConfig.value = this._config.min;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
|
|
|
sliderConfig.range = "min";
|
2010-03-12 21:08:50 +01:00
|
|
|
sliderConfig.value = this._config.max;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
|
|
|
sliderConfig.range = true;
|
2010-03-12 21:08:50 +01:00
|
|
|
sliderConfig.values = [ this._config.min, this._config.max ];
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
2010-02-05 21:05:44 +01:00
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
this._sliderDiv.slider(sliderConfig);
|
2010-03-10 07:02:36 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._renderOtherChoices = function() {
|
|
|
|
var self = this;
|
|
|
|
var container = this._otherChoicesDiv.empty();
|
|
|
|
|
2010-04-11 10:19:05 +02:00
|
|
|
if (this._baseNonNumericCount === 0 && this._baseBlankCount === 0 && this._baseErrorCount === 0) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2010-03-10 07:02:36 +01:00
|
|
|
var table = $('<table>').attr("cellpadding", "0").attr("cellspacing", "1").css("white-space", "pre").appendTo(container)[0];
|
|
|
|
var tr0 = table.insertRow(0);
|
|
|
|
var tr1 = table.insertRow(1);
|
|
|
|
|
2010-03-22 22:48:36 +01:00
|
|
|
/*
|
|
|
|
* Numeric
|
|
|
|
*/
|
2010-03-10 07:02:36 +01:00
|
|
|
var td00 = $(tr0.insertCell(0)).attr("width", "1%");
|
2010-04-11 10:19:05 +02:00
|
|
|
var td01 = $(tr0.insertCell(1));
|
|
|
|
|
2010-03-10 09:48:04 +01:00
|
|
|
var numericCheck = $('<input type="checkbox" />').appendTo(td00).change(function() {
|
|
|
|
self._selectNumeric = !self._selectNumeric;
|
|
|
|
self._updateRest();
|
|
|
|
});
|
|
|
|
if (this._selectNumeric) {
|
|
|
|
numericCheck[0].checked = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
$('<span>').text("Numeric ").addClass("facet-choice-label").appendTo(td01);
|
|
|
|
$('<span>').text(this._numericCount).addClass("facet-choice-count").appendTo(td01);
|
|
|
|
|
2010-03-22 22:48:36 +01:00
|
|
|
/*
|
|
|
|
* Blank
|
|
|
|
*/
|
2010-03-10 09:48:04 +01:00
|
|
|
var td02 = $(tr0.insertCell(2)).attr("width", "1%");
|
|
|
|
var td03 = $(tr0.insertCell(3));
|
2010-04-11 10:19:05 +02:00
|
|
|
if (this._baseBlankCount === 0) {
|
|
|
|
td02.hide();
|
|
|
|
td03.hide();
|
|
|
|
} else {
|
|
|
|
var blankCheck = $('<input type="checkbox" />').appendTo(td02).change(function() {
|
|
|
|
self._selectBlank = !self._selectBlank;
|
|
|
|
self._updateRest();
|
|
|
|
});
|
|
|
|
if (this._selectBlank) {
|
|
|
|
blankCheck[0].checked = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
$('<span>').text("Blank ").addClass("facet-choice-label").appendTo(td03);
|
|
|
|
$('<span>').text(this._blankCount).addClass("facet-choice-count").appendTo(td03);
|
|
|
|
}
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-03-22 22:48:36 +01:00
|
|
|
/*
|
|
|
|
* Non-Numeric
|
|
|
|
*/
|
2010-03-10 07:02:36 +01:00
|
|
|
var td10 = $(tr1.insertCell(0)).attr("width", "1%");
|
|
|
|
var td11 = $(tr1.insertCell(1));
|
2010-04-11 10:19:05 +02:00
|
|
|
if (this._baseNonNumericCount === 0) {
|
|
|
|
td10.hide();
|
|
|
|
td11.hide();
|
|
|
|
} else {
|
|
|
|
var nonNumericCheck = $('<input type="checkbox" />').appendTo(td10).change(function() {
|
|
|
|
self._selectNonNumeric = !self._selectNonNumeric;
|
|
|
|
self._updateRest();
|
|
|
|
});
|
|
|
|
if (this._selectNonNumeric) {
|
|
|
|
nonNumericCheck[0].checked = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
$('<span>').text("Non-numeric ").addClass("facet-choice-label").appendTo(td11);
|
|
|
|
$('<span>').text(this._nonNumericCount).addClass("facet-choice-count").appendTo(td11);
|
|
|
|
}
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-03-22 22:48:36 +01:00
|
|
|
/*
|
|
|
|
* Error
|
|
|
|
*/
|
2010-03-10 07:02:36 +01:00
|
|
|
var td12 = $(tr1.insertCell(2)).attr("width", "1%");
|
|
|
|
var td13 = $(tr1.insertCell(3));
|
2010-04-11 10:19:05 +02:00
|
|
|
if (this._baseErrorCount === 0) {
|
|
|
|
td12.hide();
|
|
|
|
td13.hide();
|
|
|
|
} else {
|
|
|
|
var errorCheck = $('<input type="checkbox" />').appendTo(td12).change(function() {
|
|
|
|
self._selectError = !self._selectError;
|
|
|
|
self._updateRest();
|
|
|
|
});
|
|
|
|
if (this._selectError) {
|
|
|
|
errorCheck[0].checked = true;
|
|
|
|
}
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-04-11 10:19:05 +02:00
|
|
|
$('<span>').text("Error ").addClass("facet-choice-label").appendTo(td13);
|
|
|
|
$('<span>').text(this._errorCount).addClass("facet-choice-count").appendTo(td13);
|
|
|
|
}
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._setRangeIndicators = function() {
|
|
|
|
var text;
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
text = "At least " + this._from;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
text = "At most " + this._to;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
text = this._from + " to " + this._to;
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
this._statusDiv.text(text);
|
2010-03-18 23:58:06 +01:00
|
|
|
this._histogram.highlight(this._from, this._to);
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.updateState = function(data) {
|
2010-02-26 22:56:41 +01:00
|
|
|
if ("min" in data && "max" in data) {
|
2010-03-12 21:08:50 +01:00
|
|
|
this._error = false;
|
|
|
|
|
2010-02-26 22:56:41 +01:00
|
|
|
this._config.min = data.min;
|
|
|
|
this._config.max = data.max;
|
|
|
|
this._config.step = data.step;
|
|
|
|
this._baseBins = data.baseBins;
|
|
|
|
this._bins = data.bins;
|
|
|
|
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
|
|
|
this._from = Math.max(data.from, this._config.min);
|
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._to = Math.min(data.to, this._config.max);
|
2010-02-26 22:56:41 +01:00
|
|
|
break;
|
|
|
|
default:
|
|
|
|
this._from = Math.max(data.from, this._config.min);
|
|
|
|
if ("to" in data) {
|
|
|
|
this._to = Math.min(data.to, this._config.max);
|
|
|
|
} else {
|
|
|
|
this._to = data.max;
|
|
|
|
}
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
2010-03-10 07:02:36 +01:00
|
|
|
|
2010-04-11 10:19:05 +02:00
|
|
|
this._baseNumericCount = data.baseNumericCount;
|
|
|
|
this._baseNonNumericCount = data.baseNonNumericCount;
|
|
|
|
this._baseBlankCount = data.baseBlankCount;
|
|
|
|
this._baseErrorCount = data.baseErrorCount;
|
|
|
|
|
2010-03-10 09:48:04 +01:00
|
|
|
this._numericCount = data.numericCount;
|
2010-03-10 07:02:36 +01:00
|
|
|
this._nonNumericCount = data.nonNumericCount;
|
|
|
|
this._blankCount = data.blankCount;
|
|
|
|
this._errorCount = data.errorCount;
|
2010-02-26 22:56:41 +01:00
|
|
|
} else {
|
|
|
|
this._error = true;
|
2010-03-12 21:08:50 +01:00
|
|
|
this._errorMessage = "error" in data ? data.error : "Unknown error.";
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
this.render();
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.render = function() {
|
2010-02-05 21:05:44 +01:00
|
|
|
if (!this._initializedUI) {
|
|
|
|
this._initializeUI();
|
|
|
|
this._initializedUI = true;
|
|
|
|
}
|
2010-03-12 21:08:50 +01:00
|
|
|
|
2010-02-26 22:56:41 +01:00
|
|
|
if (this._error) {
|
2010-03-12 21:08:50 +01:00
|
|
|
this._messageDiv.text(this._errorMessage).show();
|
|
|
|
this._sliderDiv.hide();
|
|
|
|
this._histogramDiv.hide();
|
|
|
|
this._statusDiv.hide();
|
|
|
|
this._otherChoicesDiv.hide();
|
2010-02-26 22:56:41 +01:00
|
|
|
return;
|
|
|
|
}
|
2010-02-05 21:05:44 +01:00
|
|
|
|
2010-03-12 21:08:50 +01:00
|
|
|
this._messageDiv.hide();
|
|
|
|
this._sliderDiv.show();
|
|
|
|
this._histogramDiv.show();
|
|
|
|
this._statusDiv.show();
|
|
|
|
this._otherChoicesDiv.show();
|
|
|
|
|
2010-02-03 01:20:42 +01:00
|
|
|
this._sliderDiv.slider("option", "min", this._config.min);
|
|
|
|
this._sliderDiv.slider("option", "max", this._config.max);
|
|
|
|
this._sliderDiv.slider("option", "step", this._config.step);
|
|
|
|
|
2010-03-18 21:45:52 +01:00
|
|
|
this._histogram.update(
|
|
|
|
this._config.min,
|
|
|
|
this._config.max,
|
|
|
|
this._config.step,
|
2010-03-18 23:58:06 +01:00
|
|
|
[ this._baseBins, this._bins ],
|
|
|
|
this._from,
|
|
|
|
this._to
|
2010-03-18 21:45:52 +01:00
|
|
|
);
|
2010-02-03 01:20:42 +01:00
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
this._setRangeIndicators();
|
2010-03-10 07:02:36 +01:00
|
|
|
this._renderOtherChoices();
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._remove = function() {
|
|
|
|
ui.browsingEngine.removeFacet(this);
|
|
|
|
|
|
|
|
this._div = null;
|
|
|
|
this._config = null;
|
|
|
|
this._data = null;
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._updateRest = function() {
|
2010-02-26 22:56:41 +01:00
|
|
|
Gridworks.update({ engineChanged: true });
|
2010-02-02 02:36:02 +01:00
|
|
|
};
|