Events Working

Basic events #19

Queercon/src/app/app.component.ts

@@ -45,7 +45,6 @@ export class MyApp {
 			{ title: 'Events Calendar', component: EventsPage },
 			{ title: 'Queercon Locals', component: LocalPage },
 			{ title: 'Chat Room', component: ChatPage },
-			{ title: 'Events', component: EventsPage },
 			{ title: 'Support Us', component: SupportersPage },
 			{ title: 'Volunteer', component: VolunteerPage },
 			{ title: 'Contact', component: ContactPage },

Queercon/src/app/app.module.ts

@@ -9,7 +9,7 @@ import { ChatPage } from '../pages/chat/chat';
 import { LocalPage } from '../pages/local/local';
 import { QcRsa2018Page } from '../pages/qc-rsa2018/qc-rsa2018';
 import { VolunteerPage } from '../pages/volunteer/volunteer';
-import { EventsPage } from '../pages/events/events';
+import { EventsPage as EventsPage, EventsDetailsPage} from '../pages/events/events';
 import { ContactPage } from '../pages/contact/contact';
 import { SupportersPage } from '../pages/supporters/supporters';
 import { AboutPage } from '../pages/about/about';
@@ -20,8 +20,14 @@ import { SplashScreen } from '@ionic-native/splash-screen';
 
 import { Calendar } from '@ionic-native/calendar';
 
+
 @NgModule({
   declarations: [
+
+    EventsPage,
+
+    EventsDetailsPage,
+
     MyApp,
     NewsPage,
     SupportersPage,
@@ -30,17 +36,40 @@ import { Calendar } from '@ionic-native/calendar';
     LocalPage,
     QcRsa2018Page,
     VolunteerPage,
-    EventsPage,
     AboutPage,
     ContactPage,
     HomePage
   ],
+
   imports: [
+
     BrowserModule,
-    IonicModule.forRoot(MyApp)
-  ],
+
+    IonicModule.forRoot(MyApp, {
+
+      statusbarPadding: false,
+
+     },
+
+     {
+
+       links: [
+      { component: EventsPage, name: 'EventsPage', segment: 'navigation-basic' },
+
+      { component: EventsDetailsPage, name: 'NavigationDetailsPage', segment: 'navigation-details' },
+
+    ]
+
+  })
+
+],
   bootstrap: [IonicApp],
   entryComponents: [
+
+    EventsPage,
+
+    EventsDetailsPage,
+
     MyApp,
     NewsPage,
     SupportersPage,
@@ -49,7 +78,6 @@ import { Calendar } from '@ionic-native/calendar';
     LocalPage,
     QcRsa2018Page,
     VolunteerPage,
-    EventsPage,
     AboutPage,
     ContactPage,
     HomePage

Queercon/src/pages/events/events-details.html

@@ -0,0 +1,12 @@
+<ion-header>
+        <ion-navbar>
+          <ion-title>
+            {{ item.title }}
+          </ion-title>
+        </ion-navbar>
+      </ion-header>
+
+      <ion-content padding>
+        <ion-icon [name]="'logo-' + item.icon" [ngStyle]="{'color': item.color}"></ion-icon>
+        {{ item.description }}
+      </ion-content>

Queercon/src/pages/events/events.ts

@@ -1,17 +1,78 @@
 import { Component } from '@angular/core';
-import { NavController } from 'ionic-angular';
+
+import { NavController, NavParams } from 'ionic-angular';
+
 
 @Component({
-  selector: 'page-events',
-  templateUrl: 'events.html'
+  templateUrl: 'events-details.html',
 })
-export class EventsPage {
-
-  constructor(public navCtrl: NavController) {
+export class EventsDetailsPage {
+  item;
 
+  constructor(params: NavParams) {
+    this.item = params.data.item;
   }
-  
+}
 
+@Component({
+  template: `
+<ion-header>
+  <ion-navbar>
+    <button ion-button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>Events</ion-title>
+  </ion-navbar>
+</ion-header>
 
+<ion-content>
+  <ion-list>
+    <ion-card *ngFor="let item of items" (click)="openEventDetailsPage(item)">
+      <ion-card-header>
+        {{ item.title }}
+      </ion-card-header>
+      <ion-card-content>
+      {{ item.summary }}
+      </ion-card-content>
+    </ion-card>
+  </ion-list>
+</ion-content>
+`
+})
+export class EventsPage {
+  items = [];
 
-}
+  constructor(public nav: NavController) {
+    this.items = [
+      {
+        'title': 'Event 1',
+        'summary': '1111111111',
+        'description': 'Blah Blah Blah',
+        'host': 'QC'
+      },
+      {
+        'title': 'Event 2',
+        'summary': '1111111111',
+        'description': 'Blah Blah Blah',
+        'host': 'QC'
+      },
+      {
+        'title': 'Event 3',
+        'summary': '1111111111',
+        'description': 'Blah Blah Blah',
+        'host': 'SEA'
+      },
+      {
+        'title': 'Event 4',
+        'summary': '1111111111',
+        'description': 'Blah Blah Blah',
+        'host': 'DC'
+      },
+    ]
+  }
+
+  openEventDetailsPage(item) {
+    this.nav.push(EventsDetailsPage, { item: item });
+  }
+
+}