import { SMALL, MEDIUM, LARGE } from '../constants/sizes';
import { CLASSIC_LAYOUT, NEWSLETTER_SOCIAL_LAYOUT, BOTTOM_BAR_LAYOUT, FEATURE_BAR_LAYOUT, FOOTER_PADDING_SMALL, FOOTER_PADDING_LARGE, FOOTER_PADDING_MEDIUM } from '../constants/components/footer';
import { darken } from './colorHelper';

const getFooterPadding = (size = MEDIUM) => {
    let padding;

    switch (size) {
        case SMALL.value:
            padding = FOOTER_PADDING_SMALL;
            break;
        case LARGE.value:
            padding = FOOTER_PADDING_LARGE;
            break;
        default:
            padding = FOOTER_PADDING_MEDIUM;
            break;
    }

    return padding;
};

const getDefaultTextColor = (layout = CLASSIC_LAYOUT) => {
    let textColor;

    switch (layout) {
        case CLASSIC_LAYOUT:
            textColor = '#474747';
            break;
        default:
            textColor = '#fff';
            break;
    }

    return textColor;
};

const getDefaultBgColor = layout => {
    let bgColor;

    switch (layout) {
        case NEWSLETTER_SOCIAL_LAYOUT:
        case BOTTOM_BAR_LAYOUT:
        case FEATURE_BAR_LAYOUT:
            bgColor = '#5F5F5F';
            break;
        default:
            bgColor = '#EAEAEA';
            break;
    }

    return bgColor;
};

const getSocialIconColor = (layout, footerText, footerBottomTextColor) => {
    let color;

    switch (layout) {
        case BOTTOM_BAR_LAYOUT:
        case FEATURE_BAR_LAYOUT:
            color = footerBottomTextColor;
            break;
        default:
            color = footerText;
            break;
    }

    return color;
};

export const getComponentVariables = ({
    size,
    layout,
    logoSize,
    footerText: settingFooterText,
    footerBackground: settingFooterBackground,
    bottomBarText,
    bottomBarBackground,
    socialIconColor: settingSocialIconColor,
    navSeparatorColor,
    featureBarBackground,
    featureBarText
}) => {
    const footerBackground = settingFooterBackground || getDefaultBgColor(layout);
    const footerText = settingFooterText || getDefaultTextColor(layout);
    const footerBottomTextColor = bottomBarText || footerText;
    const socialIconColor = settingSocialIconColor || getSocialIconColor(layout, footerText, footerBottomTextColor);

    return {
        'footer-padding': size && `${getFooterPadding(size)}px`,
        'footer-logo-width': logoSize && `${logoSize}px`,
        'footer-text-color': footerText,
        'footer-bg-color': footerBackground,
        'footer-bottom-text-color': footerBottomTextColor,
        'footer-bottom-bg-color': bottomBarBackground || darken(footerBackground, 0.25),
        'footer-nav-separator-color': navSeparatorColor,
        'footer-social-icon-color': socialIconColor,
        'footer-feature-bar-background': featureBarBackground,
        'footer-feature-bar-text': featureBarText
    };
};

export const getSocialIconsWithLink = socials => Boolean(socials && socials.length) && socials.filter(item => item.url);

export const hasLogo = logo => Boolean(logo);
export const hasNavigation = nav => Boolean(nav && nav.items && nav.items.length);
export const hasMenu = menu => Boolean(menu && menu.items && menu.items.length);
export const hasSocialNetworks = socials => Boolean(socials && socials.items && socials.items.length);
export const hasFeatures = features => Boolean(features && features.items && features.items.length);
export const hasLanguageSwitch = locale => Boolean(locale && locale.available && locale.available.length);
export const hasNavigationBar = (nav, locale) => hasNavigation(nav) || hasLanguageSwitch(locale);
