From fc78ad054cdc5b9b9f5af4cab6c61bb0166d7f11 Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 07:26:34 +0000
Subject: [PATCH 1/8] Update src/app/app.module.ts


---

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 1a1d5ea..dc6d9ba 100755
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -24,6 +24,7 @@ import { NoBookmarksComponent } from '../components/no-bookmarks/no-bookmarks';
 import { NoMeetingsComponent } from '../components/no-meetings/no-meetings';
 import { NoResultsComponent } from '../components/no-results/no-results';
 import { NoInternetComponent } from '../components/no-internet/no-internet';
+import { LoaderComponent } from '../components/loadingdots/loadingdots';
 
 import { Browser } from '../providers/browser/browser';
 
@@ -49,6 +50,7 @@ import { Browser } from '../providers/browser/browser';
     NoMeetingsComponent,
     NoResultsComponent,
     NoInternetComponent,
+    LoaderComponent,
     FedoraPodcast,
     PodcastPlayer
   ],

From 0e47b6fc3691c898ff66d1524b1cf9d59dc904b7 Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:22:18 +0000
Subject: [PATCH 2/8] Update src/pages/ask/ask.html


---

diff --git a/src/pages/ask/ask.html b/src/pages/ask/ask.html
index 90a1389..95cabb7 100644
--- a/src/pages/ask/ask.html
+++ b/src/pages/ask/ask.html
@@ -22,6 +22,7 @@
         Popular
       </ion-segment-button>
     </ion-segment>
+    <loader *ngIf="dotsloading"></loader>
     <ion-list>
       <ion-list *ngIf="questions.length !== 0">
         <ion-card *ngFor="let question of questions" tappable (click)="openQuestion(question)">

From de4daa9e1c6337fe90c38595c914da77dae6c9eb Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:24:55 +0000
Subject: [PATCH 3/8] Update src/pages/ask/ask.ts


---

