| <link rel="import" href="../../../../../third-party/polymer/polymer.html"> |
| <link rel="import" href="../../../../../third-party/paper-toggle-button/paper-toggle-button.html"> |
| <polymer-element name="p2b-grid-filter-toggle" attributes="key checked label" grid-filter expects-grid-state> |
| <template> |
| <link rel="stylesheet" href="component.css"> |
| <link rel="stylesheet" href="../common.css"> |
| <div class="filter-container"> |
| <h3>{{label}}</h3> |
| <paper-toggle-button id="toggle" on-change="{{ updateGridState }}" checked?="{{ checked }}"></paper-toggle-button> |
| </div> |
| </template> |
| <script> |
| Polymer('p2b-grid-filter-toggle', { |
| /* |
| * Label text for the toggle filter |
| * @type {string} |
| */ |
| label: '', |
| |
| /* |
| * Whether toggle is checked or not |
| * @type {boolean} |
| */ |
| checked: false, |
| |
| /* |
| * Key that will be added to filters map passed to the fetch() function of your data source. |
| * @type {string} |
| */ |
| key: '', |
| updateGridState: function() { |
| this.gridState.filters[this.key] = this.$.toggle.checked; |
| } |
| }); |
| </script> |
| </polymer-element> |
