Qortal/qortal-ui
1
0
Fork 0
mirror of https://github.com/Qortal/qortal-ui.git synced 2025-04-24 03:47:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Translate Websites Page and fix loading theme and language

Browse Source
This commit is contained in:
AlphaX-Projects 2022-04-13 06:46:00 +02:00
parent fa60cd9cfa
commit 4c49256624
12 changed files with 410 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
qortal-ui-core/language/cn.json
View File

@ -283,5 +283,42 @@
"nchange16": "Need Core Update", "nchange16": "Need Core Update",
"nchange17": "Name Already Exists!", "nchange17": "Name Already Exists!",
"nchange18": "Name Registration Successful!" "nchange18": "Name Registration Successful!"
},
"websitespage": {
"schange1": "Browse Websites",
"schange2": "Followed Websites",
"schange3": "Blocked Websites",
"schange4": "Search Websites",
"schange5": "Avatar",
"schange6": "Details",
"schange7": "Published by",
"schange8": "Actions",
"schange9": "Websites",
"schange10": "No websites available",
"schange11": "Your Followed Websites",
"schange12": "Followed Websites",
"schange13": "You aren't following any websites",
"schange14": "Your Blocked Websites",
"schange15": "Blocked Websites",
"schange16": "You have not blocked any websites",
"schange17": "Name Not Found!",
"schange18": "Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting",
"schange19": "in",
"schange20": "Relay mode is disabled. You can enable it by setting",
"schange21": "Publish Website",
"schange22": "Error occurred when trying to follow this registered name. Please try again!",
"schange23": "Error occurred when trying to unfollow this registered name. Please try again!",
"schange24": "Error occurred when trying to block this registered name. Please try again!",
"schange25": "Error occurred when trying to unblock this registered name. Please try again!",
"schange26": "Uncategorized",
"schange27": "Size",
"schange28": "Status",
"schange29": "Follow",
"schange30": "Unfollow",
"schange31": "Block",
"schange32": "Unblock",
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
} }
} }

37
qortal-ui-core/language/de.json
View File

@ -283,5 +283,42 @@
"nchange16": "Core-Update erforderlich", "nchange16": "Core-Update erforderlich",
"nchange17": "Name existiert bereits!", "nchange17": "Name existiert bereits!",
"nchange18": "Namensregistrierung erfolgreich!" "nchange18": "Namensregistrierung erfolgreich!"
},
"websitespage": {
"schange1": "Webseiten durchsuchen",
"schange2": "Gefolgte Webseiten",
"schange3": "Blockierte Webseiten",
"schange4": "Suche Webseite",
"schange5": "Avatar",
"schange6": "Einzelheiten",
"schange7": "Herausgegeben von",
"schange8": "Aktionen",
"schange9": "Webseiten",
"schange10": "Keine Webseiten verfügbar",
"schange11": "Ihre verfolgten Webseiten",
"schange12": "Gefolgte Websites",
"schange13": "Du folgst keine Webseiten",
"schange14": "Ihre blockierten Webseiten",
"schange15": "Blockierte Webseiten",
"schange16": "Sie haben keine Webseiten blockiert",
"schange17": "Name nicht gefunden!",
"schange18": "Der Relay-Modus ist aktiviert. Dies bedeutet, dass Ihr Knoten dabei hilft, verschlüsselte Daten im Netzwerk zu transportieren, wenn ein Peer sie anfordert. Sie können sich per Einstellung abmelden, ändern Sie",
"schange19": "in",
"schange20": "Der Relay-Modus ist deaktiviert. Sie können es durch Einstellung aktivieren, ändern Sie",
"schange21": "Webseite veröffentlichen",
"schange22": "Beim Versuch, diesem registrierten Namen zu folgen, ist ein Fehler aufgetreten. Bitte versuche es erneut!",
"schange23": "Beim Versuch, diesem registrierten Namen nicht mehr zu folgen, ist ein Fehler aufgetreten. Bitte versuche es erneut!",
"schange24": "Beim Blockieren dieses registrierten Namens ist ein Fehler aufgetreten. Bitte versuche es erneut!",
"schange25": "Beim Versuch, diesen registrierten Namen zu entsperren, ist ein Fehler aufgetreten. Bitte versuche es erneut!",
"schange26": "Nicht kategorisiert",
"schange27": "Größe",
"schange28": "Status",
"schange29": "Folgen",
"schange30": "Entfolgen",
"schange31": "Sperren",
"schange32": "Entsperren",
"schange33": "Name zu suchen",
"schange34": "Name darf nicht leer sein!",
"schange35": "Suchen"
} }
} }

37
qortal-ui-core/language/fr.json
View File

