import { t } from 'Framework/i18n';
import { showConfirm } from '../Confirm/Actions';
import { setPreviousEditedDesignAreaIdentier } from '../DesignArea/Actions';
import { getSelectedDesignArea } from '../DesignArea/Selectors';
import { getDesignData } from './Reducer';
import { getConfigurator } from '../Configurator/Selectors';

export const actionTypes = {
    SET_CANVAS_DATA: 'DesignData/SET_CANVAS_DATA',
    SET_DESIGN_PRODUCTION_METHOD: 'DesignData/SET_DESIGN_PRODUCTION_METHOD',
    SET_COLOR_AMOUNT: 'DesignData/SET_COLOR_AMOUNT',
    SET_INITIAL_DESIGN_DATA: 'DesignData/SET_INITIAL_DESIGN_DATA',
    UPDATE_IMAGE_DATA: 'DesignData/UPDATE_IMAGE_DATA',
    SET_DESIGN_AREA_TEXTS_COLOR: 'DesignData/SET_DESIGN_AREA_TEXTS_COLOR',
    REPLACE_DESIGN_AREA_TEXTS_COLOR: 'DesignData/REPLACE_DESIGN_AREA_TEXTS_COLOR',
    SET_CANVAS_DATA_MAP: 'DesignData/SET_CANVAS_DATA_MAP',
};

export const createDesignDataAction = actionObject => (dispatch, getState) => {
    const {
        designArea: {
            selectedDesignArea: { identifier: designAreaIdentifier },
        },
    } = getState();
    // skip if no designAreaIdentifier
    if (designAreaIdentifier) {
        return dispatch({
            ...actionObject,
            designAreaIdentifier,
        });
    }
};

export const setCanvasData = (canvasData, targetDesignAreaIdentifier) => (dispatch, getState) => {
    const {
        designArea: { selectedDesignArea },
    } = getState();
    const designAreaIdentifier = targetDesignAreaIdentifier || selectedDesignArea.identifier;
    // skip if no designAreaIdentifier
    if (designAreaIdentifier) {
        dispatch(setPreviousEditedDesignAreaIdentier(designAreaIdentifier));
        return dispatch({
            type: actionTypes.SET_CANVAS_DATA,
            canvasData,
            designAreaIdentifier,
        });
    }
};

export const setDesignProductionMethod = designProductionMethodIdentifier =>
    createDesignDataAction({
        type: actionTypes.SET_DESIGN_PRODUCTION_METHOD,
        designProductionMethodIdentifier,
    });

export const updateImageData = (imageData, originalImageIdentifier = '') => (dispatch, getState) => {
    const designAreaIdentifier = getSelectedDesignArea(getState()).identifier;
    return dispatch({
        type: actionTypes.UPDATE_IMAGE_DATA,
        imageData,
        designAreaIdentifier,
        originalImageIdentifier,
    });
};

export const setColorAmount = colorAmount =>
    createDesignDataAction({
        type: actionTypes.SET_COLOR_AMOUNT,
        colorAmount,
    });

export const setInitialDesignData = initialDesignData => ({
    type: actionTypes.SET_INITIAL_DESIGN_DATA,
    initialDesignData,
});

export const showSwitchToProductionMethodWithVectorization = () =>
    showConfirm(
        t('designProductionMethodSwitch.toVectorization.message'),
        t('designProductionMethodSwitch.toVectorization.ok'),
        t('designProductionMethodSwitch.toVectorization.cancel')
    );

export const showSwitchToProductionMethodWithoutVectorization = () =>
    showConfirm(
        t('designProductionMethodSwitch.fromVectorization.message'),
        t('designProductionMethodSwitch.fromVectorization.ok'),
        t('designProductionMethodSwitch.fromVectorization.cancel')
    );

export const showColorUsageConfirm = (colorCount, maxColorCount) =>
    showConfirm(
        t('colorAmountAlert.colorChange', {
            colorAmount: colorCount,
            maxColorAmount: maxColorCount,
        }),
        t('colorAmountAlert.colorChangeOk', { colorAmount: colorCount }),
        t('colorAmountAlert.colorChangeCancel', { colorAmount: maxColorCount })
    );

export const showMaxColorChangeConfirm = (colorCount, maxColorCount, currentColorCount) =>
    showConfirm(
        t('colorAmountAlert.maxColorChange', {
            colorAmount: colorCount,
            maxColorAmount: maxColorCount,
        }),
        t('colorAmountAlert.maxColorChangeOk', { colorAmount: maxColorCount }),
        t('colorAmountAlert.maxColorChangeCancel', { colorAmount: currentColorCount })
    );

export const showMinFontSizeConfirm = fontSizeMin =>
    showConfirm(
        t('minFontSizeWarning.message', { fontSizeMin }),
        t('minFontSizeWarning.okButtonLabel'),
        t('minFontSizeWarning.cancelButtonLabel')
    );

export const showProductionMethodRemoveImagesConfirm = () =>
    showConfirm(
        t('colorAmountAlert.productionMethodRemoveImagesWarning.message'),
        t('colorAmountAlert.productionMethodRemoveImagesWarning.okButtonLabel'),
        t('colorAmountAlert.productionMethodRemoveImagesWarning.cancelButtonLabel')
    );

export const showProductionMethodChangeColorsConfirm = () =>
    showConfirm(
        t('colorAmountAlert.productionMethodChangeColorsWarning.message'),
        t('colorAmountAlert.productionMethodChangeColorsWarning.okButtonLabel'),
        t('colorAmountAlert.productionMethodChangeColorsWarning.cancelButtonLabel')
    );

export const showProductionMethodChangeConfirm = () =>
    showConfirm(
        t('designProductionChangeAlert.message'),
        t('designProductionChangeAlert.okButtonLabel'),
        t('designProductionChangeAlert.cancelButtonLabel')
    );

export const setDesignAreaTextsColor = (identifier, color) => ({
    type: actionTypes.SET_DESIGN_AREA_TEXTS_COLOR,
    identifier,
    color,
});

export const replaceDesignAreaTextsColor = (identifier, oldColorData, oldValue, colorData, value) => ({
    type: actionTypes.REPLACE_DESIGN_AREA_TEXTS_COLOR,
    identifier,
    oldColorData,
    oldValue,
    colorData,
    value,
});

export const updateLinkedImagesWithImageData = (imageIdentifier, imageData) => (dispatch, getState) => {
    const designData = getDesignData(getConfigurator(getState()));
    const canvasDataMap = {};
    Object.keys(designData)
        .filter(designAreaIdentifier => {
            const { canvasData } = designData[designAreaIdentifier];
            return canvasData && canvasData.objects && canvasData.objects.length > 0;
        })
        .forEach(designAreaIdentifier => {
            const { canvasData } = designData[designAreaIdentifier];
            const { objects } = canvasData;

            canvasDataMap[designAreaIdentifier] = {
                ...canvasData,
                objects:
                    objects &&
                    objects.map(object => {
                        if (object.type === 'Image' && object.imageData.identifier === imageIdentifier) {
                            return {
                                ...object,
                                imageData,
                            };
                        }
                        return object;
                    }),
            };
        });
    dispatch({
        type: actionTypes.SET_CANVAS_DATA_MAP,
        canvasDataMap,
    });
};
