function BrowsingEngine(div, facetConfigs) { this._div = div; this._facets = []; this._initializeUI(); if (facetConfigs.length > 0) { for (var i = 0; i < facetConfigs.length; i++) { var facetConfig = facetConfigs[i]; var type = facetConfig.c.type; var elmt = this._createFacetContainer(); var facet; switch (type) { case "range": facet = RangeFacet.reconstruct(elmt, facetConfig); break; case "scatterplot": facet = ScatterplotFacet.reconstruct(elmt, facetConfig); break; case "text": facet = TextSearchFacet.reconstruct(elmt, facetConfig); break; default: facet = ListFacet.reconstruct(elmt, facetConfig); } this._facets.push({ elmt: elmt, facet: facet }); } } } BrowsingEngine.prototype.resize = function() { if (this._facets.length > 0) { var body = this._div.find(".facets-container"); var bodyPaddings = body.outerHeight(true) - body.height(); var height = this._div.height() - this._div.find(".browsing-panel-header").outerHeight(true) - this._div.find(".browsing-panel-modes").outerHeight(true) - bodyPaddings; body.css("height", height + "px"); this._elmts.facets.sortable("refresh"); } }; BrowsingEngine.prototype.getFacetUIStates = function() { var f = []; for (var i = 0; i < this._facets.length; i++) { var facet = this._facets[i]; f.push(facet.facet.getUIState()); } return f; }; BrowsingEngine.prototype._initializeUI = function() { var self = this; this._div.html( '
' + '

Explore data ...

' + '

by choosing a facet or filter method from the menus at the top of each column.

' + '

Not sure how to get started? Watch these screencasts.

' + '
' + '
' + 'Browse by ' + '' + '' + '' + '' + '
' + '
' + '
' + ' refreshing facets ...' + '
' + '
' + '' + '' + '' + '' + '' + '
' + 'Refresh' + '' + 'Reset All' + '' + 'Remove All' + '
' + '
' + '' ); this._elmts = DOM.bind(this._div); this._elmts.facets.sortable({ handle: '.facet-title', update: function(event, ui) { self._updateFacetOrder(); } }); $("#browsing-panel-mode-" + (theProject.recordModel.hasRecords ? 'record-based' : 'row-based')).attr("checked", "checked"); this._elmts.modeSelectors.buttonset(); this._elmts.modeSelectors.find("input").change(function() { Gridworks.update({ engineChanged: true }); }); 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() { var elmts = this._elmts.facets.children(); var newFacets = []; for (var e = 0; e < elmts.length; e++) { var elmt = elmts[e]; for (var f = 0; f < this._facets.length; f++) { if (elmt === this._facets[f].elmt[0]) { newFacets.push(this._facets[f]); break; } } } this._facets = newFacets; }; BrowsingEngine.prototype.getJSON = function(keepUnrestrictedFacets, except) { var a = { facets: [], mode: this._elmts.modeSelectors.find("input:checked")[0].value }; for (var i = 0; i < this._facets.length; i++) { var facet = this._facets[i]; if ((keepUnrestrictedFacets || facet.facet.hasSelection()) && (facet.facet !== except)) { a.facets.push(facet.facet.getJSON()); } } return a; }; BrowsingEngine.prototype.addFacet = function(type, config, options) { var elmt = this._createFacetContainer(); var facet; switch (type) { case "range": facet = new RangeFacet(elmt, config, options); break; case "scatterplot": facet = new ScatterplotFacet(elmt, config, options); break; case "text": facet = new TextSearchFacet(elmt, config, options); break; default: facet = new ListFacet(elmt, config, options); } this._facets.push({ elmt: elmt, facet: facet }); Gridworks.update({ engineChanged: true }); }; BrowsingEngine.prototype._createFacetContainer = function() { return $('
  • ').addClass("facet-container").attr("id","facet-" + this._facets.length).hide().appendTo(this._elmts.facets); }; BrowsingEngine.prototype.removeFacet = function(facet) { var update = facet.hasSelection(); for (var i = this._facets.length - 1;i >= 0; i--) { var facetRecord = this._facets[i]; if (facetRecord.facet === facet) { this._facets.splice(i, 1); facetRecord.facet.dispose(); // This makes really big facet disappear right away. If you just call remove() // then it takes a while for all the event handlers to get unwired, and the UI // appear frozen. facetRecord.elmt.hide(); window.setTimeout(function() { facetRecord.elmt.remove(); }, 300); break; } } for (var i = 0; i < this._facets.length; i++) { if (typeof this._facets[i].facet.update == "function") { this._facets[i].facet.update(); } } if (update) { Gridworks.update({ engineChanged: true }); } }; BrowsingEngine.prototype.update = function(onDone) { var self = this; this._elmts.help.hide(); this._elmts.header.show(); this._elmts.controls.css("visibility", "hidden"); this._elmts.indicator.css("visibility", "visible"); $.post( "/command/compute-facets?" + $.param({ project: theProject.id }), { engine: JSON.stringify(this.getJSON(true)) }, function(data) { var facetData = data.facets; for (var i = 0; i < facetData.length; i++) { self._facets[i].facet.updateState(facetData[i]); } self._elmts.indicator.css("visibility", "hidden"); if (self._facets.length > 0) { self._elmts.header.show(); self._elmts.controls.css("visibility", "visible"); self.resize(); } else { self._elmts.help.show(); } if (onDone) { 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++) { var facet = oldFacets[i]; facet.facet.dispose(); facet.elmt.hide(); } window.setTimeout(function() { for (var i = 0; i < oldFacets.length; i++) { oldFacets[i].elmt.remove(); } }, 300); Gridworks.update({ engineChanged: true }); };