From 0649b1198581475f7e31cecae21a966f9e748d3d Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Tue, 15 Mar 2022 18:52:30 +0100 Subject: [PATCH] WIP --- .../plugins/core/qdn/publish/publish.src.js | 243 +++++++++--------- 1 file changed, 119 insertions(+), 124 deletions(-) diff --git a/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js b/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js index 7dae160b..aa068359 100644 --- a/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js +++ b/qortal-ui-plugins/plugins/core/qdn/publish/publish.src.js @@ -6,7 +6,6 @@ import '@material/mwc-button' import '@material/mwc-textfield' import '@material/mwc-select' import '@material/mwc-list/mwc-list-item.js' -import '@material/mwc-slider' import '@polymer/paper-progress/paper-progress.js' const parentEpml = new Epml({ type: 'WINDOW', source: window.parent }) @@ -48,58 +47,58 @@ class PublishData extends LitElement { static get styles() { return css` - * { - --mdc-theme-primary: rgb(3, 169, 244); - --mdc-theme-secondary: var(--mdc-theme-primary); - --paper-input-container-focus-color: var(--mdc-theme-primary); - --lumo-primary-text-color: rgb(0, 167, 245); - --lumo-primary-color-50pct: rgba(0, 167, 245, 0.5); - --lumo-primary-color-10pct: rgba(0, 167, 245, 0.1); - --lumo-primary-color: hsl(199, 100%, 48%); - --lumo-base-color: var(--white); - --lumo-body-text-color: var(--black); - --lumo-secondary-text-color: var(--sectxt); - --lumo-contrast-60pct: var(--vdicon); - --_lumo-grid-border-color: var(--border); - --_lumo-grid-secondary-border-color: var(--border2); - } - - #publishWrapper paper-button { - float: right; - } - - #publishWrapper .buttons { - width: auto !important; - } - - mwc-textfield { - margin: 0; - } - - paper-progress { - --paper-progress-active-color: var(--mdc-theme-primary); - } - - .upload-text { - display: block; - font-size: 14px; - color: var(--black); - } - - .address-bar { - position: absolute; - top: 0; - left: 0; - right: 0; - height: 100px; - background-color: var(--white); - height: 36px; - } - - .address-bar-button mwc-icon { - width: 30px; - } - ` + * { + --mdc-theme-primary: rgb(3, 169, 244); + --mdc-theme-secondary: var(--mdc-theme-primary); + --paper-input-container-focus-color: var(--mdc-theme-primary); + --lumo-primary-text-color: rgb(0, 167, 245); + --lumo-primary-color-50pct: rgba(0, 167, 245, 0.5); + --lumo-primary-color-10pct: rgba(0, 167, 245, 0.1); + --lumo-primary-color: hsl(199, 100%, 48%); + --lumo-base-color: var(--white); + --lumo-body-text-color: var(--black); + --lumo-secondary-text-color: var(--sectxt); + --lumo-contrast-60pct: var(--vdicon); + --_lumo-grid-border-color: var(--border); + --_lumo-grid-secondary-border-color: var(--border2); + } + + #publishWrapper paper-button { + float: right; + } + + #publishWrapper .buttons { + width: auto !important; + } + + mwc-textfield { + margin: 0; + } + + paper-progress { + --paper-progress-active-color: var(--mdc-theme-primary); + } + + .upload-text { + display: block; + font-size: 14px; + color: var(--black); + } + + .address-bar { + position: absolute; + top: 0; + left: 0; + right: 0; + height: 100px; + background-color: var(--white); + height: 36px; + } + + .address-bar-button mwc-icon { + width: 30px; + } + ` } constructor() { @@ -108,7 +107,7 @@ class PublishData extends LitElement { this.showName = false; this.showService = false this.showIdentifier = false - this.showMetadata = false + this.showMetadata = false const urlParams = new URLSearchParams(window.location.search) this.name = urlParams.get('name') @@ -120,13 +119,16 @@ class PublishData extends LitElement { if (urlParams.get('showName') === "true") { this.showName = true } + if (urlParams.get('showService') === "true") { this.showService = true } + if (urlParams.get('showIdentifier') === "true") { this.showIdentifier = true } - if (urlParams.get('showMetadata') === "true") { + + if (urlParams.get('showMetadata') === "true") { this.showMetadata = true } @@ -150,10 +152,7 @@ class PublishData extends LitElement { this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' const fetchNames = () => { - parentEpml.request('apiCall', { - url: `/names/address/${this.selectedAddress.address}?limit=0&reverse=true` - }).then(res => { - + parentEpml.request('apiCall', {url: `/names/address/${this.selectedAddress.address}?limit=0&reverse=true`}).then(res => { setTimeout(() => { this.names = res if (res[0] != null) { @@ -165,21 +164,16 @@ class PublishData extends LitElement { } const fetchCategories = () => { - parentEpml.request('apiCall', { - url: `/arbitrary/categories` - }).then(res => { - + parentEpml.request('apiCall', {url: `/arbitrary/categories`}).then(res => { setTimeout(() => { this.categories = res }, 1) }) + setTimeout(fetchCategories, this.config.user.nodeSettings.pingInterval) } const fetchPeersSummary = () => { - parentEpml.request('apiCall', { - url: `/peers/summary` - }).then(res => { - + parentEpml.request('apiCall', {url: `/peers/summary`}).then(res => { setTimeout(() => { this.portForwardingEnabled = (res.inboundConnections != null && res.inboundConnections > 0); }, 1) @@ -188,6 +182,7 @@ class PublishData extends LitElement { } let configLoaded = false + parentEpml.ready().then(() => { parentEpml.subscribe('selected_address', async selectedAddress => { this.selectedAddress = {} @@ -195,6 +190,7 @@ class PublishData extends LitElement { if (!selectedAddress || Object.entries(selectedAddress).length === 0) return this.selectedAddress = selectedAddress }) + parentEpml.subscribe('config', c => { if (!configLoaded) { setTimeout(fetchNames, 1) @@ -204,10 +200,9 @@ class PublishData extends LitElement { } this.config = JSON.parse(c) }) - parentEpml.subscribe('copy_menu_switch', async value => { + parentEpml.subscribe('copy_menu_switch', async value => { if (value === 'false' && window.getSelection().toString().length !== 0) { - this.clearSelection() } }) @@ -216,28 +211,27 @@ class PublishData extends LitElement { render() { return html` -
-
-
- this.goBack()} class="address-bar-button">arrow_back_ios Back -
- +
+
+
+ this.goBack()} class="address-bar-button">arrow_back_ios Back +
+

