settle-request-generator/index.html at master · SettleAPI/settle-request-generator · 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
<html>
<header>
  <link rel="stylesheet" href="https://unpkg.com/purecss@1.0.1/build/pure-min.css"
    integrity="sha384-oAOxQR6DkCoMliIh8yFnu25d7Eq/PHS21PClpwjOTeU2jRSq11vu66rf90/cZr47" crossorigin="anonymous">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
  <script src="jsencrypt.js"></script>

  <style>
    body {
      padding: 40px;
      font-family: monospace;
    }

    .wide {
      width: 530px;
    }

    label {
      font-weight: bold;
    }

    .change-animation {
      animation: pulse 0.5s 1;
    }

    .pure-form-aligned .pure-control-group label {
      width: 13em;
    }

    @keyframes pulse {
      0% {
        background-color: rgb(230, 255, 230);
      }

      100% {
        background-color: #eee;
      }
    }
  </style>
</header>

<body>
  <h1 id="test">Settle API PKCS#1 1.5 signature generator</h1>
  <div class="pure-form  pure-form-aligned">
    <p>Is an Integrator acting as a proxy on behalf of a Merchant client?</p>
    <div class="pure-u-1-2">
      <div class="pure-u-1-8">
        <label for="is-integrator-false" class="pure-radio">
            <input type="radio" id="is-integrator-false" name="optionsRadios" value="integratorFalse" checked="" onclick="integratorFalse();" /> No
        </label>
      </div>
      <div class="pure-u-1-8">
        <label for="is-integrator-true" class="pure-radio">
            <input type="radio" id="is-integrator-true" name="optionsRadios" value="integratorTrue" onclick="integratorTrue();" /> Yes
        </label>
      </div>
    </div>
    <hr /><br />
    <div class="pure-control-group">
      <label for="merchant_id">Merchant ID</label>
      <input type="text" name="merchant_id" id="merchant_id"></input>
    </div>

    <div class="pure-control-group" id="controllGroupApiUser">
      <label for="api_user">API Key/User ID</label>
      <input type="text" name="api_user" id="api_user"></input>
    </div>

    <div class="pure-control-group integrator" id="controllGroupIntegrator">
      <label for="X_Auka_Integrator">Integrator ID</label>
      <input type="text" name="X_Auka_Integrator" id="X_Auka_Integrator"></input>
    </div>

    <div class="pure-control-group">
      <label for="private_key">Private RSA key</label>
      <textarea name="private_key" id="private_key" cols="70" rows="15"></textarea>
    </div>

    <div class="pure-control-group">
      <label for="method">REST API Method</label>
      <input type="text" name="method" id="method"></input>
    </div>

    <div class="pure-control-group">
      <label for="url">REST API Endpoint URL</label>
      <input class='wide' type="text" name="url" id="url" cols="70"></input>
    </div>

    <div class="pure-control-group">
      <label for="body">Request body</label>
      <textarea name="body" id="body" cols="70" rows="10"></textarea>
      <span class="pure-form-message-inline">Pro tip:<br />Will autogenrate headers on focus lost</span>
    </div>

    <div class="pure-control-group">
      <label for="bulk_headers">Bulk headers</label>
      <textarea class="change-animation" name="bulk_headers" id="bulk_headers" cols="70" rows="15" readonly></textarea>
      <span class="pure-form-message-inline">Pro tip:<br />Click text area to copy headers</span>
    </div>

    <div class="pure-control-group">
      <label for="generate"></label>
      <button class="pure-button" id="generate">Generate headers!</button>
    </div>

  </div>

  <script src="index.js"></script>
</body>

</html>