diff --git a/src/components/newMessage.vue b/src/components/newMessage.vue index 7adbd8d..f357da0 100644 --- a/src/components/newMessage.vue +++ b/src/components/newMessage.vue @@ -22,7 +22,7 @@ type="submit" title="press enter to submit" class="sendMessageBtn" - ic="./sym/ic_send_white.svg" + :ic="isSending?'./sym/throbber.svg':'./sym/ic_send_white.svg'" @click.native="onSubmit(event)" /> @@ -74,13 +74,15 @@ export default { }, methods: { onSubmit(event){ - console.log(event) + if (this.isSending) return; event.content.msgtype==='m.text'?this.sendEvent(event):this.sendMediaEvent(event); }, async sendEvent(event){ if (!event.content.body.trim()) return; this.setReplyTo(this.replyTo); - matrix.sendEvent(new Proxy(this.event, this.eventProxyHandler), this.roomId); + this.isSending = true; + await matrix.sendEvent(new Proxy(this.event, this.eventProxyHandler), this.roomId); + this.isSending = false; event.content.body = ''; this.resetAttachment(); this.resetReplyTo(); @@ -89,6 +91,7 @@ export default { this.onResize(id.parentElement.clientHeight); }, sendMediaEvent(event){ + this.isSending = true; matrix.client.uploadContent(this.attachment.blob).then(mxc => { event.content.url = mxc; this.sendEvent(event); @@ -169,20 +172,21 @@ export default { } } }, - showEmojiPicker: false, - waitForSendTyping: false, - attachment: undefined, eventProxyHandler: { set: () => true, get: (target, key) => { if (typeof target[key] === 'object') return new Proxy(Object.assign({}, target[key]), this.eventProxyHandler); return target[key]; } - } + }, + showEmojiPicker: false, + waitForSendTyping: false, + attachment: undefined, + isSending: false } }, updated() { - this.resizeMessageBanner(); + this.$nextTick(this.resizeMessageBanner); } } diff --git a/src/lib/DataStore.js b/src/lib/DataStore.js index 21cc668..f30cf6d 100644 --- a/src/lib/DataStore.js +++ b/src/lib/DataStore.js @@ -1,4 +1,6 @@ import {cookieHandler} from '@/lib/cookieHandler'; +import {Capacitor, Plugins} from '@capacitor/core'; +const {Storage} = Plugins; export class DataStore{ constructor(){ @@ -6,17 +8,14 @@ export class DataStore{ this.cookie.setExpire(15); this.store = localStorage; } - set(key, value){ - this.cookie.set(key, value); + async set(key, value){ + if (Capacitor.isNative) return await Storage.set({key, value: JSON.stringify(value)}); + this.store.setItem(key, JSON.stringify(value)); + this.cookie.set(key, JSON.stringify(value)); this.cookie.store(); - this.store.setItem(key, value); } - get(key){ - return this.store.getItem(key) || this.cookie.get(key); - } - setObj(obj){ - this.cookie.setCookies(obj); - this.cookie.store(); - Object.keys(obj).forEach(key => this.store.setItem(key, obj[key])); + async get(key){ + if (Capacitor.isNative) return JSON.parse((await Storage.get({key})).value||'null'); + return JSON.parse(this.store.getItem(key) || this.cookie.get(key) || 'null'); } } \ No newline at end of file diff --git a/src/main.js b/src/main.js index d0bbe93..159eb2a 100644 --- a/src/main.js +++ b/src/main.js @@ -10,18 +10,21 @@ Vue.use(VueRouter); export let matrix = new MatrixHandler(); -let store = new DataStore(); +(async () => { + let login = await new DataStore().get('login'); + if (login && login.baseUrl && login.accessToken && login.userId) { + matrix.tokenLogin(login.baseUrl, login.accessToken, login.userId); + } + + new Vue({ + el: '#app', + router, + template: '', + components: {App}, + data() { + return {} + } + }).$mount('#app'); +})() -if (store.get('baseUrl') && store.get('accessToken') && store.get('userId')) { - matrix.tokenLogin(store.get('baseUrl'), store.get('accessToken'), store.get('userId')); -} -new Vue({ - el: '#app', - router, - template: '', - components: {App}, - data() { - return {} - } -}).$mount('#app'); diff --git a/src/router/index.js b/src/router/index.js index c96523c..b42bd93 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -9,7 +9,7 @@ export const router = new VueRouter({ { path: '/', name: 'home', - component: login + component: rooms }, { path: '/login', diff --git a/src/views/login.vue b/src/views/login.vue index f386604..c21abdf 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -25,6 +25,7 @@ import {matrix} from '@/main.js'; import ThrobberOverlay from '@/components/throbberOverlay'; import {isValidUserId} from '@/lib/matrixUtils'; import {DataStore} from '@/lib/DataStore'; +const store = new DataStore(); export default { name: 'login.vue', @@ -34,25 +35,14 @@ export default { }, methods: { login(){ - if (matrix.client !== undefined) { - this.loginError = 'you are already logged in'; - return; - } if (this.user === '') { - this.loginError = 'username is empty'; - return; - } if (this.password === '') { - this.loginError = 'password is empty'; - return; - } if (!isValidUserId(this.user)) { - this.loginError = 'username is in wrong style'; - return; - } + // eslint-disable-next-line no-cond-assign + if (this.loginError = this.getInputErrors()) return false; this.loading = 'logging in'; matrix.login(this.user, this.password, this.homeServer, (error) => { this.loginError = `login failed: ${error}`; this.loading = false; }, token => { - this.store.setObj({ + this.store.set('login', { baseUrl: this.homeServer, userId: this.user, accessToken: token @@ -64,14 +54,17 @@ export default { async logout(){ this.loading = 'logging out'; await matrix.logout(); - this.store.setObj({ - baseUrl: undefined, - userId: undefined, - accessToken: undefined - }); + this.store.set('login', {}); this.loading = false; this.$forceUpdate(); }, + getInputErrors(){ + if (matrix.client !== undefined) return 'you are already logged in'; + if (this.user === '') return 'username is empty'; + if (this.password === '') return 'password is empty'; + if (!isValidUserId(this.user)) return 'username is in wrong style'; + return false; + }, showLogin(){ return matrix.client === undefined; } @@ -82,7 +75,7 @@ export default { password: '', homeServer: 'https://adb.sh', loginError: '', - store: new DataStore(), + store, loading: false } }