Slide 16
Slide 16 text
Typescript (Cycle.js)
About as you’d expect
function main({DOM}) {
let actions = intent(DOM);
let state$ = model(actions);
let vtree$ = view(state$);
return { DOM: vtree$ };
}
run(main, {
DOM: makeDOMDriver('#app')
});
function makeVisibleIndices$(
tableHeight$ : Stream,
rowHeight$ : Stream,
rowCount$ : Stream,
scrollTop$ : Stream
) {
let firstVisibleRow$ = xs.combine(scrollTop$,
rowHeight$)
.map(([scrollTop, rowHeight]) =>
Math.floor(scrollTop / rowHeight))
.compose(dropRepeats());
let visibleRows$ = xs.combine(tableHeight$,
rowHeight$)
.map(([tableHeight, rowHeight]) => Math.ceil
(tableHeight / rowHeight)
);
let visibleIndices$ =
xs.combine(rowCount$, visibleRows$,
firstVisibleRow$)
.map(([rowCount, visibleRows,
firstVisibleRow]) => {
let visibleIndices : number[] = [];
let lastRow = firstVisibleRow +
visibleRows;
for (let i = firstVisibleRow; i <=
lastRow; i++) {
visibleIndices.push(i);
}