import { TEXTAREA, SLIDER, DROPDOWN, COLORPICKER, RADIO, IMAGE_UPLOADER, TOGGLE,
    TOGGLE_CHECK, INPUT, LOGO, GROUP_HEADER } from '../../schemaComponentTypes';
import { NAVIGATION_TEXT_ALIGN, NAVIGATION_TEXT_SIZE, DEFAULT_TEXT_COLOR,
    LOGO_TARGET_TYPES, LOGO_TARGET_CUSTOM_URL, LOGO_TARGET_HOMEPAGE,
    SEARCH_BAR_IN_HOME_BAR } from '../header';
import { searchBarSchemaForm } from './search-bar';
import { MEDIUM } from '../../sizes';
import { NO_LOGO } from '../../logo';
import { CENTER, LEFT, RIGHT } from '../../alignment';

export const headerHomeBarDefaultSettings = {
    logoHeight: 50,
    logoTheme: NO_LOGO,
    homeBarPadding: 10,
    homeBarLinkSpacing: 20,
    displayCart: true,
    displayLoginLink: true,
    displayRegistrationLink: false,
    homeBarTextSize: MEDIUM.value,
    homeBarTextColor: DEFAULT_TEXT_COLOR,
    homeBarTextHoverColor: undefined,
    homeBarTextActiveColor: undefined,
    homeBarTextAlignment: LEFT.value,
    homeBarBorderColor: undefined,
    homeBarBackgroundColor: undefined,
    homeBarMenuItems: [],
    logoTargetType: LOGO_TARGET_HOMEPAGE.value,
    logoTargetCustomUrl: '',
    searchBarLocation: SEARCH_BAR_IN_HOME_BAR.value,
    searchBackgroundColor: undefined,
    searchIconColor: undefined,
    searchButtonColor: undefined,
    searchBorderColor: undefined,
    searchBarMaxWidth: 650,
    searchBorderVisible: false,
    searchCornerRadius: 3,
    searchPlaceholder: 'Search',
    nav: {}
};

export const headerHomeBarDefaultData = {
    toggleHeaderScrimFunction: () => {},
    logo: null,
    listingEndpoint: '/',
    baseUrl: '/',
    user: {
        isLoggedIn: false,
        companyOnlyAdminsCanBuy: false
    },
    marketplaceName: null,
    searchBar: {},
    i18n: {
        Home: 'Home',
        'sign.in': 'Log In',
        'sign.up': 'Sign Up',
        profile: 'Profile',
        account: 'Account',
        company: 'Company',
        settings: 'Settings',
        logout: 'Logout',
        header: {
            homeBarLabel: 'Home Bar',
            quickLinksLabel: 'Quick Links'
        },
        cart: {
            cart: 'Cart'
        },
        mobileMenu: 'Main menu',
        companySwitcher: 'SWITCH COMPANIES',
        currentCompany: 'CURRENT COMPANY'
    },
    categories: [],
    locale: {
        code: 'en_US'
    },
    channelSettings: {
        identityProvider: false
    }
};

export const headerNavigationBarDefaultData = {
    searchBar: {
        placeholder: '',
        label: ''
    },
    config: {},
    categories: []
};

export const headerNavigationBarSchemaForm = {
    navBarPadding: {
        title: 'uieditor.sfbComponent.header.navigationBar.padding.title',
        type: SLIDER,
        caption: 'uieditor.sfbComponent.header.navigationBar.padding.caption',
        defaultValue: 10,
        options: {
            range: true,
            step: 1,
            min: 5,
            max: 40
        }
    },
    navBarTextAlignment: {
        title: 'uieditor.sfbComponent.header.navigationBar.textAlignment.title',
        type: DROPDOWN,
        required: true,
        defaultValue: NAVIGATION_TEXT_ALIGN[0].value,
        options: NAVIGATION_TEXT_ALIGN
    },
    navBarTextSize: {
        title: 'uieditor.sfbComponent.header.navigationBar.textSize.title',
        type: DROPDOWN,
        required: true,
        defaultValue: NAVIGATION_TEXT_SIZE[1].value,
        options: NAVIGATION_TEXT_SIZE
    },
    navBarLinkSpacing: {
        title: 'uieditor.sfbComponent.header.navigationBar.linkSpacing.title',
        type: SLIDER,
        defaultValue: 20,
        options: {
            range: true,
            step: 1,
            min: 15,
            max: 50
        }
    },
    navBarTextColor: {
        title: 'uieditor.sfbComponent.header.navigationBar.textColor.title',
        type: COLORPICKER,
        defaultValue: DEFAULT_TEXT_COLOR
    },
    navBarTextHoverColor: {
        title: 'uieditor.sfbComponent.header.navigationBar.textHoverColor.title',
        type: COLORPICKER,
        defaultValue: undefined
    },
    navBarBorderColor: {
        title: 'uieditor.sfbComponent.header.navigationBar.borderColor.title',
        type: COLORPICKER,
        defaultValue: undefined
    },
    navBarBackgroundColor: {
        title: 'uieditor.sfbComponent.header.navigationBar.backgroundColor.title',
        type: COLORPICKER,
        defaultValue: undefined
    }
};

