Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Clear filters button

  • Loading branch information...
commit 7a3cee662ba1ecef62dd8a416dbb611360dba448 1 parent 526a35d
@Mr0grog Mr0grog authored
View
21 css/filterbar.css
@@ -57,6 +57,25 @@
color: #fff;
}
- #filters .unapplied-changes {
+ #filters.unapplied-changes > button {
background-color: #a8a7a7;
+ }
+
+ #filters > #filters_clear {
+ display: none;
+ width: 25px;
+ height: 25px;
+ margin: 0 0 0 5px;
+ padding: 0;
+ text-indent: -100em;
+ overflow: hidden;
+ background: url("../images/x.png");
+ }
+
+ #filters > #filters_clear:hover {
+ background: url("../images/x_hover.png");
+ }
+
+ #filters.has-filters > #filters_clear {
+ display: inline-block;
}
View
1  index.html
@@ -55,6 +55,7 @@
<li>Status: <span id="filters_status"></span></li>
</ul>
<button id="filters_apply">Apply</button>
+ <button id="filters_clear">Clear</button>
</section>
<div id="map"></div>
View
12 js/DailyBriefingController.js
@@ -136,6 +136,14 @@ DailyBriefingController.prototype = {
this._filterData(newFilters);
},
+ currentFiltersEqual: function (filters) {
+ return this.arraysAreEquivalent(filters.area, this.filterConditions.area) &&
+ this.arraysAreEquivalent(filters.states, this.filterConditions.states) &&
+ this.arraysAreEquivalent(filters.services, this.filterConditions.services) &&
+ filters.dateRange.from.getTime() === this.filterConditions.dateRange.from.getTime() &&
+ filters.dateRange.to.getTime() === this.filterConditions.dateRange.to.getTime();
+ },
+
_filterData: function (filters) {
filters = filters || this.filterConditions;
for (var state in this.allRequests) {
@@ -176,6 +184,10 @@ DailyBriefingController.prototype = {
// FIXME: this really shouldn't be here
// would be nice on Array.prototype...
arraysAreEquivalent: function (a, b) {
+ // if it's the same array or if both are null/undefined
+ if (a == b) {
+ return true;
+ }
if (!a || !b || a.length !== b.length) {
return false;
}
View
35 js/FilterBarController.js
@@ -16,10 +16,12 @@ var FilterBarController = function (appController) {
this.serviceSelector.subscribe("change", this);
this.applyButton = document.getElementById("filters_apply");
+ this.clearButton = document.getElementById("filters_clear");
this._initializeFilters();
this.applyButton.addEventListener("click", this, false);
+ this.clearButton.addEventListener("click", this, false);
};
FilterBarController.prototype = {
@@ -77,18 +79,23 @@ FilterBarController.prototype = {
},
handleEvent: function (event) {
- if (event.type === "change") {
- $(this.applyButton).addClass("unapplied-changes");
- return;
- }
- // this will all change when we have a more complicated multiselect control
- // var selectedService = this.serviceSelector.value;
- // var selectedState = this.statusSelector.value;
var selectedService = this.serviceSelector.getValue();
var selectedState = this.statusSelector.getValue();
var selectedArea = this.areaSelector.getValue();
- // TODO: should have something around default values
+ if (event.type === "change") {
+ $(this.element).addClass("unapplied-changes");
+ }
+
+ if (event.target === this.clearButton) {
+ this.serviceSelector.setValue();
+ this.statusSelector.setValue();
+ this.areaSelector.setValue();
+ selectedService = null;
+ selectedState = null;
+ selectedArea = null;
+ }
+
var filters = {
area: selectedArea || null,
services: selectedService ? selectedService : null,
@@ -96,9 +103,15 @@ FilterBarController.prototype = {
dateRange: this.app.filterConditions.dateRange
};
- // dispatch an event that the filter conditions have changed
- this.dispatchEvent("filtersChanged", filters);
- $(this.applyButton).removeClass("unapplied-changes");
+ if (event.target === this.applyButton) {
+ // dispatch an event that the filter conditions have changed
+ this.dispatchEvent("filtersChanged", filters);
+ $(this.element).removeClass("unapplied-changes");
+ }
+
+ $(this.element)
+ [selectedService || selectedState || selectedArea ? "addClass" : "removeClass"]("has-filters")
+ [this.app.currentFiltersEqual(filters) ? "removeClass" : "addClass"]("unapplied-changes");
}
};
Please sign in to comment.
Something went wrong with that request. Please try again.