Mirroristas/gun
2
0
Fork 0
mirror of https://github.com/amark/gun.git synced 2025-06-05 21:56:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

cleanup

Browse Source
This commit is contained in:
Martti Malmi 2020-09-18 11:07:56 +03:00
parent 866e8594d6
commit 773d5cba25
4 changed files with 26 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
examples/infinite-scroll/InfiniteScrollWindow.js → examples/infinite-scroll/ScrollWindow.js
View File

@ -3,32 +3,35 @@ const DEFAULT_OPTIONS = {
stickTo: 'top',
};
class InfiniteScrollWindow {
class ScrollWindow {
constructor(gunNode, opts = {}) {
this.opts = Object.assign(DEFAULT_OPTIONS, opts);
this.elements = new Map();
this.node = gunNode;
this.center = this.opts.startAt;
this.updateListeners();
this.updateSubscriptions();
}
updateListeners() {
updateSubscriptions() {
this.upSubscription && this.upSubscription.off();
this.downSubscription && this.downSubscription.off();
const subscribe = params => {
this.node.get({ '.': params}).map().on((val, key, a, eve) => {
if (params['-']) {
this.downSubscription = eve;
} else {
this.upSubscription = eve;
}
this._addElement(key, val);
});
};
if (this.center) {
this.node.get({ '.': { '>': this.center, '<': '\uffff' }}).map().on((val, key, a, eve) => {
this.upSubscription = eve;
this._addElement(key, val);
});
this.node.get({ '.': { '<': this.center, '>' : '', '-': true }}).map().on((val, key, a, eve) => {
this.downSubscription = eve;
this._addElement(key, val);
});
subscribe({ '>': this.center, '<': '\uffff' });
subscribe({'<': this.center, '>' : '', '-': true});
} else {
this.node.get({ '.': { '<': '\uffff', '>': '', '-': this.opts.stickTo === 'top' }}).map().on((val, key, a, eve) => {
this.upSubscription = eve;
this._addElement(key, val);
});
subscribe({ '<': '\uffff', '>': '', '-': this.opts.stickTo === 'top' });
}
}
@ -46,7 +49,7 @@ class InfiniteScrollWindow {
const newMiddleIndex = Math.max(Math.min(half + n, keys.length - 1), 0);
if (this.center !== keys[newMiddleIndex]) {
this.center = keys[newMiddleIndex];
this.updateListeners();
this.updateSubscriptions();
}
return this.center;
}
@ -62,7 +65,7 @@ class InfiniteScrollWindow {
_topOrBottom(top) {
this.opts.stickTo = top ? 'top' : 'bottom';
this.center = null;
this.updateListeners();
this.updateSubscriptions();
}
top() {

6
examples/infinite-scroll/index.html
View File

@ -5,7 +5,7 @@
<link rel="stylesheet" type="text/css" href="./style.css">
<script src="/jquery.js"></script>
<script src="/gun.js"></script>
<script src="./InfiniteScrollWindow.js"></script>
<script src="./ScrollWindow.js"></script>
</head>
<body>
@ -19,7 +19,9 @@
</div>
</header>
<div id="container" style="padding-top: 0px; padding-bottom: 0px"></div>
<div id="top-sentinel" style="padding-top: 0px;"></div>
<div id="container"></div>
<div id="bottom-sentinel" style="padding-top: 0px;"></div>
<button id="bottom">Bottom</button>

2
examples/infinite-scroll/index.js
View File

@ -39,7 +39,7 @@ const render = elements => {
const onChange = debounce(render, 20);
const scroller = new InfiniteScrollWindow(gunNode, {size, stickTo: 'top', onChange});
const scroller = new ScrollWindow(gunNode, {size, stickTo: 'top', onChange});
const initList = () => {
for (var n = 0; n < size; n++) {

2
test/panic/infinite-scroll/index.html
View File

@ -5,7 +5,7 @@
<link rel="stylesheet" type="text/css" href="./style.css">
<script src="/jquery.js"></script>
<script src="/gun.js"></script>
<script src="./InfiniteScrollWindow.js"></script>
<script src="./ScrollWindow.js"></script>
<script src='panic.js'></script>
<script>panic.server(location.origin)</script>
</head>