Qortal/qortal-ui
4
1
Fork 4
mirror of https://github.com/Qortal/qortal-ui.git synced 2025-02-11 09:45:52 +00:00
Code Issues Projects Releases Wiki Activity

Update trade-portal.src.js

Browse Source 
Added an icon to the coin selection menu
This commit is contained in:
proto 2022-08-18 01:30:46 +01:00
parent eeeccb5a8a
commit f5a8bc94cf
1 changed files with 22 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
qortal-ui-plugins/plugins/core/trade-portal/trade-portal.src.js
View File

@ -331,6 +331,7 @@ class TradePortal extends LitElement {
mwc-select#coinSelectionMenu { mwc-select#coinSelectionMenu {
font-size: 24px; font-size: 24px;
width:220px;
} }
mwc-select#coinSelectionMenu mwc-list-item { mwc-select#coinSelectionMenu mwc-list-item {
@ -1064,10 +1065,10 @@ class TradePortal extends LitElement {
let coinSelectionMenu = this.shadowRoot.getElementById("coinSelectionMenu") let coinSelectionMenu = this.shadowRoot.getElementById("coinSelectionMenu")
coinSelectionMenu.addEventListener('change', function () { coinSelectionMenu.addEventListener('change', function () {
_this.setForeignCoin(coinSelectionMenu.value) _this.setForeignCoin(coinSelectionMenu.value,false)
}) })
_this.setForeignCoin(coinSelectionMenu.value) _this.setForeignCoin(coinSelectionMenu.value,true)
}) })
parentEpml.imReady() parentEpml.imReady()
@ -1140,9 +1141,27 @@ class TradePortal extends LitElement {
}) })
} }
setForeignCoin(coin) { setForeignCoin(coin,beingInitialized) {
let _this = this let _this = this
this.selectedCoin = coin this.selectedCoin = coin
let coinSelectionMenu=this.shadowRoot.getElementById("coinSelectionMenu")
if(beingInitialized){
//apply padding to the container
coinSelectionMenu.shadowRoot.querySelector('.mdc-select--outlined .mdc-select__anchor').setAttribute('style', 'padding-left: 60px;')
//create the coin pair container
let pairIconContainer = document.createElement("span")
pairIconContainer.setAttribute("class","pairIconContainer")
pairIconContainer.setAttribute('style', 'left: 10px;top: 50%;transform: translate(0, -50%);height: 26px;width: 45px;position: absolute;background-repeat: no-repeat;background-size: cover;background-image: url(/img/qort'+_this.listedCoins.get(_this.selectedCoin).coinCode+'.png);')
//appending the coin pair container to the menu
coinSelectionMenu.shadowRoot.querySelector('.mdc-select--outlined .mdc-select__anchor').appendChild(pairIconContainer)
}else{//we need just to update the existing pair icon container
let pairIconContainer = coinSelectionMenu.shadowRoot.querySelector(".mdc-select--outlined .mdc-select__anchor span.pairIconContainer")
pairIconContainer.style.backgroundImage='url(/img/qort'+_this.listedCoins.get(_this.selectedCoin).coinCode+'.png)'
}
this.isLoadingHistoricTrades = true this.isLoadingHistoricTrades = true
this.isLoadingOpenTrades = true this.isLoadingOpenTrades = true
this.createConnection() this.createConnection()