refactor topic list header to use a raw template
This commit is contained in:
parent
3f0a4b9e52
commit
f0ca6150d8
|
@ -5,6 +5,8 @@ export default Ember.Component.extend(StringBuffer, {
|
|||
|
||||
rerenderTriggers: ['order', 'ascending'],
|
||||
|
||||
rawTemplate: 'components/topic-list-header.raw',
|
||||
|
||||
click: function(e) {
|
||||
var target = $(e.target);
|
||||
|
||||
|
@ -18,52 +20,4 @@ export default Ember.Component.extend(StringBuffer, {
|
|||
}
|
||||
|
||||
},
|
||||
|
||||
renderColumn: function(buffer, options){
|
||||
var className = options.sortable ? "sortable " : "";
|
||||
className += options.order || "";
|
||||
|
||||
var sortIcon = "";
|
||||
if(this.get("order") === options.order && options.sortable){
|
||||
className += " sorting";
|
||||
sortIcon = " <i class='fa fa-chevron-" + (this.get('ascending') ? 'up' : 'down') + "'></i>";
|
||||
}
|
||||
|
||||
if(options.number){
|
||||
className += " num";
|
||||
}
|
||||
|
||||
var name = options.forceName || I18n.t(options.name);
|
||||
|
||||
buffer.push("<th data-sort-order='" + options.order + "' class='"+ className +"'>" + name + sortIcon + "</th>");
|
||||
},
|
||||
|
||||
renderString: function(buffer){
|
||||
var self = this;
|
||||
|
||||
if(this.get('currentUser')){
|
||||
buffer.push("<th class='star'>");
|
||||
if(this.get('canBulkSelect')){
|
||||
var title = I18n.t('topics.bulk.toggle');
|
||||
buffer.push("<button class='btn bulk-select' title='" + title + "'><i class='fa fa-list'></i></button>");
|
||||
}
|
||||
buffer.push("</th>");
|
||||
}
|
||||
|
||||
var column = function(options){
|
||||
self.renderColumn(buffer, options);
|
||||
};
|
||||
|
||||
column({name: 'topic.title', sortable: false, order: 'default'});
|
||||
|
||||
if(!this.get('hideCategory')) {
|
||||
column({name: 'category_title', sortable: true, order: 'category'});
|
||||
}
|
||||
|
||||
column({sortable: false, order: 'posters', name: 'users'});
|
||||
column({sortable: true, order: 'posts', name: 'posts', number: true});
|
||||
column({sortable: true, order: 'views', name: 'views', number: true});
|
||||
column({sortable: true, order: 'activity', name: 'activity', number: true});
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
@ -0,0 +1,5 @@
|
|||
<th data-sort-order='{{order}}' class='{{view.className}}'>{{view.localizedName}}
|
||||
{{~#if view.isSorting}}
|
||||
<i class='{{view.sortClass}}'></i>
|
||||
{{/if ~}}
|
||||
</th>
|
|
@ -0,0 +1,15 @@
|
|||
{{#if currentUser}}
|
||||
<th class='star'>
|
||||
{{#if canBulkSelect}}
|
||||
<button class='btn bulk-select' title='{{i18n "topics.bulk.toggle"}}'><i class='fa fa-list'></i></button>
|
||||
{{/if}}
|
||||
</th>
|
||||
{{/if}}
|
||||
{{raw "components/topic-list-header-column" order='default' name='topic.title'}}
|
||||
{{#unless parent.hideCategory}}
|
||||
{{raw "components/topic-list-header-column" sortable='true' order='category' name='category_title'}}
|
||||
{{/unless}}
|
||||
{{raw "components/topic-list-header-column" order='posters' name='users'}}
|
||||
{{raw "components/topic-list-header-column" sortable='true' number='true' order='posts' name='posts'}}
|
||||
{{raw "components/topic-list-header-column" sortable='true' number='true' order='views' name='views'}}
|
||||
{{raw "components/topic-list-header-column" sortable='true' number='true' order='activity' name='activity'}}
|
|
@ -0,0 +1,38 @@
|
|||
export default Ember.Object.extend({
|
||||
|
||||
localizedName: function(){
|
||||
if(this.forceName){
|
||||
return this.forceName;
|
||||
}
|
||||
|
||||
return I18n.t(this.name);
|
||||
}.property(),
|
||||
|
||||
sortClass: function(){
|
||||
return "fa fa-chevron-" + (this.parent.get("ascending") ? "up" : "down");
|
||||
}.property(),
|
||||
|
||||
isSorting: function(){
|
||||
return this.sortable && this.parent.get("order") === this.order;
|
||||
}.property(),
|
||||
|
||||
className: function(){
|
||||
var name = [];
|
||||
if(this.order){
|
||||
name.push(this.order);
|
||||
}
|
||||
if(this.sortable){
|
||||
name.push("sortable");
|
||||
|
||||
if(this.get("isSorting")){
|
||||
name.push("sorting");
|
||||
}
|
||||
}
|
||||
|
||||
if(this.number){
|
||||
name.push("num");
|
||||
}
|
||||
|
||||
return name.join(' ');
|
||||
}.property()
|
||||
});
|
Loading…
Reference in New Issue