added icon and login witch other homeservers

.gitignore

@@ -1,6 +1,7 @@
 .DS_Store
 node_modules
 /dist
+package-lock.json
 
 
 # local env files

src/components/newMessage.vue

@@ -3,7 +3,7 @@
     <form v-on:submit.prevent="sendMessage()">
       <label for="newMessageInput"></label>
       <textarea @keyup.enter.exact="sendMessage()" @input="resizeMessageBanner()" ref="newMessageInput" id="newMessageInput" class="newMessageInput"
-                autocomplete="off" placeholder="type a message ..." v-model="msg.content.body" />
+                autocomplete="off" rows="1" placeholder="type a message ..." v-model="msg.content.body" />
       <icon type="submit" title="press enter to submit" id="sendMessageBtn"
             ic="./sym/ic_send_white_24px.svg" />
     </form>

src/matrix.js

@@ -2,36 +2,38 @@ import matrix from 'matrix-js-sdk';
 import main from '@/main.js';
 // import Vue from 'vue';
 
-const client = matrix.createClient({
-  baseUrl: 'https://adb.sh',
-  accessToken: getCookie('accessToken'),
-  userId: getCookie('userId'),
-});
+let client = matrix.createClient({});
 let session = {
   user: '',
-  password: '',
+  baseUrl: '',
   accessToken: '',
   rooms: [],
   currentRoom: undefined,
   login: {
     user: '',
     password: '',
+    baseUrl: 'https://adb.sh',
   },
 };
 
-console.log(document.cookie);
+console.log(`cookie => ${document.cookie}`);
 
-if (getCookie('accessToken') && getCookie('userId')) {
+if (getCookie('accessToken') && getCookie('userId') && getCookie('baseUrl')) {
   document.cookie = `expires=${new Date(Date.now() + 86400 * 10 * 1000)}`;
   session = {
     user: getCookie('userId'),
-    password: '',
+    baseUrl: getCookie('baseUrl'),
     accessToken: getCookie('accessToken'),
     rooms: [],
     currentRoom: undefined,
   };
   // Vue.$router.push("/rooms/")
   window.location.href = '/#/rooms/';
+  client = matrix.createClient({
+    baseUrl: getCookie('baseUrl'),
+    accessToken: getCookie('accessToken'),
+    userId: getCookie('userId'),
+  });
   client.startClient();
   client.once('sync', (state) => {
     console.log(state);
@@ -59,6 +61,9 @@ export default {
         main.methods.error('username is in wrong style');
         return;
       }
+      client = matrix.createClient({
+        baseUrl: session.login.baseUrl
+      });
       client.login('m.login.password', {
         user: session.login.user,
         password: session.login.password,
@@ -66,10 +71,11 @@ export default {
       }).then((response) => {
         document.cookie = `accessToken=${response.access_token}`;
         document.cookie = `userId=${session.login.user}`;
-        document.cookie = `max-expires=${new Date(Date.now() + 86400 * 10 * 1000)}`;
+        document.cookie = `baseUrl=${session.login.baseUrl}`;
+        document.cookie = `expires=${new Date(Date.now() + 86400 * 10 * 1000)}`;
         session = {
           user: session.login.user,
-          password: '',
+          baseUrl: session.login.baseUrl,
           accessToken: response.access_token,
           rooms: [],
           currentRoom: undefined,
@@ -80,12 +86,20 @@ export default {
           console.log(`login error => ${response.error}`);
         }
         window.location.href = '/#/rooms/';
-        client.startClient();
+        window.location.reload();
+        /*client.startClient();
         client.once('sync', (state) => {
           console.log(state);
-        });
+        });*/
       });
     },
+    logout(){
+      document.cookie = `accessToken=`;
+      document.cookie = `userId=`;
+      document.cookie = `baseUrl=`;
+      document.cookie = `expires=${new Date(0)}`;
+      window.location.reload();
+    },
     sendMessage(msg) {
       const msgSend = {
         type: msg.type,

src/views/chat.vue

@@ -63,8 +63,12 @@ export default {
     return {
       chatroom: main.data().chatroom,
       session: matrix.data().session,
-      showScrollBtn: false
+      showScrollBtn: false,
+      scrollOnUpdate: true
     }
+  },
+  updated(){
+    //this.scrollToBottom();
   }
 }
 </script>

src/views/login.vue

@@ -1,11 +1,17 @@
 <template>
   <div id="login">
     <h1 class="title">[chat]</h1>
-    <form @submit.prevent="login()">
+    <form v-if="session.login" @submit.prevent="login()">
       <input v-model="session.login.user" class="input" name="user" type="text" maxlength="30" placeholder="@user:adb.sh"><br>
       <input v-model="session.login.password" class="input" name="password" type="password" maxlength="30" placeholder="password"><br>
+      <input v-model="session.login.baseUrl" class="input" name="homeserver" maxlength="50" placeholder="https://matrix.org"><br>
       <textbtn type="submit" text="login" />
     </form>
+    <div v-else>
+      <p>you are already logged in</p>
+      <textbtn @click.native="$router.push('room')" text="chat" />
+      <textbtn @click.native="logout()" text="logout" />
+    </div>
   </div>
 </template>
 
@@ -20,7 +26,10 @@ export default {
   },
   methods: {
     login(){
-      matrix.methods.login()
+      matrix.methods.login();
+    },
+    logout(){
+      matrix.methods.logout();
     }
   },
   data(){

src/views/rooms.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
     <div id="roomList" class="roomList">
-      <h1>[chat]</h1>
+      <h1>[chat]{{scrollOnUpdate}}</h1>
       <h2>{{session.rooms.length}} rooms:</h2>
       <div v-for="room in session.rooms" :key="room.roomId" @click="openChat(room)" class="roomListElement">
         <div class="roomImgPlaceholder">{{room.name.substr(0,2)}}</div>
@@ -44,7 +44,7 @@ export default {
   },
   data(){
     return {
-      session: matrix.data().session,
+      session: matrix.data().session
     }
   }
 }