import { Component, OnInit } from '@angular/core';
import { PublicService } from '../PublicService';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
import { ActivatedRoute } from '@angular/router';
import { Screenshot } from '@ionic-native/screenshot/ngx';
import { SocialSharing } from '@ionic-native/social-sharing/ngx';
import {LoadingController, MenuController, NavController} from '@ionic/angular';
import { Constants } from '../Constant';
import { Base64 } from '@ionic-native/base64/ngx';

@Component({
  selector: 'app-detail',
  templateUrl: './detail.page.html',
  styleUrls: ['./detail.page.scss'],
})
export class DetailPage implements OnInit {

  private title = '';
  private isIframeShow = false;
  private url: SafeResourceUrl;
  private searchKey = '';
  private menuDate = [];
  private isMenuHidden = true;
  private childData = [];
  private selectedMenuId;
  private publishDetail;
  private user;
  private userConfig;
  private collects = [];
  private isCollected = false;
  constructor(private readonly publicService: PublicService,
              private readonly socialSharing: SocialSharing,
              private readonly route: ActivatedRoute,
              private readonly screenShot: Screenshot,
              private readonly base64: Base64,
              // private readonly menu: MenuController,
              private readonly loadingCtrl: LoadingController,
              private readonly navController: NavController,
              private readonly sanitizer: DomSanitizer) { }

  ngOnInit() {
    this.user = this.publicService.getCurrentUser();
    this.userConfig = this.user.userConfig;
    const params = this.route.snapshot.queryParams;
    this.title = params.title;
    if (this.userConfig.collection){
      this.collects = JSON.parse(this.userConfig.collection);
    }
    this.getDetail(params.id, params.publishId);
    this.toSearch();
  }

  getDetail(viewId, publishId){
    this.url = this.sanitizer.bypassSecurityTrustResourceUrl('');
    this.publicService.getPublicDetail(publishId).then(res => {
      if (res.code === Constants.SUCCESS && res.data){
        // const test = 'https://echarts.apache.org/examples/zh/editor.html?c=line-simple';
        this.url = this.sanitizer.bypassSecurityTrustResourceUrl(res.data.extUrl);
        // this.url = this.sanitizer.bypassSecurityTrustResourceUrl(test);
        this.isIframeShow = false;
        this.publishDetail = {id: viewId, publishId, title: this.title};
        this.publicService.addViewRecord(this.publishDetail);
        this.isCollect(viewId);
      }else{
        this.publicService.presentToast(res.msg);
      }
    }, err => {
      this.publicService.checkNetworkToast(err);
    });
  }
  isCollect(id) {
    this.isCollected = false;
    this.collects.forEach(item => {
      if (item.id === id){
        this.isCollected = true;
        return;
      }
    });
  }
  loaded(){
    this.isIframeShow = true;
  }
  toShare(){
    const fileName = this.title + new Date().getTime() + '.jpg';
    this.screenShot.save('jpg', 80, fileName).then((res) => {
      this.base64.encodeFile('file:///' + res.filePath).then( base64File => {
        setTimeout(() => {
          this.socialSharing.share(this.title, '截图', base64File, null).then(() => {
          }, (err) => {
            // Error!
            this.publicService.presentToast('分享失败！' + err);
          });
        }, 500);
      }, (err) => {
        console.log(err);
      });
    }, (err) => {
      // alert('save失败' + err);
    });
  }
  async toCollect() {
    if (this.isCollected) {
      this.publicService.presentToast('已收藏');
      return;
    }
    const load = await this.publicService.showLoading(this.loadingCtrl, '数据保存中...');
    this.collects.push(this.publishDetail);
    this.userConfig.collection = JSON.stringify(this.collects);
    this.publicService.updateUserConfig(this.userConfig).then(res => {
      load.dismiss();
      if (res.code === Constants.SUCCESS) {
        this.publicService.setCurrentUser(this.user);
        this.publicService.presentToast('收藏成功');
        this.isCollected = true;
      } else {
        this.publicService.presentToast(res.msg);
      }
    }, err => {
      load.dismiss();
      this.publicService.checkNetworkToast(err);
    });
  }
  toOpenMenu(){
    this.isMenuHidden = false;
    // const menuId = 'first';
    // this.menu.isOpen(menuId).then(isOpen => {
    //   if (isOpen){
    //     this.menu.close(menuId);
    //   }else{
    //     this.menu.open(menuId);
    //   }
    // });
  }
  toCloseMenu(){
    this.isMenuHidden = true;
    // const menuId = 'first';
    // this.menu.isOpen(menuId).then(isOpen => {
    //   if (isOpen){
    //     this.menu.close(menuId);
    //   }else{
    //     this.menu.open(menuId);
    //   }
    // });
  }
  clickMenu(menuId, index){
    this.selectedMenuId = menuId;
    this.childData = this.menuDate[index].childrens;
  }
  clickItem(item){
    this.title = item.title;
    this.getDetail(item.id, item.publishId);
    this.toCloseMenu();
  }
  toSearch(){
    this.publicService.queryByParentAndKey(this.searchKey).then(res => {
      if (res.code === Constants.SUCCESS){
        this.menuDate = res.data;
        if (this.menuDate.length > 0){
          this.clickMenu(this.menuDate[0].id, 0);
        }else{
          this.childData = [];
        }
      }else{
        this.publicService.presentToast(res.msg);
      }
    });
  }

  back(){
    this.navController.back();
  }
}