midefos/basicswap
1
0
Fork 0
mirror of https://github.com/basicswap/basicswap.git synced 2025-11-06 10:48:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

ui: Add rate lookup helper when creating offers.

Browse Source
This commit is contained in:
tecnovert
2021-11-21 22:59:39 +02:00
parent 54ad0e496c
commit 8a9f4f9e38
11 changed files with 238 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
basicswap/templates/offer_new_1.html
View File

@@ -22,26 +22,112 @@
</select></td></tr>
<tr><td>Coin From</td><td>
<select name="coin_from"><option value="-1">-- Select Coin --</option>
<select id="coin_from" name="coin_from" onchange="set_rate('coin_from');"><option value="-1">-- Select Coin --</option>
{% for c in coins %}
<option{% if data.coin_from==c[0] %} selected{% endif %} value="{{ c[0] }}">{{ c[1] }}</option>
{% endfor %}
</select>
</td><td>Amount From</td><td><input type="text" name="amt_from" value="{{ data.amt_from }}"></td><td>The amount you will send.</td></tr>
</td><td>Amount From</td><td><input type="text" id="amt_from" name="amt_from" value="{{ data.amt_from }}" onchange="set_rate('amt_from');"></td><td>The amount you will send.</td></tr>
<tr><td>Coin To</td><td>
<select name="coin_to"><option value="-1">-- Select Coin --</option>
<select id="coin_to" name="coin_to" onchange="set_rate('coin_to');"><option value="-1">-- Select Coin --</option>
{% for c in coins %}
<option{% if data.coin_to==c[0] %} selected{% endif %} value="{{ c[0] }}">{{ c[1] }}</option>
{% endfor %}
</select>
</td><td>Amount To</td><td><input type="text" name="amt_to" value="{{ data.amt_to }}"></td><td>The amount you will receive.</td></tr>
</td><td>Amount To</td><td><input type="text" id="amt_to" name="amt_to" value="{{ data.amt_to }}" onchange="set_rate('amt_to');"></td><td>The amount you will receive.</td></tr>
</td><td>Rate</td><td><input type="text" id="rate" name="rate" value="{{ data.rate }}" onchange="set_rate('rate');"></td><td>Lock Rate: <input type="checkbox" id="rate_lock" name="rate_lock" value="rl"></td></tr>
<tr><td>Amount Variable</td><td><input type="checkbox" id="amt_var" name="amt_var" value="av" {% if data.amt_var==true %} checked="true"{% endif %}></td></tr>
<tr><td>Rate Variable</td><td><input type="checkbox" id="rate_var" name="rate_var" value="rv" {% if data.rate_var==true %} checked="true"{% endif %}></td></tr>
</table>
<input name="continue" type="submit" value="Continue">
<input name="check_rates" type="button" value="Lookup Rates" onclick='lookup_rates();'>
<input type="hidden" name="formid" value="{{ form_id }}">
<input type="hidden" name="step1" value="a">
</form>
<p id="rates_display"></p>
<p><a href="/">home</a></p>
<script>
const xhr_rates = new XMLHttpRequest();
xhr_rates.onload = () => {
if (xhr_rates.status == 200) {
const obj = JSON.parse(xhr_rates.response);
inner_html = '<pre><code>' + JSON.stringify(obj, null, ' ') + '</code></pre>';
document.getElementById('rates_display').innerHTML = inner_html;
}
}
const xhr_rate = new XMLHttpRequest();
xhr_rate.onload = () => {
if (xhr_rate.status == 200) {
const obj = JSON.parse(xhr_rate.response);
if (obj.hasOwnProperty('rate')) {
document.getElementById('rate').value = obj['rate'];
} else
if (obj.hasOwnProperty('amount_to')) {
document.getElementById('amt_to').value = obj['amount_to'];
} else
if (obj.hasOwnProperty('amount_from')) {
document.getElementById('amt_from').value = obj['amount_from'];
}
}
}
function lookup_rates() {
const coin_from = document.getElementById('coin_from').value;
const coin_to = document.getElementById('coin_to').value;
if (coin_from == '-1' || coin_to == '-1') {
alert('Coins from and to must be set first.');
return;
}
xhr_rates.open('POST', '/json/rates');
xhr_rates.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr_rates.send('coin_from='+coin_from+'&coin_to='+coin_to);
}
function set_rate(value_changed) {
const coin_from = document.getElementById('coin_from').value;
const coin_to = document.getElementById('coin_to').value;
const amt_from = document.getElementById('amt_from').value;
const amt_to = document.getElementById('amt_to').value;
const rate = document.getElementById('rate').value;
const lock_rate = document.getElementById('rate_lock').checked;
if (coin_from == '-1' || coin_to == '-1') {
return;
}
params = 'coin_from='+coin_from+'&coin_to='+coin_to;
if (value_changed == 'rate' || (lock_rate && value_changed == 'amt_from')) {
if (amt_from == '' || rate == '') {
return;
}
params += '&rate='+rate+'&amt_from='+amt_from;
} else
if (lock_rate && value_changed == 'amt_to') {
if (amt_to == '' || rate == '') {
return;
}
params += '&amt_to='+amt_to+'&rate='+rate;
} else {
if (amt_from == '' || amt_to == '') {
return;
}
params += '&amt_from='+amt_from+'&amt_to='+amt_to;
}
xhr_rate.open('POST', '/json/rate');
xhr_rate.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr_rate.send(params);
}
</script>
</body></html>