import Diagram from 'diagram-js';
import ConnectModule from 'diagram-js/lib/features/connect';
import ContextPadModule from 'diagram-js/lib/features/context-pad';
import CreateModule from 'diagram-js/lib/features/create';
import LassoToolModule from 'diagram-js/lib/features/lasso-tool';
import ModelingModule from 'diagram-js/lib/features/modeling';
import MoveCanvasModule from 'diagram-js/lib/navigation/movecanvas';
import MoveModule from 'diagram-js/lib/features/move';
import OutlineModule from 'diagram-js/lib/features/outline';
import PaletteModule from 'diagram-js/lib/features/palette';
import ResizeModule from 'diagram-js/lib/features/resize';
import RulesModule from 'diagram-js/lib/features/rules';
import SelectionModule from 'diagram-js/lib/features/selection';
import GlobalConnectModule from 'diagram-js/lib/features/global-connect';
import ZoomScrollModule from 'diagram-js/lib/navigation/zoomscroll';
import BendpointMoveModule from 'diagram-js/lib/features/bendpoints';
import StyleModule from './StyleModule.ts';
import ManhattanConnectionModule from './ManhattanConnectionModule.ts';
import CustomPaletteModule from './CustomPaletteModule.ts';
import CustomGlobalConnectRulesModule from './CustomGlobalConnectRulesModule.ts';
import CustomShapeRendererModule from './CustomShapeRendererModule.ts';
import CustomOutlineModule from './CustomOutlineModule.ts';

interface EditorOptions {
  container: HTMLElement;
  additionalModules?: Array<any>;
}

export default function Editor(options: EditorOptions): Diagram {
  const { container } = options;

  const modules = [
      BendpointMoveModule
    , ConnectModule
    , ContextPadModule
    , CreateModule
    , GlobalConnectModule
    , LassoToolModule
    , ModelingModule
    , MoveCanvasModule
    , MoveModule
    //, OutlineModule
    , PaletteModule
    //, ResizeModule
    , RulesModule
    , SelectionModule
    , ZoomScrollModule
    , StyleModule
    , ManhattanConnectionModule
    , CustomPaletteModule
    , CustomGlobalConnectRulesModule
    , CustomShapeRendererModule
    , CustomOutlineModule
  ];


  console.log(container);
  return new Diagram({
    canvas: {
      container
    },
    modules: modules
  });
}