Merge branch 'master' of github.com:KevinMidboe/vinlottis

src/ui/Attendees.vue

@@ -2,7 +2,7 @@
   <div class="attendees" v-if="attendees.length > 0">
     <h2>Deltakere ({{ attendees.length }})</h2>
     <div class="attendees-container" ref="attendees">
-      <div class="attendee" v-for="(attendee, index) in attendees" :key="index">
+      <div class="attendee" v-for="(attendee, index) in flipList(attendees)" :key="index">
         <span class="attendee-name">{{ attendee.name }}</span>
         <div class="red-ballot ballot-element small">{{ attendee.red }}</div>
         <div class="blue-ballot ballot-element small">{{ attendee.blue }}</div>
@@ -20,13 +20,18 @@ export default {
       type: Array
     }
   },
+  methods: {
+    flipList: (list) => list.slice().reverse()
+  },
   watch: {
     attendees: {
       deep: true,
       handler() {
-        setTimeout(() => {
-          this.$refs.attendees.scrollTop = this.$refs.attendees.scrollHeight;
-        }, 50);
+        if (this.$refs && this.$refs.history) {
+          setTimeout(() => {
+            this.$refs.attendees.scrollTop = this.$refs.attendees.scrollHeight;
+          }, 50);
+        }
       }
     }
   }

src/ui/Chat.vue

@@ -53,9 +53,11 @@ export default {
   watch: {
     chatHistory: {
       handler() {
-        setTimeout(() => {
-          this.$refs.history.scrollTop = this.$refs.history.scrollHeight;
-        }, 10);
+        if (this.$refs && this.$refs.history) {
+          setTimeout(() => {
+            this.$refs.history.scrollTop = this.$refs.history.scrollHeight;
+          }, 10);
+        }
       },
       deep: true
     }