1/** 2 * Range Slider component functionality 3 * @module searchFacetRangeSlider 4 * @param {jQuery} $ Instance of jQuery 5 * @param {Document} document dom document object 6 * @return {Object} list of methods for working with range slider 7*/ 8XA.component.search.facet.rangeslider = (function ($, document) { 9 /** 10 * This object stores all public api methods 11 * @type {Object.<Methods>} 12 * @memberOf module:searchFacetRangeSlider 13 */ 14 var api = {}, 15 urlHelperModel, 16 queryModel, 17 initialized = false; 18 19 /** 20 * @name module:searchFacetRangeSlider.SearchFacetRangeSliderModel 21 * @constructor 22 * @augments Backbone.Model 23 */ 24 var SearchFacetRangeSliderModel = Backbone.Model.extend( 25 /** @lends module:searchFacetRangeSlider.SearchFacetRangeSliderModel.prototype **/ 26 { 27 /** 28 * Default model options 29 * @default 30 */ 31 defaults: { 32 dataProperties: {}, 33 sig: [], 34 timeStamp: '' 35 } 36 }); 37 /** 38 * @name module:searchFacetRangeSlider.SearchFacetRangeSliderView 39 * @constructor 40 * @augments Backbone.View 41 */ 42 var SearchFacetRangeSliderView = XA.component.search.baseView.extend( 43 /** @lends module:searchFacetRangeSlider.SearchFacetRangeSliderView.prototype **/ 44 { 45 /** 46 * Initially sets data to model and watches events on which 47 * view should be updated 48 * @listens module:searchFacetRangeSlider.SearchFacetRangeSliderView~event:change 49 * @listens module:XA.component.search.vent~event:hashChanged 50 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 51 */ 52 initialize: function () { 53 var dataProperties = this.$el.data(); 54 this.properties = dataProperties.properties; 55 56 if (this.model) { 57 this.model.set({ dataProperties: this.properties }); 58 this.model.set("sig", this.translateSignatures(this.properties.searchResultsSignature, this.properties.f)); 59 } 60 this.model.on("change", this.updateSelectedValue, this); 61 62 XA.component.search.vent.on("hashChanged", this.updateModel.bind(this)); 63 64 this.render(); 65 }, 66 /** 67 * list of events for Backbone View 68 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 69 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#events 70 */ 71 events: { 72 'click .bottom-remove-filter, .clear-filter': 'removeFacet', 73 'mouseup .ui-slider-handle': 'updateModel' 74 }, 75 /** 76 * Renders view. Use jQueryUI slider with set up from searchFacetRangeSlider 77 * properties 78 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 79 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#render 80 */ 81 render: function () { 82 var self = this, 83 sig = this.model.get('sig'), 84 queryModel = XA.component.search.query, 85 hashObj = queryModel.parseHashParameters(window.location.hash), 86 minRangeValue = parseFloat(this.model.get('dataProperties').minRangeValue), 87 maxRangeValue = parseFloat(this.model.get('dataProperties').maxRangeValue), 88 changeStep = parseFloat(this.model.get('dataProperties').changeStep), 89 $sliderValue = $('<div />').addClass('slider-value'), 90 facetClose = this.$el.find('.facet-heading > span'), 91 $slider = this.$el.find('.slider'), 92 selectedMinValue, 93 selectedMaxValue, 94 i; 95 96 for (i = 0; i < sig.length; i++) { 97 if (!jQuery.isEmptyObject(_.pick(hashObj, sig[i]))) { 98 var values = _.values(_.pick(hashObj, sig[i]))[0]; 99 if (values) { 100 selectedMinValue = values.split("|")[0]; 101 selectedMaxValue = values.split("|")[1]; 102 //Adds active class to group close button 103 facetClose.addClass('has-active-facet'); 104 } 105 } else { 106 selectedMinValue = parseFloat(this.model.get('dataProperties').selectedMinValue); 107 selectedMaxValue = parseFloat(this.model.get('dataProperties').selectedMaxValue); 108 facetClose.removeClass('has-active-facet'); 109 } 110 } 111 112 if (isNaN(minRangeValue)) { 113 minRangeValue = 0; 114 } 115 if (isNaN(maxRangeValue)) { 116 maxRangeValue = 0; 117 }
118 if (isNaN(changeStep) || changeStep === 0) { 119 changeStep = 1; 120 } 121 if (isNaN(selectedMinValue)) { 122 selectedMinValue = 0; 123 } 124 if (isNaN(selectedMaxValue)) { 125 selectedMaxValue = 0; 126 } 127 128 $slider.slider({ 129 range: true, 130 min: minRangeValue, 131 max: maxRangeValue, 132 step: changeStep, 133 values: [selectedMinValue, selectedMaxValue], 134 create: function (event, ui) { 135 $(".slider-value").remove(); 136 $slider.after($sliderValue); 137 if (selectedMinValue !== 0 || selectedMaxValue !== 0) { 138 self.updateText(selectedMinValue, selectedMaxValue); 139 } 140 }, 141 slide: function (event, ui) { 142 self.updateModel(self.updateSignaturesHash(sig, ui.values[0] + "|" + ui.values[1], {})); 143 } 144 }); 145 146 }, 147 /** 148 * Sets default values for Range Slider and updates hash according to them 149 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 150 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#removeFacet 151 */ 152 removeFacet: function () { 153 var facet = this.$el, 154 sig = this.model.get('sig'), 155 $slider = this.$el.find('.slider'), 156 $facetClose = facet.find('.facet-heading > span'), 157 properties = this.model.get('dataProperties'), 158 hash = queryModel.parseHashParameters(window.location.hash); 159 160 $facetClose.removeClass('has-active-facet'); 161 162 properties.selectedMinValue = properties.minRangeValue; 163 properties.selectedMaxValue = properties.maxRangeValue; 164 165 //Updates slider text to default min and max range values 166 this.updateText(properties.minRangeValue, properties.maxRangeValue); 167 168 //Sets slider valued to default min and max range values 169 $slider.slider("values", [properties.minRangeValue, properties.maxRangeValue]); 170 171 this.model.set({ dataProperties: properties }); 172 173 if (hash.hasOwnProperty(this.model.get('sig'))) { 174 queryModel.updateHash(this.updateSignaturesHash(sig, "", hash)); 175 } 176 }, 177 /** 178 * Updates model based on hash parameters 179 * @param {Object} hash Object that contains hash parameters 180 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 181 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#updateModel 182 */ 183 updateModel: function (hash) { 184 var sig = this.model.get('sig'), 185 facetPart, 186 dataProperties, 187 values, 188 selectedMinValue, 189 selectedMaxValue, 190 i; 191 192 if (!hash) { 193 hash = queryModel.parseHashParameters(window.location.hash); 194 } 195 196 for (i = 0; i < sig.length; i++) { 197 facetPart = sig[i].toLocaleString(); 198 if (hash.hasOwnProperty(facetPart)) { 199 values = _.values(_.pick(hash, facetPart))[0]; 200 if (values !== '') { 201 selectedMinValue = values.split("|")[0]; 202 selectedMaxValue = values.split("|")[1]; 203 204 if (typeof selectedMaxValue === "undefined" || 205 typeof selectedMinValue === "undefined") { 206 continue; 207 } 208 209 dataProperties = this.model.get('dataProperties'); 210 dataProperties.selectedMinValue = selectedMinValue; 211 dataProperties.selectedMaxValue = selectedMaxValue; 212 this.model.set('dataProperties', dataProperties); 213 this.model.set("timeStamp", (new Date()).getTime()); 214 } else { 215 this.removeFacet(); 216 } 217 } 218 } 219 }, 220 /** 221 * Updates selected text values 222 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 223 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#updateSelectedValue 224 */ 225 updateSelectedValue: function () { 226 var dataProperties = this.model.get('dataProperties'), 227 facetMinValue = dataProperties.selectedMinValue, 228 facetMaxValue = dataProperties.selectedMaxValue, 229 $slider = this.$el.find('.slider'), 230 sig = this.model.get('sig'); 231 232 $slider.slider("values", [facetMinValue, facetMaxValue]); 233 this.updateText(facetMinValue, facetMaxValue); 234 this.$el.find('.facet-heading > span').addClass('has-active-facet'); 235
236 queryModel.updateHash(this.updateSignaturesHash(sig, facetMinValue + "|" + facetMaxValue, {})); 237 }, 238 /** 239 * Updates slider text values text 240 * @param {String} facetMinValue Minimal value of facet 241 * @param {String} facetMaxValue Maximal value of facet 242 * @memberof module:searchFacetRangeSlider.SearchFacetRangeSliderView 243 * @alias module:searchFacetRangeSlider.SearchFacetRangeSliderView#updateSelectedValue 244 */ 245 updateText: function (facetMinValue, facetMaxValue) { 246 var $sliderValueField = this.$el.find('.slider-value'), 247 sliderText = this.model.get('dataProperties').formatingString; 248 249 sliderText = sliderText.replace('{from}', facetMinValue).replace('{to}', facetMaxValue); 250 $sliderValueField.html(sliderText); 251 } 252 }); 253 /** 254 * For each search facet range slider component on a page creates instance of 255 * ["SearchFacetRangeSliderModel"]{@link module:searchFacetRangeSlider.SearchFacetRangeSliderModel} and 256 * ["SearchFacetRangeSliderView"]{@link module:searchFacetRangeSlider.SearchFacetRangeSliderView} 257 * @memberOf module:searchFacetRangeSlider 258 * @alias module:searchFacetRangeSlider.init 259 */ 260 api.init = function () { 261 queryModel = XA.component.search.query; 262 urlHelperModel = XA.component.search.url; 263 264 var searchFacetRangeSlider = $(".facet-range-selector"); 265 _.each(searchFacetRangeSlider, function (elem) { 266 var searchFacetRangeSliderModel = new SearchFacetRangeSliderModel(), 267 searchFacetRangeSliderView = new SearchFacetRangeSliderView({ el: $(elem), model: searchFacetRangeSliderModel }); 268 }); 269 270 initialized = true; 271 }; 272 273 return api; 274 275}(jQuery, document)); 276 277XA.register('searchFacetRangeSlider', XA.component.search.facet.rangeslider);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.