From 6f1c6a0168dbc3e5179d8c88474768524f1faac3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= <tim@ascribe.io>
Date: Tue, 4 Aug 2015 13:28:44 +0200
Subject: [PATCH] add 'filter active' functionality to piece list filter widget

---
 .../piece_list_toolbar_filter_widget.js       | 20 +++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js
index 975bb9fc..ee178651 100644
--- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js
+++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js
@@ -5,7 +5,6 @@ import React from 'react';
 import PieceListStore from '../../stores/piece_list_store';
 import PieceListActions from '../../actions/piece_list_actions';
 
-import Glyphicon from 'react-bootstrap/lib/Glyphicon';
 import DropdownButton from 'react-bootstrap/lib/DropdownButton';
 import MenuItem from 'react-bootstrap/lib/MenuItem';
 
@@ -67,8 +66,25 @@ let PieceListToolbarFilterWidgetFilter = React.createClass({
         };
     },
 
+    isFilterActive() {
+        let trueValuesOnly = Object.keys(this.state.filterBy).filter((acl) => acl);
+
+        // We're hiding the star in that complicated matter so that,
+        // the surrounding button is not resized up on appearance
+        if(trueValuesOnly.length > 0) {
+            return { visibility: 'visible'};
+        } else {
+            return { visibility: 'hidden' };
+        }
+    },
+
     render() {
-        let filterIcon = <Glyphicon glyph='filter' className="filter-glyph"/>;
+        let filterIcon = (
+            <span>
+                <span className="glyphicon glyphicon-filter" aria-hidden="true"></span>
+                <span style={this.isFilterActive()}>*</span>
+            </span>
+        );
 
         return (
             <DropdownButton