2015-04-07 15:41:17 +00:00
|
|
|
define(["virtual-dom"], function (V) {
|
|
|
|
return function(headings, sortIndex, renderRow) {
|
2016-05-22 11:23:43 +00:00
|
|
|
var data;
|
|
|
|
var sortReverse = false;
|
|
|
|
var el = document.createElement("table");
|
|
|
|
var elLast = V.h("table");
|
2015-04-07 15:41:17 +00:00
|
|
|
|
|
|
|
function sortTable(i) {
|
2016-05-22 11:23:43 +00:00
|
|
|
sortReverse = i === sortIndex ? !sortReverse : false;
|
|
|
|
sortIndex = i;
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
updateView();
|
2015-04-07 15:41:17 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function sortTableHandler(i) {
|
2016-05-22 11:23:43 +00:00
|
|
|
return function () { sortTable(i); };
|
2015-04-07 15:41:17 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
function updateView() {
|
2016-05-22 11:23:43 +00:00
|
|
|
var children = [];
|
2015-04-07 15:41:17 +00:00
|
|
|
|
|
|
|
if (data.length !== 0) {
|
|
|
|
var th = headings.map(function (d, i) {
|
|
|
|
var properties = { onclick: sortTableHandler(i),
|
|
|
|
className: "sort-header"
|
2016-05-22 11:23:43 +00:00
|
|
|
};
|
2015-04-07 15:41:17 +00:00
|
|
|
|
|
|
|
if (sortIndex === i)
|
2016-05-22 11:23:43 +00:00
|
|
|
properties.className += sortReverse ? " sort-up" : " sort-down";
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
return V.h("th", properties, d.name);
|
|
|
|
});
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
var links = data.slice(0).sort(headings[sortIndex].sort);
|
2015-04-07 15:41:17 +00:00
|
|
|
|
|
|
|
if (headings[sortIndex].reverse ? !sortReverse : sortReverse)
|
2016-05-22 11:23:43 +00:00
|
|
|
links = links.reverse();
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
children.push(V.h("thead", V.h("tr", th)));
|
|
|
|
children.push(V.h("tbody", links.map(renderRow)));
|
2015-04-07 15:41:17 +00:00
|
|
|
}
|
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
var elNew = V.h("table", children);
|
|
|
|
el = V.patch(el, V.diff(elLast, elNew));
|
|
|
|
elLast = elNew;
|
2015-04-07 15:41:17 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
this.setData = function (d) {
|
2016-05-22 11:23:43 +00:00
|
|
|
data = d;
|
|
|
|
updateView();
|
|
|
|
};
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
this.el = el;
|
2015-04-07 15:41:17 +00:00
|
|
|
|
2016-05-22 11:23:43 +00:00
|
|
|
return this;
|
|
|
|
};
|
|
|
|
});
|