Skip to content

Commit

Permalink
Merge pull request #111 from frosetti/fr/shift_select_comparator
Browse files Browse the repository at this point in the history 
Fr/shift select comparator
  • Loading branch information
@TheOtherDude
TheOtherDude committed Feb 26, 2017
2 parents 7d4b2fd + 9fa2ee2 commit 8ab5b8d
Show file tree
Hide file tree
Showing 4 changed files with 74 additions and 80 deletions.
1 change: 0 additions & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,6 @@ Detailed API and example usage can be found in the sample application in tests/d
| `Sub Attribute` | `properties` | `array` | | Array of sortable attributes. eg. [{"label: "foo", "value": "bar"}], This is an attribute on frost-sort component.|
| `Sub Attribute` | `onSort` | `action closure` | | callback functions user provided to handle sorting. This is an attribute on frost-sort component.|
| `Attribute` | `itemComparator` | `action closure` | | callback functions user provided to handle custom item comparisons.|
| `Attribute` | `basicClickDisabled` | `boolean` | | Optional: set to true if you want to disable basic clicks, else false by default. Basic clicks select the item you clicked while deselecting everything else|


### Infinite scroll
Expand Down
7 changes: 1 addition & 6 deletions addon/components/frost-list.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,6 @@ export default Component.extend({
])),
onSelectionChange: PropTypes.func,
itemComparator: PropTypes.func,
basicClickDisabled: PropTypes.bool,

// Options - sub-components
pagination: PropTypes.EmberComponent,
Expand Down Expand Up @@ -77,7 +76,6 @@ export default Component.extend({
// Options - general
scrollTop: 0,
itemComparator: (rhs, lhs) => { return rhs === lhs },
basicClickDisabled: false,

// Smoke and mirrors options
alwaysUseDefaultHeight: false,
Expand Down Expand Up @@ -172,12 +170,9 @@ export default Component.extend({
_select ({isRangeSelect, isSpecificSelect, item}) {
const items = this.get('items')
const itemComparator = this.get('itemComparator')
const basicClickDisabled = this.get('basicClickDisabled')
const clonedSelectedItems = A(this.get('selectedItems').slice())
const _rangeState = this.get('_rangeState')
if (basicClickDisabled) {
isSpecificSelect = true
}

// Selects are proccessed in order of precedence: specific, range, basic
if (isSpecificSelect) {
selection.specific(clonedSelectedItems, item, _rangeState, itemComparator)
Expand Down
12 changes: 6 additions & 6 deletions addon/utils/selection.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export default {
rangeState['anchor'] = item

// New anchor, clear any previous endpoint
rangeState['endpoint'] = null
rangeState['endpoint'] = Ember.Object.create()
} else {
// Toggle the item selection

Expand All @@ -43,10 +43,10 @@ export default {
}

// Set the range anchor if selected, otherwise clear the anchor
rangeState['anchor'] = isSelected ? item : null
rangeState['anchor'] = isSelected ? item : Ember.Object.create()

// New or no anchor, clear any previous endpoint
rangeState['endpoint'] = null
rangeState['endpoint'] = Ember.Object.create()
}
},

Expand All @@ -71,7 +71,7 @@ export default {
rangeState['anchor'] = item

// New anchor, clear any previous endpoint
rangeState['endpoint'] = null
rangeState['endpoint'] = Ember.Object.create()

// Add the anchor to the selected items
selectedItems.pushObject(item)
Expand Down Expand Up @@ -134,9 +134,9 @@ export default {
const isSelected = !isCurrentlySelected

// Set the range anchor if selected, otherwise clear the anchor
rangeState['anchor'] = isSelected ? item : null
rangeState['anchor'] = isSelected ? item : Ember.Object.create()
// New or no anchor, clear any previous endpoint
rangeState['endpoint'] = null
rangeState['endpoint'] = Ember.Object.create()

// Store the selection
if (isSelected) {
Expand Down
134 changes: 67 additions & 67 deletions tests/integration/components/frost-list-test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,7 @@ describe(test.label, function () {
})
})

describe('supports pre selection with default itemComparator', function () {
describe('Supports pre selection with default itemComparator', function () {
beforeEach(function () {
const one = Ember.Object.create({isNotCompared: '0'})
const two = Ember.Object.create({isNotCompared: '1'})
Expand Down Expand Up @@ -151,7 +151,7 @@ describe(test.label, function () {
})
})

describe('supports pre selection with custom itemComparator', function () {
describe('Supports pre selection with custom itemComparator', function () {
beforeEach(function () {
const testItems = [
Ember.Object.create({id: '0'}),
Expand Down Expand Up @@ -185,7 +185,7 @@ describe(test.label, function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(false)
})

describe('when itemComparator set back to default', function () {
describe('When itemComparator is set back to default', function () {
beforeEach(function () {
this.render(hbs`
{{frost-list
Expand All @@ -206,7 +206,7 @@ describe(test.label, function () {
})
})

describe('supports basic and specific click', function () {
describe('Supports basic and specific click', function () {
beforeEach(function () {
const testItems = A([
Ember.Object.create({id: '0'}),
Expand All @@ -232,7 +232,7 @@ describe(test.label, function () {
return wait()
})

describe('when doing basic click', function () {
describe('When using basic click', function () {
beforeEach(function () {
$(hook('my-list-item', {index: 0})).click()
return wait()
Expand All @@ -246,7 +246,7 @@ describe(test.label, function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(false)
})

describe('when doing basic click on previous selected item', function () {
describe('When using basic click on previous selected item', function () {
beforeEach(function () {
$(hook('my-list-item', {index: 0})).click()
return wait()
Expand All @@ -262,7 +262,7 @@ describe(test.label, function () {
})
})

describe('when doing basic click and all is selected', function () {
describe('When using basic click and all is selected', function () {
beforeEach(function () {
$(hook('my-list-selection', {index: 0})).click()
$(hook('my-list-selection', {index: 1})).click()
Expand All @@ -279,7 +279,7 @@ describe(test.label, function () {
})
})

describe('when doing specific click on one item', function () {
describe('When using specific click on one item', function () {
beforeEach(function () {
$hook('my-list-selection', {index: 0}).click()
return wait()
Expand All @@ -292,7 +292,7 @@ describe(test.label, function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(false)
})

describe('when doing specific click to unselect previous item', function () {
describe('When using specific click to unselect previous item', function () {
beforeEach(function () {
$hook('my-list-selection', {index: 0}).click()
return wait()
Expand All @@ -307,7 +307,7 @@ describe(test.label, function () {
})
})

describe('when doing specific click on each item', function () {
describe('When using specific click on each item', function () {
beforeEach(function () {
$hook('my-list-selection', {index: 0}).click()
$hook('my-list-selection', {index: 1}).click()
Expand All @@ -321,7 +321,7 @@ describe(test.label, function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(true)
})

describe('when doing specific click to unselect each items', function () {
describe('When using specific click to unselect each items', function () {
beforeEach(function () {
$hook('my-list-selection', {index: 0}).click()
$hook('my-list-selection', {index: 1}).click()
Expand All @@ -339,60 +339,7 @@ describe(test.label, function () {
})
})

describe('when setting basicClickDisabled=true and using basic clicks', function () {
beforeEach(function () {
const testItems = A([
Ember.Object.create({id: '0'}),
Ember.Object.create({id: '1'})
])
this.set('items', testItems)
const testSelectedItems = A([])
this.set('selectedItems', testSelectedItems)
this.set('onSelectionChange', (selectedItems) => {
this.get('selectedItems').setObjects(selectedItems)
})
this.render(hbs`
{{frost-list
basicClickDisabled=true
item=(component 'frost-list-item')
hook='my-list'
items=items
selectedItems=selectedItems
onSelectionChange=onSelectionChange
}}
`)
return wait()
})

describe('when selecting both items', function () {
beforeEach(function () {
$hook('my-list-item', {index: 0}).click()
$hook('my-list-item', {index: 1}).click()
return wait()
})
it('item 0 is selected', function () {
expect($hook('my-list-item-container', {index: 0}).hasClass('is-selected')).to.eql(true)
})
it('item 1 is selected', function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(true)
})

describe('when unselecting item 0', function () {
beforeEach(function () {
$hook('my-list-item', {index: 0}).click()
return wait()
})
it('item 0 is not selected', function () {
expect($hook('my-list-item-container', {index: 0}).hasClass('is-selected')).to.eql(false)
})
it('item 1 is selected', function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(true)
})
})
})
})

describe('supports ranged based clicks', function () {
describe('Supports ranged based clicks', function () {
beforeEach(function () {
const testItems = A([
Ember.Object.create({id: '0'}),
Expand Down Expand Up @@ -422,7 +369,7 @@ describe(test.label, function () {
return wait()
})

describe('when doing shift click from item1-5', function () {
describe('When using shift click from item1-5', function () {
beforeEach(function () {
const clickEvent = $.Event('click')
clickEvent.shiftKey = true
Expand Down Expand Up @@ -455,8 +402,61 @@ describe(test.label, function () {
expect($hook('my-list-item-container', {index: 6}).hasClass('is-selected')).to.eql(false)
})
})

describe('When using custom itemComparator', function () {
beforeEach(function () {
this.set('itemComparator', (lhs, rhs) => {
return lhs.get('id') === rhs.get('id')
})
this.render(hbs`
{{frost-list
item=(component 'frost-list-item')
hook='my-list'
items=items
selectedItems=selectedItems
onSelectionChange=onSelectionChange
itemComparator=itemComparator
}}
`)
return wait()
})

describe('When using shift click from item1-5', function () {
beforeEach(function () {
const clickEvent = $.Event('click')
clickEvent.shiftKey = true
const clickEvent2 = $.Event('click')
clickEvent2.shiftKey = true
$(hook('my-list-item', {index: 1})).trigger(clickEvent)
$(hook('my-list-item', {index: 5})).trigger(clickEvent2)
return wait()
})

it('item 0 is not selected', function () {
expect($hook('my-list-item-container', {index: 0}).hasClass('is-selected')).to.eql(false)
})
it('item 1 is selected', function () {
expect($hook('my-list-item-container', {index: 1}).hasClass('is-selected')).to.eql(true)
})
it('item 2 is selected', function () {
expect($hook('my-list-item-container', {index: 2}).hasClass('is-selected')).to.eql(true)
})
it('item 3 is selected', function () {
expect($hook('my-list-item-container', {index: 3}).hasClass('is-selected')).to.eql(true)
})
it('item 4 is selected', function () {
expect($hook('my-list-item-container', {index: 4}).hasClass('is-selected')).to.eql(true)
})
it('item 5 is selected', function () {
expect($hook('my-list-item-container', {index: 5}).hasClass('is-selected')).to.eql(true)
})
it('item 6 is not selected', function () {
expect($hook('my-list-item-container', {index: 6}).hasClass('is-selected')).to.eql(false)
})
})
})
})
describe('supports item expansion', function () {
describe('Supports item expansion', function () {
beforeEach(function () {
const testItems = A([
Ember.Object.create({id: '0'}),
Expand Down

0 comments on commit 8ab5b8d

Please sign in to comment.