import { Component, OnInit, ViewChild } from '@angular/core';
import { NgBlocklyComponent, NgBlocklyConfig, NgBlocklyGeneratorConfig, NgToolboxBuilderService, CustomBlock, Category, LOGIC_CATEGORY, LOOP_CATEGORY, MATH_CATEGORY, TEXT_CATEGORY, Separator, LISTS_CATEGORY, COLOUR_CATEGORY, VARIABLES_CATEGORY, FUNCTIONS_CATEGORY } from '@ng-blockly/blockly';

@Component({
  selector: '<%= prefix %>-welcome',
  templateUrl: './welcome.component.html',
  styleUrls: ['./welcome.component.<%= style %>']
})
export class WelcomeComponent implements OnInit {
  public customBlocks: CustomBlock[] = [];
  @ViewChild(NgBlocklyComponent, { static: true }) workspace: NgBlocklyComponent;
  public config: NgBlocklyConfig = {
    scrollbars: true, // 工作区域可滚动
    trashcan: true, // 显示或隐藏垃圾桶
    media: '/assets/blockly/media/', // blockly媒体路径---默认路径访问不到，需要翻墙
  };

  public generatorConfig: NgBlocklyGeneratorConfig = {
    dart: true,
    javascript: true,
    lua: true,
    php: true,
    python: true,
    xml: true
  };

  constructor(ngToolboxBuilder: NgToolboxBuilderService) {
    ngToolboxBuilder.nodes = [
      new Category(this.customBlocks, '#FF00FF', 'Test', null),
        LOGIC_CATEGORY,
        LOOP_CATEGORY,
        MATH_CATEGORY,
        TEXT_CATEGORY,
        new Separator(), // Add Separator
        LISTS_CATEGORY,
        COLOUR_CATEGORY,
        VARIABLES_CATEGORY,
        FUNCTIONS_CATEGORY
      ];
      this.config.toolbox = ngToolboxBuilder.build();
  }
  ngOnInit() {}

  onCode(code: string) {
    console.log(code);
  }

}