import { makeAutoObservable, reaction } from "mobx";
import { Doc, DocListCast, FieldType } from "../../../../../fields/Doc";
import { Docs } from "../../../../documents/Documents";
import { Col } from "./DocCreatorMenu";
import { DynamicField } from "./FieldTypes/DynamicField";
import { Field, FieldSettings, FieldTree, ViewType } from "./FieldTypes/Field";
import {  } from "./FieldTypes/FieldUtils";
import { observer } from "mobx-react";
import { IDisposer } from "mobx-utils";
import { Width } from "../../../../../fields/DocSymbols";
import { TemplateLayouts } from "./TemplateBackend";

export class Template {

    mainField: DynamicField;
    private settings: FieldSettings;

    constructor(templateInfo: FieldSettings) {
        makeAutoObservable(this);
        this.settings = templateInfo;
        this.mainField = this.setupMainField(templateInfo);
    }

    get childFields(): Field[] { return this.mainField.getSubfields };
    get allFields(): Field[] { return this.mainField.getAllSubfields };
    get contentFields(): Field[] { return this.allFields.filter(field => field.isContentField) };
    get doc(){ return this.mainField.renderedDoc; };
    get title() { return this.mainField.getTitle() };

    cleanup = () => {
        //dispose each subfields disposers, etc.
    }

    cloneBase = async (): Promise<Template> => {
        const makeCloneFieldTree = async (field: Field): Promise<Field> => {
            const root: Field = await field.makeClone();
            field.getSubfields.forEach(async field => {
                const clone: Field = await makeCloneFieldTree(field);
                root.addField(clone);
            });
            return root;
        }

        const clone: Template = new Template(TemplateLayouts.BasicSettings);
        clone.mainField = await makeCloneFieldTree(this.mainField) as DynamicField;
        console.log('last init')
        clone.mainField.initializeDocument();
        clone.mainField.renderedDoc._width = this.mainField.renderedDoc._width;
        clone.mainField.renderedDoc._height = this.mainField.renderedDoc._height;
        return clone;
    }

    printFieldInfo = () => {
        this.allFields.forEach(field => {
            const doc = field.renderedDoc;
            console.log('title: ', field.getTitle(), ' width: ', doc.width);
        });
    }

    getRenderedDoc = () => {
        return this.doc;
    }

    getFieldByID = (id: number): Field => {
        return this.allFields.filter(field => field.getID === id)[0];
    }

    getFieldByTitle = (title: string) => {
        return this.allFields.filter(field => field.getTitle() === title)[0];
    }

    setupMainField = (templateInfo: FieldSettings) => {
        return new DynamicField(templateInfo, 1);
    }

    get descriptionSummary(): string {
        let summary: string = '';
        this.contentFields.forEach(field => {
            summary += `--- Field #${field.getID} (title: ${field.getTitle()}): ${field.getDescription ?? ''} ---`;
        });
        return summary;
    }

    get compiledContent(): string {
        let summary: string = '';
        this.contentFields.forEach(field => {
            summary += `--- Field #${field.getID} (title: ${field.getTitle()}): ${field.getContent() ?? ''} ---`;
        });
        return summary;
    }

    resetToBase = () => {
        this.allFields.forEach(field => {
            field.initializeDocument();
        })
    }

    isValidTemplate = (cols: Col[]) => {
        const matches: number[][] = this.getMatches(cols);
        const maxMatches: number = this.maxMatches(matches);
        console.log('title: ', this.mainField.getTitle(), ' matches: ', matches, ' max: ', maxMatches, ' num content fields: ', this.contentFields.length)
        return maxMatches === this.contentFields.length;
    }

    getMatches = (cols: Col[]): number[][] => {
        const numFields = this.contentFields.length;

        if (cols.length !== numFields) return [];

        const matches: number[][] = Array(numFields)
            .fill([])
            .map(() => []);

        this.contentFields.forEach((field, i) => {
            matches[i] = (field.matches(cols));
        });

        return matches;
    }

    maxMatches = (matches: number[][]) => {
        if (matches.length === 0) return 0;

        const fieldsCt = this.contentFields.length;
        const used: boolean[] = Array(fieldsCt).fill(false);
        const mt: number[] = Array(fieldsCt).fill(-1);

        const augmentingPath = (v: number): boolean => {
            if (used[v]) return false;
            used[v] = true;

            for (const to of matches[v]) {
                if (mt[to] === -1 || augmentingPath(mt[to])) {
                    mt[to] = v;
                    return true;
                }
            }
            return false;
        };

        for (let v = 0; v < fieldsCt; ++v) {
            used.fill(false);
            augmentingPath(v);
        }

        let count: number = 0;

        for (let i = 0; i < fieldsCt; ++i) {
            if (mt[i] !== -1) ++count;
        }

        return count;
    };

}