| app/page/blogIndex.jsView |
|---|
| 1 | 1 | const nest = require('depnest') |
| 2 | | -const { h, Array: MutantArray, resolve, when, computed } = require('mutant') |
| 2 | +const { h, Array: MutantArray, resolve, computed } = require('mutant') |
| 3 | 3 | const Scroller = require('mutant-scroll') |
| 4 | 4 | const pull = require('pull-stream') |
| 5 | 5 | |
| 6 | 6 | const Next = require('pull-next') |
| 28 | 28 | exports.create = (api) => { |
| 29 | 29 | var blogsCache = MutantArray() |
| 30 | 30 | |
| 31 | 31 | return nest('app.page.blogIndex', function (location) { |
| 32 | | - |
| 32 | + |
| 33 | + const { page, filter = 'All' } = location |
| 33 | 34 | |
| 34 | 35 | var strings = api.translations.sync.strings() |
| 35 | 36 | blogsCache.clear() |
| 36 | 37 | |
| 37 | 38 | var blogs = Scroller({ |
| 38 | 39 | classList: ['content'], |
| 39 | | - prepend: api.app.html.topNav(location), |
| 40 | | - streamToTop: Source({ reverse: false, live: true, old: false, limit: 20 }, api, location), |
| 41 | | - streamToBottom: Source({ reverse: true, live: false, limit: 20 }, api, location), |
| 40 | + prepend: [ |
| 41 | + api.app.html.topNav(location), |
| 42 | + Filters() |
| 43 | + ], |
| 44 | + streamToTop: Source({ reverse: false, live: true, old: false, limit: 20 }, api, filter), |
| 45 | + streamToBottom: Source({ reverse: true, live: false, limit: 20 }, api, filter), |
| 42 | 46 | updateTop: update, |
| 43 | 47 | updateBottom: update, |
| 44 | 48 | store: blogsCache, |
| 45 | 49 | render |
| 46 | 50 | }) |
| 47 | 51 | |
| 52 | + function Filters () { |
| 53 | + const goTo = (loc) => () => api.history.sync.push(loc) |
| 54 | + return h('Filters', [ |
| 55 | + h('span -filter', { |
| 56 | + className: filter === 'All' ? '-active' : '', |
| 57 | + 'ev-click': goTo({ page, filter: 'All' }) |
| 58 | + }, 'All'), |
| 59 | + h('span', '|'), |
| 60 | + h('span -filter', { |
| 61 | + className: filter === 'Subscriptions' ? '-active' : '', |
| 62 | + 'ev-click': goTo({ page, filter: 'Subscriptions' }) |
| 63 | + }, 'Subscriptions'), |
| 64 | + h('span', '|'), |
| 65 | + h('span -filter', { |
| 66 | + className: filter === 'Friends' ? '-active' : '', |
| 67 | + 'ev-click': goTo({ page, filter: 'Friends' }) |
| 68 | + }, 'Friends') |
| 69 | + ]) |
| 70 | + } |
| 48 | 71 | |
| 49 | | - |
| 50 | 72 | return h('Page -blogIndex', { title: strings.home }, [ |
| 51 | 73 | api.app.html.sideNav(location), |
| 52 | 74 | blogs |
| 53 | 75 | ]) |
| 54 | 76 | }) |
| 55 | 77 | |
| 56 | | - function Source(opts, api, location) { |
| 78 | + function Source (opts, api, filter) { |
| 57 | 79 | const commonOpts = { |
| 58 | 80 | query: [{ |
| 59 | 81 | $filter: { |
| 60 | 82 | value: { |
| 68 | 90 | } |
| 69 | 91 | |
| 70 | 92 | const myId = api.keys.sync.id() |
| 71 | 93 | const { followers } = api.contact.obs |
| 72 | | - const activeFilter = location.hasOwnProperty('filter') ? location.filter : "All" |
| 73 | 94 | |
| 74 | 95 | const filterbyFriends = (msg) => { |
| 75 | | - if (activeFilter !== 'Friends') return true |
| 96 | + if (filter !== 'Friends') return true |
| 76 | 97 | |
| 77 | 98 | const feed = msg.value.author |
| 78 | 99 | const theirFollowers = followers(feed) |
| 79 | 100 | const youFollowThem = computed(theirFollowers, followers => followers.includes(myId)) |
| 80 | | - const r = resolve(youFollowThem) |
| 81 | 101 | |
| 82 | | - return r |
| 102 | + return resolve(youFollowThem) |
| 83 | 103 | } |
| 84 | 104 | |
| 85 | 105 | const filterBySubscription = (msg) => { |
| 86 | | - if (activeFilter !== 'Subscriptions') return true |
| 106 | + if (filter !== 'Subscriptions') return true |
| 87 | 107 | |
| 88 | 108 | if (!msg.value.content.hasOwnProperty('channel')) { |
| 89 | 109 | return false |
| 90 | 110 | } |
| 91 | 111 | |
| 92 | | - const isSubscribedTo = api.channel.obs.isSubscribedTo |
| 93 | 112 | const channel = msg.value.content.channel |
| 94 | 113 | |
| 95 | 114 | return resolve(api.channel.obs.isSubscribedTo(channel)) |
| 96 | 115 | } |
| 107 | 126 | pull.filter(msg => !api.message.sync.isBlocked(msg)) |
| 108 | 127 | ) |
| 109 | 128 | } |
| 110 | 129 | |
| 111 | | - function update(soFar, newBlog) { |
| 130 | + function update (soFar, newBlog) { |
| 112 | 131 | soFar.transaction(() => { |
| 113 | 132 | var object = newBlog |
| 114 | 133 | |
| 115 | 134 | const index = indexOf(soFar, (blog) => newBlog.key === resolve(blog).key) |
| 125 | 144 | } |
| 126 | 145 | }) |
| 127 | 146 | } |
| 128 | 147 | |
| 129 | | - function render(blog) { |
| 148 | + function render (blog) { |
| 130 | 149 | const { recps, channel } = blog.value.content |
| 131 | 150 | var onClick |
| 132 | 151 | if (channel && !recps) { onClick = (ev) => api.history.sync.push(Object.assign({}, blog, { page: 'blogShow' })) } |
| 133 | 152 | return api.app.html.blogCard(blog, { onClick }) |
| 134 | 153 | } |
| 135 | 154 | } |
| 136 | 155 | |
| 137 | | -function indexOf(array, fn) { |
| 156 | +function indexOf (array, fn) { |
| 138 | 157 | for (var i = 0; i < array.getLength(); i++) { |
| 139 | 158 | if (fn(array.get(i))) { |
| 140 | 159 | return i |
| 141 | 160 | } |
| 144 | 163 | } |
| 145 | 164 | |
| 146 | 165 | |
| 147 | 166 | |
| 148 | | -function StepperStream(createStream, _opts) { |
| 167 | +function StepperStream (createStream, _opts) { |
| 149 | 168 | var opts = clone(_opts) |
| 150 | 169 | var last = null |
| 151 | 170 | var count = -1 |
| 152 | 171 | |