diff --git a/addon/components/sortable-table-header.coffee b/addon/components/sortable-table-header.coffee new file mode 100644 index 0000000..b39edf5 --- /dev/null +++ b/addon/components/sortable-table-header.coffee @@ -0,0 +1,55 @@ +import Ember from 'ember' +import layout from '../templates/components/sortable-table-header' + +export default Ember.Component.extend + layout: layout + tagName: 'th' + classNames: ['sortable-table-header'] + classNameBindings: ['isSortedByKey:sorted', 'sortDirectionClass'] + filters: Ember.Object.create() + tScope: '' + direction: 'asc' + init: -> + @_super arguments... + Ember.defineProperty @, 'filter_calls', Ember.computed.alias("filters.filter_calls") + + sortDirectionClass: Ember.computed 'isSortedByKey', -> + return false unless @get('isSortedByKey') + if @get('direction') is 'desc' then 'descending' else 'ascending' + + + isSortedByKey: Ember.computed 'filters.s', -> + return false unless s = @get('filters.s') + if Ember.isArray s + return false unless sort_statement = Ember.get(s, 'firstObject') + else if typeof s is 'string' + sort_statement = s + else + false + [sort_key, direction] = sort_statement.split(/\s+/) + direction ||= 'asc' + @set 'direction', direction + sort_key is @get('key') + + headerContent: Ember.computed 'key', 'tScope', -> + return '?' unless key = @get('key') + if t_scope = @get('tScope') + t key, scope: t_scope + else + key.replace(/[_\W]+/g, ' ').capitalize() + + click: -> + return unless key = @get('key') + if isSortedByKey = @get('isSortedByKey') + if @get('direction') is 'asc' + @set 'filters.s', "#{key} desc" + else + @set 'filters.s', "#{key} asc" + else + default_direction = if key.match /date/ then 'desc' else 'asc' + @set 'filters.s', "#{key} #{default_direction}" + #debugger + #@get('afterburn')() # call action if given + @get('model')?.reload?() + #@sendAction 'action' + #@get('filters.reload')() if typeof @get('filters.reload') is 'function' diff --git a/addon/templates/components/sortable-table-header.emblem b/addon/templates/components/sortable-table-header.emblem new file mode 100644 index 0000000..f8940a4 --- /dev/null +++ b/addon/templates/components/sortable-table-header.emblem @@ -0,0 +1,4 @@ +if hasBlock + = yield +else + = headerContent diff --git a/addon/utils/paged-remote-array.coffee b/addon/utils/paged-remote-array.coffee index 84ae631..d2c74f1 100644 --- a/addon/utils/paged-remote-array.coffee +++ b/addon/utils/paged-remote-array.coffee @@ -10,11 +10,14 @@ export default PagedRemoteArray.extend @otherParams['q'] = query #@setOtherParam('q', query) # explicitly not, init does not trigger operational callbacks @_super arguments... + reload: -> query = @get('filters')?.toProperties() || {} + @incrementProperty('filters.filter_calls') @set 'page', 1 @set 'lastPage', null @setOtherParam('q', query) + paramMapping: total_pages: 'total-pages' total_count: 'total-count' diff --git a/app/components/sortable-table-header.js b/app/components/sortable-table-header.js new file mode 100644 index 0000000..6e7e428 --- /dev/null +++ b/app/components/sortable-table-header.js @@ -0,0 +1 @@ +export { default } from 'ember-cli-dunlop/components/sortable-table-header'; diff --git a/package.json b/package.json index d3ac844..ae67894 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "ember-cli-shims": "^1.0.2", "ember-cli-sri": "^2.1.0", "ember-cli-uglify": "^1.2.0", + "ember-composable-helpers": "^2.1.0", "ember-export-application-global": "^1.0.5", "ember-get-config": "^0.2.1", "ember-load-initializers": "^1.0.0", diff --git a/tests/dummy/app/routes/table-filters/test1.coffee b/tests/dummy/app/routes/table-filters/test1.coffee index 41c74ad..d678fd0 100644 --- a/tests/dummy/app/routes/table-filters/test1.coffee +++ b/tests/dummy/app/routes/table-filters/test1.coffee @@ -20,7 +20,11 @@ export default Ember.Route.extend model: (params) -> #@store.findAll('epots/migration-window-planning') otherParams = {q: default_filter.toProperties()} - result = PagedArray.create [], perPage: 7 + result = PagedArray.create [], + perPage: 7 + reload: -> + console.log "Model reload called with filter:" + console.log default_filter.toProperties() result.setOtherParam = (param, q) -> window.last_set_param ||= {} window.last_set_param[param] = q # all is allowed for the purpose of testing and time conservation :devil: diff --git a/tests/dummy/app/templates/table-filters/test1.emblem b/tests/dummy/app/templates/table-filters/test1.emblem index 59325eb..671d30f 100644 --- a/tests/dummy/app/templates/table-filters/test1.emblem +++ b/tests/dummy/app/templates/table-filters/test1.emblem @@ -1,9 +1,14 @@ -table.ui.celled.striped.compact.table +table.ui.celled.striped.compact.table.sortable thead tr - th input - th option-buttons - th date-range + /th input + = sortable-table-header filters=filters key='name' model=model + /th option-buttons + = sortable-table-header filters=filters key='number_of_migration_windows' model=model + span # cutovers (filter.option-buttons) + /th date-range + = sortable-table-header filters=filters key='target_date' model=model + /= sortable-table-header filters=filters key='target_date' action=(invoke 'reload' model) model=model th select-multiple th select-multiple-modal th CUSTOM diff --git a/tests/integration/components/sortable-table-header-test.coffee b/tests/integration/components/sortable-table-header-test.coffee new file mode 100644 index 0000000..1831233 --- /dev/null +++ b/tests/integration/components/sortable-table-header-test.coffee @@ -0,0 +1,25 @@ +import { test, moduleForComponent } from 'ember-qunit' +import hbs from 'htmlbars-inline-precompile' + +moduleForComponent 'sortable-table-header', 'Integration | Component | sortable table header', { + integration: true +} + +test 'it renders', (assert) -> + assert.expect 2 + + # Set any properties with @set 'myProperty', 'value' + # Handle any actions with @on 'myAction', (val) -> + + @render hbs """{{sortable-table-header}}""" + + assert.equal @$().text().trim(), '' + + # Template block usage: + @render hbs """ + {{#sortable-table-header}} + template block text + {{/sortable-table-header}} + """ + + assert.equal @$().text().trim(), 'template block text'