@ -283,5 +283,42 @@
"nchange16": "Need Core Update", "nchange16": "Need Core Update",
"nchange17": "Name Already Exists!", "nchange17": "Name Already Exists!",
"nchange18": "Name Registration Successful!" "nchange18": "Name Registration Successful!"
},
"websitespage": {
"schange1": "Browse Websites",
"schange2": "Followed Websites",
"schange3": "Blocked Websites",
"schange4": "Search Websites",
"schange5": "Avatar",
"schange6": "Details",
"schange7": "Published by",
"schange8": "Actions",
"schange9": "Websites",
"schange10": "No websites available",
"schange11": "Your Followed Websites",
"schange12": "Followed Websites",
"schange13": "You aren't following any websites",
"schange14": "Your Blocked Websites",
"schange15": "Blocked Websites",
"schange16": "You have not blocked any websites",
"schange17": "Name Not Found!",
"schange18": "Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting",
"schange19": "in",
"schange20": "Relay mode is disabled. You can enable it by setting",
"schange21": "Publish Website",
"schange22": "Error occurred when trying to follow this registered name. Please try again!",
"schange23": "Error occurred when trying to unfollow this registered name. Please try again!",
"schange24": "Error occurred when trying to block this registered name. Please try again!",
"schange25": "Error occurred when trying to unblock this registered name. Please try again!",
"schange26": "Uncategorized",
"schange27": "Size",
"schange28": "Status",
"schange29": "Follow",
"schange30": "Unfollow",
"schange31": "Block",
"schange32": "Unblock",
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
} }
} }

37
qortal-ui-core/language/pl.json
View File

@ -283,5 +283,42 @@
"nchange16": "Need Core Update", "nchange16": "Need Core Update",
"nchange17": "Name Already Exists!", "nchange17": "Name Already Exists!",
"nchange18": "Name Registration Successful!" "nchange18": "Name Registration Successful!"
},
,
"websitespage": {
"schange1": "Browse Websites",
"schange2": "Followed Websites",
"schange3": "Blocked Websites",
"schange4": "Search Websites",
"schange5": "Avatar",
"schange6": "Details",
"schange7": "Published by",
"schange8": "Actions",
"schange9": "Websites",
"schange10": "No websites available",
"schange11": "Your Followed Websites",
"schange12": "Followed Websites",
"schange13": "You aren't following any websites",
"schange14": "Your Blocked Websites",
"schange15": "Blocked Websites",
"schange16": "You have not blocked any websites",
"schange17": "Name Not Found!",
"schange18": "Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting",
"schange19": "in",
"schange20": "Relay mode is disabled. You can enable it by setting",
"schange21": "Publish Website",
"schange22": "Error occurred when trying to follow this registered name. Please try again!",
"schange23": "Error occurred when trying to unfollow this registered name. Please try again!",
"schange24": "Error occurred when trying to block this registered name. Please try again!",
"schange25": "Error occurred when trying to unblock this registered name. Please try again!",
"schange26": "Uncategorized",
"schange27": "Size",
"schange28": "Status",
"schange29": "Follow",
"schange30": "Unfollow",
"schange31": "Block",
"schange32": "Unblock",
"schange33": "Name to search",
"schange35": "Search"
} }
} }

37
qortal-ui-core/language/sp.json
View File

@ -283,5 +283,42 @@
"nchange16": "Need Core Update", "nchange16": "Need Core Update",
"nchange17": "Name Already Exists!", "nchange17": "Name Already Exists!",
"nchange18": "Name Registration Successful!" "nchange18": "Name Registration Successful!"
},
"websitespage": {
"schange1": "Browse Websites",
"schange2": "Followed Websites",
"schange3": "Blocked Websites",
"schange4": "Search Websites",
"schange5": "Avatar",
"schange6": "Details",
"schange7": "Published by",
"schange8": "Actions",
"schange9": "Websites",
"schange10": "No websites available",
"schange11": "Your Followed Websites",
"schange12": "Followed Websites",
"schange13": "You aren't following any websites",
"schange14": "Your Blocked Websites",
"schange15": "Blocked Websites",
"schange16": "You have not blocked any websites",
"schange17": "Name Not Found!",
"schange18": "Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting",
"schange19": "in",
"schange20": "Relay mode is disabled. You can enable it by setting",
"schange21": "Publish Website",
"schange22": "Error occurred when trying to follow this registered name. Please try again!",
"schange23": "Error occurred when trying to unfollow this registered name. Please try again!",
"schange24": "Error occurred when trying to block this registered name. Please try again!",
"schange25": "Error occurred when trying to unblock this registered name. Please try again!",
"schange26": "Uncategorized",
"schange27": "Size",
"schange28": "Status",
"schange29": "Follow",
"schange30": "Unfollow",
"schange31": "Block",
"schange32": "Unblock",
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
} }
} }

37
qortal-ui-core/language/us.json
View File

