import {
  EVENT_OPTION_SET,
} from './config.js';

export const optionsLayout = {
  pauseDuring: {
    creation: ['Pause While Creating', 'boolean', true],
    selection: ['Pause While Selecting', 'boolean', true],
  }, 
  display: {
    velocity: ['Velocity Vectors', 'boolean', true],
    acceleration: ['Accel. Vectors', 'boolean', true],
    traces: ['Path Traces', 'boolean', true],
    dashedTraces: ['Dashed Traces', 'boolean', false],
  },
  collision: {
    merge: ['Merge Masses<br>on Collision', 'boolean', true, {wide: true}],
  },
  param: {
    gravity: ['Gravity', 'number', 4E4],
    timeScale: ['Time Scale', 'number', 0.2],
    massCreationRate: ['Mass Creation Rate', 'number', 10],
  },
  debug: {
    objectsInfo: ['Objects Info', 'boolean', false],
    cursorInfo: ['Cursor Info', 'boolean', false],
    canvasSize: ['Canvas Size', 'boolean', false],
    currentMode: ['Current Mode', 'boolean', false],
    panningInfo: ['Panning Info', 'boolean', false],
  },
};

export class Options {
  sim = undefined;
  values = {};

  constructor(sim) {
    this.sim = sim;

    // Global methods to get/set current option values
    this.sim.getOption = (path) => this.getOption(path);
    this.sim.setOption = (path, value) => this.setOption(path, value);
    this.sim.onOptionSet = (path, cb) => this.onOptionSet(path, cb);
  }

  getOption(path) {
    const val = this.values[path];
    return val;
  }

  setOption(path, value) {
    this.values[path] = value;
    const e = new CustomEvent(EVENT_OPTION_SET, {detail: {path, value}});
    this.sim.div.dispatchEvent(e);
  }

  // cb: (value) => undefined
  onOptionSet(path, cb) {
    this.sim.div.addEventListener(EVENT_OPTION_SET, (e) => {
      if (path === e.detail.path) {
        cb(e.detail.value);
      }
    });
  }

  static getSection(layout, sectionName) {
    const section = layout[sectionName];
    const group = {
      type: 'group', 
      name: sectionName, 
      title: section._title,
      items: [],
    };
    for (const name in section) {
      if (name.startsWith('_')) continue;
      const [title, type, defaultValue, opts] = section[name];
      group.items.push({
        name,
        type,
        title,
        default: defaultValue,
        ...opts
      })
    }
    return group;
  }
}