import { Component, OnInit, ContentChild, AfterContentInit, ViewChild, AfterViewInit, Input, Output, EventEmitter } from '@angular/core';
import { ApiService as ApiService } from '../../services/login-api';
import { FrontcraftItemSelectComponent } from './itemselector.component';
import { NbWindowService, NbWindowRef, NbToastrService, NbDialogService, NbDialogRef } from '@nebular/theme';
import { Item, Character, SRToken, Signup } from '../../../../../../backend/Types/Types';
import { getClassColor } from '../../../../../../backend/Types/PlayerSpecs';
import { _Tiers, allItems } from '../../../../../../backend/Types/Items';

@Component({
  selector: 'shop',
  templateUrl: './shop.component.html',
})
export class FrontcraftShopComponent{

    @Input() character: Character
    @Input() signup: Signup

    @Input() tier = _Tiers[0]
    @Output() onSelect = new EventEmitter<Item>()
    allItems = allItems

    constructor(
      private api: ApiService,
      private dialogService : NbDialogService
    ){}
}

@Component({
  selector: 'buyToken',
  template: `
  <nb-card class="col-12 col-xl-9">
    <nb-card-header>
      Buy {{item.itemname}}
    </nb-card-header>
    <nb-card-body>
      <p>
        You currently have {{currency}} softreserve currency
      </p>  
      <div *ngIf="currency>0">
        <div *ngFor="let kv of modifier | keyvalue">
          <button
              (click)="buyToken(kv.key)"
              [disabled]="currency<=0"
              nbButton 
              outline 
              status="success" 
              size="tiny">
              buy
          </button>
          {{kv.key}} <span *ngIf="kv.value>0">(<b>+{{kv.value}}</b> from priorities)</span>
        </div>
        <div *ngFor="let token of ownedtokens">
          <button
              (click)="buyToken(token.charactername)"
              nbButton 
              outline 
              status="success" 
              size="tiny">
              buy
          </button>
          {{token.charactername}} [ {{token.level}} ] => [ {{token.level+1}} ]
        </div>
      </div>
    </nb-card-body>
</nb-card>
  
  `,
})
export class FrontcraftBuyTokenComponent implements OnInit{

  item : Item
  characters: Character[]
  modifier = {}
  currency: number = 0
  ownedtokens: SRToken[] = []

  constructor(
    private toastr: NbToastrService,
    protected dialogRef: NbDialogRef<FrontcraftBuyTokenComponent>,
    private api : ApiService
  ){}

  ngOnInit(): void {
      const usr = this.api.getCurrentUser()
      this.api.get('CharacterManager')
      .getCharactersOfUser(usr.username)
      .then(chars => {
          chars.forEach(char => {
              char['color'] = getClassColor(char.class)
              this.api.get('ItemManager').getToken(char, this.item).then(token => {
                if(token) this.ownedtokens.push(token)
                else{
                  this.api.get('ItemManager').calculatePriorities(this.item.itemname, char).then(modifier => {
                    this.modifier[char.charactername] = modifier
                  })
                }
              })
          })
          this.characters = chars
      })
      this.api.get('UserManager').getUser(usr.username).then(u => {
        if(!u) return
        this.currency = u.currency
      })
  }

  buyToken = async (charactername:string) => {

    const src = this.api.get('ItemManager')
    const token = await src.buyToken(this.api.getAuth().token.value, charactername, this.item.itemname)
    

    if(token){
      this.toastr.show(token.characterid+' now has a token for '+token.itemname+' of level '+token.level, 'Yay', {status: 'success'})
    }else{
      this.toastr.show('Error (something went wrong)', 'Oh no', {status: 'danger'})
    }
    this.dialogRef.close()
  }
}