import {Component, trigger, state, transition, style, animate, OnInit} from '@angular/core';
import {AppComponent} from 'app/app.component';
import { PagesComponent } from 'app/pages/pages.component';
import {ActivatedRoute, Router} from '@angular/router';
import * as AuthStore from '../../../../../packages/member/store/auth';
import {select, Store} from '@ngrx/store';
import {AuthSelector} from '../../../../../packages/member/store';
import {Member} from '@overflow/commons-typescript/model/member';

@Component({
    selector: 'of-inline-profile',
    templateUrl: './app.profile.component.html',
    animations: [
        trigger('menu', [
            state('hidden', style({
                height: '0px'
            })),
            state('visible', style({
                height: '*'
            })),
            transition('visible => hidden', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)')),
            transition('hidden => visible', animate('400ms cubic-bezier(0.86, 0, 0.07, 1)'))
        ])
    ]
})
export class AppInlineProfileComponent implements OnInit {

    active: boolean;

    member: Member;

  // this.store.select(AuthSelector.select('member');

  constructor(
    public app: PagesComponent,
    private activatedRoute: ActivatedRoute,
    private router: Router,
    private store: Store<AuthStore.State>,
  ) {
  }


  ngOnInit() {
    this.store.select(AuthSelector.select('member')).subscribe(
      (member: Member) => {
        this.member = member;
      },
      (error) => {
        console.log(error);
      }
    );
  }
  onClick(event) {
        this.active = !this.active;
        setTimeout(() => {
          this.app.layoutMenuScrollerViewChild.moveBar();
        }, 450);
        event.preventDefault();
    }
}