export const headerHomeBarSchemaForm = {
    spacer: {
        type: GROUP_HEADER,
        title: 'uieditor.sfbComponent.header.homeBar.logoType.title',
        symbol: 'style'
    },
    logoTheme: {
        defaultValue: NO_LOGO,
        type: LOGO,
        required: true
    },
    logoHeight: {
        title: 'uieditor.sfbComponent.header.homeBar.logoHeight.title',
        type: SLIDER,
        defaultValue: headerHomeBarDefaultSettings.logoHeight,
        options: {
            range: true,
            step: 1,
            min: 30,
            max: 180
        }
    },
    logoTargetType: {
        title: 'uieditor.sfbComponent.header.homeBar.logoTargetType.title',
        type: RADIO,
        defaultValue: headerHomeBarDefaultSettings.logoTargetType,
        options: LOGO_TARGET_TYPES
    },
    logoTargetCustomUrl: {
        title: 'uieditor.sfbComponent.header.homeBar.logoTargetCustomUrl.title',
        type: INPUT,
        defaultValue: headerHomeBarDefaultSettings.logoTargetCustomUrl,
        caption: 'uieditor.sfbComponent.header.homeBar.logoTargetCustomUrl.caption',
        conditionalAttributes: {
            isVisible: {
                when: 'logoTargetType',
                connector: 'equals',
                value: LOGO_TARGET_CUSTOM_URL.value
            }
        }
    },
    homeBarPadding: {
        title: 'uieditor.sfbComponent.header.homeBar.padding.title',
        type: SLIDER,
        defaultValue: headerHomeBarDefaultSettings.homeBarPadding,
        caption: 'uieditor.sfbComponent.header.homeBar.padding.caption',
        options: {
            range: true,
            step: 1,
            min: 50,
            max: 200
        }
    },
    homeBarLinkSpacing: {
        title: 'uieditor.sfbComponent.header.homeBar.linkSpacing.title',
        type: SLIDER,
        defaultValue: headerHomeBarDefaultSettings.homeBarLinkSpacing,
        options: {
            range: true,
            step: 1,
            min: 15,
            max: 50
        }
    },
    displayLoginLink: {
        labelOn: 'uieditor.sfbComponent.header.homeBar.displayLoginLink.labelOn',
        labelOff: 'uieditor.sfbComponent.header.homeBar.displayLoginLink.labelOff',
        type: TOGGLE,
        defaultValue: headerHomeBarDefaultSettings.displayLoginLink
    },
    displayRegistrationLink: {
        labelOn: 'uieditor.sfbComponent.header.homeBar.displayRegistrationLink.labelOn',
        labelOff: 'uieditor.sfbComponent.header.homeBar.displayRegistrationLink.labelOff',
        type: TOGGLE,
        defaultValue: headerHomeBarDefaultSettings.displayRegistrationLink
    },
    displayCart: {
        labelOn: 'uieditor.sfbComponent.header.homeBar.displayCart.labelOn',
        labelOff: 'uieditor.sfbComponent.header.homeBar.displayCart.labelOff',
        type: TOGGLE,
        caption: 'uieditor.sfbComponent.header.homeBar.displayCart.caption',
        defaultValue: headerHomeBarDefaultSettings.displayCart
    },
    customCartIcon: {
        title: 'uieditor.sfbComponent.header.homeBar.customCartIcon.title',
        type: IMAGE_UPLOADER,
        placeholder: 'uieditor.sfbComponent.header.homeBar.customCartIcon.placeholder',
        caption: 'uieditor.sfbComponent.header.imageUpload.caption',
        defaultValue: {}
    },
    customSignInIcon: {
        title: 'uieditor.sfbComponent.header.homeBar.customSignInIcon.title',
        type: IMAGE_UPLOADER,
        placeholder: 'uieditor.sfbComponent.header.homeBar.customSignInIcon.placeholder',
        caption: 'uieditor.sfbComponent.header.imageUpload.caption',
        defaultValue: {}
    },
    homeBarTextSize: {
        title: 'uieditor.sfbComponent.header.homeBar.textSize.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerHomeBarDefaultSettings.homeBarTextSize,
        options: NAVIGATION_TEXT_SIZE
    },
    homeBarTextColor: {
        title: 'uieditor.sfbComponent.header.homeBar.textColor.title',
        type: COLORPICKER,
        defaultValue: headerHomeBarDefaultSettings.homeBarTextColor
    },
    homeBarTextHoverColor: {
        title: 'uieditor.sfbComponent.header.homeBar.textHoverColor.title',
        type: COLORPICKER,
        defaultValue: headerHomeBarDefaultSettings.homeBarTextHoverColor
    },
    homeBarTextActiveColor: {
        title: 'uieditor.sfbComponent.header.homeBar.textActiveColor.title',
        type: COLORPICKER,
        defaultValue: headerHomeBarDefaultSettings.homeBarTextActiveColor
    },
    homeBarBorderColor: {
        title: 'uieditor.sfbComponent.header.homeBar.borderColor.title',
        type: COLORPICKER,
        defaultValue: headerHomeBarDefaultSettings.homeBarBorderColor
    },
    homeBarBackgroundColor: {
        title: 'uieditor.sfbComponent.header.homeBar.backgroundColor.title',
        type: COLORPICKER,
        defaultValue: headerHomeBarDefaultSettings.homeBarBackgroundColor
    }
};

