// https://github.com/sass/sass/issues/659#issuecomment-64819075
@function char($character-code) {
  @if function-exists("selector-append") {
    @return unquote("\"\\#{$character-code}\"");
  }

  @return str-slice("\x", 1, 1) + $character-code;
}

$icon-font-family: videojs-record;
$icon-font-path: '../fonts' !default;

@font-face {
  font-family: $icon-font-family;
  src: url('#{$icon-font-path}/videojs-record.eot?#iefix') format('eot');
}
@font-face {
  font-family: $icon-font-family;
  src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAUcAAsAAAAACIgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAAPAAAAFY6l0dLY21hcAAAAYAAAABhAAABtj269dhnbHlmAAAB5AAAASMAAAHoaKpyRmhlYWQAAAMIAAAALQAAADYLMVVqaGhlYQAAAzgAAAAYAAAAJABeADhobXR4AAADUAAAAA4AAAAcASAAAGxvY2EAAANgAAAAEAAAABABiAH+bWF4cAAAA3AAAAAfAAAAIAEUADxuYW1lAAADkAAAATYAAAJemUJQLnBvc3QAAATIAAAAUQAAAHfWeWp5eJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGTQZJzAwMrAwCDHoAgk2aC0OAMTAw8DkGBlZsAKAtJcUxgcPjJ+ZGMwAHJZwCQDAyOIAADDpwVheJztkcENwCAMAx0IeVQdpQPx6v5fJqB2whiNdEa2Ih4OgAGgk4c4YC8MmsnUMu+4Mvez48pX7E01Kb2nNu46fwyawD936jwu1FeRDbYCenuhSywv1Okaha60okB8euoTwQAAAHicRZDrTsMwDIXtXKupVFzSEgmYpnbqYOuG1DbbD8Te/7E4bgY47YmdyM5nkyKxI+2po0+iS7frfNe6Nw7NF6cTpyk04xnqfD2N52+eex9c28M5j0397kxpnIJVxhnrLLSSSBmFrzfYIjz2Rlurjed8cC8phQhe54VhT1t6AkGa+wP/EsiLz6lljsyLFC9evCDii4Yyf08DlbRBdkbM6ZdQcYsWurDmqZ7SeOUUlRG702DVWjtt8AejSpyLOG2Vwo0z3iO4sR2xSlRvK0Yt1JlPHO3K2tVKZLjtEPrrZ4ulkTPVXRnjNpJES62BCnqlD9zJbIU2/c88N3DgnQf6fOVxzWjjEZQCu4x6I+KMsONEJC6t6Ic83Dzy9e0OQvQDgKActgB4nGNgZGBgAOJYtaCqeH6brwzcDAZAEYarn3k4kGkGXSBkYOBgYAJxAOZRB0gAAAB4nGNgZGBgMGBggJO6DIwMqIAdAA42AJd4nGNgAAID7BgADrwBIQAAAAAAAABCAGAAkACqALYA9HicY2BkYGBgZzBgYGYAASYg5gJCBob/YD4DAA38AVEAeJx9kD9qwzAYxZ/zrzSGUijtlEFQ6FJiJxlD5wQ6Zsju2LJjY1tGVgK5QQ/SE/QQHXuQnqIvqpZksATS773vfZ9AAO7xDQ/n5eHOnufVww3VP/dJj44H5GfHQ/iYOx7Rf3M8xiveHft4wIETvMEtnQk+HPeY/3Tcp//leED+cTzEE34djzDx4HiMrTdx7OPF08c8kapop1rGSicbmR3K6Mq8VFup21zVYh7MLgtrWUsdGZmI3Um0x2xhTCpSrSqxUrWRZalEo1UhYxPsjWmWYZg6P4hVhSNyJJBQKNBiCk2OqTTdDTnjX5SIqLuSXbUtWdPNqWsI/n+AWWfHmlzbrgiGd8KuHU48W/ZlWNA1SKlTZhQq0spOP6dLbkWnsbXCzjV8c2+7GiwRcqdX+cC+Xv0Be51w9gAAeJx9x0sOgCAMRdE+/GCUrbCoRprIgJRUZP0OSBx6R+eSo/88HCbMWLDCYyPPPVaxsvecRAf5SXkwmJxqKd6NrR3faA310qbx5CLGRC+J7hkhAAAA) format('woff'),
       url(data:application/x-font-ttf;charset=utf-8;base64,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) format('truetype');
  font-weight: normal;
  font-style: normal;
}

// http://sass-lang.com/documentation/file.SASS_REFERENCE.html#maps
$icons: (
          av-perm: 'f101',
          video-perm: 'f102',
          audio-perm: 'f103',
          record-start: 'f104',
          record-stop: 'f105',
          photo-camera: 'f106',
);

// NOTE: This is as complex as we want to get with SCSS functionality.
//
// Now that we have a map of icons above, we can iterate over that map and create an icon class
// for each icon in that list. The iterator below produces CSS classes like this:
//
// .vjs-icon-play {
//   font-family: VideoJS;
//   font-weight: normal;
//   font-style: normal;
// }
// .vjs-icon-play:before { content: "\25b6"; }
//
// We can then use @extend in the codebase when we need to add an icon to a class. @extend builds up
// the selectors for you so you can avoid duplication. This is generally a bad idea, but since each
// icon should only be extended one or two other places, we'll roll with it.
@each $name, $content in $icons {
  .vjs-icon-#{$name} {
    font-family: $icon-font-family;
    font-weight: normal;
    font-style: normal;

    &:before {
      content: char($content);
    }
  }
}