git ssb

1
const { h, computed, Value, when } = require('mutant')
2
3
module.exports = function TimePicker ({ times }) {
4
  return h('ScryTimePicker', [
5
    computed(times, _times => {
6
      return _times
7
        .map(time => time.date)
8
        // .sort((a, b) => a - b)
9
        .map(t => TimeEntry(t, times))
10
    }),
11
    NewTimeEntry(times)
12
  ])
13
}
14
15
function NewTimeEntry (times) {
16
  var active = Value(false)
17
18
  const options = Array(96).fill(0).map((_, i) => {
19
    var time = new Date()
20
    time.setHours(0)
21
    time.setMinutes(15 * i)
22
    return time
23
  })
24
  const DAY_START_SELECTOR = 'day-start'
25
26
  const el = h('div.add-more', [
27
    when(active,
28
      h('div.dropdown', options.map((time, i) => {
29
        return h('div',
30
          {
31
            'ev-click': () => select(time),
32
            className: i === 32 ? DAY_START_SELECTOR : ''
33
          },
34
          printTime(time)
35
        )
36
      }))
37
    ),
38
    h('div.add', { 'ev-click': activate }, '+ Add times')
39
  ])
40
41
  return el
42
43
  function select (time) {
44
    if (!times.find(t => t.date === time)) {
45
      // time not yet selected
46
      times.push(Event(time))
47
    }
48
    active.set(false)
49
  }
50
51
  function activate () {
52
    active.set(true)
53
54
    const target = el.querySelector('.' + DAY_START_SELECTOR)
55
    target.parentNode.scrollTop = target.offsetTop - target.parentNode.offsetTop + 4
56
  }
57
}
58
59
function TimeEntry (t, times) {
60
  return h('div.time-entry', [
61
    h('div.time', printTime(t)),
62
    h('div.close', { 'ev-click': () => removeTime(t, times) }, '×')
63
    // h('i.fa.fa-close')
64
  ])
65
}
66
67
function printTime (date) {
68
  var hours = date.getHours().toString()
69
  while (hours.length < 2) hours = `0${hours}`
70
71
  var minutes = date.getMinutes().toString()
72
  while (minutes.length < 2) minutes = `0${minutes}`
73
74
  return `${hours}:${minutes}`
75
}
76
77
function removeTime (t, times) {
78
  var ev = times.find(time => time.date === t)
79
80
  if (ev) times.delete(ev)
81
}
82
83
function Event (date) {
84
  return {
85
    date,
86
    data: {attending: true}
87
  }
88
}
89