moneybutton.github.io/tool-multiple-txs-sender.html at master · moneybutton/moneybutton.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Money Button | Multiple Transactions Sender</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
</head>

<body>
  <div class="container">
    <div class="row justify-content-md-center">
      <div class="col-md-6 col-xs-12">
        <h2 class="mt-3">Multiple Transactions Sender</h2>
        <div class="alert alert-info my-5">
          If you receive many small BSV amounts in your Money Button wallet,
          it may happen that you'll have a problem if you try to send
          a big payment since too many inputs would be needed.
          <br />
          <br />
          Using this tool you can send multiple payments up to certain amount,
          avoiding problems of too many inputs.
        </div>
        <form class="form">
          <label class="form-label">Destination:</label>
          <div class="input-group">
            <input type='text' id='to' class="form-control" />
          </div>
          <div class="row my-3">
            <div class="col-6">
              <label class="form-label"> Total amount to send:</label>
              <div class="input-group">
                <input type='number' id='total' class="form-control" />
                <span class="input-group-text">USD</span>
              </div>
            </div>
            <div class="col-6">
              <label class="form-label"> In payments of:</label>
              <div class="input-group">
                <input type='number' id='chunkTotal' class="form-control" value="10" />
                <span class="input-group-text">USD</span>
              </div>
            </div>
          </div>
        </form>
        <button class="btn btn-primary btn-block" onclick="requestPermission()">Start</button>
        <code id='console' class="mt-4"></code>
      </div>
    </div>
  </div>
  </div>
  <script src="https://www.moneybutton.com/moneybutton.js"></script>
  <script>
    var imb
    var pending, total, to
    var consoleEl = document.getElementById('console')

    function log(text) {
      const newEl = document.createElement('p');
      newEl.innerHTML = `> ${text}`
      consoleEl.appendChild(newEl)
    }

    function requestPermission() {
      total = Number(document.getElementById('total').value)
      to = document.getElementById('to').value

      imb.askForPermission({
        label: 'Total Amount to send',
        amount: total, // Max amount to spend.
        currency: 'USD', // Max amount to spend currency.
      })
    }

    function processChunk(chunkTotal) {
      log(`Making payment for ${chunkTotal} USD`)
      imb.swipe(
        {
          outputs: [{
            to,
            amount: chunkTotal,
            currency: 'USD'
          }],
        }
      ).then(({ payment }) => {
        if (payment) {
          log(`txid: ${payment.txid}`)
          pending -= chunkTotal
          if (pending) {
            processChunk(pending > chunkTotal ? chunkTotal : pending)
          } else {
            log(`Done sending ${total} USD`)
          }
        }
      })
    }

    window.addEventListener('load', function () {
      imb = new moneyButton.IMB({
        clientIdentifier: '93143f770568b8dfbbb3217dd14aeb71',
        onNewPermissionGranted: async (pm) => {
          log(`Permission received. Starting payments.`)
          chunkTotal = Number(document.getElementById('chunkTotal').value)
          pending = total
          processChunk(chunkTotal)
        }
      })
    })
  </script>
</body>