import { Component, OnInit } from '@angular/core';
import { PagewalkerService } from 'projects/page-walker/src/public-api';


@Component({
  selector: 'app-pager-walker-demo',
  templateUrl: './pager-walker-demo.component.html',
  styleUrls: ['./pager-walker-demo.component.scss']
})
export class PagerWalkerDemoComponent implements OnInit {

  pageWalkerContainer;
  secondContainer;
  thirdContainer;
  fourthContainer;

  constructor(private createservice:PagewalkerService) { }

  ngOnInit() {
  }

  walkSelected(event){
    console.log(event);
  }
  creat(){
    this.pageWalkerContainer = this.createservice.createDetail({
      'walkId':'step1',
      'title':'第一步',
      'subtitle':'第一步副标题',
      'coord':[100,100],
      'size':[100,40],
      'pageLength':3,
      'currentIndex':0
    })
    this.pageWalkerContainer.nextStep.subscribe(e=>{
      console.log('下一步');
      this.creatSecond();
    });
    this.pageWalkerContainer.prevStep.subscribe(e=>{
      console.log('上一步');
      
    })
    this.pageWalkerContainer.finishWakler.subscribe(e=>{
      console.log('结束');
    });
    this.pageWalkerContainer.closeWakler.subscribe(e=>{
      console.log('关闭');
      this.createservice.clear();
    })
  }
  creatSecond(){
    this.secondContainer = this.createservice.createDetail({
      'walkId':'step2',
      'title':'第二步',
      'subtitle':'第二步副标题',
      'coord':[200,200],
      'size':[200,50],
      'pageLength':3,
      'currentIndex':1
    })
    this.secondContainer.nextStep.subscribe(e=>{
      console.log('下一步');
      this.creatThird();
    });
    this.secondContainer.prevStep.subscribe(e=>{
      console.log('上一步');
      this.creat();
    })
    this.secondContainer.finishWakler.subscribe(e=>{
      console.log('结束');
    });
    this.secondContainer.closeWakler.subscribe(e=>{
      console.log('关闭');
      this.createservice.clear();
    })
  }
  creatThird(){
    this.thirdContainer = this.createservice.createDetail({
      'walkId':'step3',
      'title':'第三步',
      'subtitle':'第三步副标题',
      'coord':[100,200],
      'size':[100,40],
      'pageLength':3,
      'currentIndex':2
    })
    this.thirdContainer.nextStep.subscribe(e=>{
      console.log('下一步');
    });
    this.thirdContainer.prevStep.subscribe(e=>{
      console.log('上一步');
      this.creatSecond();
    })
    this.thirdContainer.finishWakler.subscribe(e=>{
      console.log('结束');
      this.createservice.clear();
    });
    this.thirdContainer.closeWakler.subscribe(e=>{
      console.log('关闭');
      this.createservice.clear();
    })
  }
}