jschulthess
/
qortal-ui
forked from Qortal/qortal-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Translate Publish Page and redesign button

digibyte
AlphaX-Projects 2 years ago
parent
4c49256624
commit
f5a3a1728e
7 changed files with 260 additions and 36 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. 27
      qortal-ui-core/language/cn.json
  2. 27
      qortal-ui-core/language/de.json
  3. 27
      qortal-ui-core/language/fr.json
  4. 27
      qortal-ui-core/language/pl.json
  5. 27
      qortal-ui-core/language/sp.json
  6. 27
      qortal-ui-core/language/us.json
  7. 134
      qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js

27
qortal-ui-core/language/cn.json
Unescape View File

@ -320,5 +320,32 @@
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
},
"publishpage": {
"pchange1": "Publish",
"pchange2": "Update",
"pchange3": "Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.",
"pchange4": "Select Name",
"pchange5": "Title",
"pchange6": "Description",
"pchange7": "Select Category",
"pchange8": "Tag",
"pchange9": "Service",
"pchange10": "Identifier",
"pchange11": "Publish",
"pchange12": "Select zip file containing static content",
"pchange13": "Local path to static files",
"pchange14": "Please select a registered name to publish data for",
"pchange15": "Please select a file to host",
"pchange16": "Please select a zip file to host",
"pchange17": "Please enter the directory path containing the static content",
"pchange18": "Please enter a service name",
"pchange19": "Processing data... this can take some time...",
"pchange20": "Error:",
"pchange21": "Internal Server Error when publishing data",
"pchange22": "Computing proof of work... this can take some time...",
"pchange23": "Transaction successful!",
"pchange24": "Unable to sign and process transaction",
"pchange25": "Choose File"
}
}

27
qortal-ui-core/language/de.json
Unescape View File

@ -320,5 +320,32 @@
"schange33": "Name zu suchen",
"schange34": "Name darf nicht leer sein!",
"schange35": "Suchen"
},
"publishpage": {
"pchange1": "Veröffentlichen",
"pchange2": "Aktualisieren",
"pchange3": "Hinweis: Es wird empfohlen, dass Sie die Portweiterleitung einrichten, bevor Sie Daten hosten, damit Peers im Netzwerk leichter darauf zugreifen können.",
"pchange4": "Namen wählen",
"pchange5": "Titel",
"pchange6": "Beschreibung",
"pchange7": "Kategorie wählen",
"pchange8": "Stichwort",
"pchange9": "Service",
"pchange10": "Kennung",
"pchange11": "Veröffentlichen",
"pchange12": "Wählen Sie eine ZIP-Datei mit statischem Inhalt aus",
"pchange13": "Lokaler Pfad zu statischen Dateien",
"pchange14": "Bitte wählen Sie einen registrierten Namen aus, für den die Daten veröffentlicht werden sollen",
"pchange15": "Bitte wählen Sie eine zu hostende Datei aus",
"pchange16": "Bitte wählen Sie eine ZIP-Datei zum Hosten aus",
"pchange17": "Bitte geben Sie den Verzeichnispfad ein, der den statischen Inhalt enthält",
"pchange18": "Bitte geben Sie einen Dienstnamen ein",
"pchange19": "Daten werden verarbeitet ... dies kann einige Zeit dauern ...",
"pchange20": "Fehler:",
"pchange21": "Interner Serverfehler beim Veröffentlichen von Daten",
"pchange22": "Berechnung des Arbeitsnachweises ... dies kann einige Zeit dauern ...",
"pchange23": "Transaktion Erfolgreich!",
"pchange24": "Transaktion kann nicht signiert und verarbeitet werden",
"pchange25": "Datei wählen"
}
}

27
qortal-ui-core/language/fr.json
Unescape View File

