import { Component, OnInit } from '@angular/core';
import {trigger,state,style,transition,animate} from '@angular/animations';
import { WebNotificationService } from '../notification/webNotification.service';
import { ConnectionIndicationService } from '../notification/ConnectionIndication.service';
import { AuthService } from '../auth/auth.service';
import { OcBasedUnifiedNotificationService } from '../notification/OcBasedUnifiedNotification.service';
import { UnifiedNotificationService } from '../notification/UnifiedNotification.service';
import { Store } from 'node_modules/@ngrx/store';
import * as fromRoot from '../auto-logout/reducers';
import * as ApplicationActions from '../auto-logout/actions';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  animations: [
      trigger('overlayState', [
          state('hidden', style({
              opacity: 0
          })),
          state('visible', style({
              opacity: 1
          })),
          transition('visible => hidden', animate('400ms ease-in')),
          transition('hidden => visible', animate('400ms ease-out'))
      ]),
  
      trigger('notificationTopbar', [
        state('hidden', style({
          height: '0',
          opacity: 0
        })),
        state('visible', style({
          height: '*',
          opacity: 1
        })),
        transition('visible => hidden', animate('400ms ease-in')),
        transition('hidden => visible', animate('400ms ease-out'))
      ])
  ],
})
export class AppComponent implements OnInit{
    
    menuActive: boolean;
    
    activeMenuId: string;
    
    notification: boolean = false;
    constructor(
        private webNotificationservice: WebNotificationService,
        private connectionIndicationService: ConnectionIndicationService,
        private authService: AuthService,
        
        private unifiedNotificationService : UnifiedNotificationService,
        private ocBasedUnifiedNotificationService : OcBasedUnifiedNotificationService,
        private store: Store<fromRoot.State> ) 
        {

            
        }
    ngOnInit() {
      
        this.connectionIndicationService.build();
        this.connectionIndicationService.start();
        this.webNotificationservice.build();
        this.webNotificationservice.start();
        this.unifiedNotificationService.build();
        this.unifiedNotificationService.start();
        this.ocBasedUnifiedNotificationService.build();
        this.ocBasedUnifiedNotificationService.start();
      setTimeout(()=>{this.notification = true ; }, 3000);
      this.initListener();
    }
    


//   reset(actionType: string) {
//     // console.log(actionType);
//     this.store.dispatch(new ApplicationActions.ExtendLogoutTimer());
//     // this.setLastAction(Date.now());
//   }

    isLoggedIn(): boolean {
        return this.authService.isLoggedIn();       
    }
    
    changeTheme(event: Event, theme: string) {
        let themeLink: HTMLLinkElement = <HTMLLinkElement> document.getElementById('theme-css');
        themeLink.href = 'assets/components/themes/' + theme + '/theme.css';
        event.preventDefault();
        // alert(themeLink.href);
    }
    
    onMenuButtonClick(event: Event) {
        this.menuActive = !this.menuActive;
        event.preventDefault();
    }
    
    closeNotification(event) {
      this.notification = false;
      event.preventDefault();
    }

    initListener() {
        document.body.addEventListener('click', () => this.reset('click'));
        document.body.addEventListener('mouseover',()=> this.reset('mouseover'));
      }
    
      reset(actionType: string) {
        // console.log(actionType);
        this.store.dispatch(new ApplicationActions.ExtendLogoutTimer());
        // this.setLastAction(Date.now());
      }
}