Qortal
/
qortal-ui
mirror of https://github.com/qortal/qortal-ui
4
1
Fork 4
Code Issues Projects Releases Wiki Activity
Browse Source

Show spinner if loading page

pull/257/head
QuickMythril 8 months ago
parent
e15a68f180
commit
fc84abb407
5 changed files with 112 additions and 10 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      core/language/us.json
  2. 27
      plugins/plugins/core/name-registration/name-registration.src.js
  3. 36
      plugins/plugins/core/names-market/names-market.src.js
  4. 24
      plugins/plugins/core/puzzles/puzzles.src.js
  5. 33
      plugins/plugins/core/reward-share/reward-share.src.js

2
core/language/us.json
Unescape View File

@ -459,7 +459,7 @@
"rewardsharepage": {
"rchange1": "Rewardshares",
"rchange2": "Create reward share",
"rchange3": "Rewardshares Involving In This Account",
"rchange3": "Rewardshares Involving This Account",
"rchange4": "Minting Account",
"rchange5": "Share Percent",
"rchange6": "Recipient",

27
plugins/plugins/core/name-registration/name-registration.src.js
Unescape View File

@ -29,7 +29,6 @@ class NameRegistration extends LitElement {
return {
theme: { type: String, reflect: true },
qortWalletBalance: { type: Number },
loading: { type: Boolean },
names: { type: Array },
marketSellNames: { type: Array },
recipientPublicKey: { type: String },
@ -131,6 +130,23 @@ class NameRegistration extends LitElement {
text-align: right;
}
paper-spinner-lite {
height: 30px;
width: 30px;
--paper-spinner-color: var(--mdc-theme-primary);
--paper-spinner-stroke-width: 3px;
}
.spinner {
width: 100%;
display: flex;
justify-content: center;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#pages {
display: flex;
flex-wrap: wrap;
@ -276,9 +292,14 @@ class NameRegistration extends LitElement {
}
}}></vaadin-grid-column>
</vaadin-grid>
${this.isEmptyArray(this.names) ? html`
${(this.isEmptyArray(this.names) && !this.isLoading) ? html`
<span style="color: var(--black);">${translate("registernamepage.nchange8")}</span>
`: ''}
${this.isLoading ? html`
<div class="spinner">
<paper-spinner-lite active></paper-spinner-lite>
</div>
` : ''}
</div>
<mwc-dialog id="registerNameDialog" scrimClickAction="${this.registerNameLoading ? '' : 'close'}">
@ -545,10 +566,12 @@ class NameRegistration extends LitElement {
this.unitCancelSellFee()
const fetchNames = () => {
this.isLoading = true
parentEpml.request('apiCall', {
url: `/names/address/${this.selectedAddress.address}?limit=0&reverse=true`
}).then(res => {
setTimeout(() => { this.names = res }, 1)
this.isLoading = false
})
setTimeout(fetchNames, this.config.user.nodeSettings.pingInterval)
}

36
plugins/plugins/core/names-market/names-market.src.js
Unescape View File

@ -30,7 +30,6 @@ class NamesMarket extends LitElement {
return {
theme: { type: String, reflect: true },
qortWalletBalance: { type: Number },
loading: { type: Boolean },
marketSellNames: { type: Array },
marketSoldNames: { type: Array },
filteredItems: { type: Array },
@ -165,6 +164,23 @@ class NamesMarket extends LitElement {
text-align: right;
}
paper-spinner-lite {
height: 30px;
width: 30px;
--paper-spinner-color: var(--mdc-theme-primary);
--paper-spinner-stroke-width: 3px;
}
.spinner {
width: 100%;
display: flex;
justify-content: center;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#pages {
display: flex;
flex-wrap: wrap;
@ -362,9 +378,14 @@ class NamesMarket extends LitElement {
}}></vaadin-grid-column>
</vaadin-grid>
<div id="pages"></div>
${this.isEmptyArray(this.marketSellNames) ? html`
${(this.isEmptyArray(this.marketSellNames) && !this.isLoading) ? html`
<span style="color: var(--black);">${translate("registernamepage.nchange24")}</span>
`: ''}
${this.isLoading ? html`
<div class="spinner">
<paper-spinner-lite active></paper-spinner-lite>
</div>
` : ''}
</div>
</div>
<div id="tab-sold-content">
@ -383,9 +404,14 @@ class NamesMarket extends LitElement {
}}></vaadin-grid-column>
</vaadin-grid>
<div id="pagesSold"></div>
${this.isEmptyArray(this.marketSoldNames) ? html`
${(this.isEmptyArray(this.marketSoldNames) && !this.isLoading) ? html`
<span style="color: var(--black);">${translate("registernamepage.nchange24")}</span>
`: ''}
${this.isLoading ? html`
<div class="spinner">
<paper-spinner-lite active></paper-spinner-lite>
</div>
` : ''}
</div>
</div>
</div>
@ -548,22 +574,26 @@ class NamesMarket extends LitElement {
}, 0)
const fetchMarketSellNames = async () => {
this.isLoading = true
await parentEpml.request('apiCall', {
url: `/names/forsale?limit=0&reverse=true`
}).then(res => {
this.marketSellNames = res
})
this.updatePageSize()
this.isLoading = false
setTimeout(fetchMarketSellNames, 180000)
}
const fetchMarketSoldNames = async () => {
this.isLoading = true
await parentEpml.request('apiCall', {
url: `/transactions/search?txType=BUY_NAME&confirmationStatus=BOTH&limit=0&reverse=true`
}).then(res => {
this.marketSoldNames = res
})
this.updatePageSoldSize()
this.isLoading = false
setTimeout(fetchMarketSoldNames, 300000)
}

24
plugins/plugins/core/puzzles/puzzles.src.js
Unescape View File

@ -87,6 +87,23 @@ class Puzzles extends LitElement {
box-shadow: 0 .3px 1px 0 rgba(0,0,0,0.14), 0 1px 1px -1px rgba(0,0,0,0.12), 0 1px 2px 0 rgba(0,0,0,0.20);
margin-bottom: 2em;
}
paper-spinner-lite {
height: 30px;
width: 30px;
--paper-spinner-color: var(--mdc-theme-primary);
--paper-spinner-stroke-width: 3px;
}
.spinner {
width: 100%;
display: flex;
justify-content: center;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
`
}
@ -132,6 +149,11 @@ class Puzzles extends LitElement {
}
}}></vaadin-grid-column>
</vaadin-grid>
${this.loading ? html`
<div class="spinner">
<paper-spinner-lite active></paper-spinner-lite>
</div>
` : ''}
<mwc-dialog id="puzzleGuessDialog" scrimClickAction="${this.loading ? '' : 'close'}">
<div>${translate("puzzlepage.pchange9")} ${this.selectedPuzzle.reward} QORT:</div>
@ -252,6 +274,7 @@ class Puzzles extends LitElement {
}
const updatePuzzles = async () => {
this.loading = true;
let _puzzleGroupMembers = await getPuzzleGroupMembers()
let _puzzles = []
@ -305,6 +328,7 @@ class Puzzles extends LitElement {
}))
this.puzzles = _puzzles;
this.loading = false;
setTimeout(updatePuzzles, 60000)
}

