import { Component, OnInit, ViewChild } from '@angular/core';
import { CupboardService } from '../../services/cupboard.service';
import { UsersService } from '../../services/users.service';
import { Need, GoalType } from '../../models/Need';
import { userType } from '../../models/User'; 

@Component({
  selector: 'app-cupboard',
  standalone: false,
  templateUrl: './cupboard.component.html',
  styleUrl: './cupboard.component.css'
})

export class CupboardComponent implements OnInit {
needs: any;
    constructor(private cupboardService: CupboardService, private usersService: UsersService) { }
    
    ngOnInit(): void {
      this.cupboardService.getNeeds().subscribe(n => this.needs = n);
      this.close();
      this.openmenu();

      if (this.isManager()) {
        console.log("Admin view of Cupboard");
      } else {
        console.log("Limited helper view of Cupboard");
      }
    }

    selectedNeed: any = {
      name: '',
      id: null,
      maxGoal: null,
      type: ''
    };
    selectedNeedId: number | null = null;
  
    private hideElement(element: any) {
      if (element){
        element.style.visibility = 'hidden';
        element.style.position = 'absolute';
      }
    }

    private showElement(element: any) {
      if (element){
        element.style.visibility = 'visible';
        element.style.position = 'relative';
      }
    }

    openmenu() {
      const menuElement = document.getElementById('menu');
      this.showElement(menuElement);
    }
    
    opencreate() {
      this.close();
      this.showElement(document.getElementById('create-form'));
    }

    openupdate() {
      this.close();
      this.showElement(document.getElementById('update-form'));
    }

    back() {
      this.close();
      this.openmenu();
    }
    
    close() {
      this.hideElement(document.getElementById('create-form'));
      this.hideElement(document.getElementById('destroy-form'));
      this.hideElement(document.getElementById('menu'));
      this.hideElement(document.getElementById('update-form'));
    }

    populateForm(need: any): void {
      this.selectedNeed = { ...need };
    }

    isManager() {
      const type = this.usersService.getCurrentUser()?.type;
      return type === ("MANAGER" as unknown as userType);
    }

    update(form: any) {
      console.log(form);
      const need: Need = {
        name: form.name,
        id: 0, //system will control this
        maxGoal: form.maxGoal,
        type: GoalType[form.type as keyof typeof GoalType],
        filterAttributes: [],
        current: 0
      };
      console.log(need.id, need, "need updated");
      this.cupboardService.updateNeed(need.id, need).subscribe(
        (result) => {
          if (result) {
            console.log("need updated successfully");
            location.reload();
          } else {
            console.log("need update failed");
          }
        }

      );
    }

    submit(form: any) {
      const need: Need = {
        name: form.name,
        id: form.id,
        maxGoal: form.maxGoal,
        type: GoalType[form.type as keyof typeof GoalType],
        filterAttributes: [],
        current: 0
      };
      console.log("form submitted. creating need: ", need);
      this.cupboardService.createNeed(need).subscribe(
        (result) => {
          if (result) {
            console.log("need created successfully");
            location.reload();
          } else {
            console.log("need creation failed");
          }
        }

      );
    }

    destroy() {

    }
  }