import { Component } from '@angular/core';
import { DataService } from 'src/services/data/data.service';
import { Editor } from 'ngx-editor';

@Component({
  selector: 'story',
  templateUrl: './story.component.html',
  styleUrl: './story.component.scss',
})
export class StoryComponent {
  public characterData: any;
  public editBackgroundStory: string = '';
  public editMode: boolean = false;

  editor: Editor = new Editor();
  html = '';
  toolbar: any = [
    // default value
    ['bold', 'italic'],
    ['bullet_list'],
    [{ heading: ['h3', 'h4', 'h5', 'h6'] }],
  ];

  constructor(private dataAccessor: DataService) {}

  ngOnInit() {
    this.characterData = this.dataAccessor.characterData;
  }

  update() {
    this.characterData.backgroundStory = this.editBackgroundStory;
    this.dataAccessor.characterData = this.characterData;
    this.editBackgroundStory = '';
    this.editMode = false;
  }

  cancel() {
    this.editBackgroundStory = this.characterData.backgroundStory;
    this.editMode = false;
  }

  edit() {
    this.editBackgroundStory = this.characterData.backgroundStory;
    this.editMode = true;
  }
}
