+
${this.message.decodedMessage}
diff --git a/qortal-ui-plugins/plugins/core/components/ChatPage.js b/qortal-ui-plugins/plugins/core/components/ChatPage.js
index 486c8f11..6e609b51 100644
--- a/qortal-ui-plugins/plugins/core/components/ChatPage.js
+++ b/qortal-ui-plugins/plugins/core/components/ChatPage.js
@@ -1,13 +1,19 @@
import { LitElement, html, css } from 'lit'
+import { render } from 'lit/html.js'
import { Epml } from '../../../epml.js'
import { escape, unescape } from 'html-escaper';
import { inputKeyCodes } from '../../utils/keyCodes.js'
import './ChatScroller.js'
+import './BlockAddress.js'
import './TimeAgo.js'
import { EmojiPicker } from 'emoji-picker-js';
import '@polymer/paper-spinner/paper-spinner-lite.js'
+import '@material/mwc-button'
+import '@material/mwc-dialog'
+import '@material/mwc-icon'
+
const parentEpml = new Epml({ type: 'WINDOW', source: window.parent })
class ChatPage extends LitElement {
@@ -120,15 +126,11 @@ class ChatPage extends LitElement {
}
render() {
-
- // TODO: Build a nice preloader for loading messages...
return html`
${this.isLoadingMessages ? html`
Loading Messages...
` : this.renderChatScroller(this._initialMessages)}
-
-
-
+
@@ -292,7 +293,6 @@ class ChatWelcomePage extends LitElement {
}
_sendMessage() {
-
this.isLoading = true
const recipient = this.shadowRoot.getElementById('sendTo').value
@@ -465,6 +465,17 @@ class ChatWelcomePage extends LitElement {
_textArea(e) {
if (e.keyCode === 13 && !e.shiftKey) this._sendMessage()
}
+
+ isEmptyArray(arr) {
+ if (!arr) { return true }
+ return arr.length === 0
+ }
+
+ getApiKey() {
+ const myNode = window.parent.reduxStore.getState().app.nodeConfig.knownNodes[window.parent.reduxStore.getState().app.nodeConfig.node];
+ let apiKey = myNode.apiKey;
+ return apiKey;
+ }
}
window.customElements.define('chat-welcome-page', ChatWelcomePage)
diff --git a/qortal-ui-plugins/plugins/core/components/snackbar.js b/qortal-ui-plugins/plugins/core/components/snackbar.js
new file mode 100644
index 00000000..6604d72c
--- /dev/null
+++ b/qortal-ui-plugins/plugins/core/components/snackbar.js
@@ -0,0 +1,84 @@
+import { LitElement, html, css } from 'lit'
+import '@material/mwc-snackbar'
+
+let queueElement
+
+class SnackQueue extends LitElement {
+ static get properties() {
+ return {
+ busy: {
+ type: Boolean,
+ attribute: 'busy',
+ reflectToAttribute: true
+ },
+ currentSnack: {
+ type: Object,
+ attribute: 'current-snack',
+ reflectToAttribute: true
+ },
+ _queue: {
+ type: Array
+ },
+ _labelText: { type: String },
+ _stacked: { type: Boolean },
+ _leading: { type: Boolean },
+ _closeOnEscape: { type: Boolean },
+ _timeoutMs: { type: Number },
+ action: {},
+ _dismiss: {},
+ _dismissIcon: { type: String }
+ }
+ }
+
+ static get styles() {
+ return css``
+ }
+
+ constructor() {
+ super()
+ this._queue = []
+ this.busy = false
+ this._timeoutMs = 5000
+ }
+
+ render() {
+ return html`
+
+ ${this._action}
+ ${this._dismiss ? html`
+
+ ` : ''}
+
+ `
+ }
+
+ firstUpdated() {
+ this._snackbar = this.shadowRoot.getElementById('snack')
+ }
+
+ _shift() {
+ if (this.busy || this._queue.length === 0) return
+ const item = this._queue.shift()
+ this._labelText = item.labelText || ''
+ this._action = item.action || ''
+ this._dismiss = item.dismiss || false
+ this._dismissIcon = item.dismissIcon || 'close'
+ this._leading = !!item.leading
+ this._closeOnEscape = (item.closeOnEscape && item.closeOnEscape !== false) // JSON.parse maybe needs to be compared to 'false'...in which case no need for complex expression
+ this._timeoutMs = (item.timeoutMs >= 4000 && item.timeoutMs <= 10000) ? item.timeoutMs : 5000
+ this._snackbar.show()
+ }
+
+ add(item) {
+ this._queue.push(item)
+ this._shift()
+ }
+}
+
+window.customElements.define('snack-queue', SnackQueue)
+
+const queueNode = document.createElement('snack-queue')
+queueNode.id = 'queue-node'
+queueNode.loadingMessage = ''
+queueElement = document.body.appendChild(queueNode)
+export default queueElement