Skip to content
This repository has been archived by the owner on Jan 18, 2020. It is now read-only.

Commit

Permalink
Merge pull request #43 from cbmi/issue-30
Browse files Browse the repository at this point in the history
Add column headers and enable sorting on results table
  • Loading branch information
bruth committed Jan 24, 2014
2 parents e30a6f3 + 9f2a370 commit 3ba003b
Show file tree
Hide file tree
Showing 10 changed files with 247 additions and 4 deletions.
21 changes: 21 additions & 0 deletions varify/static/cilantro/js/templates/varify/tables/header.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<tr>
<th title='Gene' data-concept-id=5>
<span>Gene<i class='icon-sort'></i></span>
</th>
<th title='HGVS P' data-concept-id=21>
<span>HGVS P<i class='icon-sort'></i></span>
</th>
<th title='Variant Effect' data-concept-id=10>
<span>Effect<i class='icon-sort'></i></span>
</th>
<th title='HGVS C' data-concept-id=19>
<span>HGVS C<i class='icon-sort'></i></span>
</th>
<th title='Genotype' data-concept-id=16>
<span>Genotype<i class='icon-sort'></i></span>
</th>
<th title='Genomic Position' data-concept-id=1>
<span>Position<i class='icon-sort'></i></span>
</th>
<th title='Condensed Flags' class='unsortable-column'></th>
</tr>
1 change: 1 addition & 0 deletions varify/static/scripts/coffeescript/ui/tables.coffee
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
define [
'underscore'
'./tables/body'
'./tables/header'
'./tables/row'
'./tables/table'
], (_, mods...) ->
Expand Down
83 changes: 83 additions & 0 deletions varify/static/scripts/coffeescript/ui/tables/header.coffee
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
define [
'underscore'
'marionette'
'tpl!templates/varify/tables/header.html'
], (_, Marionette, templates...) ->

templates = _.object ['header'], templates

class Header extends Marionette.ItemView
tagName: 'thead'

template: templates.header

events:
'click th': 'onClick'

initialize: ->
@data = {}
if not (@data.view = @options.view)
throw new Error 'view model required'

_getConcept: (element) ->
concept = parseInt(element.getAttribute('data-concept-id'))

if concept? and not isNaN(concept)
return concept

# It is possible we registered a click event on a child of the
# th element. If that is the case, try to read the concept from
# parent of the event target.
return parseInt(element.parentElement.getAttribute('data-concept-id'))

onClick: (event) =>
concept = @_getConcept(event.target)

if not concept? or isNaN(concept)
throw new Error 'Unrecognized concept ID on column'

model = _.find @data.view.facets.models, (f) ->
return f.get('concept') == concept

# If this column is not in the view already, add it in before
# updating the view sort properties.
if not model?
@data.view.facets.add({concept: concept})

_.each @data.view.facets.models, (f) ->
if f.get('concept') == concept
direction = f.get('sort')

if direction?
if direction.toLowerCase() == "asc"
f.set('sort', "desc")
f.set('sort_index', 0)
else
f.unset('sort')
f.unset('sort_index')
else
f.set('sort', "asc")
f.set('sort_index', 0)
else
f.unset('sort')
f.unset('sort_index')

@data.view.save()

onRender: =>
_.each @data.view.facets.models, (f) ->
$sortIcon = $("th[data-concept-id=#{ f.get('concept') }] i")

if $sortIcon?
$sortIcon.removeClass('icon-sort icon-sort-up icon-sort-down')

direction = (f.get('sort') or '').toLowerCase()

sortClass = switch direction
when 'asc' then 'icon-sort-up'
when 'desc' then 'icon-sort-down'
else 'icon-sort'

$sortIcon.addClass(sortClass)

{ Header }
13 changes: 12 additions & 1 deletion varify/static/scripts/coffeescript/ui/tables/table.coffee
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@ define [
'underscore'
'marionette'
'./body'
], (_, Marionette, body) ->
'./header'
], (_, Marionette, body, header) ->


# Renders a table with one or more tbody elements each representing a
Expand All @@ -23,10 +24,20 @@ define [
'change:currentpage': 'showCurentPage'

initialize: ->
@data = {}
if not (@data.view = @options.view)
throw new Error 'view model required'

@header = new header.Header
view: @data.view

@$el.append(@header.render().el)

@collection.on 'reset', =>
if @collection.objectCount == 0
@$el.hide()
else
@header.render()
@$el.show()

showCurentPage: (model, num, options) ->
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -484,6 +484,7 @@ define [

@table.show new tables.ResultTable
collection: @data.results
view: @data.view

@table.currentView.on 'render', () =>
@$('.context').stacked('restack', @$el.height())
Expand Down
2 changes: 1 addition & 1 deletion varify/static/scripts/javascript/src/ui/tables.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

111 changes: 111 additions & 0 deletions varify/static/scripts/javascript/src/ui/tables/header.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

11 changes: 10 additions & 1 deletion varify/static/scripts/javascript/src/ui/tables/table.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion varify/static/scripts/javascript/src/ui/workflows/results.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions varify/static/stylesheets/scss/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,11 @@ body {
margin-top: 10px;
}

.unsortable-column {
cursor: auto;
pointer-events: none;
}

// Override Cilantro style
.table-region {
margin-top: 10px !important;
Expand Down

0 comments on commit 3ba003b

Please sign in to comment.