jeudi 26 février 2015

How to apply 'Blink' feature in Ember Table?

in Ember Table, I need to change style of cell with the change of particular cell content. i need to add color to cell with value update (that i have already done) and remove styles after 1 second(that i want to do).


I have called to setTimeout when applying color and removed color within setTimeout. It does not work all the time. some cell colors are not removed. (this gets worse when scrolling). i assume after 1sec ember cannot find particular cell element. I use Ember table component and assigned contentBinding and columnBinding. and added a template for Ember.Table.TableCell component and added class names.


This is my table component



App.MyTableCellView = Ember.Table.TableCell.extend({
templateName: 'cell_view',
previousColumnValue: -1,
param: null,
clearStyles: Ember.computed(function () {
var self = this;
var currentVal = this.get('previousColumnValue');
setTimeout(function () {
self.set('param', -1);
}, 1000);
return null;
}).property('cellContent'),
customColor: Ember.computed(function () {
var column, row, _ref, preVal, currentVal, cellColor;
preVal = this.get('previousColumnValue');
currentVal = this.get('cellContent');
if (preVal && currentVal && preVal !== -1 && currentVal !== -1) {
if (preVal > currentVal) {
cellColor = 'red';
} else if (preVal < currentVal) {
cellColor = 'green';
} else if (this.get('param') === -1) {
cellColor = '';
this.set('param', 0);
}
}
this.set('previousColumnValue', currentVal);
return cellColor;
}).property('cellContent', 'param'),

styles: Ember.computed(function () {
var x = this.get('clearStyles');
return "height:30px; background-color:" + this.get('customColor') + ";'";

}).property('customColor', 'previousColumnValue')


this is html



<script type="text/x-handlebars" data-template-name="cell_view">
<div {{bind-attr style="view.styles" }}>
<span>
{{ view.cellContent}}
</span>
</div>
</script>


Please tell a way to remove style of a cell after 1 sec.





Aucun commentaire:

Enregistrer un commentaire