From 650071568d6d29f6fc44f3f9ecabc30075959045 Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Sun, 11 Feb 2018 16:10:39 -0800
Subject: [PATCH] fix show/hide of timelines

---
 routes/_actions/streaming.js              | 10 ++++++----
 routes/_actions/timeline.js               |  1 +
 routes/_components/LoadingPage.html       |  8 +++++++-
 routes/_components/timeline/Timeline.html |  9 ++++++---
 4 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/routes/_actions/streaming.js b/routes/_actions/streaming.js
index f0efbef2..f41a8824 100644
--- a/routes/_actions/streaming.js
+++ b/routes/_actions/streaming.js
@@ -6,7 +6,7 @@ import { scheduleIdleTask } from '../_utils/scheduleIdleTask'
 
 async function removeDuplicates (instanceName, timelineName, updates) {
   // remove duplicates, including duplicates due to reblogs
-  let timelineItemIds = store.getForTimeline(instanceName, timelineName, 'timelineItemIds')
+  let timelineItemIds = store.getForTimeline(instanceName, timelineName, 'timelineItemIds') || []
   let reblogIds = (await Promise.all(timelineItemIds.map(async timelineItemId => {
     let status = await database.getStatus(instanceName, timelineItemId)
     return status.reblog && status.reblog.id
@@ -30,9 +30,11 @@ async function handleFreshChanges (instanceName, timelineName) {
 
     await database.insertTimelineItems(instanceName, timelineName, updates)
 
-    let itemIdsToAdd = store.getForTimeline(instanceName, timelineName, 'itemIdsToAdd') || []
-    itemIdsToAdd = itemIdsToAdd.concat(updates.map(_ => _.id))
-    store.setForTimeline(instanceName, timelineName, {itemIdsToAdd: itemIdsToAdd})
+    let itemIdsToAdd = store.getForTimeline(instanceName, timelineName, 'itemIdsToAdd')
+    if (itemIdsToAdd && itemIdsToAdd.length) {
+      itemIdsToAdd = itemIdsToAdd.concat(updates.map(_ => _.id))
+      store.setForTimeline(instanceName, timelineName, {itemIdsToAdd: itemIdsToAdd})
+    }
   }
 }
 
diff --git a/routes/_actions/timeline.js b/routes/_actions/timeline.js
index b935b963..a17596fb 100644
--- a/routes/_actions/timeline.js
+++ b/routes/_actions/timeline.js
@@ -59,6 +59,7 @@ export function initializeTimeline () {
   let timeline = store.get('currentTimeline')
   requestAnimationFrame(() => {
     requestAnimationFrame(() => {
+      console.log('initialized')
       store.setForTimeline(instanceName, timeline, {initialized: true})
     })
   })
diff --git a/routes/_components/LoadingPage.html b/routes/_components/LoadingPage.html
index 0314c649..88e0d336 100644
--- a/routes/_components/LoadingPage.html
+++ b/routes/_components/LoadingPage.html
@@ -1,4 +1,4 @@
-<div class="loading-page">
+<div class="loading-page {{shown ? '' : 'hidden'}}">
   <LoadingSpinner />
 </div>
 <style>
@@ -12,11 +12,17 @@
     align-items: center;
     justify-content: center;
     z-index: 50;
+    transition: opacity 0.25s linear;
   }
 </style>
 <script>
   import LoadingSpinner from './LoadingSpinner.html'
   export default {
+    oncreate() {
+      setTimeout(() => {
+        this.set({shown: true})
+      }, 200)
+    },
     components: {
       LoadingSpinner
     }
diff --git a/routes/_components/timeline/Timeline.html b/routes/_components/timeline/Timeline.html
index f7dd9138..b4d72814 100644
--- a/routes/_components/timeline/Timeline.html
+++ b/routes/_components/timeline/Timeline.html
@@ -75,8 +75,10 @@
       let timelineName = this.get('timeline')
       this.observe('itemIdsToAdd', itemIdsToAdd => {
         console.log('itemIdsToAdd', itemIdsToAdd)
-        addTimelineItemIds(instanceName, timelineName, itemIdsToAdd)
-        this.store.setForTimeline(instanceName, timelineName, { itemIdsToAdd: [] })
+        if (itemIdsToAdd && itemIdsToAdd.length) {
+          addTimelineItemIds(instanceName, timelineName, itemIdsToAdd)
+          this.store.setForTimeline(instanceName, timelineName, {itemIdsToAdd: []})
+        }
       })
     },
     ondestroy() {
@@ -151,9 +153,10 @@
     },
     methods: {
       initialize() {
-        if (this.store.get('initialized') || !this.store.get('timelineItemIds')) {
+        if (this.get('initializeStarted')) {
           return
         }
+        this.set({initializeStarted: true})
         console.log('timeline initialize()')
         initializeTimeline()
       },