From 3f8012f0d0e4946e858814de34cfa33305100e8e Mon Sep 17 00:00:00 2001
From: gerlofvanek <gerlof@particl.io>
Date: Mon, 6 Jan 2025 19:06:14 +0100
Subject: [PATCH 1/2] doge: Fix images + coin tiles layout.
---
.../images/coins/{Doge-20.png => Dogecoin-20.png} | Bin
.../static/images/coins/{Doge.png => Dogecoin.png} | Bin
basicswap/templates/offers.html | 4 ++--
3 files changed, 2 insertions(+), 2 deletions(-)
rename basicswap/static/images/coins/{Doge-20.png => Dogecoin-20.png} (100%)
rename basicswap/static/images/coins/{Doge.png => Dogecoin.png} (100%)
diff --git a/basicswap/static/images/coins/Doge-20.png b/basicswap/static/images/coins/Dogecoin-20.png
similarity index 100%
rename from basicswap/static/images/coins/Doge-20.png
rename to basicswap/static/images/coins/Dogecoin-20.png
diff --git a/basicswap/static/images/coins/Doge.png b/basicswap/static/images/coins/Dogecoin.png
similarity index 100%
rename from basicswap/static/images/coins/Doge.png
rename to basicswap/static/images/coins/Dogecoin.png
diff --git a/basicswap/templates/offers.html b/basicswap/templates/offers.html
index d48cacb..4b663de 100644
--- a/basicswap/templates/offers.html
+++ b/basicswap/templates/offers.html
@@ -170,7 +170,7 @@ function getWebSocketConfig() {
'PIVX': {'name': 'PIVX', 'symbol': 'PIVX', 'image': 'PIVX.png', 'show': true},
'DASH': {'name': 'Dash', 'symbol': 'DASH', 'image': 'Dash.png', 'show': true},
'ETH': {'name': 'Ethereum', 'symbol': 'ETH', 'image': 'Ethereum.png', 'show': false},
- 'DOGE': {'name': 'Dogecoin', 'symbol': 'DOGE', 'image': 'Doge.png', 'show': true},
+ 'DOGE': {'name': 'Dogecoin', 'symbol': 'DOGE', 'image': 'Dogecoin.png', 'show': true},
'DCR': {'name': 'Decred', 'symbol': 'DCR', 'image': 'Decred.png', 'show': true},
'ZANO': {'name': 'Zano', 'symbol': 'ZANO', 'image': 'Zano.png', 'show': false},
'WOW': {'name': 'Wownero', 'symbol': 'WOW', 'image': 'Wownero.png', 'show': true}
@@ -192,7 +192,7 @@ function getWebSocketConfig() {
{% for coin_symbol in custom_order %}
{% if coin_symbol in display_coins and coin_data[coin_symbol]['show'] %}
- <div class="w-full sm:w-1/2 lg:w-1/5 p-3" id="{{ coin_symbol.lower() }}-container">
+ <div class="w-full sm:w-1/2 lg:w-1/6 p-3" id="{{ coin_symbol.lower() }}-container">
<div class="px-5 py-3 h-full bg-coolGray-100 dark:bg-gray-500 rounded-2xl dark:text-white {% if coin_symbol == 'BTC' %}active-container{% endif %}" style="min-height: 180px;">
<div class="flex items-center">
<img src="/static/images/coins/{{ coin_data[coin_symbol]['image'] }}" class="rounded-xl" style="width: 28px; height: 28px; object-fit: contain;" alt="{{ coin_data[coin_symbol]['name'] }}">
From 80dbbd3d125441e8d9642860258864aa331916be Mon Sep 17 00:00:00 2001
From: gerlofvanek <gerlof@particl.io>
Date: Mon, 6 Jan 2025 20:37:33 +0100
Subject: [PATCH 2/2] Fix Swap Type select for Doge + UI update for Get Rate
Inferred.
---
basicswap/templates/offer_new_1.html | 348 ++++++++++++++-------------
1 file changed, 185 insertions(+), 163 deletions(-)
diff --git a/basicswap/templates/offer_new_1.html b/basicswap/templates/offer_new_1.html
index e85d32c..2b2c309 100644
--- a/basicswap/templates/offer_new_1.html
+++ b/basicswap/templates/offer_new_1.html
@@ -283,15 +283,15 @@ if (document.readyState === 'loading') {
</div>
</div>
<div class="w-full md:w-1/2 p-3">
- <p class="mb-1.5 font-medium text-base dark:text-white text-coolGray-800">Rate</p>
- <div class="relative">
- <div class="flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none">
- {{ select_rate_svg | safe }}
- </div>
- <input class="pl-10 hover:border-blue-500 pl-10 bg-gray-50 text-gray-900 appearance-none pr-10 dark:bg-gray-500 dark:text-white border border-gray-300 dark:border-gray-400 dark:text-gray-50 dark:placeholder-white text-sm rounded-lg outline-none focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 focus:ring-0" type="text" id="rate" name="rate" value="{{ data.rate }}" onchange="set_rate('rate');">
- </div>
- <div class="text-sm mt-2">
- <a href="" id="get_rate_inferred_button" class="mt-2 dark:text-white bold text-coolGray-800">Get Rate Inferred:</a><span class="dark:text-white" id="rate_inferred_display"></span>
+ <p class="mb-1.5 font-medium text-base dark:text-white text-coolGray-800">Rate</p>
+ <div class="flex items-center gap-2">
+ <div class="relative flex-1">
+ <div class="flex absolute inset-y-0 left-0 items-center pl-3 pointer-events-none">
+ {{ select_rate_svg | safe }}
+ </div>
+ <input class="pl-10 hover:border-blue-500 bg-gray-50 text-gray-900 appearance-none pr-10 dark:bg-gray-500 dark:text-white border border-gray-300 dark:border-gray-400 dark:text-gray-50 dark:placeholder-white text-sm rounded-lg outline-none focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 focus:ring-0" type="text" id="rate" name="rate" value="{{ data.rate }}" onchange="set_rate('rate');">
+ </div>
+ <button type="button" id="get_rate_inferred_button" class="px-4 py-2.5 text-sm font-medium text-white bg-blue-500 hover:bg-blue-600 rounded-md shadow-sm focus:outline-none">Get Rate Inferred</button>
</div>
<div class="flex form-check form-check-inline mt-5">
<div class="flex items-center h-5"> <input class="form-check-input hover:border-blue-500 w-5 h-5 form-check-input text-blue-600 bg-gray-50 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-1 dark:bg-gray-500 dark:border-gray-400" type="checkbox" id="rate_lock" name="rate_lock" value="rl" checked=checked> </div>
@@ -306,7 +306,6 @@ if (document.readyState === 'loading') {
</div>
</div>
</div>
-
{% if debug_mode == true %}
<div class="py-0 border-b items-center justify-between -mx-4 mb-6 pb-3 border-gray-400 border-opacity-20">
<div class="w-full md:w-10/12">
@@ -414,181 +413,204 @@ if (document.readyState === 'loading') {
</div>
</div>
</section>
- <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;
- }
-
- const selectedCoin = (coin_from === '15') ? '3' : coin_from;
-
- inner_html = '<p>Updating...</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;
- document.querySelector(".pricejsonhidden").classList.remove("hidden");
+ }
+};
- const xhr_rates = new XMLHttpRequest();
- xhr_rates.onreadystatechange = function() {
- if (xhr_rates.readyState === XMLHttpRequest.DONE) {
- if (xhr_rates.status === 200) {
- document.getElementById('rates_display').innerHTML = xhr_rates.responseText;
- } else {
- console.error('Error fetching data:', xhr_rates.statusText);
- }
- }
- };
+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'];
+ }
+ }
+};
- xhr_rates.open('POST', '/json/rates');
- xhr_rates.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
- xhr_rates.send('coin_from=' + selectedCoin + '&coin_to=' + coin_to);
+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;
}
- function getRateInferred(event) {
- event.preventDefault();
+ const selectedCoin = (coin_from === '15') ? '3' : coin_from;
- const coin_from = document.getElementById('coin_from').value;
- const coin_to = document.getElementById('coin_to').value;
- const params = 'coin_from=' + encodeURIComponent(coin_from) + '&coin_to=' + encodeURIComponent(coin_to);
+ inner_html = '<p>Updating...</p>';
+ document.getElementById('rates_display').innerHTML = inner_html;
+ document.querySelector(".pricejsonhidden").classList.remove("hidden");
- const xhr_rates = new XMLHttpRequest();
- xhr_rates.onreadystatechange = function() {
- if (xhr_rates.readyState === XMLHttpRequest.DONE) {
- //console.log(xhr_rates.responseText);
- if (xhr_rates.status === 200) {
- try {
- const responseData = JSON.parse(xhr_rates.responseText);
+ const xhr_rates = new XMLHttpRequest();
+ xhr_rates.onreadystatechange = function() {
+ if (xhr_rates.readyState === XMLHttpRequest.DONE) {
+ if (xhr_rates.status === 200) {
+ document.getElementById('rates_display').innerHTML = xhr_rates.responseText;
+ } else {
+ console.error('Error fetching data:', xhr_rates.statusText);
+ }
+ }
+ };
+
+ xhr_rates.open('POST', '/json/rates');
+ xhr_rates.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
+ xhr_rates.send('coin_from=' + selectedCoin + '&coin_to=' + coin_to);
+}
+
+function getRateInferred(event) {
+ event.preventDefault();
+
+ const coin_from = document.getElementById('coin_from').value;
+ const coin_to = document.getElementById('coin_to').value;
+ const params = 'coin_from=' + encodeURIComponent(coin_from) + '&coin_to=' + encodeURIComponent(coin_to);
+
+ const xhr_rates = new XMLHttpRequest();
+ xhr_rates.onreadystatechange = function() {
+ if (xhr_rates.readyState === XMLHttpRequest.DONE) {
+ if (xhr_rates.status === 200) {
+ try {
+ const responseData = JSON.parse(xhr_rates.responseText);
+ if (responseData.coingecko && responseData.coingecko.rate_inferred) {
const rateInferred = responseData.coingecko.rate_inferred;
- //document.getElementById('rate_inferred_display').innerText = " (" + coin_from + " to " + coin_to + "): " + rateInferred;
- document.getElementById('rate_inferred_display').innerText = " " + rateInferred;
- } catch (error) {
- console.error('Error parsing response:', error);
+ document.getElementById('rate').value = rateInferred;
+ set_rate('rate');
+ } else {
+ document.getElementById('rate').value = 'Error: Rate limit';
+ console.error('Rate limit reached or invalid response format');
}
- } else {
- console.error('Error fetching data:', xhr_rates.statusText);
+ } catch (error) {
+ document.getElementById('rate').value = 'Error: Rate limit';
+ console.error('Error parsing response:', error);
}
+ } else {
+ document.getElementById('rate').value = 'Error: Rate limit';
+ console.error('Error fetching data:', xhr_rates.statusText);
}
- };
+ }
+ };
- xhr_rates.open('POST', '/json/rates');
- xhr_rates.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
- xhr_rates.send(params);
+ xhr_rates.open('POST', '/json/rates');
+ xhr_rates.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
+ xhr_rates.send(params);
+}
+
+document.getElementById('get_rate_inferred_button').addEventListener('click', getRateInferred);
+
+function set_swap_type_enabled(coin_from, coin_to, swap_type) {
+ const adaptor_sig_only_coins = [
+ '6', /* XMR */
+ '9', /* WOW */
+ '8', /* PART_ANON */
+ '7', /* PART_BLIND */
+ '13', /* FIRO */
+ '17', /* BCH */
+ '18' /* DOGE */
+ ];
+ const secret_hash_only_coins = [
+ '11', /* PIVX */
+ '12' /* DASH */
+ ];
+
+ let make_hidden = false;
+
+ if (adaptor_sig_only_coins.includes(coin_from) || adaptor_sig_only_coins.includes(coin_to)) {
+ swap_type.disabled = true;
+ swap_type.value = 'xmr_swap';
+ make_hidden = true;
+ swap_type.classList.add('select-disabled');
+ } else if (secret_hash_only_coins.includes(coin_from) && secret_hash_only_coins.includes(coin_to)) {
+ swap_type.disabled = true;
+ swap_type.value = 'seller_first';
+ make_hidden = true;
+ swap_type.classList.add('select-disabled');
+ } else {
+ swap_type.disabled = false;
+ swap_type.classList.remove('select-disabled');
}
- document.getElementById('get_rate_inferred_button').addEventListener('click', getRateInferred);
+ let swap_type_hidden = document.getElementById('swap_type_hidden');
+ if (make_hidden) {
+ if (!swap_type_hidden) {
+ swap_type_hidden = document.createElement('input');
+ swap_type_hidden.setAttribute('id', 'swap_type_hidden');
+ swap_type_hidden.setAttribute('type', 'hidden');
+ swap_type_hidden.setAttribute('name', 'swap_type');
+ document.getElementById('form').appendChild(swap_type_hidden);
+ }
+ swap_type_hidden.setAttribute('value', swap_type.value);
+ } else if (swap_type_hidden) {
+ swap_type_hidden.parentNode.removeChild(swap_type_hidden);
+ }
+}
- function set_swap_type_enabled(coin_from, coin_to, swap_type) {
- const adaptor_sig_only_coins = ['6' /* XMR */,'9' /* WOW */, '8' /* PART_ANON */, '7' /* PART_BLIND */, '13' /* FIRO */, '17' /* BCH */];
- const secret_hash_only_coins = ['11' /* PIVX */, '12' /* DASH */];
- let make_hidden = false;
- if (adaptor_sig_only_coins.includes(coin_from) || adaptor_sig_only_coins.includes(coin_to)) {
- swap_type.disabled = true;
- swap_type.value = 'xmr_swap';
- make_hidden = true;
- swap_type.classList.add('select-disabled');
- } else
- if (secret_hash_only_coins.includes(coin_from) && secret_hash_only_coins.includes(coin_to)) {
- swap_type.disabled = true;
- swap_type.value = 'seller_first';
- make_hidden = true;
- swap_type.classList.add('select-disabled');
+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 = rate == '' ? false : document.getElementById('rate_lock').checked;
+
+ if (value_changed === 'coin_from' || value_changed === 'coin_to') {
+ document.getElementById('rate').value = '';
+ return;
+ }
+
+ const swap_type = document.getElementById('swap_type');
+ set_swap_type_enabled(coin_from, coin_to, swap_type);
+
+ if (coin_from == '-1' || coin_to == '-1') {
+ return;
+ }
+
+ let params = 'coin_from=' + coin_from + '&coin_to=' + coin_to;
+
+ if (value_changed == 'rate' || (lock_rate && value_changed == 'amt_from') || (amt_to == '' && value_changed == 'amt_from')) {
+ if (rate == '' || (amt_from == '' && amt_to == '')) {
+ return;
+ } else if (amt_from == '' && amt_to != '') {
+ if (value_changed == 'amt_from') {
+ return;
+ }
+ params += '&rate=' + rate + '&amt_to=' + amt_to;
} else {
- swap_type.disabled = false;
- swap_type.classList.remove('select-disabled');
+ params += '&rate=' + rate + '&amt_from=' + amt_from;
}
- let swap_type_hidden = document.getElementById('swap_type_hidden');
- if (make_hidden) {
- if (!swap_type_hidden) {
- swap_type_hidden = document.createElement('input');
- swap_type_hidden.setAttribute('id', 'swap_type_hidden');
- swap_type_hidden.setAttribute('type', 'hidden');
- swap_type_hidden.setAttribute('name', 'swap_type');
- document.getElementById('form').appendChild(swap_type_hidden)
- }
- swap_type_hidden.setAttribute('value', swap_type.value);
- } else
- if (swap_type_hidden) {
- swap_type_hidden.parentNode.removeChild(swap_type_hidden);
- }
- }
-
- 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 = rate == '' ? false : document.getElementById('rate_lock').checked;
-
- const swap_type = document.getElementById('swap_type');
- set_swap_type_enabled(coin_from, coin_to, swap_type);
-
- if (coin_from == '-1' || coin_to == '-1') {
+ } else if (lock_rate && value_changed == 'amt_to') {
+ if (amt_to == '' || rate == '') {
return;
}
- params = 'coin_from=' + coin_from + '&coin_to=' + coin_to;
- if (value_changed == 'rate' || (lock_rate && value_changed == 'amt_from') || (amt_to == '' && value_changed == 'amt_from')) {
- if (rate == '' || (amt_from == '' && amt_to == '')) {
- return;
- } else
- if (amt_from == '' && amt_to != '') {
- if (value_changed == 'amt_from') {
- return;
- }
- params += '&rate=' + rate + '&amt_to=' + amt_to;
- } else {
- 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;
+ params += '&amt_to=' + amt_to + '&rate=' + rate;
+ } else {
+ if (amt_from == '' || amt_to == '') {
+ return;
}
- xhr_rate.open('POST', '/json/rate');
- xhr_rate.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
- xhr_rate.send(params);
+ params += '&amt_from=' + amt_from + '&amt_to=' + amt_to;
}
- document.addEventListener("DOMContentLoaded", function() {
- const coin_from = document.getElementById('coin_from').value;
- const coin_to = document.getElementById('coin_to').value;
- const swap_type = document.getElementById('swap_type');
- set_swap_type_enabled(coin_from, coin_to, swap_type);
- });
- </script>
+ xhr_rate.open('POST', '/json/rate');
+ xhr_rate.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
+ xhr_rate.send(params);
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+ const coin_from = document.getElementById('coin_from').value;
+ const coin_to = document.getElementById('coin_to').value;
+ const swap_type = document.getElementById('swap_type');
+ set_swap_type_enabled(coin_from, coin_to, swap_type);
+});
+</script>
</div>
<script src="static/js/new_offer.js"></script>
{% include 'footer.html' %}