| <!DOCTYPE html> |
| <!-- |
| Copyright (c) 2016 The Chromium Authors. All rights reserved. |
| Use of this source code is governed by a BSD-style license that can be |
| found in the LICENSE file. |
| --> |
| |
| <link rel="import" href="/tracing/ui/base/checkbox.html"> |
| <link rel="import" href="/tracing/ui/base/ui.html"> |
| |
| <polymer-element name='tr-ui-b-checkbox-picker'> |
| <template> |
| <style> |
| #container { |
| display: flex; |
| flex-direction: column; |
| } |
| </style> |
| |
| <div id="container"> |
| </div> |
| |
| </template> |
| |
| <script> |
| 'use strict'; |
| |
| Polymer({ |
| created: function() { |
| this.needsInit_ = true; |
| this.settingsKey_ = undefined; |
| this.is_ready_ = false; |
| this.checkboxes_ = undefined; |
| }, |
| |
| ready: function() { |
| this.is_ready_ = true; |
| this.maybeInit_(); |
| this.maybeRenderCheckboxes_(); |
| }, |
| |
| get settingsKey() { |
| return this.settingsKey_; |
| }, |
| |
| set settingsKey(settingsKey) { |
| if (!this.needsInit_) |
| throw new Error('Already initialized.'); |
| this.settingsKey_ = settingsKey; |
| this.maybeInit_(); |
| }, |
| |
| maybeInit_: function() { |
| if (!this.needsInit_) |
| return; |
| if (this.settingsKey_ === undefined) |
| return; |
| if (this.checkboxes_ === undefined) |
| return; |
| |
| this.needsInit_ = false; |
| |
| for (var key in this.checkboxes_) { |
| this.checkboxes_[key].defaultCheckedValue = false; |
| this.checkboxes_[key].settingsKey = this.settingsKey_ + key; |
| } |
| }, |
| |
| set items(items) { |
| this.checkboxes_ = {}; |
| items.forEach(function(e) { |
| if (e.key in this.checkboxes_) |
| throw new Error(e.key + ' already exists'); |
| var checkboxEl = document.createElement('tr-ui-b-checkbox'); |
| checkboxEl.label = e.label; |
| this.checkboxes_[e.key] = checkboxEl; |
| }.bind(this)); |
| this.maybeInit_(); |
| this.maybeRenderCheckboxes_(); |
| }, |
| |
| maybeRenderCheckboxes_: function() { |
| if (!this.is_ready_) |
| return; |
| if (this.checkboxes_ === undefined) |
| return; |
| for (var key in this.checkboxes_) |
| this.$.container.appendChild(this.checkboxes_[key]); |
| }, |
| |
| selectCheckbox: function(key) { |
| if (!(key in this.checkboxes_)) |
| throw new Error(key + ' does not exists'); |
| this.checkboxes_[key].checked = true; |
| }, |
| |
| unselectCheckbox: function(key) { |
| if (!(key in this.checkboxes_)) |
| throw new Error(key + ' does not exists'); |
| this.checkboxes_[key].checked = false; |
| }, |
| |
| get checkedKeys() { |
| return Object.keys(this.checkboxes_).filter(function(k) { |
| return this.checkboxes_[k].checked; |
| }.bind(this)); |
| }, |
| |
| }); |
| </script> |
| </polymer-element> |
