2010-02-02 02:36:02 +01:00
|
|
|
function RangeFacet(div, config, options) {
|
|
|
|
this._div = div;
|
|
|
|
this._config = config;
|
|
|
|
this._options = options;
|
|
|
|
|
|
|
|
this._setDefaults();
|
|
|
|
this._timerID = null;
|
|
|
|
|
|
|
|
this._initializeUI();
|
|
|
|
}
|
|
|
|
|
|
|
|
RangeFacet.prototype._setDefaults = function() {
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._from = this._config.min;
|
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-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-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.getJSON = function() {
|
|
|
|
var o = cloneDeep(this._config);
|
|
|
|
o.type = "range";
|
|
|
|
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
o.from = this._from;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
o.to = this._to;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
o.from = this._from;
|
|
|
|
if (this._to == this._config.max) {
|
2010-02-02 02:36:02 +01:00
|
|
|
// pretend to be open-ended
|
|
|
|
o.mode = "min";
|
|
|
|
} else {
|
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() {
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
return this._from > this._config.min;
|
2010-02-02 02:36:02 +01:00
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
return this._to < this._config.max;
|
2010-02-02 02:36:02 +01:00
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
return this._from > this._config.min ||
|
|
|
|
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);
|
|
|
|
|
|
|
|
var removeButton = $('<a href="javascript:{}"></a>').addClass("facet-choice-link").text("remove").click(function() {
|
|
|
|
self._remove();
|
|
|
|
}).prependTo(headerDiv);
|
|
|
|
|
|
|
|
var bodyDiv = $('<div></div>').addClass("facet-range-body").appendTo(container);
|
2010-02-03 01:20:42 +01:00
|
|
|
|
|
|
|
this._histogramDiv = $('<div></div>').addClass("facet-range-histogram").appendTo(bodyDiv);
|
2010-02-02 02:36:02 +01:00
|
|
|
this._sliderDiv = $('<div></div>').addClass("facet-range-slider").appendTo(bodyDiv);
|
|
|
|
this._statusDiv = $('<div></div>').addClass("facet-range-status").appendTo(bodyDiv);
|
|
|
|
|
|
|
|
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();
|
|
|
|
self._scheduleUpdate();
|
|
|
|
};
|
|
|
|
var sliderConfig = {
|
|
|
|
range: "max",
|
|
|
|
min: this._config.min,
|
|
|
|
max: this._config.max,
|
|
|
|
value: 2,
|
|
|
|
slide: onSlide
|
|
|
|
};
|
|
|
|
if ("step" in this._config) {
|
|
|
|
sliderConfig.step = this._config.step;
|
|
|
|
}
|
|
|
|
|
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
|
|
|
sliderConfig.range = "max";
|
2010-02-03 01:20:42 +01:00
|
|
|
sliderConfig.value = this._from;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
|
|
|
sliderConfig.range = "min";
|
2010-02-03 01:20:42 +01:00
|
|
|
sliderConfig.value = this._to;
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
|
|
|
sliderConfig.range = true;
|
2010-02-03 01:20:42 +01:00
|
|
|
sliderConfig.values = [ this._from, this._to ];
|
2010-02-02 02:36:02 +01:00
|
|
|
}
|
|
|
|
this._sliderDiv.slider(sliderConfig);
|
|
|
|
this._setRangeIndicators();
|
|
|
|
};
|
|
|
|
|
|
|
|
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
|
|
|
}
|
|
|
|
this._statusDiv.text(text);
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.updateState = function(data) {
|
2010-02-03 01:20:42 +01:00
|
|
|
this._config.min = data.min;
|
|
|
|
this._config.max = data.max;
|
|
|
|
this._config.step = data.step;
|
|
|
|
this._bins = data.bins;
|
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
switch (this._config.mode) {
|
|
|
|
case "min":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._from = Math.max(data.from, this._config.min);
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
case "max":
|
2010-02-03 01:20:42 +01:00
|
|
|
this._to = Math.min(data.to, this._config.max);
|
2010-02-02 02:36:02 +01:00
|
|
|
break;
|
|
|
|
default:
|
2010-02-03 01:20:42 +01:00
|
|
|
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
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
this.render();
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype.render = function() {
|
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);
|
|
|
|
|
|
|
|
var max = 0;
|
|
|
|
for (var i = 0; i < this._bins.length; i++) {
|
|
|
|
max = Math.max(max, this._bins[i]);
|
|
|
|
}
|
|
|
|
if (max == 0) {
|
|
|
|
this._histogramDiv.hide();
|
|
|
|
} else {
|
|
|
|
var a = [];
|
|
|
|
for (var i = 0; i < this._bins.length; i++) {
|
|
|
|
a.push(Math.round(100 * this._bins[i] / max));
|
|
|
|
}
|
|
|
|
|
|
|
|
this._histogramDiv.empty().show();
|
|
|
|
$('<img />').attr("src",
|
|
|
|
"http://chart.apis.google.com/chart?cht=ls&chs=" +
|
|
|
|
this._histogramDiv[0].offsetWidth +
|
|
|
|
"x50&chd=t:" + a.join(",")
|
|
|
|
).appendTo(this._histogramDiv);
|
|
|
|
}
|
|
|
|
|
2010-02-02 02:36:02 +01:00
|
|
|
this._setRangeIndicators();
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._reset = function() {
|
|
|
|
this._setDefaults();
|
|
|
|
this._updateRest();
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._remove = function() {
|
|
|
|
ui.browsingEngine.removeFacet(this);
|
|
|
|
|
|
|
|
this._div = null;
|
|
|
|
this._config = null;
|
|
|
|
this._data = null;
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._scheduleUpdate = function() {
|
|
|
|
if (this._timerID == null) {
|
|
|
|
var self = this;
|
|
|
|
this._timerID = window.setTimeout(function() {
|
|
|
|
self._timerID = null;
|
|
|
|
self._updateRest();
|
|
|
|
}, 300);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
RangeFacet.prototype._updateRest = function() {
|
|
|
|
ui.browsingEngine.update();
|
|
|
|
ui.dataTableView.update(true);
|
|
|
|
};
|