Commit b70759f872a7c4a5c73cc3413f10d221633d860c
get profile feed offset streaming working, show loading state at bottom
Matt McKegg committed on 6/10/2017, 8:55:55 AMParent: 407645c2d756a5059346f2bdbc100779f5af7d9e
Files changed
| modules/feed/html/rollup.js | changed |
| modules/feed/pull/summary.js | changed |
| modules/page/html/render/profile.js | changed |
| modules/page/html/render/search.js | changed |
| styles/loading.mcss | changed |
| modules/feed/html/rollup.js | ||
|---|---|---|
| @@ -1,5 +1,6 @@ | ||
| 1 | 1 | var Value = require('mutant/value') |
| 2 | +var Proxy = require('mutant/proxy') | |
| 2 | 3 | var when = require('mutant/when') |
| 3 | 4 | var computed = require('mutant/computed') |
| 4 | 5 | var h = require('mutant/h') |
| 5 | 6 | var MutantArray = require('mutant/array') |
| @@ -37,15 +38,16 @@ | ||
| 37 | 38 | return nest({ |
| 38 | 39 | 'feed.html': { rollup } |
| 39 | 40 | }) |
| 40 | 41 | function rollup (getStream, opts) { |
| 41 | - var sync = Value(false) | |
| 42 | + var loading = Proxy(true) | |
| 42 | 43 | var updates = Value(0) |
| 43 | 44 | |
| 44 | 45 | var filter = opts && opts.filter |
| 45 | 46 | var bumpFilter = opts && opts.bumpFilter |
| 46 | 47 | var windowSize = opts && opts.windowSize |
| 47 | 48 | var waitFor = opts && opts.waitFor || true |
| 49 | + var getSequence = opts && opts.getSequence | |
| 48 | 50 | |
| 49 | 51 | var newSinceRefresh = new Set() |
| 50 | 52 | var newInSession = new Set() |
| 51 | 53 | var prioritized = {} |
| @@ -65,10 +67,10 @@ | ||
| 65 | 67 | style: { overflow: 'auto' } |
| 66 | 68 | }, [ |
| 67 | 69 | h('div.wrapper', [ |
| 68 | 70 | h('section.prepend', opts.prepend), |
| 69 | - when(sync, null, h('Loading -large')), | |
| 70 | - content | |
| 71 | + content, | |
| 72 | + when(loading, h('Loading -large')) | |
| 71 | 73 | ]) |
| 72 | 74 | ]) |
| 73 | 75 | |
| 74 | 76 | onceTrue(waitFor, () => { |
| @@ -136,14 +138,11 @@ | ||
| 136 | 138 | if (abortLastFeed) { |
| 137 | 139 | abortLastFeed() |
| 138 | 140 | } |
| 139 | 141 | updates.set(0) |
| 140 | - sync.set(false) | |
| 141 | 142 | |
| 142 | 143 | content.set( |
| 143 | - h('section.content', { | |
| 144 | - hidden: computed(sync, s => !s) | |
| 145 | - }) | |
| 144 | + h('section.content') | |
| 146 | 145 | ) |
| 147 | 146 | |
| 148 | 147 | var abortable = Abortable() |
| 149 | 148 | abortLastFeed = abortable.abort |
| @@ -152,12 +151,13 @@ | ||
| 152 | 151 | newSinceRefresh.forEach(x => { |
| 153 | 152 | prioritized[x] = 2 |
| 154 | 153 | }) |
| 155 | 154 | |
| 155 | + var stream = api.feed.pull.summary(getStream, {windowSize, bumpFilter, prioritized, getSequence}) | |
| 156 | + loading.set(stream.loading) | |
| 157 | + | |
| 156 | 158 | pull( |
| 157 | - api.feed.pull.summary(getStream, {windowSize, bumpFilter, prioritized}, () => { | |
| 158 | - sync.set(true) | |
| 159 | - }), | |
| 159 | + stream, | |
| 160 | 160 | pull.asyncMap(ensureMessageAndAuthor), |
| 161 | 161 | pull.filter((item) => { |
| 162 | 162 | // ignore messages that are handled by other apps |
| 163 | 163 | if (item.rootMessage && api.app.sync.externalHandler(item.rootMessage)) return |
| modules/feed/pull/summary.js | ||
|---|---|---|
| @@ -3,8 +3,10 @@ | ||
| 3 | 3 | var pullNext = require('pull-next') |
| 4 | 4 | var SortedArray = require('sorted-array-functions') |
| 5 | 5 | var nest = require('depnest') |
| 6 | 6 | var ref = require('ssb-ref') |
| 7 | +var sustained = require('../../../lib/sustained') | |
| 8 | +var Value = require('mutant/value') | |
| 7 | 9 | |
| 8 | 10 | exports.gives = nest({ |
| 9 | 11 | 'feed.pull': [ 'summary' ] |
| 10 | 12 | }) |
| @@ -18,21 +20,28 @@ | ||
| 18 | 20 | function summary (source, opts, cb) { |
| 19 | 21 | var bumpFilter = opts && opts.bumpFilter |
| 20 | 22 | var windowSize = opts && opts.windowSize || 1000 |
| 21 | 23 | var prioritized = opts && opts.prioritized || {} |
| 24 | + var getSequence = opts && opts.getSequence | |
| 25 | + | |
| 26 | + var loading = Value(true) | |
| 27 | + | |
| 22 | 28 | var last = null |
| 23 | 29 | var returned = false |
| 24 | 30 | var done = false |
| 25 | - return pullNext(() => { | |
| 31 | + | |
| 32 | + var result = pullNext(() => { | |
| 26 | 33 | if (!done) { |
| 34 | + loading.set(true) | |
| 27 | 35 | var next = {reverse: true, limit: windowSize, live: false} |
| 28 | 36 | if (last) { |
| 29 | - next.lt = last.timestamp || last.value.sequence | |
| 37 | + next.lt = typeof getSequence === 'function' ? getSequence(last) : last.timestamp | |
| 30 | 38 | } |
| 31 | 39 | var deferred = pullDefer.source() |
| 32 | 40 | pull( |
| 33 | 41 | source(next), |
| 34 | 42 | pull.collect((err, values) => { |
| 43 | + loading.set(false) | |
| 35 | 44 | if (err) throw err |
| 36 | 45 | if (!values.length) { |
| 37 | 46 | done = true |
| 38 | 47 | deferred.resolve(pull.values([])) |
| @@ -54,8 +63,13 @@ | ||
| 54 | 63 | ) |
| 55 | 64 | } |
| 56 | 65 | return deferred |
| 57 | 66 | }) |
| 67 | + | |
| 68 | + // switch to loading state immediately, only revert after no loading for > 200 ms | |
| 69 | + result.loading = sustained(loading, 500, x => x) | |
| 70 | + | |
| 71 | + return result | |
| 58 | 72 | } |
| 59 | 73 | |
| 60 | 74 | function groupMessages (messages, fromTime, opts, cb) { |
| 61 | 75 | var subscribes = {} |
| modules/page/html/render/profile.js | ||
|---|---|---|
| @@ -166,9 +166,9 @@ | ||
| 166 | 166 | ]) |
| 167 | 167 | |
| 168 | 168 | var feedView = api.feed.html.rollup((opts) => { |
| 169 | 169 | return api.sbot.pull.userFeed(extend(opts, {id})) |
| 170 | - }, { prepend }) | |
| 170 | + }, { prepend, getSequence: x => x.value.sequence }) | |
| 171 | 171 | |
| 172 | 172 | var container = h('div', {className: 'SplitView'}, [ |
| 173 | 173 | h('div.main', [ |
| 174 | 174 | feedView |
Built with git-ssb-web