33
plugins/plugins/core/reward-share/reward-share.src.js
Unescape View File

@ -20,7 +20,7 @@ const parentEpml = new Epml({ type: 'WINDOW', source: window.parent })
class RewardShare extends LitElement {
static get properties() {
return {
loading: { type: Boolean },
isLoading: { type: Boolean },
rewardShares: { type: Array },
recipientPublicKey: { type: String },
selectedAddress: { type: Object },
@ -80,6 +80,23 @@ class RewardShare extends LitElement {
.red {
--mdc-theme-primary: #F44336;
}
paper-spinner-lite {
height: 30px;
width: 30px;
--paper-spinner-color: var(--mdc-theme-primary);
--paper-spinner-stroke-width: 3px;
}
.spinner {
width: 100%;
display: flex;
justify-content: center;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
`
}
@ -92,6 +109,7 @@ class RewardShare extends LitElement {
this.btnDisable = false
this.createRewardShareLoading = false
this.removeRewardShareLoading = false
this.isLoading = false
this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light'
}
@ -115,6 +133,14 @@ class RewardShare extends LitElement {
}}>
</vaadin-grid-column>
</vaadin-grid>
${(this.isEmptyArray(this.rewardShares) && !this.isLoading) ? html`
<span style="color: var(--black);">${translate("rewardsharepage.rchange15")}</span>
`: ''}
${this.isLoading ? html`
<div class="spinner">
<paper-spinner-lite active></paper-spinner-lite>
</div>
` : ''}
</div>
<mwc-dialog id="createRewardShareDialog" scrimClickAction="${this.createRewardShareLoading ? '' : 'close'}">
@ -202,9 +228,6 @@ class RewardShare extends LitElement {
${translate("general.close")}
</mwc-button>
</mwc-dialog>
${this.isEmptyArray(this.rewardShares) ? html`
<span style="color: var(--black);">${translate("rewardsharepage.rchange15")}</span>
`: ''}
</div>
`
}
@ -236,11 +259,13 @@ class RewardShare extends LitElement {
}
const updateRewardshares = () => {
this.isLoading = true
this.rewardShares = []
parentEpml.request('apiCall', {
url: `/addresses/rewardshares?involving=${this.selectedAddress.address}`
}).then(res => {
this.rewardShares = res
this.isLoading = false
})
setTimeout(updateRewardshares, 60000)
}

Write Preview
Loading…
Cancel
Save