git ssb

1
const { h, computed } = require('mutant')
2
const Marama = require('marama')
3
4
module.exports = function DayPicker (state) {
5
  const startOfToday = startOfDay()
6
7
  return h('ScryDayPicker', [
8
    h('div.month-picker', [
9
      h('button', { 'ev-click': () => setMonth(-1) }, '<'),
10
      MonthTitle(state.monthIndex),
11
      h('button', { 'ev-click': () => setMonth(+1) }, '>')
12
    ]),
13
    computed(state, ({ monthIndex, days }) => {
14
      return Marama({
15
        monthIndex,
16
        events: days,
17
        onSelect,
18
        styles: {
19
          weekFormat: 'rows',
20
          showNumbers: true,
21
          tileRadius: 16,
22
          tileGap: 8
23
        }
24
      })
25
    })
26
  ])
27
28
  function setMonth (d) {
29
    state.monthIndex.set(state.monthIndex() + d)
30
  }
31
32
  function onSelect ({ gte, lt, events: dayEvents }) {
33
    if (gte < startOfToday) return
34
35
    if (!dayEvents.length) addEmptyEvent()
36
    else clearDay()
37
38
    function addEmptyEvent () {
39
      state.days.push(Event(gte))
40
    }
41
    function clearDay () {
42
      const prunedEvents = state.days().filter(e => !dayEvents.includes(e))
43
      state.days.set(prunedEvents)
44
    }
45
  }
46
}
47
48
function MonthTitle (monthIndex) {
49
  const MONTHS = [ 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December' ]
50
51
  return computed(monthIndex, mi => {
52
    const view = new Date()
53
    view.setMonth(mi)
54
55
    return `${MONTHS[view.getMonth()]} ${view.getFullYear()}`
56
57
    // while (monthIndex < 0) { monthIndex += 12 }
58
    // return `${MONTHS[(monthIndex) % 12]} ${year}`
59
  })
60
}
61
62
function Event (date) {
63
  return {
64
    date,
65
    data: {attending: true}
66
  }
67
}
68
69
function startOfDay (d = new Date()) {
70
  return new Date(d.getFullYear(), d.getMonth(), d.getDate())
71
}
72