import * as DG from 'datagrok-api/dg';
import * as ui from 'datagrok-api/ui';
import * as grok from 'datagrok-api/grok';
import { Subject, Subscription } from 'rxjs';
// @ts-ignore
import '../css/style.css';

let chemDrawId = 1;

export const _package = new DG.Package();
export let _properties: { [key: string]: any };

const INIT_TIMEOUT_MS = 30000;

//tags: init
export async function initChemDraw() {
  _properties = _package.settings;
}

//name: ChemDraw
//tags: moleculeSketcher
//output: widget sketcher
export function chemDrawSketcher() {
  return new ChemDrawSketcher();
}

class ChemDrawSketcher extends grok.chem.SketcherBase {
  initialized = new Subject<boolean>();
  _smiles: string | null = null;
  _molV2000: string | null = null;
  _molV3000: string | null = null;
  _smarts: string | null = null;
  _sketcher: any = null;
  _importing = false;
  private _initSub: Subscription | null = null;
  private _styleEl: HTMLStyleElement | null = null;

  async init(host: any) {
    if (!_properties.LicensePath) {
      this.root.append(ui.divText(`Licence is not available`, 'license-not-available'));
      return;
    }

    const sketchId = `chemdraw-${chemDrawId++}`;
    const div = ui.div();
    div.id = `chemdrawjs-container-${sketchId}`;
    // Raise ChemDrawJS toolbar pop-overs above the hosting Datagrok dialog/popup;
    // without this they render *behind* the dialog they're embedded in. The injected
    // <style> is per-instance and removed in detach().
    const closestDlg = host.root.closest('.d4-dialog') as HTMLElement | null;
    const closestPopup = host.root.closest('.d4-popup-host') as HTMLElement | null;
    const baseZ = closestDlg
      ? parseInt(closestDlg.style.zIndex, 10)
      : closestPopup
        ? parseInt(getComputedStyle(closestPopup).zIndex, 10)
        : NaN;
    if (Number.isFinite(baseZ)) {
      this._styleEl = document.createElement('style');
      this._styleEl.innerHTML = `.cdd.cdd-toolbar-popup-container { z-index: ${baseZ + 1} !important; }`;
      document.head.appendChild(this._styleEl);
    }

    const waitForInit = new Promise<void>((resolve) => {
      this._initSub = this.initialized.subscribe(() => resolve());
    });
    let timer: ReturnType<typeof setTimeout> | undefined;
    const timeout = new Promise<void>((_, reject) => {
      timer = setTimeout(() => reject(new Error('ChemDraw init timed out')), INIT_TIMEOUT_MS);
    });

    const onAttached: (chemdraw: any) => void = (chemdraw) => {
      this._sketcher = chemdraw;
      this._sketcher.setContentChangedHandler(() => { this.moleculeChangeHandler(); });
      this.initialized.next(true);
    };

    //@ts-ignore
    perkinelmer.ChemdrawWebManager.attach({
      element: div,
      callback: onAttached,
      licenseUrl: _properties.LicensePath
    });
    this.root.appendChild(div);
    this.host = host;
    ui.setUpdateIndicator(this.root, true, 'Initializing ChemDraw sketcher');
    try {
      await Promise.race([waitForInit, timeout]);
    } finally {
      clearTimeout(timer);
      ui.setUpdateIndicator(this.root, false);
    }
    if (!this.host?.resized)
      div.style.height = '400px';
  }

  get supportedExportFormats() {
    return ["smiles", "mol"];
  }

  get width(): number {
    return 800;
  }

  get height(): number {
    return 400;
  }

  get smiles(): string {
    if (this.explicitMol?.notation === 'smiles')
      return this.explicitMol.value;
    return this.convertFrom(DG.chem.Notation.Smiles);
  }

  set smiles(smiles: string) {
    this._smiles = smiles;
    this._molV2000 = null;
    this._molV3000 = null;
    this._smarts = null;
    this.explicitMol = {notation: 'smiles', value: smiles};
    this._importing = true;
    this._sketcher?.loadSMILES(smiles, () => { this.moleculeChangeHandler(); });
  }