Publish / Update ${this.category}

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.

- - -

- this.selectName(e)} style="min-width: 130px; max-width:100%; width:100%;"> + + +

+ this.selectName(e)} style="min-width: 130px; max-width:100%; width:100%;"> ${this.myRegisteredName} - -

- + +

- +

@@ -248,39 +242,33 @@ class PublishData extends LitElement { ${c.name} `)} -

+

- - - - - + + + + +

-
- - ${this.renderUploadField()} - -

- -

-

- -

- -

${this.generalMessage}

-

${this.errorMessage}

-

${this.successMessage}

- - ${this.loading ? html` ` : ''} - -
-
- this.doPublish(e)}>Publish   -
-
-
-
-
+
+ ${this.renderUploadField()} +

+ +

+

+ +

+

${this.generalMessage}

+

${this.errorMessage}

+

${this.successMessage}

+ ${this.loading ? html` ` : ''} +
+
+ this.doPublish(e)}>Publish   +
+
+ + ` } @@ -326,20 +314,26 @@ class PublishData extends LitElement { renderUploadField() { if (this.uploadType === "file") { - return html`

- -

`; + return html` +

+ +

+ ` } else if (this.uploadType === "zip") { - return html`

- Select zip file containing static content:
- -

`; + return html` +

+ Select zip file containing static content:
+ +

+ ` } else { - return html`

- -

`; + return html` +

+ +

+ ` } } @@ -590,6 +584,7 @@ class PublishData extends LitElement { }, 1) }) } + selectName(e) { let name = this.shadowRoot.getElementById('registeredName') this.selectedName = (name.value)