diff --git a/src/pages/ask/ask.ts b/src/pages/ask/ask.ts
index f24aa27..386dfae 100644
--- a/src/pages/ask/ask.ts
+++ b/src/pages/ask/ask.ts
@@ -22,6 +22,8 @@ export class AskPage {
    * Stores list of displayed questions
    */
   private questions: Question[];
+  
+  private dotsloading;
 
   constructor(private browser: Browser,
     private askFedora: AskFedoraService) {
@@ -36,10 +38,12 @@ export class AskPage {
    * Fetch a list of latest questions using Ask Fedora API.
    */
   updateQuestions(type: string): void {
+  	this.dotsloading = true;
     this.askFedora
       .getQuestions(type)
       .subscribe(questions => {
         this.questions = questions || [];
+        this.dotsloading = false;
       });
   }
 

From 2e82c64a9bc37d58a40e1e2f20c1ece143a45e7a Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:28:13 +0000
Subject: [PATCH 4/8] Update src/pages/calendar/calendar.html


---

diff --git a/src/pages/calendar/calendar.html b/src/pages/calendar/calendar.html
index 3c7aaff..806e0b5 100644
--- a/src/pages/calendar/calendar.html
+++ b/src/pages/calendar/calendar.html
@@ -27,6 +27,7 @@
       Past Events
     </ion-segment-button>
   </ion-segment>
+  <loader *ngIf="dotsloading"></loader>
   <ion-list>
     <div *ngIf="meetings.length !== 0">
       <ion-card *ngFor="let meeting of meetings">

From 66a06062bdbcbb8ca4c11a2e6acda1530e26173e Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:32:42 +0000
Subject: [PATCH 5/8] Update src/pages/calendar/calendar.ts


---

diff --git a/src/pages/calendar/calendar.ts b/src/pages/calendar/calendar.ts
index 4e97e46..6e95434 100644
--- a/src/pages/calendar/calendar.ts
+++ b/src/pages/calendar/calendar.ts
@@ -32,6 +32,8 @@ export class CalendarPage {
    * List of calendars in FedoCal
    */
   public calendars: CalendarType[];
+  
+  private dotsloading;
 
   /**
    * List of meetings in the selected calendar
@@ -81,10 +83,12 @@ export class CalendarPage {
    * @param type type of meetings to fetch, upcoming or past
    */
   updateMeetings(type: string): void {
+  this.dotsloading = true;
     this.fedoCal
       .getMeetings(this.selectedCalendar, type)
       .subscribe(meetings => {
         this.meetings = meetings;
+        this.dotsloading = false;
       });
   }
 

From 2bcc3710923fd941d4df8cf4803601296941cce5 Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:36:00 +0000
Subject: [PATCH 6/8] Update src/pages/magazine/magazine.html


---

diff --git a/src/pages/magazine/magazine.html b/src/pages/magazine/magazine.html
index e384403..edeb700 100644
--- a/src/pages/magazine/magazine.html
+++ b/src/pages/magazine/magazine.html
@@ -17,6 +17,7 @@
       <img src='./assets/img/sort.svg'>
     </button>
   </ion-label>
+  <loader *ngIf="dotsloading"></loader>
   <ion-list>
     <ion-card *ngFor="let post of posts let i = index">
       <ion-row>

From d1d2a0ac38c8816e252acf7bce5f363dfd6eee0a Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 08:40:39 +0000
Subject: [PATCH 7/8] Update src/pages/magazine/magazine.ts


---

diff --git a/src/pages/magazine/magazine.ts b/src/pages/magazine/magazine.ts
index 2023c32..c770e97 100644
--- a/src/pages/magazine/magazine.ts
+++ b/src/pages/magazine/magazine.ts
@@ -18,6 +18,8 @@ export class MagazinePage {
    * List of posts from Fedora Magazine
    */
   private posts: Post[];
+  
+  private dotsloading;
 
   /**
    * Number of posts
@@ -50,9 +52,11 @@ export class MagazinePage {
    * Fetch latest posts from Fedor Magazine API
    */
   updatePosts(postCount): void {
+   	this.dotsloading = true;
     this.fedoraMag.getPosts(postCount)
       .subscribe(posts => {
         this.posts = posts;
+        this.dotsloading = false;
       });
   }
 

From 1c063cf518070e6aee98f94789eea36009fe6bc5 Mon Sep 17 00:00:00 2001
From: Nishant Parhi <nishantparhi@gmail.com>
Date: Oct 26 2018 10:57:33 +0000
Subject: [PATCH 8/8] loadingdots


---

diff --git a/src/components/loadingdots/loadingdots.html b/src/components/loadingdots/loadingdots.html
new file mode 100644
index 0000000..3fc52db
--- /dev/null
+++ b/src/components/loadingdots/loadingdots.html
@@ -0,0 +1,29 @@
+<div class="spinner"></div>
+<style>.spinner {
+  width: 40px;
+  height: 40px;
+  background-color: #333;
+
+  margin: 100px auto;
+  -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
+  animation: sk-rotateplane 1.2s infinite ease-in-out;
+}
+
+@-webkit-keyframes sk-rotateplane {
+  0% { -webkit-transform: perspective(120px) }
+  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
+  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
+}
+
+@keyframes sk-rotateplane {
+  0% { 
+    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
+    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
+  } 50% { 
+    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
+    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
+  } 100% { 
+    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+  }
+}</style>
diff --git a/src/components/loadingdots/loadingdots.ts b/src/components/loadingdots/loadingdots.ts
new file mode 100644
index 0000000..1290b3c
--- /dev/null
+++ b/src/components/loadingdots/loadingdots.ts
@@ -0,0 +1,12 @@
+ import { Component } from '@angular/core';
+ 
+ @Component({
+   selector: 'loadingdots',
+   templateUrl: 'loadingdots.html'
+ })
+ export class LoaderComponent {
+ 
+   constructor() {
+   }
+ 
+ }