@ -283,5 +283,42 @@
"nchange16": "Need Core Update", "nchange16": "Need Core Update",
"nchange17": "Name Already Exists!", "nchange17": "Name Already Exists!",
"nchange18": "Name Registration Successful!" "nchange18": "Name Registration Successful!"
},
"websitespage": {
"schange1": "Browse Websites",
"schange2": "Followed Websites",
"schange3": "Blocked Websites",
"schange4": "Search Websites",
"schange5": "Avatar",
"schange6": "Details",
"schange7": "Published by",
"schange8": "Actions",
"schange9": "Websites",
"schange10": "No websites available",
"schange11": "Your Followed Websites",
"schange12": "Followed Websites",
"schange13": "You aren't following any websites",
"schange14": "Your Blocked Websites",
"schange15": "Blocked Websites",
"schange16": "You have not blocked any websites",
"schange17": "Name Not Found!",
"schange18": "Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting",
"schange19": "in",
"schange20": "Relay mode is disabled. You can enable it by setting",
"schange21": "Publish Website",
"schange22": "Error occurred when trying to follow this registered name. Please try again!",
"schange23": "Error occurred when trying to unfollow this registered name. Please try again!",
"schange24": "Error occurred when trying to block this registered name. Please try again!",
"schange25": "Error occurred when trying to unblock this registered name. Please try again!",
"schange26": "Uncategorized",
"schange27": "Size",
"schange28": "Status",
"schange29": "Follow",
"schange30": "Unfollow",
"schange31": "Block",
"schange32": "Unblock",
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
} }
} }

25
qortal-ui-plugins/plugins/core/minting/minting-info.src.js
View File

