// Mixin: Bg
//
// Makes background (with image) declarations a little simpler. Use this with
// the global img-path variable to set a base image path that you don't have to
// keep repeating. Also sets 'no-repeat' as the default background-repeat.
//
// ex. bg: 'test.png'
// ex. bg: 'other.jpg' center center repeat

bg($path, $args...)
  $args = unquote('no-repeat') unless $args
  background: url($img-path $path) $args

// Mixin: bg-retina
//
// Make sure the image path is double the size, pass it halved numbers, and
// you're in the retina-clear.
//
// ex. bg-retina: 'test.png' 200px 100px
// ex. bg-retina: 'other.jpg' 100px 50px center center repeat

bg-retina($path, $width, $height, $args...)
  $args = unquote('no-repeat') unless $args
  $set_size = false

  for $arg in $args
    if $arg == 'no-repeat'
      $set_size = true

  background: url($img-path $path) $args
  background-size: $width $height

  if $set_size
    size: $width $height

// Mixin: Image Replace
//
// Image replacement. Pass it an image path and the image's dimensions and any
// text will be hidden in the div and it will show an image instead. Uses the
// fanciest new method, props to Paul Irish. Only works when called as a
// function with parens. Do not try to do it with a colon!
//
// ex. ir('test.jpg', 200 400)

image-replace($path, $dimensions...)
  $dimensions = $dimensions[0]
  font: 0/0 a
  text-shadow: none
  color: transparent
  bg: $path if $path
  if length($dimensions) > 1
    width: unit($dimensions[0], 'px')
    height: unit($dimensions[1], 'px')
  else
    warn("Make sure you also pass the image dimensions. Example: ir('/img/whatever.jpg', 200px 400px)")

// Alias: ir
ir = image-replace

// Function: cached-image-url
//
// An alternative to url() that stores images in a cache for use in
// cache-images().

$background-images = null

cached-image-url()
  $base = ''
  $s = unquote('url("' + $base + join('', arguments) + '")')
  push($background-images, $s) unless $s in $background-images
  url(arguments)

// Mixin: Cache Images
// Use this at the end of all your styles outputs the image cache script.

cache-images()
  body:after
    display: none
    content: $background-images

// Mixin: Sprite
//
// Given a direction in which your sprites are aligned (horizontal/vertical) and
// an iteration, will measure the width/height of your first sprite frame and
// step through to the nth next one, depending on the given iteration number.
// Width/height must be defined for this to work (as is the case for any sprite)
//
// ex. sprite: 2
// ex. sprite: 5 'horizontal'
//
// TODO: Try using image-size here if @width or @height aren't defined

sprite($iteration, $orientation = 'vertical')
  if $orientation == 'vertical'
    background-position: 0 unit(@height*-1*$iteration, 'px')
  else if $orientation == 'horizontal'
    // warn(unit(@width*iteration, 'px'))
    background-position: unit(@width*$iteration, 'px') 0