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

import { CruiseService } from '../../services/cruises';
import { CruisePage } from '../cruise/cruise';

@Component({
  selector: 'page-cruises',
  templateUrl: 'cruises.html',
  providers: [ CruiseService ]
})
export class CruisesPage {

  cruises: any;
  tabNavEl: any;

  constructor(public navCtrl: NavController, public cruiseService: CruiseService, private _sanitizer: DomSanitizer) {
    cruiseService.load().then((data) => {
      this.cruises = data;
    });
    this.tabNavEl = document.querySelector('#tab-nav .tabbar');
  }

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

  getBackgroundThumbnail(images) {
    // PROD: return this._sanitizer.bypassSecurityTrustStyle('url(https://appsby.fitz.guru/urge/' + images.thumb + ')');
    return this._sanitizer.bypassSecurityTrustStyle('url(' + images.thumb + ')');
  }

  profileTapped(event, cruise) {
    this.navCtrl.push(CruisePage, {
      cruise: cruise
    });
  }
}