Various small changes and enhancements

Client/src/app/components/event-large/event-large.component.html

@@ -26,7 +26,7 @@
     </div>
     <div class="buttons-edit" *ngIf="loggedIn">
         <div class="border"></div>
-        <button md-button class="action" (click)="edit()" ><i ofbicon>edit</i>  Edit</button><!--
+        <span class="action filler"></span><!--
         --><button md-button class="action" (click)="delete()" ><i ofbicon>delete_forever</i>  Delete</button>
     </div>
 </div>

Client/src/app/components/event-large/event-large.component.ts

@@ -92,10 +92,6 @@ export class EventLargeComponent implements AfterContentInit {
     let dialog = this.dialog.open(SharePopupComponent, opts);
   }
 
-  edit(){
-
-  }
-
   delete(){
     let opts = new MdDialogConfig;
     opts.data = { title:'Delete','message':'Are you sure you want to delete "' + this.title + '"?' };

Client/src/app/components/events-page/events-page.component.css

@@ -27,6 +27,10 @@ li:last-child{
     display: none;
 }
 
+#showAllButton{
+    margin-top: 10px;
+}
+
 @media(max-width:800px){
     .mobile-search{
         display: block;

Client/src/app/components/events-page/events-page.component.html

@@ -1,6 +1,6 @@
 <secondary-page-component [hideSideBarOnMobile]="true" >
     <div mainContent>
-        <p>These are some upcoming events at Old Fashion Baptist Church</p>
+        <p *ngIf="loading">Loading upcoming events...</p>
         <ul>
             <li *ngFor="let event of events; let i = index;">
                 <event-large-component
@@ -13,11 +13,14 @@
                     ></event-large-component>
             </li>
         </ul>
+        <button md-button *ngIf="showAllButtonVisible" id="showAllButton" class="width100" style="text-align: center;" routerLink="/events" >               
+            <i ofbicon >expand_more</i><span *ngIf="!loading"> Show All</span>
+        </button>
         <div class="fab-buttons" >
             <button md-fab *ngIf="loggedIn" (click)="addEvent()"><i ofbicon>add</i></button>
         </div>        
     </div>
     <div sideBar class="side-bar">
-        <button md-raised-button class="width100" (click)="addEvent()" >Add Event</button>
+        <button md-raised-button *ngIf="loggedIn" class="width100" (click)="addEvent()" >Add Event</button>
     </div>
 </secondary-page-component>

Client/src/app/components/events-page/events-page.component.ts

@@ -18,14 +18,15 @@ export class EventsPageComponent implements OnInit {
   private dialogConfig: MdDialogConfig;
   public loading: boolean = true;
   public events: Event[];
-  public loggedIn: boolean;
+  public loggedIn: boolean = false;
+  public showAllButtonVisible: boolean = false;
 
   constructor(private loginService: LoginService, 
               private eventService: EventService,
               private dialog: MdDialog,
               private snackbar: MdSnackBar,
               private activatedRoute: ActivatedRoute) { 
-    this.loginService.isLoggedIn(true).subscribe(is => { this.loggedIn = is });
+    this.loginService.isLoggedIn(true).subscribe(is => { this.loggedIn = is; });
     this.loginService.onLogin().subscribe(is => { this.loggedIn = is.isLoggedIn; });
   }
 
@@ -36,12 +37,16 @@ export class EventsPageComponent implements OnInit {
             id = Number.isNaN(id) ? -1 : id;
             if (id > -1){
                 this.getSingleEvent(id);
+                console.log("GG");
+                this.showAllButtonVisible = true;
             } else {
                 this.getEvents(true);
+                this.showAllButtonVisible = false;
             }
         });
   }
 
+
   getEvents(clearExisting: boolean): void{
     this.loading = true;
     this.events = this.events || [];

Client/src/app/components/sermons/sermons.component.html

@@ -19,7 +19,7 @@
                     [loggedIn]="loggedIn"
                     ></sermon-large-component>
             </li>
-            <button md-button class="width100" style="text-align: center;" (click)="loadMoreSermonsClick()">
+            <button md-button [disabled]="loading" class="width100" style="text-align: center;" (click)="loadMoreSermonsClick()">
                 <i ofbicon *ngIf="loading">access_time</i><span *ngIf="loading"> Loading...</span>                
                 <i ofbicon *ngIf="!loading">expand_more</i><span *ngIf="!loading"> Load More</span>
             </button>
@@ -36,6 +36,6 @@
                 <input #search mdInput placeholder="Search Sermons" [value]="searchTerm" (keyup)="searchChange(search.value)">
             </md-input-container>
         </div>
-        <button md-raised-button class="width100" (click)="addSermon()" >Add Sermon</button>
+        <button md-raised-button *ngIf="loggedIn" class="width100" (click)="addSermon()" >Add Sermon</button>
     </div>
 </secondary-page-component>

Client/src/app/components/upcoming-events/upcoming-events.component.html

@@ -1,4 +1,4 @@
-<div class="event-container">
+<div class="event-container" *ngIf="events.length > 0 || !hideWhenNoEvents">
     <p class="event-header" >Upcoming Events</p>
     <p *ngIf="loading">Loading...</p>
     <ul class="events">

Client/src/app/components/upcoming-events/upcoming-events.component.ts

@@ -9,10 +9,12 @@ import { EventService } from '../../services/event.service';
   styleUrls: ['./upcoming-events.component.css']  
 })
 export class UpcomingEventsComponent implements OnInit {
-    events: Event[];
+    public events: Event[];
     loading: boolean = false;
     @Input()
-    numberOfEventsToShow = 3;
+    numberOfEventsToShow: number = 3;
+    @Input()
+    hideWhenNoEvents: boolean = true;
 
     constructor(private eventService: EventService){