Fixed bug in narrow width for #111

Author: dalezak

src/app/app.html

@@ -34,8 +34,8 @@
     </ion-header>
     <ion-content>
       <checkin-details [checkin]="checkin" [person]="person"
-                       [canSend]="checkin.canRespond(person)" [canResend]="checkin.canResend(person)"
-                       (sendClicked)="respondCheckin($event)" (resendClicked)="resendCheckin($event)" *ngIf="checkin"></checkin-details>
+                       [canRespond]="checkin.canRespond(person)" [canResend]="checkin.canResend(person)"
+                       (respondClicked)="respondCheckin($event)" (resendClicked)="resendCheckin($event)" *ngIf="checkin"></checkin-details>
     </ion-content>
   </ion-menu>
   <ion-nav main #content #rootNavController swipeBackEnabled="false" [root]="rootPage"></ion-nav>

src/components/checkin-details/checkin-details.html

@@ -7,7 +7,7 @@ <h1>{{checkin.message}}</h1>
     <ion-badge color="waiting" *ngIf="checkin.waiting_count > 0">{{checkin.waiting_count}}</ion-badge>
   </ion-item>
   <ion-item text-wrap color="white">
-    <button ion-button text-only item-left clear color="primary" tappable *ngIf="hasSendClicked && checkin.canRespond(person)" (click)="onSendClicked($event)">Respond</button>
+    <button ion-button text-only item-left clear color="primary" tappable *ngIf="hasRespondClicked && checkin.canRespond(person)" (click)="onRespondClicked($event)">Respond</button>
     <button ion-button text-only item-right clear color="primary" tappable *ngIf="hasResendClicked && checkin.canResend(person)" (click)="onResendClicked($event)">Resend</button>
   </ion-item>
 </ion-list>

src/components/checkin-details/checkin-details.ts

@@ -16,30 +16,30 @@ export class CheckinDetailsComponent {
   person:Person;
 
   @Input()
-  canSend:boolean = false;
+  canRespond:boolean = false;
 
   @Input()
   canResend:boolean = false;
 
   @Output()
-  sendClicked = new EventEmitter();
+  respondClicked = new EventEmitter();
 
   @Output()
   resendClicked = new EventEmitter();
 
-  hasSendClicked:boolean = false;
+  hasRespondClicked:boolean = false;
   hasResendClicked:boolean = false;
 
   constructor() {
   }
 
   ngOnInit() {
-    this.hasSendClicked = this.sendClicked && this.sendClicked.observers.length > 0;
+    this.hasRespondClicked = this.respondClicked && this.respondClicked.observers.length > 0;
     this.hasResendClicked = this.resendClicked && this.resendClicked.observers.length > 0;
   }
 
-  onSendClicked(event:any) {
-    this.sendClicked.emit();
+  onRespondClicked(event:any) {
+    this.respondClicked.emit();
   }
 
   onResendClicked(event:any) {

src/pages/checkin-details/checkin-details.html

@@ -16,6 +16,6 @@
     <ion-refresher-content></ion-refresher-content>
   </ion-refresher>
   <checkin-details [checkin]="checkin" [person]="person"
-                   [canSend]="checkin.canRespond(person)" [canResend]="checkin.canResend(person)"
-                   (sendClicked)="respondCheckin($event)" (resendClicked)="resendCheckin($event)"></checkin-details>
+                   [canRespond]="checkin.canRespond(person)" [canResend]="checkin.canResend(person)"
+                   (respondClicked)="respondCheckin($event)" (resendClicked)="resendCheckin($event)" *ngIf="checkin && person"></checkin-details>
 </ion-content>

src/pages/checkin-list/checkin-list.ts

@@ -417,14 +417,15 @@ export class CheckinListPage extends BasePage {
   }
 
   private showCheckinDetails(checkin:Checkin, event:any=null) {
-    if (this.platform.width() > this.WIDTH_LARGE) {
+    if (document.body.clientWidth > this.WIDTH_LARGE) {
       // this.showModal(CheckinDetailsPage, {
       //   organization: this.organization,
       //   person: this.person,
       //   checkin: checkin,
       //   checkin_id: checkin.id,
       //   modal: true
       // });
+      // this.selected = checkin;
       this.events.publish('checkin:details', {
         checkin: checkin
       });