| app/page/calendar.jsView |
|---|
| 1 | 1 … | const nest = require('depnest') |
| 2 | 2 … | const { h, Array: MutantArray, map, Struct, computed, watch, throttle, resolve } = require('mutant') |
| 3 | 3 … | const Month = require('marama') |
| 4 | | - |
| 5 | 4 … | const pull = require('pull-stream') |
| 6 | | -const paraMap = require('pull-paramap') |
| 7 | | -const { isMsg } = require('ssb-ref') |
| 8 | 5 … | |
| 9 | 6 … | exports.gives = nest({ |
| 10 | 7 … | 'app.page.calendar': true, |
| 11 | 8 … | 'app.html.menuItem': true |
| 16 | 13 … | 'keys.sync.id': 'first', |
| 17 | 14 … | 'message.html.render': 'first', |
| 18 | 15 … | 'message.sync.unbox': 'first', |
| 19 | 16 … | 'sbot.async.get': 'first', |
| 20 | | - 'sbot.pull.stream': 'first' |
| 17 … | + 'sbot.pull.stream': 'first', |
| 18 … | + 'scry.html.button': 'first', |
| 19 … | + 'gathering.html.button': 'first' |
| 21 | 20 … | }) |
| 22 | 21 … | |
| 23 | 22 … | exports.create = (api) => { |
| 24 | 23 … | return nest({ |
| 47 | 46 … | |
| 48 | 47 … | watch(state.year, year => getGatherings(year, state.events, Query)) |
| 49 | 48 … | watchAttending(state.attending, api) |
| 50 | 49 … | |
| 50 … | + const actions = [ |
| 51 … | + api.scry.html.button(), |
| 52 … | + api.gathering.html.button() |
| 53 … | + ] |
| 54 … | + |
| 51 | 55 … | const page = h('CalendarPage', { title: '/calendar' }, [ |
| 52 | | - Calendar(state), |
| 56 … | + Calendar(state, actions), |
| 53 | 57 … | Events(state, api) |
| 54 | 58 … | ]) |
| 55 | 59 … | |
| 56 | 60 … | page.scroll = (i) => scroll(state.range, i) |
| 95 | 99 … | } |
| 96 | 100 … | } |
| 97 | 101 … | |
| 98 | 102 … | function Events (state, api) { |
| 99 | | - return h('CalendarEvents', computed([state.events, state.range], (events, range) => { |
| 103 … | + return h('CalendarEvents', { title: '' }, computed([state.events, state.range], (events, range) => { |
| 100 | 104 … | const keys = events |
| 101 | 105 … | .filter(ev => ev.date >= range.gte && ev.date < range.lt) |
| 102 | 106 … | .sort((a, b) => a.date - b.date) |
| 103 | 107 … | .map(ev => ev.data.key) |
| 109 | 113 … | pull.asyncMap((key, cb) => { |
| 110 | 114 … | api.sbot.async.get(key, (err, value) => { |
| 111 | 115 … | if (err) return cb(err) |
| 112 | 116 … | |
| 113 | | - if (typeof value.content === 'object') cb(null, {key, value}) |
| 114 | | - else cb(null, api.message.sync.unbox({key, value})) |
| 117 … | + if (typeof value.content === 'object') cb(null, { key, value }) |
| 118 … | + else cb(null, api.message.sync.unbox({ key, value })) |
| 115 | 119 … | }) |
| 116 | 120 … | }), |
| 117 | 121 … | pull.drain(msg => gatherings.push(msg)) |
| 118 | 122 … | ) |
| 156 | 160 … | }) |
| 157 | 161 … | ) |
| 158 | 162 … | } |
| 159 | 163 … | |
| 160 | | - |
| 161 | 164 … | function getGatherings (year, events, Query) { |
| 162 | 165 … | |
| 163 | 166 … | |
| 164 | 167 … | |
| 171 | 174 … | }, |
| 172 | 175 … | content: { |
| 173 | 176 … | type: 'about', |
| 174 | 177 … | startDateTime: { |
| 175 | | - epoch: {$is: 'number'} |
| 178 … | + epoch: { $is: 'number' } |
| 176 | 179 … | } |
| 177 | 180 … | } |
| 178 | 181 … | } |
| 179 | 182 … | } |
| 200 | 203 … | if (target && target.data.ts <= ts) events.delete(target) |
| 201 | 204 … | |
| 202 | 205 … | |
| 203 | 206 … | |
| 204 | | - |
| 205 | 207 … | events.push({ date, data: { key, ts } }) |
| 206 | 208 … | }) |
| 207 | 209 … | ) |
| 208 | 210 … | } |
| 211 | 213 … | |
| 212 | 214 … | |
| 213 | 215 … | const MONTH_NAMES = [ 'Ja', 'Fe', 'Ma', 'Ap', 'Ma', 'Ju', 'Ju', 'Au', 'Se', 'Oc', 'No', 'De' ] |
| 214 | 216 … | |
| 215 | | -function Calendar (state) { |
| 217 … | +function Calendar (state, actions) { |
| 216 | 218 … | |
| 217 | 219 … | |
| 218 | 220 … | |
| 219 | | - return h('Calendar', [ |
| 221 … | + return h('Calendar', { title: '' }, [ |
| 220 | 222 … | h('div.header', [ |
|
| 221 | 223 … | h('div.year', [ |
| 222 | 224 … | state.year, |
| 223 | 225 … | h('a', { 'ev-click': () => state.year.set(state.year() - 1) }, '-'), |
| 224 | 226 … | h('a', { 'ev-click': () => state.year.set(state.year() + 1) }, '+') |
| 225 | | - ]) |
| 227 … | + ]), |
| 228 … | + h('div.actions', actions) |
| 226 | 229 … | ]), |
| 227 | 230 … | h('div.months', computed(throttle(state, 100), ({ today, year, events, attending, range }) => { |
| 228 | 231 … | events = events.map(ev => { |
| 229 | 232 … | ev.data.attending = attending.includes(ev.data.key) |
| 239 | 242 … | } |
| 240 | 243 … | |
| 241 | 244 … | return h('div.month', [ |
| 242 | 245 … | h('div.month-name', { 'ev-click': setMonthRange }, MONTH_NAMES[i]), |
| 243 | | - Month({ year, monthIndex: i, events, range, onSelect, styles: {weekFormat: 'columns'} }) |
| 246 … | + Month({ year, monthIndex: i, events, range, onSelect, styles: { weekFormat: 'columns' } }) |
| 244 | 247 … | ]) |
| 245 | 248 … | }) |
| 246 | 249 … | })) |
| 247 | 250 … | ]) |