@use 'sass:math';
@use 'sass:map';

@use './material' as mat-functions;
@use './dark-theme' as dark-theme;
@use '../palettes/amadeus' as amadeus-palette;
@use '../../utils/functions' as utils-functions;

/// Generate a map of theme variables for Otter and override them with a map of overridden values
/// Add the variables that are specific to the Otter theme
/// @access private
/// @param {bool} $is-dark-theme [false]
/// @param {map} $override [()] map with the list of the properties to override for one Otter implementation
/// @return map
@function _generate-otter-variables($is-dark-theme: false, $override: ()) {

  $private-default: (
    panel-background: #FFF,
    light-graphical-line-color: #F5F5F5,
    medium-graphical-line-color: #E0DFE7,
    graphical-line-width: 2px,
    disabled-color: #61688F
  );

  @if ($is-dark-theme) {
    $private-default: map.merge($private-default, dark-theme.$private-dark-default);
  }

  $private: map.merge($private-default, $override);

  $otter-default: (
    // Dialog
    overlay-color: utils-functions.get-mandatory($private, 'disabled-color'),
    overlay-opacity: .85,
    dialog-background: darken(utils-functions.get-mandatory($private, 'panel-background'), .03), // f7f7f7
    dialog-min-width: 400px,
    dialog-minimum-margin: 50px,
    // Panels
    primary-background: #FCFCFC,
    primary-background-complementary-darken: rgba(0, 0, 0, .03),
    panel-background: utils-functions.get-mandatory($private, 'panel-background'),
    hover-filter: rgba(0, 0, 0, .04),
    // Fields
    input-background: utils-functions.get-mandatory($private, 'panel-background'),
    // Validation / progress bar colors
    disabled-color: utils-functions.get-mandatory($private, 'disabled-color'),
    disabled-color-contrast: #FFF,
    success-color: #0AA937,
    success-color-contrast: #FFF,
    progress-filter: linear-gradient(to left, rgba(255, 255, 255, 0.45), rgba(255, 255, 255, 0)),
    // Borders / separators
    light-graphical-line-color: utils-functions.get-mandatory($private, 'light-graphical-line-color'),
    medium-graphical-line-color: utils-functions.get-mandatory($private, 'medium-graphical-line-color'),
    dark-graphical-line: #61688F, // Use?
    thin-graphical-line-width: math.div(utils-functions.get-mandatory($private, 'graphical-line-width'), 2),
    standard-graphical-line-width: utils-functions.get-mandatory($private, 'graphical-line-width'),
    thick-graphical-line: 2 * utils-functions.get-mandatory($private, 'graphical-line-width'),
    border-style: solid,
    medium-border-width: utils-functions.get-mandatory($private, 'graphical-line-width'),
    thick-border-width: 2 * utils-functions.get-mandatory($private, 'graphical-line-width'),
    light-separator-color: utils-functions.get-mandatory($private, 'light-graphical-line-color'),
    light-separator-style: solid,
    light-separator-width: math.div(utils-functions.get-mandatory($private, 'graphical-line-width'), 2),
    separator-color: utils-functions.get-mandatory($private, 'medium-graphical-line-color'),
    separator-style: solid,
    separator-width: utils-functions.get-mandatory($private, 'graphical-line-width'),
    panel-border: none,
    focus-outline-color: #0096FA,
    // Radius
    container-radius-top-left: 0,
    container-radius-top-right: 2rem,
    container-radius-bottom-right: 0,
    container-radius-bottom-left: 2rem,
    primary-button-radius: 2.5rem,
    secondary-button-radius: 2.5rem,
    icon-button-radius: 1.7rem,
    outline-radius: 0,
    list-border-radius: 0,
    // Shadow
    enable-shadow-on-elements: false,
    enable-shadow-on-containers: true,
    shadow-color: rgba(0, 0, 0, 0.22),
    shadow-container-repartition: .1rem .1rem .3rem 0,
    // Text - theme
    text: if($is-dark-theme, rgb(198, 205, 243), #61688F),
  );

  @if ($is-dark-theme) {
    $otter-default: map.merge($otter-default, dark-theme.$otter-dark-default);
  }

  // Insure all the basic variables are always available in the theme
  @return map.merge($otter-default, $override);
};

/// Override the generic material theme to keep consistency with the application theme
/// @access private
/// @param {map} $theme generic theme as generated by the otter library based on angular material design
/// @param {map} $override specific theme for the application using the otter library
/// @return {map} theme map with the material key (primary, accent, foreground, background), plus the application
/// dedicated maps (main palette, application)
@function _override-mat-theme($theme, $override: ()) {
  $application-variables: map.merge(utils-functions.get-mandatory($theme, application), $override);

  $mat-foreground: utils-functions.get-mandatory($theme, 'foreground');
  $mat-background: utils-functions.get-mandatory($theme, 'background');

  $foreground-override: (
    divider: utils-functions.get-mandatory($application-variables, 'separator-color'),
    dividers: utils-functions.get-mandatory($application-variables, 'separator-color'),
    elevation: utils-functions.get-mandatory($application-variables, 'shadow-color'),
    hint-text: utils-functions.get-mandatory($application-variables, 'text'),
    secondary-text: utils-functions.get-mandatory($application-variables, 'text'),
    icon: utils-functions.get-mandatory($application-variables, 'text'),
    icons: utils-functions.get-mandatory($application-variables, 'text'),
    text: utils-functions.get-mandatory($application-variables, 'text'),
  );

  $background-override: (
    // Check background slider, etc.
    background: utils-functions.get-mandatory($application-variables, 'panel-background'),
    hover: utils-functions.get-mandatory($application-variables, 'hover-filter'),
    card: utils-functions.get-mandatory($application-variables, 'panel-background'),
    dialog: utils-functions.get-mandatory($application-variables, 'dialog-background')
  );

  @return map.merge(
    $theme,
    (
      foreground: map.merge($mat-foreground, $foreground-override),
      background: map.merge($mat-background, $background-override),
    )
  );
};

/// Generate the theme map containing a set of palettes and variables specific for this application
/// @access public
/// @param {map} $primary [$otter-primary] palette generated via mat-functions.define-palette (for Material Design 2) with the colors in the primary theme (forms)
/// @param {map} $highlight [$otter-highlight] palette generated via mat-functions.define-palette (for Material Design 2) with the colors for the navigation and the continue / back buttons
/// @param {map} $accent [$otter-accent] palette generated via mat-functions.define-palette (for Material Design 2) with the colors used to accentuate one element in the page
/// @param {map} $warn [$otter-warn] palette generated via mat-functions.define-palette (for Material Design 2) with the colors used in warning or error feedbacks
/// @param {bool} $is-dark-theme
/// @param {map} $application [()] a set of properties to override for one specific implementation
/// @param {string} $matVersion version of material design used (default: "2")
/// @return {map} containing the palette maps and the otter-theme variables map
@function generate-otter-theme(
  $primary: map.get(mat-functions.define-palette(amadeus-palette.$ama-primary), 'value'),
  $highlight: map.get(mat-functions.define-palette(amadeus-palette.$ama-highlight), 'value'),
  $accent: map.get(mat-functions.define-palette(amadeus-palette.$ama-accent), 'value'),
  $warn: map.get(mat-functions.define-palette(amadeus-palette.$ama-warn), 'value'),
  $is-dark-theme: false,
  $application: (),
  $matVersion: '2'
  ) {
  $theme: mat-functions.generate-theme(
    $primary: $primary,
    $highlight: $highlight,
    $accent: $accent,
    $warn: $warn,
    $application: _generate-otter-variables($is-dark-theme, $application),
    $is-dark-theme: $is-dark-theme,
    $matVersion: $matVersion
  );

  @return _override-mat-theme($theme);
};

/// Generate the dark theme map containing a set of palettes and variables specific for this application
/// @access public
/// @param {map} $primary [$otter-primary] palette generated via mat-functions.define-palette (for Material Design 2) with the colors in the primary theme (forms)
/// @param {map} $highlight [$otter-highlight] palette generated via mat-functions.define-palette (for Material Design 2) with the colors for the navigation and the continue / back buttons
/// @param {map} $accent [$otter-accent] palette generated via mat-functions.define-palette (for Material Design 2) with the colors used to accentuate one element in the page
/// @param {map} $warn [$otter-warn] palette generated via mat-functions.define-palette (for Material Design 2) with the colors used in warning or error feedbacks
/// @param {map} $application [()] a set of properties to override for one specific implementation
/// @param {string} $matVersion version of material design used (default: "2")
/// @return {map} containing the palette maps and the otter-theme variables map
@function generate-otter-dark-theme(
  $primary: map.get(mat-functions.define-palette(amadeus-palette.$ama-primary), 'value'),
  $highlight: map.get(mat-functions.define-palette(amadeus-palette.$ama-highlight), 'value'),
  $accent: map.get(mat-functions.define-palette(amadeus-palette.$ama-accent), 'value'),
  $warn: map.get(mat-functions.define-palette(amadeus-palette.$ama-warn), 'value'),
  $application: (),
  $matVersion: '2'
  ) {
  @return generate-otter-theme(
    $primary: $primary,
    $highlight: $highlight,
    $accent: $accent,
    $warn: $warn,
    $application: $application,
    $is-dark-theme: true,
    $matVersion: $matVersion
  );
};