@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({ registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
@ -362,17 +362,8 @@ class MintingInfo extends LitElement {
firstUpdated() { firstUpdated() {
this.changeTheme() this.changeTheme()
setInterval(() => {
this.changeTheme()
}, 100)
this.changeLanguage() this.changeLanguage()
setInterval(() => {
this.changeLanguage()
}, 100)
const getAdminInfo = () => { const getAdminInfo = () => {
parentEpml.request("apiCall", { url: `/admin/info` }).then((res) => { parentEpml.request("apiCall", { url: `/admin/info` }).then((res) => {
setTimeout(() => { this.adminInfo = res; }, 1); setTimeout(() => { this.adminInfo = res; }, 1);
@ -410,6 +401,20 @@ class MintingInfo extends LitElement {
setTimeout(getAddressLevel, 30000); setTimeout(getAddressLevel, 30000);
}; };
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
let configLoaded = false; let configLoaded = false;
parentEpml.ready().then(() => { parentEpml.ready().then(() => {

58
qortal-ui-plugins/plugins/core/name-registration/name-registration.src.js
View File

@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({ registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
@ -168,33 +168,8 @@ class NameRegistration extends LitElement {
firstUpdated() { firstUpdated() {
this.changeTheme() this.changeTheme()
setInterval(() => {
this.changeTheme();
}, 100)
this.changeLanguage() this.changeLanguage()
this.unitFee()
setInterval(() => {
this.changeLanguage()
}, 100)
this.unitFee();
window.addEventListener("contextmenu", (event) => {
event.preventDefault();
this._textMenu(event)
});
window.addEventListener("click", () => {
parentEpml.request('closeCopyTextMenu', null)
});
window.onkeyup = (e) => {
if (e.keyCode === 27) {
parentEpml.request('closeCopyTextMenu', null)
}
}
const fetchNames = () => { const fetchNames = () => {
parentEpml.request('apiCall', { parentEpml.request('apiCall', {
@ -205,6 +180,35 @@ class NameRegistration extends LitElement {
setTimeout(fetchNames, this.config.user.nodeSettings.pingInterval) setTimeout(fetchNames, this.config.user.nodeSettings.pingInterval)
} }
window.addEventListener("contextmenu", (event) => {
event.preventDefault()
this._textMenu(event)
})
window.addEventListener("click", () => {
parentEpml.request('closeCopyTextMenu', null)
})
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
window.onkeyup = (e) => {
if (e.keyCode === 27) {
parentEpml.request('closeCopyTextMenu', null)
}
}
let configLoaded = false let configLoaded = false
parentEpml.ready().then(() => { parentEpml.ready().then(() => {

142
qortal-ui-plugins/plugins/core/qdn/websites.src.js
View File

@ -1,18 +1,23 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
})
import '@material/mwc-icon' import '@material/mwc-icon'
import '@material/mwc-button' import '@material/mwc-button'
import '@material/mwc-tab-bar' import '@material/mwc-tab-bar'
import '@material/mwc-textfield' import '@material/mwc-textfield'
import '@vaadin/button' import '@vaadin/button'
import '@vaadin/grid' import '@vaadin/grid'
import '@vaadin/icon' import '@vaadin/icon'
import '@vaadin/icons' import '@vaadin/icons'
import '@vaadin/text-field' import '@vaadin/text-field'
const parentEpml = new Epml({ type: 'WINDOW', source: window.parent }) const parentEpml = new Epml({ type: 'WINDOW', source: window.parent })
class Websites extends LitElement { class Websites extends LitElement {
@ -234,41 +239,41 @@ class Websites extends LitElement {
return html` return html`
<div id="websites-list-page"> <div id="websites-list-page">
<mwc-tab-bar id="tabs-1" activeIndex="0"> <mwc-tab-bar id="tabs-1" activeIndex="0">
<mwc-tab label="Browse Websites" icon="travel_explore" @click="${(e) => this.displayTabContent('browse')}"></mwc-tab> <mwc-tab label="${translate("websitespage.schange1")}" icon="travel_explore" @click="${(e) => this.displayTabContent('browse')}"></mwc-tab>
<mwc-tab label="Followed Websites" icon="desktop_windows" @click="${(e) => this.displayTabContent('followed')}"></mwc-tab> <mwc-tab label="${translate("websitespage.schange2")}" icon="desktop_windows" @click="${(e) => this.displayTabContent('followed')}"></mwc-tab>
<mwc-tab label="Blocked Websites" icon="block" @click="${(e) => this.displayTabContent('blocked')}"></mwc-tab> <mwc-tab label="${translate("websitespage.schange3")}" icon="block" @click="${(e) => this.displayTabContent('blocked')}"></mwc-tab>
</mwc-tab-bar> </mwc-tab-bar>
<z id="tabs-1-content"> <z id="tabs-1-content">
<div id="tab-browse-content"> <div id="tab-browse-content">
<div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;"> <div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;">
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">Browse Websites</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${translate("websitespage.schange1")}</h2>
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2>
</div> </div>
<div class="divCard"> <div class="divCard">
<h3 style="margin: 0; margin-bottom: 1em; text-align: left;">Search Websites</h3> <h3 style="margin: 0; margin-bottom: 1em; text-align: left;">${translate("websitespage.schange4")}</h3>
<div id="search"> <div id="search">
<vaadin-text-field theme="medium" id="searchName" placeholder="Name to search" value="${this.searchName}" @keydown="${this.searchListener}" clear-button-visible> <vaadin-text-field theme="medium" id="searchName" placeholder="${translate("websitespage.schange33")}" value="${this.searchName}" @keydown="${this.searchListener}" clear-button-visible>
<vaadin-icon slot="prefix" icon="vaadin:user"></vaadin-icon> <vaadin-icon slot="prefix" icon="vaadin:user"></vaadin-icon>
</vaadin-text-field>&nbsp;&nbsp;<br> </vaadin-text-field>&nbsp;&nbsp;<br>
<vaadin-button theme="medium" @click="${(e) => this.doSearch(e)}"> <vaadin-button theme="medium" @click="${(e) => this.doSearch(e)}">
<vaadin-icon icon="vaadin:search" slot="prefix"></vaadin-icon> <vaadin-icon icon="vaadin:search" slot="prefix"></vaadin-icon>
Search ${translate("websitespage.schange35")}
</vaadin-button> </vaadin-button>
</div><br /> </div><br />
<vaadin-grid theme="wrap-cell-content" id="searchResourcesGrid" ?hidden="${this.isEmptyArray(this.searchResources)}" .items="${this.searchResources}" aria-label="Search Websites" all-rows-visible> <vaadin-grid theme="wrap-cell-content" id="searchResourcesGrid" ?hidden="${this.isEmptyArray(this.searchResources)}" .items="${this.searchResources}" aria-label="Search Websites" all-rows-visible>
<vaadin-grid-column width="7rem" flex-grow="0" header="Avatar" .renderer=${(root, column, data) => { <vaadin-grid-column width="7rem" flex-grow="0" header="${translate("websitespage.schange5")}" .renderer=${(root, column, data) => {
render(html`${this.renderAvatar(data.item)}`, root) render(html`${this.renderAvatar(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column header="Details" .renderer=${(root, column, data) => { <vaadin-grid-column header="${translate("websitespage.schange6")}" .renderer=${(root, column, data) => {
render(html`${this.renderInfo(data.item)}`, root) render(html`${this.renderInfo(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="12rem" flex-grow="0" header="Published by" .renderer=${(root, column, data) => { <vaadin-grid-column width="12rem" flex-grow="0" header="${translate("websitespage.schange7")}" .renderer=${(root, column, data) => {
render(html`${this.renderPublishedBy(data.item)}`, root) render(html`${this.renderPublishedBy(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="11rem" flex-grow="0" header="Actions" .renderer=${(root, column, data) => { <vaadin-grid-column width="11rem" flex-grow="0" header="${translate("websitespage.schange8")}" .renderer=${(root, column, data) => {
render(html`${this.renderFollowUnfollowButton(data.item)}`, root); render(html`${this.renderFollowUnfollowButton(data.item)}`, root);
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
@ -279,21 +284,21 @@ class Websites extends LitElement {
</vaadin-grid><br /> </vaadin-grid><br />
</div> </div>
<div class="divCard"> <div class="divCard">
<h3 style="margin: 0; margin-bottom: 1em; text-align: center;">Websites</h3> <h3 style="margin: 0; margin-bottom: 1em; text-align: center;">${translate("websitespage.schange9")}</h3>
<vaadin-grid theme="wrap-cell-content" id="resourcesGrid" ?hidden="${this.isEmptyArray(this.pageRes)}" .items="${this.pageRes}" aria-label="Websites" all-rows-visible> <vaadin-grid theme="wrap-cell-content" id="resourcesGrid" ?hidden="${this.isEmptyArray(this.pageRes)}" .items="${this.pageRes}" aria-label="Websites" all-rows-visible>
<vaadin-grid-column width="7rem" flex-grow="0" header="Avatar" .renderer=${(root, column, data) => { <vaadin-grid-column width="7rem" flex-grow="0" header="${translate("websitespage.schange5")}" .renderer=${(root, column, data) => {
render(html`${this.renderAvatar(data.item)}`, root) render(html`${this.renderAvatar(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column header="Details" .renderer=${(root, column, data) => { <vaadin-grid-column header="${translate("websitespage.schange6")}" .renderer=${(root, column, data) => {
render(html`${this.renderInfo(data.item)}`, root) render(html`${this.renderInfo(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="12rem" flex-grow="0" header="Published by" .renderer=${(root, column, data) => { <vaadin-grid-column width="12rem" flex-grow="0" header="${translate("websitespage.schange7")}" .renderer=${(root, column, data) => {
render(html`${this.renderPublishedBy(data.item)}`, root) render(html`${this.renderPublishedBy(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="11rem" flex-grow="0" header="Actions" .renderer=${(root, column, data) => { <vaadin-grid-column width="11rem" flex-grow="0" header="${translate("websitespage.schange8")}" .renderer=${(root, column, data) => {
render(html`${this.renderFollowUnfollowButton(data.item)}`, root); render(html`${this.renderFollowUnfollowButton(data.item)}`, root);
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
@ -307,32 +312,32 @@ class Websites extends LitElement {
Loading... Loading...
`: ''} `: ''}
${this.isEmptyArray(this.pageRes) ? html` ${this.isEmptyArray(this.pageRes) ? html`
<span style="color: var(--black);">No websites available</span> <span style="color: var(--black);">${translate("websitespage.schange10")}</span>
`: ''} `: ''}
</div> </div>
${this.renderRelayModeText()} ${this.renderRelayModeText()}
</div> </div>
<div id="tab-followed-content"> <div id="tab-followed-content">
<div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;"> <div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;">
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">Your Followed Websites</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${translate("websitespage.schange11")}</h2>
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2>
</div> </div>
<div class="divCard"> <div class="divCard">
<h3 style="margin: 0; margin-bottom: 1em; text-align: center;">Followed Websites</h3> <h3 style="margin: 0; margin-bottom: 1em; text-align: center;">${translate("websitespage.schange12")}</h3>
<vaadin-grid theme="wrap-cell-content" id="followedResourcesGrid" ?hidden="${this.isEmptyArray(this.followedResources)}" .items="${this.followedResources}" aria-label="Followed Websites" all-rows-visible> <vaadin-grid theme="wrap-cell-content" id="followedResourcesGrid" ?hidden="${this.isEmptyArray(this.followedResources)}" .items="${this.followedResources}" aria-label="Followed Websites" all-rows-visible>
<vaadin-grid-column width="7rem" flex-grow="0" header="Avatar" .renderer=${(root, column, data) => { <vaadin-grid-column width="7rem" flex-grow="0" header="${translate("websitespage.schange5")}" .renderer=${(root, column, data) => {
render(html`${this.renderAvatar(data.item)}`, root) render(html`${this.renderAvatar(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column header="Details" .renderer=${(root, column, data) => { <vaadin-grid-column header="${translate("websitespage.schange6")}" .renderer=${(root, column, data) => {
render(html`${this.renderInfo(data.item)}`, root) render(html`${this.renderInfo(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="12rem" flex-grow="0" header="Published by" .renderer=${(root, column, data) => { <vaadin-grid-column width="12rem" flex-grow="0" header="${translate("websitespage.schange7")}" .renderer=${(root, column, data) => {
render(html`${this.renderPublishedBy(data.item)}`, root) render(html`${this.renderPublishedBy(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="11rem" flex-grow="0" header="Actions" .renderer=${(root, column, data) => { <vaadin-grid-column width="11rem" flex-grow="0" header="${translate("websitespage.schange8")}" .renderer=${(root, column, data) => {
render(html`${this.renderFollowUnfollowButton(data.item)}`, root); render(html`${this.renderFollowUnfollowButton(data.item)}`, root);
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
@ -345,32 +350,32 @@ class Websites extends LitElement {
Loading... Loading...
`: ''} `: ''}
${this.isEmptyArray(this.followedResources) ? html` ${this.isEmptyArray(this.followedResources) ? html`
<span style="color: var(--black);">You aren't following any websites</span> <span style="color: var(--black);">${translate("websitespage.schange13")}</span>
`: ''} `: ''}
</div> </div>
${this.renderRelayModeText()} ${this.renderRelayModeText()}
</div> </div>
<div id="tab-blocked-content"> <div id="tab-blocked-content">
<div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;"> <div style="min-height:48px; display: flex; padding-bottom: 6px; margin: 2px;">
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">Your Blocked Websites</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${translate("websitespage.schange14")}</h2>
<h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2> <h2 style="margin: 0; flex: 1; padding-top: .5em; display: inline;">${this.renderPublishButton()}</h2>
</div> </div>
<div class="divCard"> <div class="divCard">
<h3 style="margin: 0; margin-bottom: 1em; text-align: center;">Blocked Websites</h3> <h3 style="margin: 0; margin-bottom: 1em; text-align: center;">${translate("websitespage.schange15")}</h3>
<vaadin-grid theme="wrap-cell-content" id="blockedResourcesGrid" ?hidden="${this.isEmptyArray(this.blockedResources)}" .items="${this.blockedResources}" aria-label="Blocked Websites" all-rows-visible> <vaadin-grid theme="wrap-cell-content" id="blockedResourcesGrid" ?hidden="${this.isEmptyArray(this.blockedResources)}" .items="${this.blockedResources}" aria-label="Blocked Websites" all-rows-visible>
<vaadin-grid-column width="7rem" flex-grow="0" header="Avatar" .renderer=${(root, column, data) => { <vaadin-grid-column width="7rem" flex-grow="0" header="${translate("websitespage.schange5")}" .renderer=${(root, column, data) => {
render(html`${this.renderAvatar(data.item)}`, root) render(html`${this.renderAvatar(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column header="Details" .renderer=${(root, column, data) => { <vaadin-grid-column header="${translate("websitespage.schange6")}" .renderer=${(root, column, data) => {
render(html`${this.renderInfo(data.item)}`, root) render(html`${this.renderInfo(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="12rem" flex-grow="0" header="Published by" .renderer=${(root, column, data) => { <vaadin-grid-column width="12rem" flex-grow="0" header="${translate("websitespage.schange7")}" .renderer=${(root, column, data) => {
render(html`${this.renderPublishedBy(data.item)}`, root) render(html`${this.renderPublishedBy(data.item)}`, root)
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
<vaadin-grid-column width="11rem" flex-grow="0" header="Actions" .renderer=${(root, column, data) => { <vaadin-grid-column width="11rem" flex-grow="0" header="${translate("websitespage.schange8")}" .renderer=${(root, column, data) => {
render(html`${this.renderFollowUnfollowButton(data.item)}`, root); render(html`${this.renderFollowUnfollowButton(data.item)}`, root);
}}> }}>
</vaadin-grid-column> </vaadin-grid-column>
@ -383,7 +388,7 @@ class Websites extends LitElement {
Loading... Loading...
`: ''} `: ''}
${this.isEmptyArray(this.blockedResources) ? html` ${this.isEmptyArray(this.blockedResources) ? html`
<span style="color: var(--black);">You have not blocked any websites</span> <span style="color: var(--black);">${translate("websitespage.schange16")}</span>
`: ''} `: ''}
</div> </div>
${this.renderRelayModeText()} ${this.renderRelayModeText()}
@ -396,11 +401,7 @@ class Websites extends LitElement {
firstUpdated() { firstUpdated() {
this.changeTheme() this.changeTheme()
this.changeLanguage()
setInterval(() => {
this.changeTheme();
}, 100)
this.showWebsites() this.showWebsites()
setTimeout(() => { setTimeout(() => {
@ -449,6 +450,20 @@ class Websites extends LitElement {
} }
} }
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
let configLoaded = false let configLoaded = false
parentEpml.ready().then(() => { parentEpml.ready().then(() => {
@ -487,6 +502,21 @@ class Websites extends LitElement {
document.querySelector('html').setAttribute('theme', this.theme); document.querySelector('html').setAttribute('theme', this.theme);
} }
changeLanguage() {
const checkLanguage = localStorage.getItem('qortalLanguage')
if (checkLanguage === null || checkLanguage.length === 0) {
localStorage.setItem('qortalLanguage', 'us')
use('us')
} else {
use(checkLanguage)
}
}
renderCatText() {
return html`${translate("websitespage.schange26")}`
}
displayTabContent(tab) { displayTabContent(tab) {
const tabBrowseContent = this.shadowRoot.getElementById('tab-browse-content') const tabBrowseContent = this.shadowRoot.getElementById('tab-browse-content')
const tabFollowedContent = this.shadowRoot.getElementById('tab-followed-content') const tabFollowedContent = this.shadowRoot.getElementById('tab-followed-content')
@ -640,13 +670,15 @@ class Websites extends LitElement {
async searchResult() { async searchResult() {
let searchName = this.shadowRoot.getElementById('searchName').value let searchName = this.shadowRoot.getElementById('searchName').value
if (searchName.length === 0) { if (searchName.length === 0) {
parentEpml.request('showSnackBar', 'Name Can Not Be Empty!') let err1string = get("websitespage.schange34")
parentEpml.request('showSnackBar', `${err1string}`)
} else { } else {
let searchResources = await parentEpml.request('apiCall', { let searchResources = await parentEpml.request('apiCall', {
url: `/arbitrary/resources/search?service=${this.service}&query=${searchName}&default=true&limit=5&reverse=false&includestatus=true&includemetadata=true` url: `/arbitrary/resources/search?service=${this.service}&query=${searchName}&default=true&limit=5&reverse=false&includestatus=true&includemetadata=true`
}) })
if (this.isEmptyArray(searchResources)) { if (this.isEmptyArray(searchResources)) {
parentEpml.request('showSnackBar', 'Name Not Found!') let err2string = get("websitespage.schange17")
parentEpml.request('showSnackBar', `${err2string}`)
} else { } else {
this.searchResources = searchResources this.searchResources = searchResources
} }
@ -663,10 +695,10 @@ class Websites extends LitElement {
renderRelayModeText() { renderRelayModeText() {
if (this.relayMode === true) { if (this.relayMode === true) {
return html`<div class="relay-mode-notice">Relay mode is enabled. This means that your node will help to transport encrypted data around the network when a peer requests it. You can opt out by setting <strong>"relayModeEnabled": false</strong> in settings.json</div>`; return html`<div class="relay-mode-notice">${translate("websitespage.schange18")} <strong>"relayModeEnabled": false</strong> ${translate("websitespage.schange19")} settings.json</div>`;
} }
else if (this.relayMode === false) { else if (this.relayMode === false) {
return html`<div class="relay-mode-notice">Relay mode is disabled. You can enable it by setting <strong>"relayModeEnabled": true</strong> in settings.json</div>`; return html`<div class="relay-mode-notice">${translate("websitespage.schange20")} <strong>"relayModeEnabled": true</strong> ${translate("websitespage.schange19")} settings.json</div>`;
} }
return html``; return html``;
} }
@ -677,7 +709,7 @@ class Websites extends LitElement {
if (this.followedNames == null || !Array.isArray(this.followedNames)) { if (this.followedNames == null || !Array.isArray(this.followedNames)) {
return html`` return html``
} }
return html`<mwc-button style="float:right;" @click=${() => this.publishWebsite()}><mwc-icon>add</mwc-icon>Publish Website</mwc-button>` return html`<mwc-button style="float:right;" @click=${() => this.publishWebsite()}><mwc-icon>add</mwc-icon>${translate("websitespage.schange21")}</mwc-button>`
} }
publishWebsite() { publishWebsite() {
@ -710,7 +742,8 @@ class Websites extends LitElement {
window.location.reload() window.location.reload()
} }
else { else {
parentEpml.request('showSnackBar', 'Error occurred when trying to follow this registered name. Please try again') let err3string = get("websitespage.schange22")
parentEpml.request('showSnackBar', `${err3string}`)
} }
return ret return ret
this.displayTabContent('followed') this.displayTabContent('followed')
@ -739,7 +772,8 @@ class Websites extends LitElement {
window.location.reload() window.location.reload()
} }
else { else {
parentEpml.request('showSnackBar', 'Error occurred when trying to unfollow this registered name. Please try again') let err4string = get("websitespage.schange23")
parentEpml.request('showSnackBar', `${err4string}`)
} }
return ret return ret
this.displayTabContent('followed') this.displayTabContent('followed')
@ -771,7 +805,8 @@ class Websites extends LitElement {
window.location.reload() window.location.reload()
} }
else { else {
parentEpml.request('showSnackBar', 'Error occurred when trying to block this registered name. Please try again') let err5string = get("websitespage.schange24")
parentEpml.request('showSnackBar', `${err5string}`)
} }
return ret return ret
this.displayTabContent('blocked') this.displayTabContent('blocked')
@ -800,7 +835,8 @@ class Websites extends LitElement {
window.location.reload() window.location.reload()
} }
else { else {
parentEpml.request('showSnackBar', 'Error occurred when trying to unblock this registered name. Please try again') let err6string = get("websitespage.schange25")
parentEpml.request('showSnackBar', `${err6string}`)
} }
return ret return ret
this.displayTabContent('blocked') this.displayTabContent('blocked')
@ -810,7 +846,7 @@ class Websites extends LitElement {
let name = websiteObj.name let name = websiteObj.name
let title = name; let title = name;
let description = ""; let description = "";
let categoryName = "Uncategorized"; let categoryName = this.renderCatText();
let tags = ""; let tags = "";
let sizeReadable = ""; let sizeReadable = "";
@ -838,13 +874,13 @@ class Websites extends LitElement {
${tags.length > 0 ? " | " : ""} ${tags.length > 0 ? " | " : ""}
&nbsp;${tags}&nbsp; &nbsp;${tags}&nbsp;
${sizeReadable.length > 0 ? " | " : ""} ${sizeReadable.length > 0 ? " | " : ""}
&nbsp;Size: ${sizeReadable} &nbsp;${translate("websitespage.schange27")}: ${sizeReadable}
</div>`; </div>`;
} }
renderPublishedBy(websiteObj) { renderPublishedBy(websiteObj) {
return html`<div class="resourceRegisteredName">${websiteObj.name}</div> return html`<div class="resourceRegisteredName">${websiteObj.name}</div>
<div class="resourceStatus">Status: <span title="${websiteObj.status.description}">${websiteObj.status.title}</span></div>`; <div class="resourceStatus">${translate("websitespage.schange28")}: <span title="${websiteObj.status.description}">${websiteObj.status.title}</span></div>`;
} }
renderSize(websiteObj) { renderSize(websiteObj) {
@ -865,11 +901,11 @@ class Websites extends LitElement {
if (this.followedNames.indexOf(name) === -1) { if (this.followedNames.indexOf(name) === -1) {
// render follow button // render follow button
return html`<mwc-button @click=${() => this.followName(websiteObj)}><mwc-icon>add_to_queue</mwc-icon>&nbsp;Follow</mwc-button>` return html`<mwc-button @click=${() => this.followName(websiteObj)}><mwc-icon>add_to_queue</mwc-icon>&nbsp;${translate("websitespage.schange29")}</mwc-button>`
} }
else { else {
// render unfollow button // render unfollow button
return html`<mwc-button @click=${() => this.unfollowName(websiteObj)}><mwc-icon>remove_from_queue</mwc-icon>&nbsp;Unfollow</mwc-button>` return html`<mwc-button @click=${() => this.unfollowName(websiteObj)}><mwc-icon>remove_from_queue</mwc-icon>&nbsp;${translate("websitespage.schange30")}</mwc-button>`
} }
} }
@ -883,11 +919,11 @@ class Websites extends LitElement {
if (this.blockedNames.indexOf(name) === -1) { if (this.blockedNames.indexOf(name) === -1) {
// render block button // render block button
return html`<mwc-button @click=${() => this.blockName(websiteObj)}><mwc-icon>block</mwc-icon>&nbsp;Block</mwc-button>` return html`<mwc-button @click=${() => this.blockName(websiteObj)}><mwc-icon>block</mwc-icon>&nbsp;${translate("websitespage.schange31")}</mwc-button>`
} }
else { else {
// render unblock button // render unblock button
return html`<mwc-button @click=${() => this.unblockName(websiteObj)}><mwc-icon>radio_button_unchecked</mwc-icon>&nbsp;Unblock</mwc-button>` return html`<mwc-button @click=${() => this.unblockName(websiteObj)}><mwc-icon>radio_button_unchecked</mwc-icon>&nbsp;${translate("websitespage.schange32")}</mwc-button>`
} }
} }

31
qortal-ui-plugins/plugins/core/reward-share/reward-share.src.js
View File

@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({ registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
@ -173,25 +173,30 @@ class RewardShare extends LitElement {
firstUpdated() { firstUpdated() {
this.changeTheme() this.changeTheme()
setInterval(() => {
this.changeTheme();
}, 100)
this.changeLanguage() this.changeLanguage()
setInterval(() => {
this.changeLanguage()
}, 100)
window.addEventListener("contextmenu", (event) => { window.addEventListener("contextmenu", (event) => {
event.preventDefault(); event.preventDefault()
this._textMenu(event) this._textMenu(event)
}); })
window.addEventListener("click", () => { window.addEventListener("click", () => {
parentEpml.request('closeCopyTextMenu', null) parentEpml.request('closeCopyTextMenu', null)
}); })
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
window.onkeyup = (e) => { window.onkeyup = (e) => {
if (e.keyCode === 27) { if (e.keyCode === 27) {

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

@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({ registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
@ -882,17 +882,7 @@ class TradePortal extends LitElement {
let _this = this let _this = this
this.changeTheme() this.changeTheme()
setInterval(() => {
this.changeTheme();
}, 100)
this.changeLanguage() this.changeLanguage()
setInterval(() => {
this.changeLanguage()
}, 100)
this.updateWalletBalance() this.updateWalletBalance()
setTimeout(() => { setTimeout(() => {
@ -917,23 +907,31 @@ class TradePortal extends LitElement {
this.getOpenOrdersGrid() this.getOpenOrdersGrid()
window.addEventListener( window.addEventListener('contextmenu', (event) => {
'contextmenu', event.preventDefault()
(event) => { this._textMenu(event)},
event.preventDefault()
this._textMenu(event)
},
{ passive: true } { passive: true }
) )
window.addEventListener( window.addEventListener('click', () => {
'click', parentEpml.request('closeCopyTextMenu', null)},
() => {
parentEpml.request('closeCopyTextMenu', null)
},
{ passive: true } { passive: true }
) )
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
window.onkeyup = (e) => { window.onkeyup = (e) => {
if (e.keyCode === 27) parentEpml.request('closeCopyTextMenu', null) if (e.keyCode === 27) parentEpml.request('closeCopyTextMenu', null)
} }

25
qortal-ui-plugins/plugins/core/wallet/wallet-app.src.js
View File

@ -1,7 +1,7 @@
import { LitElement, html, css } from 'lit' import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js' import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js' import { Epml } from '../../../epml.js'
import { use, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate' import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({ registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json()) loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
@ -1155,17 +1155,8 @@ class MultiWallet extends LitElement {
firstUpdated() { firstUpdated() {
this.changeTheme() this.changeTheme()
setInterval(() => {
this.changeTheme();
}, 100)
this.changeLanguage() this.changeLanguage()
setInterval(() => {
this.changeLanguage()
}, 100)
setInterval(() => { setInterval(() => {
this.errorMessage = ''; this.errorMessage = '';
}, 5000) }, 5000)
@ -1195,6 +1186,20 @@ class MultiWallet extends LitElement {
} }
}) })
window.addEventListener('storage', () => {
const checkLanguage = localStorage.getItem('qortalLanguage')
const checkTheme = localStorage.getItem('qortalTheme')
use(checkLanguage)
if (checkTheme === 'dark') {
this.theme = 'dark'
} else {
this.theme = 'light'
}
document.querySelector('html').setAttribute('theme', this.theme)
})
window.onkeyup = (e) => { window.onkeyup = (e) => {
if (e.keyCode === 27) { if (e.keyCode === 27) {
parentEpml.request('closeCopyTextMenu', null) parentEpml.request('closeCopyTextMenu', null)