// Breakpoint Integration
// ======================

$susy-media: () !default;
$susy-media-fallback: false !default;

$_susy-media-context: ();


// Susy Breakpoint
// ---------------
// Change grids at different media query breakpoints.
// - $query     : <min-width> [<max-width>] | <property> <value> | <map>
// - $layout    : <settings>
// - $no-query  : <boolean> | <selector>
@mixin susy-breakpoint(
  $query,
  $layout: false,
  $no-query: $susy-media-fallback
) {
  @include susy-media-router($query, $no-query) {
    @if $layout {
      @include with-layout($layout) {
        @content;
      }
    } @else {
      @content;
    }
  }
}


// Susy Media
// ----------
// - $query: <min-width> [<max-width>] | <property> <value>
// - $no-query: <boolean> | <selector>
@mixin susy-media(
  $query,
  $no-query: $susy-media-fallback
) {
  $old-context: $_susy-media-context;
  $name: if(map-has-key($susy-media, $query), $query, null);
  $query: susy-get-media($query);
  $query: susy-parse-media($query);

  @include susy-media-context($query, $name);

  @if $no-query and type-of($no-query) != string {
    @content;
  } @else {
    @media #{susy-render-media($query)} {
      @content;
    }

    @if type-of($no-query) == string {
      #{$no-query} & {
        @content;
      }
    }
  }

  @include susy-media-context($old-context, $clean: true);
}


// Media Router
// ------------
// Rout media arguments to the correct mixin.
@mixin susy-media-router(
  $query,
  $no-query: $susy-media-fallback
) {
  @if susy-support(breakpoint, (mixin: breakpoint), $warn: false) {
    @include breakpoint($query, $no-query) {
      @content;
    }
  } @else {
    @include susy-media($query, $no-query) {
      @content;
    }
  }
}


// Update Context
// -------------
// Set the new media context
@mixin susy-media-context(
  $query,
  $name: null,
  $clean: false
) {
  $query: map-merge((name: $name), $query);

  @if $clean {
    $_susy-media-context: $query !global;
  } @else {
    $_susy-media-context: map-merge($_susy-media-context, $query) !global;
  }
}


// Media Context
// -------------
// Return the full media context, or a single media property (e.g. min-width)
@function susy-media-context(
  $property: false
) {
  @if $property {
    @return map-get($_susy-media-context, $property);
  } @else {
    @return $_susy-media-context;
  }
}


// Get Media
// ---------
// Return a named media-query from $susy-media.
// - $name: <key>
@function susy-get-media(
  $name
) {
  @if map-has-key($susy-media, $name) {
    $map-value: map-get($susy-media, $name);
    @if ($name == $map-value) {
      $name: $map-value;
    } @else {
      $name: susy-get-media($map-value);
    }
  }

  @return $name;
}


// Render Media
// ------------
// Build a media-query string from various media settings
@function susy-render-media(
  $query
) {
  $output: null;
  @each $property, $value in $query {
    $string: null;

    @if $property == media {
      $string: $value;
    } @else {
      $string: '(#{$property}: #{$value})';
    }

    $output: if($output, '#{$output} and #{$string}', $string);
  }

  @return $output;
}


// Parse Media
// -----------
// Return parsed media-query settings based on shorthand
@function susy-parse-media(
  $query
) {
  $mq: null;
  @if type-of($query) == map {
    $mq: $query;
  } @else if type-of($query) == number {
    $mq: (min-width: $query);
  } @else if type-of($query) == list and length($query) == 2 {
    @if type-of(nth($query, 1)) == number {
      $mq: (
        min-width: min($query...),
        max-width: max($query...),
      );
    } @else {
      $mq: (nth($query, 1): nth($query, 2));
    }
  } @else {
    $mq: (media: '#{$query}');
  }

  @return $mq;
}