aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoreperelm2 <emily_perelman@brown.edu>2023-07-25 12:30:07 -0400
committereperelm2 <emily_perelman@brown.edu>2023-07-25 12:30:07 -0400
commit14032744483a7fc83d552ccbe263cf9ec487fa25 (patch)
treee04406ac81c27a4aec9fa7d9a038d0598f11c8dd
parentb3c0db8e2d6f29b6b09474b8252760e95f80de95 (diff)
filters - collapsing works (w/o ui improvement)
-rw-r--r--src/client/views/FilterPanel.scss7
-rw-r--r--src/client/views/FilterPanel.tsx26
2 files changed, 22 insertions, 11 deletions
diff --git a/src/client/views/FilterPanel.scss b/src/client/views/FilterPanel.scss
index bb1e79d11..d774983a7 100644
--- a/src/client/views/FilterPanel.scss
+++ b/src/client/views/FilterPanel.scss
@@ -215,6 +215,13 @@
font-size: 16;
}
+
+
+}
+.filterbox-collpasedAndActive{
+ left:100px;
+ background-color: pink;
+ font-size: 100px;
}
diff --git a/src/client/views/FilterPanel.tsx b/src/client/views/FilterPanel.tsx
index c99967ef7..4cfc02ff7 100644
--- a/src/client/views/FilterPanel.tsx
+++ b/src/client/views/FilterPanel.tsx
@@ -115,6 +115,9 @@ export class FilterPanel extends React.Component<filterProps> {
@observable _chosenFacets = new ObservableMap<string, 'text' | 'checkbox' | 'slider' | 'range'>();
@observable _chosenFacetsCollapse = new ObservableMap<string, boolean>();
@observable _currentActiveFilters = new ObservableMap<string, string>();
+ @observable _collapseReturnKeys = new Array();
+
+ // let returnKeys = [];
@computed get activeFacets() {
// console.log("chosen collpase " + this._chosenFacetsCollapse)
@@ -154,20 +157,16 @@ export class FilterPanel extends React.Component<filterProps> {
this._chosenFacetsCollapse.set(facetHeader, false)
};
+
@action
sortingCurrentFacetValues = (facetHeader:string) => {
-
- let returnKeys = [];
-
- console.log("this is current filtes " + this._currentActiveFilters)
+
for (var key of this.facetValues(facetHeader)){
console.log("key : " + key )
if (this._currentActiveFilters.get(key)){
- console.log("pushing")
- returnKeys.push(key)
+ this._collapseReturnKeys.push(key)
}}
- console.log("this is return keys " + returnKeys)
- return returnKeys.toString();
+ return this._collapseReturnKeys.toString();
}
@@ -241,7 +240,7 @@ export class FilterPanel extends React.Component<filterProps> {
for (var key of this.facetValues(facetHeader)){
if (this._currentActiveFilters.get(key)){
Doc.setDocFilter(this.targetDoc, facetHeader, key, 'remove')
- this._currentActiveFilters.delete(facetHeader)
+ this._currentActiveFilters.delete(key)
}}
this.activeFacets.delete(facetHeader)
@@ -256,7 +255,9 @@ export class FilterPanel extends React.Component<filterProps> {
</div>
{ this._chosenFacetsCollapse.get(facetHeader) ?
- this.sortingCurrentFacetValues(facetHeader) : this.displayFacetValueFilterUIs(this.activeFacets.get(facetHeader), facetHeader) }
+ <div className = 'filterbox-collpasedAndActive'> {this.sortingCurrentFacetValues(facetHeader)} </div> && this._collapseReturnKeys.splice(0)
+
+ : this.displayFacetValueFilterUIs(this.activeFacets.get(facetHeader), facetHeader) }
{/* */}
</div>
))}
@@ -296,7 +297,7 @@ export class FilterPanel extends React.Component<filterProps> {
type={type}
onChange={undoable(e => Doc.setDocFilter(this.targetDoc, facetHeader, fval, e.target.checked ? 'check' : 'remove'), 'set filter')}
onClick={undoable (e =>
- e.target.checked ? this._currentActiveFilters.set(fval, facetHeader) : this._currentActiveFilters.delete(facetHeader) , 'set filter'
+ e.target.checked ? this._currentActiveFilters.set(fval, facetHeader) : this._currentActiveFilters.delete(fval) , 'set filter'
) }
@@ -308,3 +309,6 @@ export class FilterPanel extends React.Component<filterProps> {
}
}
}
+
+
+// NEED TO LEARN HOW TO RESET FILTERS WHEN WEBPAGE IS RELOADED \ No newline at end of file