/*
 * Copyright (C) 2019 Robert Bosch GmbH Copyright (C) 2019 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
 */

import { MediaQueryBuilder } from '../layout/media-query-builder';

export const BOSCH_BREAKPOINTS = {
  XXS: 320,
  XS: 480,
  S: 768,
  M: 992,
  L: 1280,
  XL: 1600,
  XXL: 1920,
};

export const BOSCH_MARGINS = {
  XXS: 14,
  XS: 14,
  S: 14,
  M: 16,
  L: 32,
  XL: 32,
  XXL: 32,
};

const mobilePortrait = MediaQueryBuilder.is().lt(BOSCH_BREAKPOINTS.S).and.portrait.query;
const tabletPortrait = MediaQueryBuilder.is().ge(BOSCH_BREAKPOINTS.S).and.lt(BOSCH_BREAKPOINTS.M).and.portrait.query;
const desktopPortrait = MediaQueryBuilder.is().ge(BOSCH_BREAKPOINTS.M).and.portrait.query;

const mobileLandscape = MediaQueryBuilder.is().lt(BOSCH_BREAKPOINTS.M).and.landscape.query;
const tabletLandscape = MediaQueryBuilder.is().ge(BOSCH_BREAKPOINTS.M).and.lt(BOSCH_BREAKPOINTS.L).and.landscape.query;
const desktopLandscape = MediaQueryBuilder.is().ge(BOSCH_BREAKPOINTS.L).and.landscape.query;

export const BOSCH_MEDIA_QUERIES = {
  /**
   * All mobile (= small size) devices, may match some small tablets in portrait mode.
   */
  mobile: mobilePortrait + ', ' + mobileLandscape,

  /**
   * All tablets (= medium size) devices.
   */
  tablet: tabletPortrait + ', ' + tabletLandscape,

  /**
   * All larger screens (= larger size) devices, also matches typical 10"+ tablets in landscape mode.
   */
  desktop: desktopPortrait + ', ' + desktopLandscape,

  /**
   * Portrait orientation
   */
  mobilePortrait: mobilePortrait,
  tabletPortrait: tabletPortrait,
  desktopPortrait: desktopPortrait,

  /**
   * Landscape orientation
   */
  mobileLandscape: mobileLandscape,
  tabletLandscape: tabletLandscape,
  desktopLandscape: desktopLandscape,
};

export const FLEX_BREAKPOINTS = [
  {
    alias: 'mobile',
    suffix: 'mobile',
    mediaQuery: mobilePortrait + ', ' + mobileLandscape,
    overlapping: false,
  },
  {
    alias: 'tablet',
    suffix: 'tablet',
    mediaQuery: tabletPortrait + ', ' + tabletLandscape,
    overlapping: false,
  },
  {
    alias: 'desktop',
    suffix: 'desktop',
    mediaQuery: desktopPortrait + ', ' + desktopLandscape,
    overlapping: false,
  },
];
