Merge frontend repository into app/ subdirectory

app/src/pages/profile/profile.html

@@ -0,0 +1,27 @@
+<ion-content no-padding [style.backgroundImage]="getBackground(profile.details.pic)" (press)="showLightbox($event, profile.details.pic.detail)" on-swipe-left="nextProfile($event)" on-swipe-right="previousProfile($event)">
+  <ion-toolbar class="profile-toolbar">
+    <ion-buttons left>
+      <button ion-button icon-only (tap)="closeProfile($event)">
+        <ion-icon name="arrow-back"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>{{this.profile.details.name}}</ion-title>
+  </ion-toolbar>
+
+  <button ion-button icon-only clear large (tap)="openChat($event, this.profile)" class="button-chat">
+    <ion-icon name="ios-chatboxes"></ion-icon>
+  </button>
+
+  <div id="detail-overlay" class="details">
+    <ion-grid>
+      <ion-row nowrap align-items-center justify-content-between>
+        <ion-col col-12 text-center (click)="toggleProfileDetails($event)" class="detail-toggle">
+          <ion-icon name="arrow-down"></ion-icon>
+        </ion-col>
+      </ion-row>
+      <ion-row class="about" *ngIf="this.profile.details.about">
+        <ion-col col-12 [innerHTML]="this.profile.details.about"></ion-col>
+      </ion-row>
+    </ion-grid>
+  </div>
+</ion-content>

app/src/pages/profile/profile.scss

@@ -0,0 +1,72 @@
+page-profile {
+
+  ion-content {
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+  }
+
+  .scroll-content {
+    overflow-y: hidden;
+  }
+
+  ion-toolbar {
+    border-bottom: 1px solid #ffffff;
+    transition: opacity 250ms 125ms ease-in-out;
+
+    &.hidden {
+      opacity: 0;
+      z-index: -1;
+    }
+
+    .toolbar-background {
+      background-color: rgba(0, 0, 0, 1);
+    }
+
+    .bar-button,
+    .toolbar-title {
+      color: #ffffff;
+    }
+  }
+
+  .button-chat {
+    bottom: 3rem;
+    color: #fdb315;
+    position: absolute;
+    right: 1.5rem;
+    z-index: 100;
+  }
+
+  .detail-toggle {
+    font-size: 2.5em;
+    z-index: 100;
+  }
+
+  .details {
+    bottom: 0;
+    height: 60px;
+    left: 0;
+    position: absolute;
+    right: 0;
+    transition: all 250ms 125ms ease-in-out;
+
+    &.open {
+      background: rgba(0, 0, 0, 0.8);
+      height: 100%;
+      overflow-y: scroll;
+    }
+
+    .about {
+      font-family: 'Helvetica Neue', HelveticaNeue, Helvetica, Arial, sans-serif;
+      line-height: 1.5;
+    }
+
+    .actions {
+      text-align: right;
+
+      .button-clear {
+        color: #fdb315;
+      }
+    }
+  }
+}

app/src/pages/profile/profile.ts

@@ -0,0 +1,89 @@
+import { Component } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { NavController, NavParams } from 'ionic-angular';
+
+import { ChatPage } from '../chat/chat';
+import { LightboxPage } from '../lightbox/lightbox';
+import { ProfileService } from '../../services/profiles';
+
+@Component({
+  selector: 'page-profile',
+  templateUrl: 'profile.html',
+  providers: [ ProfileService ]
+})
+
+export class ProfilePage {
+
+  detailsOpen: boolean = false;
+  profile: any;
+  tabNavEl: any;
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public profileService: ProfileService, private _sanitizer: DomSanitizer) {
+    this.profile = navParams.get('profile');
+    this.tabNavEl = document.querySelector('#tab-nav .tabbar');
+  }
+
+  ionViewWillEnter() {
+    this.tabNavEl.style.display = 'none';
+  }
+
+  closeProfile(event) {
+    this.navCtrl.pop();
+  }
+
+  closeProfileDetails(event) {
+    if (this.detailsOpen) {
+      this.detailsOpen = false;
+      document.querySelector('.profile-toolbar').classList.remove('hidden');
+      document.getElementById('detail-overlay').classList.remove('open');
+    }
+  }
+
+  getBackground(pics) {
+    return this._sanitizer.bypassSecurityTrustStyle('url(https://appsby.fitz.guru/urge/' + pics.detail + ')');
+  }
+
+  markFavorite(event, profile) {
+    console.debug('favorite profile', { event: event, profile: profile });
+  }
+
+  nextProfile(event) {
+    this.profile = this.profileService.getNextProfile(this.profile._id);
+    this.navCtrl.setRoot(this.navCtrl.getActive().component);
+  }
+
+  openChat(event, profile) {
+    this.navCtrl.push(ChatPage, {
+      profile: profile
+    });
+  }
+
+  openProfileDetails(event) {
+    if (!this.detailsOpen) {
+      this.detailsOpen = true;
+      document.querySelector('.profile-toolbar').classList.add('hidden');
+      document.getElementById('detail-overlay').classList.add('open');
+    }
+  }
+
+  previousProfile(event) {
+    this.profile = this.profileService.getPreviousProfile(this.profile._id);
+    this.navCtrl.setRoot(this.navCtrl.getActive().component);
+  }
+
+  showLightbox(event, image) {
+    if (event.target.classList.contains('scroll-content')) {
+      this.navCtrl.push(LightboxPage, {
+        image: image
+      });
+    }
+  }
+
+  toggleProfileDetails(event) {
+    if (!this.detailsOpen) {
+      this.openProfileDetails(event);
+    } else {
+      this.closeProfileDetails(event);
+    }
+  }
+}