  get molFile(): string {
    if (this.explicitMol?.notation === 'molblock')
      return this.explicitMol.value;
    return this.convertFrom(DG.chem.Notation.MolBlock);
  }

  set molFile(molfile: string) {
    this._molV2000 = molfile;
    this._molV3000 = null;
    this._smiles = null;
    this._smarts = null;
    this.explicitMol = {notation: 'molblock', value: molfile};
    this._importing = true;
    this._sketcher?.loadMOL(molfile, () => { this.moleculeChangeHandler(); });
  }

  get molV3000(): string {
    if (this.explicitMol?.notation === 'molblockV3000')
      return this.explicitMol.value;
    return this.convertFrom(DG.chem.Notation.V3KMolBlock);
  }

  set molV3000(molfile: string) {
    this._molV3000 = molfile;
    this._molV2000 = null;
    this._smiles = null;
    this._smarts = null;
    this.explicitMol = {notation: 'molblockV3000', value: molfile};
    this._importing = true;
    this._sketcher?.loadMOL(molfile, () => { this.moleculeChangeHandler(); });
  }

  get isInitialized() {
    return this._sketcher !== null;
  }

  async getSmarts(): Promise<string> {
    return new Promise<string>((resolve, reject) => {
      this._sketcher?.getMOL((res: any) => {
        try {
          resolve(DG.chem.convert(res, DG.chem.Notation.MolBlock, DG.chem.Notation.Smarts));
        } catch (error) {
          reject(error);
        }
      });
    });
  }

  set smarts(smarts: string) {
    this._smarts = smarts;
    this._smiles = null;
    this._molV2000 = null;
    this._molV3000 = null;
    //@ts-ignore
    this.explicitMol = s === '' ? null : {notation: 'smarts', value: s};
    this.convertAndSetSmarts(smarts);
  }

  detach() {
    this._initSub?.unsubscribe();
    this._initSub = null;
    this._styleEl?.remove();
    this._styleEl = null;
    super.detach();
  }

  private convertAndSetSmarts(s: string) {
    const molfile = DG.chem.convert(s, DG.chem.Notation.Smarts, DG.chem.Notation.MolBlock);
    this._sketcher?.loadMOL(molfile, this.moleculeChangeHandler());
  }

  private convertFrom(target: DG.chem.Notation): string {
    if (target === DG.chem.Notation.Smiles && this._smiles !== null) return this._smiles;
    if (target === DG.chem.Notation.MolBlock && this._molV2000 !== null) return this._molV2000;
    if (target === DG.chem.Notation.V3KMolBlock && this._molV3000 !== null) return this._molV3000;
    if (this._molV2000 !== null) return DG.chem.convert(this._molV2000, DG.chem.Notation.MolBlock, target);
    if (this._molV3000 !== null) return DG.chem.convert(this._molV3000, DG.chem.Notation.V3KMolBlock, target);
    if (this._smiles !== null) return DG.chem.convert(this._smiles, DG.chem.Notation.Smiles, target);
    if (this._smarts !== null) {
      if (target === DG.chem.Notation.Smiles) {
        DG.chem.smilesFromSmartsWarning();
        return '';
      }
      return DG.chem.convert(this._smarts, DG.chem.Notation.Smarts, target);
    }
    return '';
  }

  private moleculeChangeHandler(): void {
    if (this._importing)
      this._importing = false;
    else if (this._smiles !== null || this._molV2000 !== null || this._molV3000 !== null || this._smarts !== null)
      this.explicitMol = null;
    this._sketcher?.getSMILES((smi: any) => {
      this._smiles = smi;
      this._sketcher?.getMOL((mol: any) => {
        this._molV2000 = mol;
        this._sketcher?.getMOLV3000((molV3: any) => {
          this._molV3000 = molV3;
          this.onChanged.next(null);
        });
      });
    });
  }
}