export const headerSearchBarSchemaForm = {
    ...searchBarSchemaForm

};

export const headerAuxBarDefaultSettings = {
    auxBarHeight: 40,
    auxBarTextAlignment: RIGHT.value,
    auxBarLinkSpacing: 15,
    displayLanguageSwitcher: true,
    auxBarTextSize: MEDIUM.value,
    auxBarTextColor: DEFAULT_TEXT_COLOR,
    auxBarTextColorHover: undefined,
    auxBarBorderColor: undefined,
    auxBarBackgroundColor: undefined,
    auxBarMenuItems: []
};

export const headerAuxBarSchemaForm = {
    auxBarHeight: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.height.title',
        type: SLIDER,
        defaultValue: headerAuxBarDefaultSettings.auxBarHeight,
        options: {
            range: true,
            step: 1,
            min: 30,
            max: 90
        }
    },
    auxBarTextAlignment: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.textAlignment.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerAuxBarDefaultSettings.auxBarTextAlignment,
        options: NAVIGATION_TEXT_ALIGN
    },
    auxBarTextSize: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.textSize.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerAuxBarDefaultSettings.auxBarTextSize,
        options: NAVIGATION_TEXT_SIZE
    },
    auxBarLinkSpacing: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.linkSpacing.title',
        type: SLIDER,
        defaultValue: headerAuxBarDefaultSettings.auxBarLinkSpacing,
        options: {
            range: true,
            step: 1,
            min: 15,
            max: 50
        }
    },
    displayLanguageSwitcher: {
        labelOn: 'uieditor.sfbComponent.header.auxiliaryBar.displayLanguageSwitcher.labelOn',
        labelOff: 'uieditor.sfbComponent.header.auxiliaryBar.displayLanguageSwitcher.labelOff',
        type: TOGGLE,
        defaultValue: headerAuxBarDefaultSettings.displayLanguageSwitcher
    },
    auxBarTextColor: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.textColor.title',
        type: COLORPICKER,
        defaultValue: headerAuxBarDefaultSettings.auxBarTextColor
    },
    auxBarTextColorHover: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.textColorHover.title',
        type: COLORPICKER,
        defaultValue: headerAuxBarDefaultSettings.auxBarTextColorHover
    },
    auxBarBorderColor: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.borderColor.title',
        type: COLORPICKER,
        defaultValue: headerAuxBarDefaultSettings.auxBarBorderColor
    },
    auxBarBackgroundColor: {
        title: 'uieditor.sfbComponent.header.auxiliaryBar.backgroundColor.title',
        type: COLORPICKER,
        defaultValue: headerAuxBarDefaultSettings.auxBarBackgroundColor
    }
};

