From 2cd9de4e1b61b1c641c5d551ca7c69dcf2ced144 Mon Sep 17 00:00:00 2001
From: Peter Maquiran <petermaquiran29@gmail.com>
Date: Tue, 2 Feb 2021 11:05:01 +0100
Subject: [PATCH] Add centralize timeline

---
 src/app/pages/agenda/agenda.page.ts | 41 ++++++++++++++++++-----------
 1 file changed, 25 insertions(+), 16 deletions(-)

diff --git a/src/app/pages/agenda/agenda.page.ts b/src/app/pages/agenda/agenda.page.ts
index 2c1f71193..e2cd33462 100644
--- a/src/app/pages/agenda/agenda.page.ts
+++ b/src/app/pages/agenda/agenda.page.ts
@@ -151,20 +151,6 @@ export class AgendaPage implements OnInit {
 
       this.showLoader = false;
 
-      // auto scroll
-      setTimeout(() => {
-        const timelineMarker = document.querySelector('.cal-current-time-marker');
-  
-        const timelineContainer = document.querySelectorAll('ion-content')[2];
-        const shadowRoot = timelineContainer.shadowRoot;
-
-        const scrollContainer = shadowRoot.querySelector('main');
-
-        scrollContainer.scrollTop = timelineMarker['offsetTop'] - (window.screen.availHeight - (91 + 337 +56+140));
-
-        
-      }, 2000);
-
     }
 
   ngOnInit() {
@@ -184,8 +170,26 @@ export class AgendaPage implements OnInit {
         }
       }
     });
+
+
+
+    this.centralizeTimeline();
+
   }
 
+  centralizeTimeline() {
+    // auto scroll timeline
+    setTimeout(() => {
+      const timelineMarker = document.querySelector('.cal-current-time-marker');
+      const timelineContainer = document.querySelectorAll('ion-content')[2];
+      const shadowRoot = timelineContainer.shadowRoot;
+
+      const scrollContainer = shadowRoot.querySelector('main');
+
+      scrollContainer.scrollTop = timelineMarker['offsetTop'] - (scrollContainer.offsetHeight/2);
+      
+    }, 2000);
+  }
 
   timelineIsCurrentDate(): Boolean {
     return formatDate(new Date(),'dd MMMM yyyy', 'pt') == formatDate(this.eventSelectedDate,'dd MMMM yyyy', 'pt');
@@ -222,9 +226,9 @@ export class AgendaPage implements OnInit {
       eventTypeNum = (Object.keys(eventType)).length
 
       if (eventTypeNum == 2) { 
-        return `calendar-${this.profile}-event-type-both`;
+        return ` calendar-event-border calendar-${this.profile}-event-type-both`;
       } else {
-        return `calendar-${this.profile}-event-type-`+(Object.keys(eventType))[0];
+        return ` calendar-event-border calendar-${this.profile}-event-type-`+(Object.keys(eventType))[0];
       }
     }
 
@@ -250,6 +254,7 @@ export class AgendaPage implements OnInit {
     this.viewDate = new Date(formatDate(ev,'yyyy-MM-dd', 'pt'));
     // calendar change date
     this.eventSelectedDate = new Date(ev);
+    this.centralizeTimeline();
   };
 
   // changedate
@@ -373,6 +378,8 @@ export class AgendaPage implements OnInit {
 
               this.showLoader = false;
               this.showTimeline = true;
+
+              this.centralizeTimeline();
              
             });
     
@@ -415,6 +422,8 @@ export class AgendaPage implements OnInit {
               this.showLoader = false;
               this.showTimeline = true;
 
+              this.centralizeTimeline();
+
             });
         }
       break;