103 lines
3.6 KiB
JavaScript
103 lines
3.6 KiB
JavaScript
|
|
||
|
(function() {
|
||
|
new Vue({
|
||
|
el: '#app',
|
||
|
data: {
|
||
|
dropdownVisibility: {
|
||
|
source: false,
|
||
|
target: false
|
||
|
},
|
||
|
sourceCoinAmount: 0,
|
||
|
sourceCoinFilter: '',
|
||
|
targetCoinFilter: '',
|
||
|
sourceCoinValue: 'cashout',
|
||
|
targetCoinValue: 'ascoin',
|
||
|
balances: [],
|
||
|
coins: [],
|
||
|
club: false
|
||
|
},
|
||
|
methods: {
|
||
|
changeSourceCoin(name) {
|
||
|
this.sourceCoinValue = name;
|
||
|
this.dropdownVisibility.source = false;
|
||
|
this.sourceCoinFilter = '';
|
||
|
},
|
||
|
changeTargetCoin(name) {
|
||
|
this.targetCoinValue = name;
|
||
|
this.dropdownVisibility.target = false;
|
||
|
this.targetCoinFilter = '';
|
||
|
},
|
||
|
swapCoins() {
|
||
|
const tmp = this.sourceCoinValue;
|
||
|
this.sourceCoinValue = this.targetCoinValue;
|
||
|
this.targetCoinValue = tmp;
|
||
|
},
|
||
|
fetchCoins() {
|
||
|
fetch("/api/fetch_coins").then(res => res.json()).then(coins => {
|
||
|
this.coins = coins;
|
||
|
})
|
||
|
},
|
||
|
fetchBalances() {
|
||
|
fetch("/api/wallet/balances").then(res => res.json()).then(balances => {
|
||
|
this.balances = balances;
|
||
|
})
|
||
|
},
|
||
|
convert() {
|
||
|
fetch("/api/wallet/transaction", {
|
||
|
method: "POST",
|
||
|
body: JSON.stringify({
|
||
|
sourceCoin: this.sourceCoinValue,
|
||
|
targetCoin: this.targetCoinValue,
|
||
|
balance: this.sourceCoinAmount
|
||
|
}),
|
||
|
headers: {
|
||
|
"Content-Type": "application/json"
|
||
|
}
|
||
|
}).then(_ => {
|
||
|
this.fetchBalances();
|
||
|
this.sourceCoinAmount = 0;
|
||
|
})
|
||
|
},
|
||
|
joinGlacierClub() {
|
||
|
fetch("/api/wallet/join_glacier_club", {method: "POST"}).then(res => res.json()).then(club => {
|
||
|
this.club = club;
|
||
|
this.$refs.modalGlacierclub.classList.add('is-active')
|
||
|
})
|
||
|
},
|
||
|
closeClubModal() {
|
||
|
this.$refs.modalGlacierclub.classList.remove('is-active')
|
||
|
}
|
||
|
},
|
||
|
computed: {
|
||
|
filteredSourceCoins() {
|
||
|
return this.coins.filter(coin => coin.value.includes(this.sourceCoinFilter) && coin.name !== this.targetCoinValue);
|
||
|
},
|
||
|
filteredTargetCoins() {
|
||
|
return this.coins.filter(coin => coin.value.includes(this.targetCoinFilter) && coin.name !== this.sourceCoinValue);
|
||
|
},
|
||
|
sourceCoin() {
|
||
|
return this.coins.filter(coin => coin.name === this.sourceCoinValue)[0];
|
||
|
},
|
||
|
targetCoin() {
|
||
|
return this.coins.filter(coin => coin.name === this.targetCoinValue)[0];
|
||
|
}
|
||
|
},
|
||
|
mounted() {
|
||
|
this.fetchCoins();
|
||
|
this.fetchBalances();
|
||
|
},
|
||
|
delimiters: ['$$', '$$'],
|
||
|
})
|
||
|
})();
|
||
|
|
||
|
(function() {
|
||
|
setInterval(_ => {
|
||
|
document.querySelectorAll("[data-adjust-width-to]").forEach(element => {
|
||
|
const referenceElementId = element.dataset.adjustWidthTo;
|
||
|
if(!referenceElementId) return;
|
||
|
const referenceElement = document.getElementById(referenceElementId);
|
||
|
if(!referenceElement) return;
|
||
|
element.style.width = `${referenceElement.offsetWidth}px`;
|
||
|
})
|
||
|
})
|
||
|
})();
|