// Define the type for the element being added
interface Element {
    id: string;
    type: string;
    name: string;
    opacity: number;
    visible: boolean;
    selectable: boolean;
    removable: boolean;
    alwaysOnTop: boolean;
    showInExport: boolean;
    x: number;
    y: number;
    width: number;
    height: number;
    rotation: number;
    animations?: any[];
    draggable?: boolean;
    resizable?: boolean;
    contentEditable: boolean;
    styleEditable: boolean;
    text: string;
    fontSize: number;
    fontFamily: string;
    fontStyle: string;
    fontWeight: string;
    fill: string;
    align: string;
    verticalAlign: string;
    lineHeight: number;
    letterSpacing: number;
    backgroundEnabled?: boolean;
    backgroundColor?: string;
    backgroundOpacity?: number;
    backgroundCornerRadius?: number;
    backgroundPadding?: number;
}

// Define the type for the page
interface Page {
    addElement: (element: Element) => void;
}

// Define the type for the store
interface Store {
    pages: Page[];
    history: {
        clear: () => void;
    };
}

// Reusable function to create text elements
const createTextElement = (
    id: string,
    text: string,
    x: number,
    y: number,
    width: number
): Element => ({
    id,
    type: "text",
    name: "",
    opacity: 1,
    visible: true,
    selectable: false,
    removable: false,
    alwaysOnTop: true,
    showInExport: true,
    x,
    y,
    width,
    height: 11,
    rotation: 0,
    draggable: true,
    resizable: true,
    contentEditable: true,
    styleEditable: false,
    text,
    fontSize: 7,
    fontFamily: "Roboto",
    fontStyle: "normal",
    fontWeight: "normal",
    fill: "grey",
    align: "center",
    verticalAlign: "top",
    lineHeight: 1.2,
    letterSpacing: 0,
});


export const addIdentifierAreaTo4x6PostCard = (store: Store): void => {
    const page = store.pages[1];

    const elements: Element[] = [
        createTextElement("cont-id-placeholder", "C:", 401, 356, 11),
        createTextElement("contId", "0000001", 408, 356, 30),
        createTextElement("sequence-id-placeholder", "| S:", 436, 356, 12),
        createTextElement("sequence", "0000001", 446, 356, 29),
        createTextElement("template-id-placeholder", "| T:", 473, 356, 14),
        createTextElement("templateId", "0001034", 485, 356, 29),
        createTextElement("order-id-placeholder", "| O:", 514, 356, 11),
        createTextElement("orderId", "0000127", 525, 356, 29),
    ];

    elements.forEach(element => page.addElement(element));
    store.history.clear();
};


export const addIdentifierAreaTo6x9PostCard = (store: Store): void => {
    const page = store.pages[1];

    const elements: Element[] = [
        createTextElement("cont-id-placeholder", "C:", 680, 539, 11),
        createTextElement("contId", "0000001", 689, 539, 30),
        createTextElement("sequence-id-placeholder", "| S:", 717, 539, 12),
        createTextElement("sequence", "0000001", 727, 539, 29),
        createTextElement("template-id-placeholder", "| T:", 753, 539, 14),
        createTextElement("templateId", "0001034", 764, 539, 29),
        createTextElement("order-id-placeholder", "| O:", 793, 539, 11),
        createTextElement("orderId", "0000127", 804, 539, 29),
    ];

    elements.forEach(element => page.addElement(element));
    store.history.clear();
};

export const addIdentifierAreaTo6x11PostCard = (store: Store): void => {
    const page = store.pages[1];

    const elements: Element[] = [
        createTextElement("cont-id-placeholder", "C:", 875, 540, 11),
        createTextElement("contId", "0000001", 882, 540, 30),
        createTextElement("sequence-id-placeholder", "| S:", 910, 540, 12),
        createTextElement("sequence", "0000001", 920, 540, 29),
        createTextElement("template-id-placeholder", "| T:", 946, 540, 14),
        createTextElement("templateId", "0001034", 958, 540, 29),
        createTextElement("order-id-placeholder", "| O:", 987, 540, 11),
        createTextElement("orderId", "0000127", 998, 540, 29),
    ];

    elements.forEach(element => page.addElement(element));
    store.history.clear();
};


export const addIdentifierAreaTo12x9PostCard = (store: Store): void => {
    const page = store.pages[1];

    const elements: Element[] = [
        createTextElement("cont-id-placeholder", "C:", 560, 205, 11),
        createTextElement("contId", "0000001", 570, 205, 30),
        createTextElement("sequence-id-placeholder", "| S:", 597, 205, 12),
        createTextElement("sequence", "0000001", 607, 205, 29),
        createTextElement("template-id-placeholder", "| T:", 634, 205, 14),
        createTextElement("templateId", "0001034", 645, 205, 29),
        createTextElement("order-id-placeholder", "| O:", 674, 205, 11),
        createTextElement("orderId", "0000127", 685, 205, 29),
    ];

    elements.forEach(element => page.addElement(element));
    store.history.clear();
};