From 0e5574452f47b7f4cc5e9dbf07bd7754f06e77ea Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Mon, 6 Nov 2023 15:13:48 +0100 Subject: [PATCH 1/2] Fix account view --- .../components/settings-view/account-view.js | 31 ++++++++++--------- 1 file changed, 17 insertions(+), 14 deletions(-) diff --git a/core/src/components/settings-view/account-view.js b/core/src/components/settings-view/account-view.js index 191fc0b4..6f4758d6 100644 --- a/core/src/components/settings-view/account-view.js +++ b/core/src/components/settings-view/account-view.js @@ -1,7 +1,7 @@ -import {css, html, LitElement} from 'lit' -import {connect} from 'pwa-helpers' -import {store} from '../../store.js' -import {translate} from 'lit-translate' +import { LitElement, html, css } from 'lit' +import { connect } from 'pwa-helpers' +import { store } from '../../store.js' +import { get, translate } from 'lit-translate' class AccountView extends connect(store)(LitElement) { static get properties() { @@ -65,7 +65,7 @@ class AccountView extends connect(store)(LitElement) { constructor() { super() - this.accountInfo = { names: [], addressInfo: {} } + this.accountInfo = store.getState().app.accountInfo this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' this.switchAvatar = '' } @@ -76,7 +76,7 @@ class AccountView extends connect(store)(LitElement) {
${this.getAvatar()}
- ${this.accountInfo.names.length !== 0 ? this.accountInfo.names[0].name : 'No Registered Name'} + ${this.accountInfo.names.length !== 0 ? this.accountInfo.names[0].name : get("chatpage.cchange15")}
${translate("settings.address")}: @@ -98,21 +98,24 @@ class AccountView extends connect(store)(LitElement) { } getAvatar() { - const avatarNode = store.getState().app.nodeConfig.knownNodes[store.getState().app.nodeConfig.node] - const avatarUrl = avatarNode.protocol + '://' + avatarNode.domain + ':' + avatarNode.port - const url = `${avatarUrl}/arbitrary/THUMBNAIL/${this.accountInfo.names[0].name}/qortal_avatar?async=true&apiKey=${this.getApiKey()}` - const numberBlocks = (this.accountInfo.addressInfo.blocksMinted + this.accountInfo.addressInfo.blocksMintedAdjustment) - if (this.switchAvatar === 'light') { - if (Number.isNaN(numberBlocks) || numberBlocks == "" || numberBlocks === null) { + if (this.accountInfo.names.length === 0) { return html`` } else { + const avatarName = this.accountInfo.names[0].name + const avatarNode = store.getState().app.nodeConfig.knownNodes[store.getState().app.nodeConfig.node] + const avatarUrl = avatarNode.protocol + '://' + avatarNode.domain + ':' + avatarNode.port + const url = `${avatarUrl}/arbitrary/THUMBNAIL/${avatarName}/qortal_avatar?async=true&apiKey=${this.getApiKey()}` return html`` } } else if (this.switchAvatar === 'dark') { - if (Number.isNaN(numberBlocks) || numberBlocks == "" || numberBlocks === null) { + if (this.accountInfo.names.length === 0) { return html`` } else { + const avatarName = this.accountInfo.names[0].name + const avatarNode = store.getState().app.nodeConfig.knownNodes[store.getState().app.nodeConfig.node] + const avatarUrl = avatarNode.protocol + '://' + avatarNode.domain + ':' + avatarNode.port + const url = `${avatarUrl}/arbitrary/THUMBNAIL/${avatarName}/qortal_avatar?async=true&apiKey=${this.getApiKey()}` return html`` } } @@ -133,4 +136,4 @@ class AccountView extends connect(store)(LitElement) { } } -window.customElements.define('account-view', AccountView) +window.customElements.define('account-view', AccountView) \ No newline at end of file From 4ba32390254d286f179a2b826e57b15c85d80e6b Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Tue, 7 Nov 2023 15:02:11 +0100 Subject: [PATCH 2/2] New language selector --- core/src/components/app-view.js | 27 +++--- core/src/components/new-selector.js | 139 ++++++++++++++++++++++++++++ 2 files changed, 150 insertions(+), 16 deletions(-) create mode 100644 core/src/components/new-selector.js diff --git a/core/src/components/app-view.js b/core/src/components/app-view.js index dd356819..dba95054 100644 --- a/core/src/components/app-view.js +++ b/core/src/components/app-view.js @@ -27,7 +27,7 @@ import './wallet-profile.js' import './app-info.js' import './show-plugin.js' import './theme-toggle.js' -import './language-selector.js' +import './new-selector.js' import './settings-view/user-settings.js' import './logout-view/logout-view.js' import './check-for-update.js' @@ -564,22 +564,17 @@ class AppView extends connect(store)(LitElement) {
-
- - - - +
+ + + +
-
- - - -
-
  
- -
    
+
 
+ +
     
-
  
+
   
  
${this.renderLockButton()} @@ -591,7 +586,7 @@ class AppView extends connect(store)(LitElement) {
  
-
  
+
 
this.openLogout()} title="${translate("logout.logout")}">
diff --git a/core/src/components/new-selector.js b/core/src/components/new-selector.js new file mode 100644 index 00000000..ebe44c20 --- /dev/null +++ b/core/src/components/new-selector.js @@ -0,0 +1,139 @@ +import {css, html, LitElement} from 'lit' +import {registerTranslateConfig, translate, use} from 'lit-translate' + +registerTranslateConfig({ + loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) +}) + +const checkLanguage = localStorage.getItem('qortalLanguage') + +if (checkLanguage === null || checkLanguage.length === 0) { + localStorage.setItem('qortalLanguage', 'us') + use('us') +} else { + use(checkLanguage) +} + +class NewSelector extends LitElement { + static get properties() { + return { + theme: { type: String, reflect: true } + } + } + + static get styles() { + return [ + css` + select { + width: auto; + height: auto; + position: absolute; + top: 50px; + padding: 5px 5px 5px 5px; + font-size: 16px; + border: 1px solid var(--black); + border-radius: 3px; + color: var(--black); + background: var(--white); + overflow: hidden; + } + + *:focus { + outline: none; + } + + select option { + color: var(--black); + background: var(--white); + line-height: 34px; + } + + select option:hover { + color: var(--white); + background: var(--black); + line-height: 34px; + cursor: pointer; + } + ` + ] + } + + constructor() { + super() + this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' + } + + render() { + return html` +
+ + this.toggleMenu()}> + + +
+ + ` + } + + firstUpdated() { + const myElement = this.shadowRoot.getElementById('languageNew') + + myElement.addEventListener("change", () => { + this.selectElement() + }) + + myElement.addEventListener("click", () => { + const element1 = localStorage.getItem('qortalLanguage') + const element2 = this.shadowRoot.getElementById('languageNew').value + if (element1 === element2) { + myElement.style.display = "none" + } + }) + + this.selectElement() + } + + selectElement() { + const selectedLanguage = localStorage.getItem('qortalLanguage') + let element = this.shadowRoot.getElementById('languageNew') + element.value = selectedLanguage + element.style.display = "none" + } + + changeLanguage(event) { + use(event.target.value) + localStorage.setItem('qortalLanguage', event.target.value) + } + + toggleMenu() { + let mySwitchDisplay = this.shadowRoot.getElementById('languageNew') + if(mySwitchDisplay.style.display == "none") { + mySwitchDisplay.style.display = "block" + } else { + mySwitchDisplay.style.display = "none" + } + } +} + +window.customElements.define('new-selector', NewSelector)