git ssb

0+

punkmonk / double



Tree: 1739ab2f646d5e903603c2b7e59b6dee0c17fd3e

Files: 1739ab2f646d5e903603c2b7e59b6dee0c17fd3e / views / main.js

2451 bytesRaw
1var html = require('choo/html')
2
3var TITLE = 'double - main'
4
5function view (state, emit) {
6  if (state.title !== TITLE) emit(state.events.DOMTITLECHANGE, TITLE)
7
8  const {db} = state
9
10  const form = html`<form class="pv3">
11    <div class="pb2">
12      <label>debit account</label><br>
13      <select>
14        <option value="true">--- select debit account ---</option>
15        ${generateAccountList()}
16      </select>
17    </div>
18    <div class="pb2">
19      <label>credit account</label><br>
20      <select>
21        <option value="true">--- select credit account ---</option>
22        ${generateAccountList()}
23      </select>
24    </div>
25    <div>
26      <input class="mb2" id="amount" placeholder="amount"/><br>
27      <input id="description" placeholder="description"/>
28  </form>`
29
30  const submit = html`<div class="pb6">
31    <button onclick=${handleTransaction}>submit</button>
32  </div>`
33
34  return html`<body class="code ph3 lh-copy">
35    <main>
36      <div>double</div>
37      ${form}
38      ${submit}
39    </main>
40    <div>
41      <form class="pb3">
42        <input id="account"/>
43      </form>
44      <button onclick=${handleAccountCreate}>create account</button>
45    </div>
46    <div>
47      ${Object.keys(state.accounts).map(key => {
48        if (state.accounts[key].archived) return html`<div class="strike" onclick=${handleAccountArchive}>${state.accounts[key].name}</div>`
49        return html`<div onclick=${handleAccountArchive}>${state.accounts[key].name}</div>`
50      })}
51    </div>
52  </body>`
53
54  function generateAccountList () {
55    return Object.keys(state.accounts).map(key => {
56      if (state.accounts[key].archived) return
57      return html`<option value="true">${state.accounts[key].name}</option>`
58    })
59  }
60
61  function handleTransaction () {
62    const amount = document.getElementById('amount').value
63    const debit = document.getElementById('debit').value
64    const credit = document.getElementById('credit').value
65    const description = document.getElementById('description').value
66
67    emit('transaction:add', {type: 'transaction', msg: { amount, debit, credit, description }})
68  }
69
70  function handleAccountCreate () {
71    const account = document.getElementById('account').value
72
73    emit('account', { type: 'accounts', msg: { name: account, archived: false }})
74  }
75
76  function handleAccountArchive () {
77    const name = this.innerHTML
78
79    emit('account', { type: 'accounts', msg: { name, type: 'TOGGLE' }})
80  }
81}
82
83module.exports = view
84

Built with git-ssb-web