import Ember from 'ember';
import RegisterTableComponentMixin from 'ember-table/mixins/register-table-component';

export default Ember.View.extend(RegisterTableComponentMixin,{
  templateName: 'column-sort-indicator',

  classNames: [ 'column-sort-indicator'],

  classNameBindings: ['columnCellStyle'],

  tagName: 'span',

  column: null,

  sortOrder: Ember.computed(function () {
    var sortingColumns = this.get('tableComponent.sortingColumns');
    if (sortingColumns && sortingColumns.get('isMultipleColumns')) {
      var index = sortingColumns.findOrder(this.get('column'));
      return index > 0 ? index: "";
    }
    return "";
  }).property('tableComponent.sortingColumns._columns'),

  columnCellStyle: Ember.computed(function(){
    var columnClasses = [];
    columnClasses = columnClasses.concat(this.get('column.sortIndicatorStyles'));
    return columnClasses.join(' ');
  }).property('column.sortIndicatorStyles')
});

@@ -217,51 +217,8 @@
 ',%0A%0A
-  classNames: %5B 'column-sort-indicator'%5D,%0A%0A
   cl
@@ -722,16 +722,39 @@
 sses = %5B
+'column-sort-indicator'
 %5D;%0A    c

use classNameBinding to repalce classNames in Ember.view