import { Component } from "@angular/core";
import { DomSanitizer } from "@angular/platform-browser";
import { NavController } from "ionic-angular";

import { ChatPage } from "../chat/chat";
import { ProfileService } from "../../services/profiles";
import { ProfilePage } from "../profile/profile";

@Component({
  selector: "page-grid",
  templateUrl: "grid.html",
  providers: [ProfileService],
})
export class GridPage {
  profiles: any;
  tabNavEl: any;

  constructor(
    public navCtrl: NavController,
    public profileService: ProfileService,
    private _sanitizer: DomSanitizer
  ) {
    profileService.loadVerified().then((data) => {
      this.profiles = data;
      console.debug("profiles: ", this.profiles);
    });
    this.tabNavEl = document.querySelector("#tab-nav .tabbar");
  }

  ionViewWillEnter() {
    this.tabNavEl.style.display = "flex";
  }

  doTellStory() {
    // this.navCtrl.push(TellYourStoryPage);
  }

  getBackgroundThumbnail(pics) {
    return this._sanitizer.bypassSecurityTrustStyle(
      "url(/assets/" + pics.thumb + ")"
    );
  }

  profilePressed(event, profile) {
    if (profile.messages && profile.messages.length) {
      this.navCtrl.push(ChatPage, {
        profile: profile,
      });
    }
  }

  profileTapped(event, profile) {
    this.navCtrl.push(ProfilePage, {
      profile: profile,
    });
  }
}
