plasma-tools/tokenring.html at master · jet86/plasma-tools · 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
114
115
<html>

<head>
  <link rel="stylesheet" type="text/css" href="./src/semantic/semantic.min.css">
  <link rel="shortcut icon" href='./images/favicon.png'>
  <script type="text/javascript" src="./src/dist/lightwallet.min.js"></script>
  <script type="text/javascript" src="./src/dist/omg.js"></script>
  <script type="text/javascript" src="./src/dist/web3.js"></script>
  <script type="text/javascript" src="./src/dist/hooked-web3-provider.js"></script>
  <script type="text/javascript" src="./src/dist/bignumber.min.js"></script>
  <script type="text/javascript" src="./src/omg-wallet.js"></script>
  <script type="text/javascript" src="./src/plasma-tools.js"></script>
  <script type="text/javascript" src="./src/token-ring.js"></script>
  <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
    crossorigin="anonymous"></script>
  <script src="./src/semantic/semantic.min.js"></script>
  <style>
    body {
      font-family: Verdana, Geneva, Tahoma, sans-serif;
    }

    .balance {
      font-family: monospace;
    }

    h2 {
      background-color: lightgrey;
      display: inline-block;
      padding: 5px 20px;
      border-radius: 10px;
    }

    .fn-container {
      display: flex;
      align-items: stretch;
      height: 450px;
      justify-content: space-between;
      width: 100%;

    }

    .fn-container>div {
      flex: 0 0 30%;
    }

    .fn-container .segment {
      margin-top: 0;
      margin-bottom: 0;

    }

    .fn-container button {
      float: right;
    }

    .create-wallet {
      position: absolute;
      right: 0;
      top: 50%;
      transform: translateY(-50%);
    }

    button.ui.primary.button {
      background-color: #1a56f0;
    }

    button.ui.primary.button:hover {
      background-color: #1a56f0;
    }

    button.ui.primary.button:focus {
      background-color: #1a56f0;
    }
  </style>
</head>
<title>Plasma ERC20 Token Ring</title>

<body onload="createRingVault()">
  <div class="ui stackable grid container" style='padding: 50px 0;'>
    <div class='row'>
      <img src='./images/OmiseGO_Jetcoins.png' width='304' height='36' />
    </div>
    <div class='row'>
      <div id="RingAddressArea" class="address-area ui segment" style="display:block; width: 100%;">
        <h2>Token Ring Addresses</h2>
        <div id="distributeButton" class="balance"  style="display:none;">
          <button class="ui primary button" onclick="distributeTokens()" style="width: 200px">Distribute Tokens</button>
          <button class="ui primary button" onclick="distributeEth()" style="width: 200px">Distribute ETH</button>
          <br><br>
        </div>
        <div id="rotateButton" class="balance">
          <button class="ui primary button" onclick="rotateTokens()" style="width: 200px">Rotate Tokens</button>
          <button class="ui primary button" onclick="redistributeTokens()" style="width: 200px">Redistribute Tokens</button>
          <button class="ui primary button" onclick="redistributeEth()" style="width: 200px">Redistribute ETH</button>
          <button class="ui primary button" onclick="showRingBalances()" style="width: 200px">Refresh Balances</button>
        </div>
        <h4>Token Ring Token Contract</h4>
        <div id="RingTokenContractAddress" class="balance"></div>
        <h4>Childchain Balances</h4>
        <div id="RingChildchainBalance" class="balance"></div>
      </div>
    </div>
    <div id="LogArea" class="address-area ui segment" style="display:block; width: 100%;">
      <button class="ui primary button" onclick="clearLogs()">Clear Logs</button>
      <h4>Current State</h4>
      <div id="CurrentState" class="balance">Not running...</div>
      <h4>Transaction Submission Logs</h4>
      <div id="TxSubmissionLog" class="balance"></div>
      <h4>Transaction Creation Logs</h4>
      <div id="TxCreationLog" class="balance"></div>
    </div>
  </div>
</body>

</html>