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

/// Breakpoints List
@use '../../utils/breakpoints' as *;

/// Change the media type (all, print, screen,...)
$media-type: all !default;

/// Convert pixels to ems
///
/// Parameters:
/// @param {Number} $px - value to convert
///
/// Return Values:
/// @returns {Number} Value in `em`
///
@function px2em($px) {
  @if math.is-unitless($px) {
    @warn "Assuming #{$px} to be in pixels, attempting to convert it into pixels.";
    @return px2em($px * 1px);
  }

  // if $px is compatible with em units, then return value unchanged
  @if math.compatible($px, 1em) {
    @return $px;
  }

  @return math.div($px, 16px) * 1em;
}

/// Get a breakpoint's width
///
/// Parameters:
/// @param {String} $name - Name of the breakpoint. One of $breakpoints
///
/// Required Variables:
/// @requires {Variable} $breakpoints
///
/// Returned Values:
/// @returns {Number} Value in pixels
///
@function get-breakpoint-width($name, $breakpoints: $breakpoints) {
  @if map.has-key($breakpoints, $name) {
    @return map.get($breakpoints, $name);
  }

  @else {
    @warn "Breakpoint #{$name} wasn't found in $breakpoints.";
    @return null;
  }
}

/// Media Query mixin
///
/// Parameters:
/// @param {String | Boolean} $from [false] - One of $breakpoints
/// @param {String | Boolean} $until [false] - One of $breakpoints
/// @param {String | Boolean} $and [false] - Additional media query parameters
/// @param {String} $media-type [$media-type] - Media type: screen, print…
///
/// Ignored Values:
/// @ignore Undocumented API, for advanced use only:
/// @ignore @param {Map} $breakpoints [$breakpoints]
///
/// Returned Content:
/// @content styling rules, wrapped into a @media query when $responsive is true
///
/// Required Variables & Functions:
/// @requires {Variable} $media-type
/// @requires {Variable} $breakpoints
/// @requires {Function} px2em
/// @requires {Function} get-breakpoint-width
///
/// Further Reading:
/// @link https://github.com/sass-mq/sass-mq#responsive-mode-on-default Full documentation and examples
///
@mixin mq($from: false,
  $until: false,
  $and: false,
  $media-type: $media-type,
  $breakpoints: $breakpoints) {
  $min-width: 0;
  $max-width: 0;
  $media-query: '';

  // From: this breakpoint (inclusive)
  @if $from {
    @if type-of($from)==number {
      $min-width: px2em($from);
    }

    @else {
      $min-width: px2em(get-breakpoint-width($from, $breakpoints));
    }
  }

  // Until: that breakpoint (exclusive)
  @if $until {
    @if type-of($until)==number {
      $max-width: px2em($until);
    }

    @else {
      $max-width: px2em(get-breakpoint-width($until, $breakpoints)) - 0.01em;
    }
  }

  @if $min-width  !=0 {
    $media-query: '#{$media-query} and (min-width: #{$min-width})';
  }

  @if $max-width  !=0 {
    $media-query: '#{$media-query} and (max-width: #{$max-width})';
  }

  @if $and {
    $media-query: '#{$media-query} and #{$and}';
  }

  // Remove unnecessary media query prefix 'all and '
  @if ($media-type =='all' and $media-query  !='') {
    $media-type: '';
    $media-query: str-slice(unquote($media-query), 6);
  }

  @media #{$media-type + $media-query} {
    @if ($from and not $until) {
      @content($from);
    }

    @else if ($until and not $from) {
      @content($until);
    }

    @else if ($from and $until) {
      @content($from, $until);
    }

    @else {
      @content;
    }
  }
}

/// Quick sort
///
/// Access Type:
/// @access private
///
/// Parameters:
/// @param {List} $list - List to sort
///
/// Returned Values:
/// @returns {List} Sorted List
///
@function _quick-sort($list) {
  $less: ();
  $equal: ();
  $large: ();

  @if length($list)>1 {
    $seed: list.nth($list, math.ceil(math.div(length($list), 2)));

    @each $item in $list {
      @if ($item ==$seed) {
        $equal: list.append($equal, $item);
      }

      @else if ($item < $seed) {
        $less: list.append($less, $item);
      }

      @else if ($item > $seed) {
        $large: list.append($large, $item);
      }
    }

    @return join(join(_quick-sort($less), $equal), _quick-sort($large));
  }

  @return $list;
}

/// Sort a map by values (works with numbers only)
///
/// Access Type:
/// @access private
/// 
/// Parameters:
/// @param {Map} $map - Map to sort
/// 
/// Returned Values:
/// @returns {Map} Map sorted by value
///
@function _map-sort-by-value($map) {
  $map-sorted: ();
  $map-keys: map.keys($map);
  $map-values: map.values($map);
  $map-values-sorted: _quick-sort($map-values);

  // Reorder key/value pairs based on key values
  @each $value in $map-values-sorted {
    $index: index($map-values, $value);
    $key: list.nth($map-keys, $index);
    $map-sorted: map.merge($map-sorted, ($key: $value));

    // Unset the value in $map-values to prevent the loop
    // from finding the same index twice
    $map-values: list.set-nth($map-values, $index, 0);
  }

  @return $map-sorted;
}

/// Add a breakpoint
///
/// Parameters:
/// @param {String} $name - Name of the breakpoint
/// @param {Number} $width - Width of the breakpoint
///
/// Required Variables:
/// @requires {Variable} $breakpoints
///
@mixin add-breakpoint($name, $width) {
  $new-breakpoint: ($name: $width);
  $breakpoints: map.merge($breakpoints, $new-breakpoint) !global;
  $breakpoints: _map-sort-by-value($breakpoints) !global;
}
