import { Injectable, NgZone } from '@angular/core';
import { ShortcutService } from './shortcut.service';
import { EventsService } from './events.service';
import { Event } from "@tauri-apps/api/event";
import { invoke } from '@tauri-apps/api';
import { ConfigService } from './config.service';
import { WorldAreaService } from './world-area.service';

class StateEvent {
  Visible?: any;
  Interactable?: any;
  Hidden?: any;
}

@Injectable({
  providedIn: 'root'
})
export class OverlayService {
  interactable: boolean = false;
  isBinding: boolean = false;
  visible: boolean = false;


  constructor(private shortcuts: ShortcutService, private events: EventsService, private configService: ConfigService) {
    this.shortcuts.register(this.configService.config.toggleOverlay, this.onToggleOverlay.bind(this));
    this.events.listen<StateEvent>("OverlayStateChange").subscribe(this.onOverlayStateChange.bind(this));
  }

  onOverlayStateChange(event: Event<StateEvent>) {
      this.interactable = event.payload.Interactable != null;
      if (event.payload.Hidden) {this.visible = false} else {this.visible = true};
    invoke("set_interactable", { interactable: true }).then();

  }

  onToggleOverlay() {
    if (this.interactable) {
      this.interactable = false;
    } else {
      this.interactable = true;
    }

    invoke("set_interactable", { interactable: this.interactable }).then();
  }

  onBindToggleOverlayFinish(keys: string[]) {
    this.isBinding = false;
    let chord = keys.reduce((acc, curr) => {
      if (acc === '') return curr;

      return acc.concat('+').concat(curr);
    }, '');

    this.shortcuts.rebind(chord, this.onToggleOverlay);
  }
}