-
Notifications
You must be signed in to change notification settings - Fork 7
/
Copy pathbrowse.html
121 lines (119 loc) · 5.82 KB
/
browse.html
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
116
117
118
119
120
121
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>TC | Browse</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!--<link rel="stylesheet" href="css/border.css">-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.rawgit.com/yahoo/xss-filters/master/dist/xss-filters.min.js"></script>
<script src="https://wallet.metamask.io/metamascara.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script src="libs/humanize-duration.js"></script>
<script src="libs/moment.min.js"></script>
<script src="libs/web3.min.js"></script>
<script src="script/utils.js"></script>
<script src="script/components.js"></script>
<script src="script/contractInfo.js"></script>
<script src="script/browse.js"></script>
</head>
<body>
<div id="nav-placeholder"></div>
<div class="container" align='center'>
<div id="betaWarning" align='center'>
<div class="alert alert-warning" style='display:inline-block;'>
<p>You are currently visiting the old version (v1) of Toastycoin Frontier</p>
<p><strong>A NEW Beta version is available. <a href="beta/index.html">Use the beta</a><br></strong></p>
</div>
</div>
<div id="noProviderWarningDiv" hidden='true'>
<div class="alert alert-warning" style='display:inline-block; margin-top:5rem'>
<strong>Alert! You do not have a web3 provider.</strong><br>
Getting Metamask is the quickest way to fix this.<br>
<a href="https://metamask.io/"><img src="resources/download-metamask.png" style="width:30rem"></a><br>
You can also use Mist or Parity. Refresh this page when you have a web3 provider.
</div>
</div>
<div id="ropstenWarning" hidden='true' align='center'>
<div class="alert alert-warning" style='display:inline-block;'>
<p><strong>You are currently viewing only "test" Burnable Payments on the Ropsten testnet.</strong></p>
<p>To see Burnable Payments that contain real ether, change your Metamask network to the "Main" Ethereum network, and refresh.</p>
</div>
</div>
<div id="web3LockedWarning" hidden='true' align='center'>
<div class="alert alert-warning" style='display:inline-block;'>
<p><strong>No Ethereum account found.</strong></p>
<p>You are currently unable to initiate any commands. Make sure Metamask is unlocked and refresh.</p>
</div>
</div>
<div id="web3Div" hidden='true'>
<div id="browseVue" align="left">
<p>This code determines how the Payments below are compared and sorted. Javascript's <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort">.sort()</a> is used.</p>
<div class="row">
<div class="col-sm-10">
<pre class="pre-scrollable" style='max-height:100px'>{{compareCode}}</pre>
</div>
<div class="col-sm-2 align-bottom">
<button class="btn btn-info" data-toggle="modal" data-target="#compare-code-modal">Change compare code</button>
</div>
</div>
<table class="table table-condensed table-bordered table-hover">
<thead>
<tr>
<th>Address/State/Autorelease</th>
<th>Payer/Worker</th>
<th>Title</th>
<th>Payment Status</th>
</tr>
</thead>
<tbody>
<tr v-for="BOP in BOPs">
<td @click="goToInteractPage(BOP.address)" style="cursor:pointer">
<eth-address-output :address=BOP.address></eth-address-output><br>
<bop-state-output :state=BOP.state></bop-state-output><br>
<autorelease-output :state="BOP.state" :autorelease-interval="BOP.autoreleaseInterval" :autorelease-time="BOP.autoreleaseTime"></autorelease-output>
</td>
<td>
Payer: <eth-address-output :address=BOP.payer></eth-address-output><br>
Worker: <eth-address-output :address=BOP.worker></eth-address-output>
</td>
<td>
{{BOP.title}}
</td>
<td>
<div v-if="BOP.state == 0">
Balance: <ether-output :wei=BOP.balance></ether-output><br>
Service Deposit: <ether-output :wei=BOP.serviceDeposit></ether-output>
</div>
<div v-if="BOP.state == 1">
Deposited: <ether-output :wei=BOP.amountDeposited></ether-output><br>
Balance: <ether-output :wei=BOP.balance></ether-output><br>
Released: <ether-output :wei=BOP.amountReleased></ether-output><br>
Burned: <ether-output :wei=BOP.amountBurned></ether-output>
</div>
<div v-if="BOP.state == 2">
Released: <ether-output :wei=BOP.amountReleased></ether-output><br>
Burned: <ether-output :wei=BOP.amountBurned></ether-output>
</div>
</td>
</tr>
</tbody>
</table>
<div id="compare-code-modal" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4>Set new compare code</h4>
</div>
<div class="modal-body">
<textarea id="compare-code-input" class="form-control" style="font-family:monospace" rows=20 style="mid-width:100%"></textarea><br>
<button class="btn btn-success" data-dismiss="modal" onclick="applyNewCompareCode()">Apply code</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>