From 8cbf12bec432eacf0c5acd95f8e16ec0df45908f Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Sun, 7 May 2023 17:38:01 +0200 Subject: [PATCH 1/3] Added new search field --- qortal-ui-core/src/components/app-view.js | 41 +----- .../src/components/check-for-update.js | 73 ++++++---- qortal-ui-core/src/components/search-modal.js | 132 ++++++++++++++++++ 3 files changed, 178 insertions(+), 68 deletions(-) create mode 100644 qortal-ui-core/src/components/search-modal.js diff --git a/qortal-ui-core/src/components/app-view.js b/qortal-ui-core/src/components/app-view.js index 4543dd79..2c197a3a 100644 --- a/qortal-ui-core/src/components/app-view.js +++ b/qortal-ui-core/src/components/app-view.js @@ -8,7 +8,7 @@ import localForage from "localforage"; const chatLastSeen = localForage.createInstance({ name: "chat-last-seen", -}); +}) import '@polymer/paper-icon-button/paper-icon-button.js' import '@polymer/paper-progress/paper-progress.js' @@ -29,6 +29,7 @@ import './language-selector.js' import './settings-view/user-settings.js' import './logout-view/logout-view.js' import './check-for-update.js' +import './search-modal.js' import './user-info-view/user-info-view.js' import '../functional-components/side-menu.js' import '../functional-components/side-menu-item.js' @@ -45,7 +46,6 @@ class AppView extends connect(store)(LitElement) { nodeType: { type: String, reflect: true }, theme: { type: String, reflect: true }, addressInfo: { type: Object }, - searchContentString: { type: String }, getAllBalancesLoading: { type: Boolean }, botQortWallet: { type: String }, botBtcWallet: { type: String }, @@ -353,7 +353,6 @@ class AppView extends connect(store)(LitElement) { constructor() { super() this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' - this.searchContentString = '' this.urls = []; this.nodeType = '' this.addressInfo = {} @@ -473,22 +472,6 @@ class AppView extends connect(store)(LitElement) { -
-
- - - -
-
-
   
@@ -499,12 +482,13 @@ class AppView extends connect(store)(LitElement) {
    
    
+ +
  
this.openSettings()} title="${translate("settings.settings")}">
  
-
  
this.openLogout()} title="${translate("logout.logout")}">
@@ -2165,23 +2149,6 @@ class AppView extends connect(store)(LitElement) { this.addressInfo = state.app.accountInfo.addressInfo } - searchKeyListener(e) { - if (e.key === 'Enter') { - this.openUserInfo() - } - } - - clearSearchField() { - this.shadowRoot.getElementById('searchContent').value = this.searchContentString - } - - openUserInfo() { - let sendInfoAddress = this.shadowRoot.getElementById('searchContent').value - const infoDialog = document.getElementById('main-app').shadowRoot.querySelector('app-view').shadowRoot.querySelector('user-info-view') - infoDialog.openUserInfo(sendInfoAddress) - this.clearSearchField() - } - openSettings() { const settingsDialog = document.getElementById('main-app').shadowRoot.querySelector('app-view').shadowRoot.querySelector('user-settings') settingsDialog.openSettings() diff --git a/qortal-ui-core/src/components/check-for-update.js b/qortal-ui-core/src/components/check-for-update.js index 216e7a9c..6ad85f52 100644 --- a/qortal-ui-core/src/components/check-for-update.js +++ b/qortal-ui-core/src/components/check-for-update.js @@ -1,41 +1,52 @@ import { LitElement, html, css } from 'lit' import { get, translate, translateUnsafeHTML } from 'lit-translate' +import isElectron from 'is-electron' import '@polymer/paper-icon-button/paper-icon-button.js' import '@polymer/iron-icons/iron-icons.js' class CheckForUpdate extends LitElement { - static get properties() { - return { - theme: { type: String, reflect: true } - } - } - - constructor() { - super() - this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' - } - - static styles = [ - css` - ` - ] - - render() { - return html` -
- this.checkupdate()} title="${translate("appspage.schange38")} UI"> -
- ` - } - - firstUpdated() { - } - - - checkupdate() { - window.electronAPI.checkForUpdate() - } + static get properties() { + return { + theme: { type: String, reflect: true } + } + } + + constructor() { + super() + this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' + } + + static styles = [ + css` + ` + ] + + render() { + return html` + ${this.renderUpdateButton()} + ` + } + + firstUpdated() { + } + + renderUpdateButton() { + if (!isElectron) { + return html` +
+ this.checkupdate()} title="${translate("appspage.schange38")} UI"> +
+
  
+ ` + } else { + return html`` + } + } + + checkupdate() { + window.electronAPI.checkForUpdate() + } } window.customElements.define('check-for-update', CheckForUpdate) diff --git a/qortal-ui-core/src/components/search-modal.js b/qortal-ui-core/src/components/search-modal.js new file mode 100644 index 00000000..7d74493f --- /dev/null +++ b/qortal-ui-core/src/components/search-modal.js @@ -0,0 +1,132 @@ +import { LitElement, html, css } from 'lit' +import { get, translate, translateUnsafeHTML } from 'lit-translate' +import snackbar from '../functional-components/snackbar.js' + +import '@polymer/paper-icon-button/paper-icon-button.js' +import '@polymer/iron-icons/iron-icons.js' +import '@polymer/paper-dialog/paper-dialog.js' +import '@vaadin/text-field' + +class SearchModal extends LitElement { + static get properties() { + return { + searchContentString: { type: String }, + theme: { type: String, reflect: true } + } + } + + constructor() { + super() + this.searchContentString = '' + this.theme = localStorage.getItem('qortalTheme') ? localStorage.getItem('qortalTheme') : 'light' + } + + static get styles() { + return css` + * { + --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); + --item-selected-color: var(--nav-selected-color); + --item-selected-color-text: var(--nav-selected-color-text); + --item-color-active: var(--nav-color-active); + --item-color-hover: var(--nav-color-hover); + --item-text-color: var(--nav-text-color); + --item-icon-color: var(--nav-icon-color); + --item-border-color: var(--nav-border-color); + --item-border-selected-color: var(--nav-border-selected-color); + } + + paper-dialog.searchSettings { + min-width: 525px; + max-width: 525px; + min-height: auto; + max-height: 150px; + background-color: var(--white); + color: var(--black); + line-height: 1.6; + overflow: hidden; + border: 1px solid var(--black); + border-radius: 10px; + padding: 15px; + box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.1); + } + + .search { + display: inline; + width: 50%; + align-items: center; + } + ` + } + + render() { + return html` +
+ this.openSearch()} title="${translate("websitespage.schange35")}"> +
+ + +
+
+ + + + +
+
+ + ` + } + + firstUpdated() { + } + + openSearch() { + this.shadowRoot.getElementById('searchSettingsDialog').open() + } + + closeSearch() { + this.shadowRoot.getElementById('searchSettingsDialog').close() + } + + searchKeyListener(e) { + if (e.key === 'Enter') { + this.openUserInfo() + } + } + + openUserInfo() { + const checkvalue = this.shadowRoot.getElementById('searchContent').value + if (checkvalue.length < 3) { + let snackbar1string = get("publishpage.pchange20") + let snackbar2string = get("welcomepage.wcchange4") + snackbar.add({ + labelText: `${snackbar1string} ${snackbar2string}`, + dismiss: true + }) + this.shadowRoot.getElementById('searchContent').value = this.searchContentString + return + } else { + let sendInfoAddress = this.shadowRoot.getElementById('searchContent').value + const infoDialog = document.getElementById('main-app').shadowRoot.querySelector('app-view').shadowRoot.querySelector('user-info-view') + infoDialog.openUserInfo(sendInfoAddress) + this.shadowRoot.getElementById('searchContent').value = this.searchContentString + this.shadowRoot.getElementById('searchSettingsDialog').close() + } + } +} + +window.customElements.define('search-modal', SearchModal) \ No newline at end of file From 981ec74f49091535f4ea8485554dc6981c570dcd Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Sun, 7 May 2023 17:55:24 +0200 Subject: [PATCH 2/3] Hide button if we are not on electron --- .../settings-view/notifications-view.js | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/qortal-ui-core/src/components/settings-view/notifications-view.js b/qortal-ui-core/src/components/settings-view/notifications-view.js index b432f604..f0474536 100644 --- a/qortal-ui-core/src/components/settings-view/notifications-view.js +++ b/qortal-ui-core/src/components/settings-view/notifications-view.js @@ -3,6 +3,7 @@ import { connect } from 'pwa-helpers' import { store } from '../../store.js' import { doSetQChatNotificationConfig } from '../../redux/user/user-actions.js' import { translate, translateUnsafeHTML } from 'lit-translate' +import isElectron from 'is-electron' import '@material/mwc-checkbox' @@ -145,13 +146,23 @@ class NotificationsView extends connect(store)(LitElement) {
-
-
this.checkCoreSettings()} class="q-button"> ${translate("settings.core")}
-
+ ${this.renderSetCoreButton()} ` } + renderSetCoreButton() { + if (!isElectron) { + return html` +
+
this.checkCoreSettings()} class="q-button"> ${translate("settings.core")}
+
+ ` + } else { + return html`` + } + } + checkCoreSettings() { window.electronAPI.setStartCore() } From 11d38ca911debc32b89a6650c4a122b289647c80 Mon Sep 17 00:00:00 2001 From: AlphaX-Projects <77661270+AlphaX-Projects@users.noreply.github.com> Date: Mon, 8 May 2023 10:19:23 +0200 Subject: [PATCH 3/3] Fix buttons --- qortal-ui-core/src/components/app-view.js | 1 + qortal-ui-core/src/components/check-for-update.js | 7 +++---- .../src/components/settings-view/notifications-view.js | 6 +++--- 3 files changed, 7 insertions(+), 7 deletions(-) diff --git a/qortal-ui-core/src/components/app-view.js b/qortal-ui-core/src/components/app-view.js index 2c197a3a..e2f69b69 100644 --- a/qortal-ui-core/src/components/app-view.js +++ b/qortal-ui-core/src/components/app-view.js @@ -489,6 +489,7 @@ class AppView extends connect(store)(LitElement) {
  
+
  
this.openLogout()} title="${translate("logout.logout")}">
diff --git a/qortal-ui-core/src/components/check-for-update.js b/qortal-ui-core/src/components/check-for-update.js index 6ad85f52..a14c0fd0 100644 --- a/qortal-ui-core/src/components/check-for-update.js +++ b/qortal-ui-core/src/components/check-for-update.js @@ -32,15 +32,14 @@ class CheckForUpdate extends LitElement { } renderUpdateButton() { - if (!isElectron) { + if (!isElectron()) { + return html`` + } else { return html`
this.checkupdate()} title="${translate("appspage.schange38")} UI">
-
  
` - } else { - return html`` } } diff --git a/qortal-ui-core/src/components/settings-view/notifications-view.js b/qortal-ui-core/src/components/settings-view/notifications-view.js index f0474536..ca209c24 100644 --- a/qortal-ui-core/src/components/settings-view/notifications-view.js +++ b/qortal-ui-core/src/components/settings-view/notifications-view.js @@ -152,14 +152,14 @@ class NotificationsView extends connect(store)(LitElement) { } renderSetCoreButton() { - if (!isElectron) { + if (!isElectron()) { + return html`` + } else { return html`
this.checkCoreSettings()} class="q-button"> ${translate("settings.core")}
` - } else { - return html`` } }