@ -320,5 +320,32 @@
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
},
"publishpage": {
"pchange1": "Publish",
"pchange2": "Update",
"pchange3": "Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.",
"pchange4": "Select Name",
"pchange5": "Title",
"pchange6": "Description",
"pchange7": "Select Category",
"pchange8": "Tag",
"pchange9": "Service",
"pchange10": "Identifier",
"pchange11": "Publish",
"pchange12": "Select zip file containing static content",
"pchange13": "Local path to static files",
"pchange14": "Please select a registered name to publish data for",
"pchange15": "Please select a file to host",
"pchange16": "Please select a zip file to host",
"pchange17": "Please enter the directory path containing the static content",
"pchange18": "Please enter a service name",
"pchange19": "Processing data... this can take some time...",
"pchange20": "Error:",
"pchange21": "Internal Server Error when publishing data",
"pchange22": "Computing proof of work... this can take some time...",
"pchange23": "Transaction successful!",
"pchange24": "Unable to sign and process transaction",
"pchange25": "Choose File"
}
}

27
qortal-ui-core/language/pl.json
Unescape View File

@ -320,5 +320,32 @@
"schange32": "Unblock",
"schange33": "Name to search",
"schange35": "Search"
},
"publishpage": {
"pchange1": "Publish",
"pchange2": "Update",
"pchange3": "Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.",
"pchange4": "Select Name",
"pchange5": "Title",
"pchange6": "Description",
"pchange7": "Select Category",
"pchange8": "Tag",
"pchange9": "Service",
"pchange10": "Identifier",
"pchange11": "Publish",
"pchange12": "Select zip file containing static content",
"pchange13": "Local path to static files",
"pchange14": "Please select a registered name to publish data for",
"pchange15": "Please select a file to host",
"pchange16": "Please select a zip file to host",
"pchange17": "Please enter the directory path containing the static content",
"pchange18": "Please enter a service name",
"pchange19": "Processing data... this can take some time...",
"pchange20": "Error:",
"pchange21": "Internal Server Error when publishing data",
"pchange22": "Computing proof of work... this can take some time...",
"pchange23": "Transaction successful!",
"pchange24": "Unable to sign and process transaction",
"pchange25": "Choose File"
}
}

27
qortal-ui-core/language/sp.json
Unescape View File

@ -320,5 +320,32 @@
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
},
"publishpage": {
"pchange1": "Publish",
"pchange2": "Update",
"pchange3": "Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.",
"pchange4": "Select Name",
"pchange5": "Title",
"pchange6": "Description",
"pchange7": "Select Category",
"pchange8": "Tag",
"pchange9": "Service",
"pchange10": "Identifier",
"pchange11": "Publish",
"pchange12": "Select zip file containing static content",
"pchange13": "Local path to static files",
"pchange14": "Please select a registered name to publish data for",
"pchange15": "Please select a file to host",
"pchange16": "Please select a zip file to host",
"pchange17": "Please enter the directory path containing the static content",
"pchange18": "Please enter a service name",
"pchange19": "Processing data... this can take some time...",
"pchange20": "Error:",
"pchange21": "Internal Server Error when publishing data",
"pchange22": "Computing proof of work... this can take some time...",
"pchange23": "Transaction successful!",
"pchange24": "Unable to sign and process transaction",
"pchange25": "Choose File"
}
}

27
qortal-ui-core/language/us.json
Unescape View File

@ -320,5 +320,32 @@
"schange33": "Name to search",
"schange34": "Name can not be empty!",
"schange35": "Search"
},
"publishpage": {
"pchange1": "Publish",
"pchange2": "Update",
"pchange3": "Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.",
"pchange4": "Select Name",
"pchange5": "Title",
"pchange6": "Description",
"pchange7": "Select Category",
"pchange8": "Tag",
"pchange9": "Service",
"pchange10": "Identifier",
"pchange11": "Publish",
"pchange12": "Select zip file containing static content",
"pchange13": "Local path to static files",
"pchange14": "Please select a registered name to publish data for",
"pchange15": "Please select a file to host",
"pchange16": "Please select a zip file to host",
"pchange17": "Please enter the directory path containing the static content",
"pchange18": "Please enter a service name",
"pchange19": "Processing data... this can take some time...",
"pchange20": "Error:",
"pchange21": "Internal Server Error when publishing data",
"pchange22": "Computing proof of work... this can take some time...",
"pchange23": "Transaction successful!",
"pchange24": "Unable to sign and process transaction",
"pchange25": "Choose File"
}
}

134
qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js
Unescape View File