export const headerAnnouncementBarDefaultSettings = {
    announcementBarOpenInNewTab: false,
    announcementBarHeight: 30,
    announcementBarTextAlignment: CENTER.value,
    announcementBarTextSize: MEDIUM.value,
    announcementBarTextColor: undefined,
    announcementBarLinkTextColor: undefined,
    announcementBarBorderColor: undefined,
    announcementBarBackgroundColor: undefined
};

export const headerAnnouncementBarSchemaForm = {
    announcementBarMessage: {
        title: 'uieditor.sfbComponent.header.announcementBarMessage.title',
        type: TEXTAREA,
        placeholder: 'uieditor.sfbComponent.header.announcementBarMessage.placeholder',
        caption: 'uieditor.sfbComponent.header.announcementBarMessage.caption'
    },
    announcementBarLink: {
        title: 'uieditor.sfbComponent.header.announcementBarLink.title',
        type: INPUT,
        placeholder: 'uieditor.sfbComponent.header.announcementBarLink.placeholder'
    },
    announcementBarOpenInNewTab: {
        label: 'uieditor.sfbComponent.header.announcementBarOpenInNewTab.label',
        type: TOGGLE_CHECK,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarOpenInNewTab
    },
    announcementBarHeight: {
        title: 'uieditor.sfbComponent.header.announcementBarHeight.title',
        type: SLIDER,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarHeight,
        caption: 'uieditor.sfbComponent.headerAuxBar.announcementBarHeight.caption',
        options: {
            range: true,
            step: 1,
            min: 30,
            max: 90
        }
    },
    announcementBarTextAlignment: {
        title: 'uieditor.sfbComponent.header.announcementBarTextAlignment.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarTextAlignment,
        options: NAVIGATION_TEXT_ALIGN
    },
    announcementBarTextSize: {
        title: 'uieditor.sfbComponent.header.announcementBarTextSize.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarTextSize,
        options: NAVIGATION_TEXT_SIZE
    },
    announcementBarTextColor: {
        title: 'uieditor.sfbComponent.header.announcementBarTextColor.title',
        type: COLORPICKER,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarTextColor
    },
    announcementBarLinkTextColor: {
        title: 'uieditor.sfbComponent.header.announcementBarLinkTextColor.title',
        type: COLORPICKER,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarLinkTextColor
    },
    announcementBarBorderColor: {
        title: 'uieditor.sfbComponent.header.announcementBarBorderColor.title',
        type: COLORPICKER,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarBorderColor
    },
    announcementBarBackgroundColor: {
        title: 'uieditor.sfbComponent.header.announcementBarBackgroundColor.title',
        type: COLORPICKER,
        defaultValue: headerAnnouncementBarDefaultSettings.announcementBarBackgroundColor
    }
};

export const headerCategoriesMenuDefaultSettings = {
    catMenuTextSize: MEDIUM.value,
    catMenuRowSpacing: 44,
    catMenuTitleColor: '',
    catMenuTextColor: '',
    catMenuTextHoverColor: '',
    catMenuTextActiveColor: '',
    catMenuBackgroundColor: '',
    catMenuBgColorHover: '',
    catMenuBgColorActive: ''
};

export const headerCategoriesMenuSchemaForm = {
    catMenuTextSize: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.textSize.title',
        type: DROPDOWN,
        required: true,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuTextSize,
        options: NAVIGATION_TEXT_SIZE
    },
    catMenuRowSpacing: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.rowSpacing.title',
        type: SLIDER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuRowSpacing,
        caption: 'uieditor.sfbComponent.header.categoriesMenu.rowSpacing.caption',
        options: {
            range: true,
            step: 1,
            min: 30,
            max: 50
        }
    },
    catMenuTitleColor: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.titleColor.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuTitleColor
    },
    catMenuTextColor: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.textColor.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuTextColor
    },
    catMenuTextHoverColor: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.textHoverColor.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuTextHoverColor
    },
    catMenuTextActiveColor: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.textActiveColor.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuTextActiveColor
    },
    catMenuBackgroundColor: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.backgroundColor.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuBackgroundColor
    },
    catMenuBgColorHover: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.bgColorHover.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuBgColorHover
    },
    catMenuBgColorActive: {
        title: 'uieditor.sfbComponent.header.categoriesMenu.bgColorActive.title',
        type: COLORPICKER,
        defaultValue: headerCategoriesMenuDefaultSettings.catMenuBgColorActive
    }
};
