| OLD | NEW |
| 1 /** @polymerBehavior Polymer.IronMultiSelectableBehavior */ | 1 /** @polymerBehavior Polymer.IronMultiSelectableBehavior */ |
| 2 Polymer.IronMultiSelectableBehaviorImpl = { | 2 Polymer.IronMultiSelectableBehaviorImpl = { |
| 3 properties: { | 3 properties: { |
| 4 | 4 |
| 5 /** | 5 /** |
| 6 * If true, multiple selections are allowed. | 6 * If true, multiple selections are allowed. |
| 7 */ | 7 */ |
| 8 multi: { | 8 multi: { |
| 9 type: Boolean, | 9 type: Boolean, |
| 10 value: false, | 10 value: false, |
| (...skipping 14 matching lines...) Expand all Loading... |
| 25 */ | 25 */ |
| 26 selectedItems: { | 26 selectedItems: { |
| 27 type: Array, | 27 type: Array, |
| 28 readOnly: true, | 28 readOnly: true, |
| 29 notify: true | 29 notify: true |
| 30 }, | 30 }, |
| 31 | 31 |
| 32 }, | 32 }, |
| 33 | 33 |
| 34 observers: [ | 34 observers: [ |
| 35 '_updateSelected(attrForSelected, selectedValues)' | 35 '_updateSelected(selectedValues)' |
| 36 ], | 36 ], |
| 37 | 37 |
| 38 /** | 38 /** |
| 39 * Selects the given value. If the `multi` property is true, then the select
ed state of the | 39 * Selects the given value. If the `multi` property is true, then the select
ed state of the |
| 40 * `value` will be toggled; otherwise the `value` will be selected. | 40 * `value` will be toggled; otherwise the `value` will be selected. |
| 41 * | 41 * |
| 42 * @method select | 42 * @method select |
| 43 * @param {string|number} value the value to select. | 43 * @param {string|number} value the value to select. |
| 44 */ | 44 */ |
| 45 select: function(value) { | 45 select: function(value) { |
| (...skipping 10 matching lines...) Expand all Loading... |
| 56 | 56 |
| 57 multiChanged: function(multi) { | 57 multiChanged: function(multi) { |
| 58 this._selection.multi = multi; | 58 this._selection.multi = multi; |
| 59 }, | 59 }, |
| 60 | 60 |
| 61 get _shouldUpdateSelection() { | 61 get _shouldUpdateSelection() { |
| 62 return this.selected != null || | 62 return this.selected != null || |
| 63 (this.selectedValues != null && this.selectedValues.length); | 63 (this.selectedValues != null && this.selectedValues.length); |
| 64 }, | 64 }, |
| 65 | 65 |
| 66 _updateAttrForSelected: function() { |
| 67 if (!this.multi) { |
| 68 Polymer.IronSelectableBehavior._updateAttrForSelected.apply(this); |
| 69 } else if (this._shouldUpdateSelection) { |
| 70 this.selectedValues = this.selectedItems.map(function(selectedItem) { |
| 71 return this._indexToValue(this.indexOf(selectedItem)); |
| 72 }, this).filter(function(unfilteredValue) { |
| 73 return unfilteredValue != null; |
| 74 }, this); |
| 75 } |
| 76 }, |
| 77 |
| 66 _updateSelected: function() { | 78 _updateSelected: function() { |
| 67 if (this.multi) { | 79 if (this.multi) { |
| 68 this._selectMulti(this.selectedValues); | 80 this._selectMulti(this.selectedValues); |
| 69 } else { | 81 } else { |
| 70 this._selectSelected(this.selected); | 82 this._selectSelected(this.selected); |
| 71 } | 83 } |
| 72 }, | 84 }, |
| 73 | 85 |
| 74 _selectMulti: function(values) { | 86 _selectMulti: function(values) { |
| 75 this._selection.clear(); | |
| 76 if (values) { | 87 if (values) { |
| 77 for (var i = 0; i < values.length; i++) { | 88 var selectedItems = this._valuesToItems(values); |
| 78 this._selection.setItemSelected(this._valueToItem(values[i]), true); | 89 // clear all but the current selected items |
| 90 this._selection.clear(selectedItems); |
| 91 // select only those not selected yet |
| 92 for (var i = 0; i < selectedItems.length; i++) { |
| 93 this._selection.setItemSelected(selectedItems[i], true); |
| 79 } | 94 } |
| 95 } else { |
| 96 this._selection.clear(); |
| 80 } | 97 } |
| 81 }, | 98 }, |
| 82 | 99 |
| 83 _selectionChange: function() { | 100 _selectionChange: function() { |
| 84 var s = this._selection.get(); | 101 var s = this._selection.get(); |
| 85 if (this.multi) { | 102 if (this.multi) { |
| 86 this._setSelectedItems(s); | 103 this._setSelectedItems(s); |
| 87 } else { | 104 } else { |
| 88 this._setSelectedItems([s]); | 105 this._setSelectedItems([s]); |
| 89 this._setSelectedItem(s); | 106 this._setSelectedItem(s); |
| 90 } | 107 } |
| 91 }, | 108 }, |
| 92 | 109 |
| 93 _toggleSelected: function(value) { | 110 _toggleSelected: function(value) { |
| 94 var i = this.selectedValues.indexOf(value); | 111 var i = this.selectedValues.indexOf(value); |
| 95 var unselected = i < 0; | 112 var unselected = i < 0; |
| 96 if (unselected) { | 113 if (unselected) { |
| 97 this.push('selectedValues',value); | 114 this.push('selectedValues',value); |
| 98 } else { | 115 } else { |
| 99 this.splice('selectedValues',i,1); | 116 this.splice('selectedValues',i,1); |
| 100 } | 117 } |
| 101 this._selection.setItemSelected(this._valueToItem(value), unselected); | 118 this._selection.setItemSelected(this._valueToItem(value), unselected); |
| 119 }, |
| 120 |
| 121 _valuesToItems: function(values) { |
| 122 return (values == null) ? null : values.map(function(value) { |
| 123 return this._valueToItem(value); |
| 124 }, this); |
| 102 } | 125 } |
| 103 }; | 126 }; |
| 104 | 127 |
| 105 /** @polymerBehavior */ | 128 /** @polymerBehavior */ |
| 106 Polymer.IronMultiSelectableBehavior = [ | 129 Polymer.IronMultiSelectableBehavior = [ |
| 107 Polymer.IronSelectableBehavior, | 130 Polymer.IronSelectableBehavior, |
| 108 Polymer.IronMultiSelectableBehaviorImpl | 131 Polymer.IronMultiSelectableBehaviorImpl |
| 109 ]; | 132 ]; |
| OLD | NEW |