@ -1,6 +1,11 @@
import { LitElement, html, css } from 'lit'
import { render } from 'lit/html.js'
import { Epml } from '../../../../epml'
import { use, get, translate, translateUnsafeHTML, registerTranslateConfig } from 'lit-translate'
registerTranslateConfig({
loader: lang => fetch(`/language/${lang}.json`).then(res => res.json())
})
import '@material/mwc-button'
import '@material/mwc-textfield'
@ -63,6 +68,27 @@ class PublishData extends LitElement {
--_lumo-grid-secondary-border-color: var(--border2);
}
input[type=text] {
padding: 6px 6px 6px 6px;
color: var(--black);
}
input[type=file]::file-selector-button {
border: 1px solid transparent;
padding: 6px 6px 6px 6px;
border-radius: 5px;
color: #fff;
background-color: var(--mdc-theme-primary);
transition: 1s;
}
input[type=file]::file-selector-button:hover {
color: #000;
background-color: #81ecec;
border: 1px solid transparent;
}
#publishWrapper paper-button {
float: right;
}
@ -214,57 +240,57 @@ class PublishData extends LitElement {
<div id="publishWrapper" style="width: auto; padding:10px; background: var(--white); height: 100vh;">
<div class="layout horizontal center" style=" padding:12px 15px;">
<div class="address-bar">
<mwc-button @click=${() => this.goBack()} class="address-bar-button"><mwc-icon>arrow_back_ios</mwc-icon> Back</mwc-button>
<mwc-button @click=${() => this.goBack()} class="address-bar-button"><mwc-icon>arrow_back_ios</mwc-icon> ${translate("general.back")}</mwc-button>
</div>
<paper-card style="width:100%; max-width:740px;">
<div style="margin:0; margin-top:20px;">
<h3 style="margin:0; padding:8px 0; text-transform: capitalize; color: var(--black);">Publish / Update ${this.category}</h3>
<p style="font-style: italic; font-size: 14px; color: var(--black);" ?hidden="${this.portForwardingEnabled}">Note: it is recommended that you set up port forwarding before hosting data, so that it can more easily accessed by peers on the network.</p>
<h3 style="margin:0; padding:8px 0; text-transform: capitalize; color: var(--black);">${translate("publishpage.pchange1")} / ${translate("publishpage.pchange2")} ${this.category}</h3>
<p style="font-style: italic; font-size: 14px; color: var(--black);" ?hidden="${this.portForwardingEnabled}">${translate("publishpage.pchange3")}</p>
</div>
</paper-card>
<!-- TODO: adapt this dropdown to list all names on the account. Right now it's hardcoded to a single name -->
<p style="display: ${this.showName ? 'block' : 'none'}">
<mwc-select id="registeredName" label="Select Name" @selected=${(e) => this.selectName(e)} style="min-width: 130px; max-width:100%; width:100%;">
<mwc-select id="registeredName" label="${translate("publishpage.pchange4")}" @selected=${(e) => this.selectName(e)} style="min-width: 130px; max-width:100%; width:100%;">
<mwc-list-item selected value=""></mwc-list-item>
<mwc-list-item value="${this.myRegisteredName}">${this.myRegisteredName}</mwc-list-item>
</mwc-select>
</p>
<div style="display: ${this.showMetadata ? 'block' : 'none'}">
<p>
<mwc-textfield style="width:100%;" label="Title" id="title" type="text" value="${this.metadata != null && this.metadata.title != null ? this.metadata.title : ''}" maxLength="80"></mwc-textfield><!--charCounter="true"-->
<mwc-textfield style="width:100%;" label="${translate("publishpage.pchange5")}" id="title" type="text" value="${this.metadata != null && this.metadata.title != null ? this.metadata.title : ''}" maxLength="80"></mwc-textfield><!--charCounter="true"-->
</p>
<p>
<mwc-textfield style="width:100%;" label="Description" id="description" type="text" value="${this.metadata != null && this.metadata.description != null ? this.metadata.description : ''}" maxLength="500"></mwc-textfield><!--charCounter="true"-->
<mwc-textfield style="width:100%;" label="${translate("publishpage.pchange6")}" id="description" type="text" value="${this.metadata != null && this.metadata.description != null ? this.metadata.description : ''}" maxLength="500"></mwc-textfield><!--charCounter="true"-->
</p>
<p>
<mwc-select id="category" label="Select Category" index="0" style="min-width: 130px; max-width:100%; width:100%;">
<mwc-select id="category" label="${translate("publishpage.pchange7")}" index="0" style="min-width: 130px; max-width:100%; width:100%;">
${this.categories.map((c, index) => html`
<mwc-list-item value="${c.id}">${c.name}</mwc-list-item>
`)}
</mwc-select>
</p>
<p>
<mwc-textfield style="width:19.85%;" id="tag1" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[0] != null ? this.metadata.tags[0] : ''}" placeholder="Tag 1" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag2" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[1] != null ? this.metadata.tags[1] : ''}" placeholder="Tag 2" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag3" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[2] != null ? this.metadata.tags[2] : ''}" placeholder="Tag 3" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag4" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[3] != null ? this.metadata.tags[3] : ''}" placeholder="Tag 4" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag5" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[4] != null ? this.metadata.tags[4] : ''}" placeholder="Tag 5" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag1" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[0] != null ? this.metadata.tags[0] : ''}" placeholder="${translate("publishpage.pchange8")} 1" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag2" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[1] != null ? this.metadata.tags[1] : ''}" placeholder="${translate("publishpage.pchange8")} 2" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag3" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[2] != null ? this.metadata.tags[2] : ''}" placeholder="${translate("publishpage.pchange8")} 3" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag4" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[3] != null ? this.metadata.tags[3] : ''}" placeholder="${translate("publishpage.pchange8")} 4" maxLength="20"></mwc-textfield>
<mwc-textfield style="width:19.85%;" id="tag5" type="text" value="${this.metadata != null && this.metadata.tags != null && this.metadata.tags[4] != null ? this.metadata.tags[4] : ''}" placeholder="${translate("publishpage.pchange8")} 5" maxLength="20"></mwc-textfield>
</p>
</div>
${this.renderUploadField()}
<p style="display: ${this.showService ? 'block' : 'none'}">
<mwc-textfield style="width:100%;" label="Service" id="service" type="text" value="${this.service}"></mwc-textfield>
<mwc-textfield style="width:100%;" label="${translate("publishpage.pchange9")}" id="service" type="text" value="${this.service}"></mwc-textfield>
</p>
<p style="display: ${this.showIdentifier ? 'block' : 'none'}">
<mwc-textfield style="width:100%;" label="Identifier" id="identifier" type="text" value="${this.identifier != null ? this.identifier : ''}"></mwc-textfield>
<mwc-textfield style="width:100%;" label="${translate("publishpage.pchange10")}" id="identifier" type="text" value="${this.identifier != null ? this.identifier : ''}"></mwc-textfield>
</p>
<p style="break-word; color: var(--black);">${this.generalMessage}</p>
<p style="color:red">${this.errorMessage}</p>
<p style="color:green;word-break: break-word;">${this.successMessage}</p>
<p style="color: green; word-break: break-word;">${this.successMessage}</p>
${this.loading ? html` <paper-progress indeterminate style="width:100%; margin:4px;"></paper-progress> ` : ''}
<div class="buttons">
<div>
<mwc-button ?disabled=${this.btnDisable} style="width:100%;" raised icon="send" @click=${(e) => this.doPublish(e)}>Publish &nbsp;</mwc-button>
<mwc-button ?disabled=${this.btnDisable} style="width:100%;" raised icon="send" @click=${(e) => this.doPublish(e)}> ${translate("publishpage.pchange11")}</mwc-button>
</div>
</div>
</div>
@ -275,10 +301,7 @@ class PublishData extends LitElement {
firstUpdated() {
this.changeTheme()
setInterval(() => {
this.changeTheme();
}, 100)
this.changeLanguage()
window.addEventListener('contextmenu', (event) => {
event.preventDefault()
@ -289,6 +312,20 @@ class PublishData extends LitElement {
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)
@ -306,6 +343,17 @@ class PublishData extends LitElement {
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)
}
}
// Navigation
goBack() {
window.history.back();
@ -323,15 +371,15 @@ class PublishData extends LitElement {
else if (this.uploadType === "zip") {
return html`
<p>
<span class="upload-text">Select zip file containing static content:</span><br />
<input style="width: 100%; background: var(--white); color: var(--black)" id="file" type="file" accept=".zip">
<span class="upload-text">${translate("publishpage.pchange12")}:</span><br />
<input style="color: var(--black)" id="file" type="file" accept=".zip">
</p>
`
}
else {
return html`
<p>
<mwc-textfield style="width:100%;" label="Local path to static files" id="path" type="text" value="${this.path}"></mwc-textfield>
<mwc-textfield style="width:100%;" label="${translate("publishpage.pchange13")}" id="path" type="text" value="${this.path}"></mwc-textfield>
</p>
`
}
@ -364,19 +412,24 @@ class PublishData extends LitElement {
if (registeredName === '') {
this.showName = true
parentEpml.request('showSnackBar', 'Please select a registered name to publish data for')
let err1string = get("publishpage.pchange14")
parentEpml.request('showSnackBar', `${err1string}`)
}
else if (this.uploadType === "file" && file == null) {
parentEpml.request('showSnackBar', 'Please select a file to host')
let err2string = get("publishpage.pchange15")
parentEpml.request('showSnackBar', `${err2string}`)
}
else if (this.uploadType === "zip" && file == null) {
parentEpml.request('showSnackBar', 'Please select a zip file to host')
let err3string = get("publishpage.pchange16")
parentEpml.request('showSnackBar', `${err3string}`)
}
else if (this.uploadType === "path" && path === '') {
parentEpml.request('showSnackBar', 'Please enter the directory path containing the static content')
let err4string = get("publishpage.pchange17")
parentEpml.request('showSnackBar', `${err4string}`)
}
else if (service === '') {
parentEpml.request('showSnackBar', 'Please enter a service name')
let err5string = get("publishpage.pchange18")
parentEpml.request('showSnackBar', `${err5string}`)
}
else {
this.publishData(registeredName, path, file, service, identifier)
@ -412,34 +465,41 @@ class PublishData extends LitElement {
throw new Error(this.errorMessage);
}
this.generalMessage = "Processing data... this can take some time...";
let err6string = get("publishpage.pchange19")
this.generalMessage = `${err6string}`
let transactionBytes = await uploadData(registeredName, path, file)
if (transactionBytes.error) {
this.errorMessage = "Error: " + transactionBytes.message
let err7string = get("publishpage.pchange20")
this.errorMessage = `${err7string}` + transactionBytes.message
showError(this.errorMessage)
throw new Error(this.errorMessage);
}
else if (transactionBytes.includes("Error 500 Internal Server Error")) {
this.errorMessage = "Internal Server Error when publishing data"
let err8string = get("publishpage.pchange21")
this.errorMessage = `${err8string}`
showError(this.errorMessage)
throw new Error(this.errorMessage);
}
this.generalMessage = "Computing proof of work... this can take some time...";
let err9string = get("publishpage.pchange22")
this.generalMessage = `${err9string}`
let signAndProcessRes = await signAndProcess(transactionBytes)
if (signAndProcessRes.error) {
this.errorMessage = "Error: " + signAndProcessRes.message
let err10string = get("publishpage.pchange20")
this.errorMessage = `${err10string}` + signAndProcessRes.message
showError(this.errorMessage)
throw new Error(this.errorMessage);
}
let err11string = get("publishpage.pchange23")
this.btnDisable = false
this.loading = false
this.errorMessage = ''
this.generalMessage = ''
this.successMessage = 'Transaction successful!'
this.successMessage = `${err11string}`
}
const uploadData = async (registeredName, path, file) => {
@ -500,7 +560,8 @@ class PublishData extends LitElement {
const signAndProcess = async (transactionBytesBase58) => {
let convertedBytesBase58 = await convertBytesForSigning(transactionBytesBase58)
if (convertedBytesBase58.error) {
this.errorMessage = "Error: " + convertedBytesBase58.message
let err12string = get("publishpage.pchange20")
this.errorMessage = `${err12string}` + convertedBytesBase58.message
showError(this.errorMessage)
throw new Error(this.errorMessage);
}
@ -531,7 +592,8 @@ class PublishData extends LitElement {
let myResponse = { error: '' }
if (response === false) {
myResponse.error = "Unable to sign and process transaction"
let err13string = get("publishpage.pchange24")
myResponse.error = `${err13string}`
}
else {
myResponse = response

Write Preview
Loading…
Cancel
Save