//------------------------------------
//      $FONT FACE TOOL
//------------------------------------

/// A wrapper function for `@font-face()`. Takes a configuration map and passes the keys to `@font-face()`. Loops through each font-name's (root map keys) weight and style.
///
/// Font file names must be the same as their CSS font-family values. Example: arial font, 400 weight would be arial-400.ttf and the CSS value would be font-family: 'arial'; font-weight: 400.
/// @group core
///
/// @param {Map} $font-map [$web-fonts]
/// @see $web-fonts
///
@mixin web-fonts($font-map: $web-fonts) {
    @each $name in map-keys($font-map) {
        $inner-map: map-get($font-map, $name);

        $weights: map-get($inner-map, 'weights');
        $italics: map-get($inner-map, 'italics');
        $formats: map-get($inner-map, 'formats');
        $path: map-get($inner-map, 'path') or
            $web-fonts-path or
            $font-file-location;

        @each $weight in $weights {
            @include _font-weights($name, $path, $weight, $formats);
        }
        @each $weight in $italics {
            @include _font-weights($name, $path, $weight, $formats, italic);
        }
    }
}
/// @alias web-fonts
/// @deprecated
@mixin include-web-fonts($font-map: $web-fonts) {
    @include web-fonts($font-map);
}

/// Formats fonts taken from `$web-fonts` and creates their equivilent weight (with correct font-style) output.
@mixin _font-weights($name, $path, $weight, $formats, $style: '') {
    $style-string: if($style != '', '-#{$style}', '');
    $svg-id: ('##{$name}#{$weight}#{$style}');
    $font-name: #{$path}/#{unquote('#{$name}-#{$weight}#{$style-string}')};
    $style: if($style == '', 'normal', $style);

    $fonts: _join-font-formats($font-name, $formats, $svg-id);

    $eot: map-get($fonts, 'eot');
    $font-files: map-get($fonts, 'font-files');

    @include font-face($name, $font-files, $weight, $style, $eot);
}

/// Generates cross-browser font-face declarations when called.
/// `$name` is required, arbitrary, and what you will use in font stacks.
/// @param {String} $name
/// @param {List} $font-files is required using font-files('relative/location', 'format'). For best results use this order: woff, opentype/truetype, svg
/// @param {String} $eot is required by IE, and is a relative location of the eot file.
/// @param {String} $weight shows if the font is bold, defaults to normal
/// @param {String} $style defaults to normal, might be also italic
///
@mixin font-face(
    $name,
    $font-files,
    $weight: false,
    $style: false,
    $eot: null
) {
    $iefont: unquote("'#{$eot}?#iefix'");
    @font-face {
        font-family: quote($name);
        src: #{$font-files};
        @if $eot {
            $font-files: url($iefont) unquote("format('embedded-opentype')"),
                $font-files;
            src: unquote("'#{$eot}'");
        }
        @if $weight {
            font-weight: #{$weight};
        }
        @if $style {
            font-style: #{$style};
        }
    }
}

@function _join-font-formats($font-name, $formats, $svg-id) {
    $font-files: ();
    $eot: null;

    @each $format in $formats {
        $extension: if($format == 'svg', 'svg#{$svg-id}', $format);

        @if $format == 'eot' {
            $eot: '#{$font-name}.eot';
        } @else {
            $font-files: join(
                unquote(
                    'url("#{$font-name}.#{$extension}") format("#{$format}")'
                ),
                $font-files,
                comma
            );
        }
    }

    @return ('font-files': $font-files, 'eot': $eot);
}