//
// Main module for the Zen Grids system.
//


// Specify the number of columns in the grid. @see http://next.zengrids.com/reference/grids/#zen-columns
$zen-columns                      : 1           !default;

// Specify the width of the gutters (as padding). @see http://next.zengrids.com/reference/grids/#zen-gutters
$zen-gutters                      : 20px        !default;

// Specify the gutter method. Can be padding or margin.
$zen-gutter-method                : padding     !default;

// @see http://next.zengrids.com/reference/grids/#zen-auto-include-grid-item-base
$zen-auto-include-grid-item-base  : true        !default;

// Specify the width of the entire grid. @see http://next.zengrids.com/reference/grids/#zen-grid-width
$zen-grid-width                   : 100%        !default;

// The box-sizing polyfill for IE6/7 requires an absolute path. @see http://next.zengrids.com/reference/grids/#box-sizing-polyfill-path
$box-sizing-polyfill-path         : ""          !default;

// Specify the CSS3 box-sizing method. @see http://next.zengrids.com/reference/grids/#zen-box-sizing
$zen-box-sizing                   : border-box  !default;

// @see http://next.zengrids.com/reference/grids/#legacy-support-for-ie7
$legacy-support-for-ie7           : false       !default;
$legacy-support-for-ie6           : false       !default;

// Specify the default floating direction for zen's mixins. @see http://next.zengrids.com/reference/grids/#zen-direction
$zen-direction                    : left        !default;

// Reverse the floating direction in all zen's mixins. @see http://next.zengrids.com/reference/grids/#zen-switch-direction
$zen-switch-direction             : false       !default;


//
// Apply this to create a grid container element.
// @see http://next.zengrids.com/reference/grids/#zen-grid-container
//
@mixin zen-grid-container(
  $context          : none,
  $gutters          : $zen-gutters,
  $gutter-method    : $zen-gutter-method,
  $direction        : $zen-direction
) {

  // @TODO: This is a pre-IE8 line of code; don't remember why its needed.
  @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
    *position: relative;
  }

  // We use the "micro clearfix", instead of Compass' clearfix or pie-clearfix.
  &:before,
  &:after {
    content: "";
    display: table;
  }
  &:after {
    clear: both;
  }
  @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
    *zoom: 1;
  }

  // Un-do the gutter padding of the parent grid item.
  @if $context == flow and $gutter-method == padding {
    margin: {
      left: -(zen-half-gutter($gutters, left, $direction));
      right: -(zen-half-gutter($gutters, right, $direction));
    }
  }

  // Prevent any padding from messing up the alignment of the nested grid.
  @if $context == grid-item or $context == flow {
    padding: {
      left: 0;
      right: 0;
    }
  }
}

//
// Apply this to each grid item. @see http://next.zengrids.com/reference/grids/#zen-grid-item
//
@mixin zen-grid-item(
  $column-span,
  $column-position,
  $direction                    : $zen-direction,
  $columns                      : $zen-columns,
  $gutters                      : $zen-gutters,
  $gutter-method                : $zen-gutter-method,
  $grid-width                   : $zen-grid-width,
  $box-sizing                   : $zen-box-sizing,
  $switch-direction             : $zen-switch-direction,
  $auto-include-grid-item-base  : $zen-auto-include-grid-item-base
) {

  // Calculate the unit width.
  $unit-width: zen-unit-width($columns, $gutters, $gutter-method, $grid-width);

  // Calculate the item's width.
  $width: zen-grid-item-width($column-span, $columns, $gutters, $gutter-method, $grid-width, $box-sizing);

  // Calculate the margin from the container's edge.
  $margin: ($column-position - 1) * $unit-width;
  @if $gutter-method == margin {
    $margin: $margin + (floor($column-position) - 1) * $gutters;
  }

  // Determine the float direction and its reverse.
  $dir: $direction;
  @if $switch-direction {
    $dir: zen-direction-switch($dir);
  }
  $rev: zen-direction-switch($dir);

  float: $dir;
  width: $width;
  margin: {
    #{$dir}: $margin;
    #{$rev}: -100%;
  }
  @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
    *margin-#{$rev}: -99.9%;
  }

  // Auto-apply the unit base mixin.
  @if $auto-include-grid-item-base {
    @include zen-grid-item-base($gutters, $gutter-method, $box-sizing, $direction, $switch-direction);
  }
}

//
// Applies a standard set of properites to all grid items in the layout.
// @see http://next.zengrids.com/reference/grids/#zen-grid-item-base
//
@mixin zen-grid-item-base(
  $gutters            : $zen-gutters,
  $gutter-method      : $zen-gutter-method,
  $box-sizing         : $zen-box-sizing,
  $direction          : $zen-direction,
  $switch-direction   : $zen-switch-direction
) {

  $dir: $direction;
  @if $switch-direction {
    $dir: zen-direction-switch($dir);
  }

  @if $gutter-method == padding {
    padding: {
      left: zen-half-gutter($gutters, left, $dir);
      right: zen-half-gutter($gutters, right, $dir);
    }
  }
  // Specify the border-box properties.
  @if $box-sizing == border-box {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  // Prevent left/right borders since they'll break the layout with content-box.
  @if $box-sizing == content-box {
    border: {
      left: 0 !important;
      right: 0 !important;
    }
    @if $gutter-method == margin {
      padding: {
        left: 0 !important;
        right: 0 !important;
      }
    }
  }
  // Prevent overflowing content from being hidden beneath other grid items.
  word-wrap: break-word;

  @if ($legacy-support-for-ie6 or $legacy-support-for-ie7) {
    @if $box-sizing == border-box and $box-sizing-polyfill-path == "" {
      @warn "Setting $box-sizing to #{$box-sizing} will fail for legacy IE browsers because the $box-sizing-polyfill-path is empty.";
    }
    @if $box-sizing-polyfill-path != "" {
      *behavior: url($box-sizing-polyfill-path);
    }
    @if $legacy-support-for-ie6 {
      // Display inline or double your floated margin!
      // @see http://www.positioniseverything.net/explorer/doubled-margin.html
      _display: inline;
      // Prevent overflowing content from breaking the layout.
      _overflow: hidden;
      // In IE6, overflow visible is broken.
      // @see http://www.howtocreate.co.uk/wrongWithIE/?chapter=overflow%3Avisible%3B
      _overflow-y: visible;
    }
  }
}

//
// Apply this to a grid item so that it starts a new row.
// @see http://next.zengrids.com/reference/grids/#zen-new-row
//
@mixin zen-new-row(
  $clear              : $zen-direction,
  $switch-direction   : $zen-switch-direction
) {
  // Determine the clearing direction.
  @if $switch-direction {
    $clear: zen-direction-switch($clear);
  }
  clear: $clear;
}


//
// Helper functions for the Zen mixins.
//

// Returns a half gutter width. @see http://next.zengrids.com/reference/grids/#zen-half-gutter
@function zen-half-gutter(
  $gutters          : $zen-gutters,
  $gutter-side      : $zen-direction,
  $direction        : $zen-direction
) {
  $half-gutter: $gutters / 2;
  // Special handling in case gutter has an odd number of pixels.
  @if unit($gutters) == "px" {
    @if $gutter-side == $direction {
      @return floor($half-gutter);
    }
    @else {
      @return ceil($half-gutter);
    }
  }
  @return $half-gutter;
}

// Warns if the gutter and grid width units are not comparable.
@function zen-compare-units(
  $feature,
  $gutters        : $zen-gutters,
  $grid-width     : $zen-grid-width
) {
  @if not comparable($gutters, $grid-width) {
    $units-gutter: unit($gutters);
    $units-grid: unit($grid-width);
    @warn "The layout cannot be calculated correctly; when using #{$feature}, the units of the gutter (#{$units-gutter} must match the units of the grid width (#{$units-grid}).";
    @return false;
  }
  @return true;
}

// Calculates the unit width of a column. @see http://next.zengrids.com/reference/grids/#zen-unit-width
@function zen-unit-width(
  $columns        : $zen-columns,
  $gutters        : $zen-gutters,
  $gutter-method  : $zen-gutter-method,
  $grid-width     : $zen-grid-width
) {
  $unit-width: 0;
  @if $gutter-method == margin {
    $test: zen-compare-units('gutter-method: margin', $gutters, $grid-width);
    $unit-width: ($grid-width - ($columns - 1) * $gutters) / $columns;
  }
  @else {
    $unit-width: $grid-width / $columns;
  }
  @if unit($unit-width) == "px" and floor($unit-width) != ceil($unit-width) {
    @if $gutter-method == margin {
      $num_gutters: $columns - 1;
      @warn "You may experience rounding errors as the grid width, #{$grid-width}, does not divide evenly into #{$columns} columns with #{$num_gutters} of #{$gutters} gutters.";
    }
    @else {
      @warn "You may experience rounding errors as the grid width, #{$grid-width}, does not divide evenly into #{$columns} columns.";
    }
  }
  @return $unit-width;
}

// Calculates the width of a grid item that spans the specified number of columns.
// @see http://next.zengrids.com/reference/grids/#zen-grid-item-width
@function zen-grid-item-width(
  $column-span,
  $columns        : $zen-columns,
  $gutters        : $zen-gutters,
  $gutter-method  : $zen-gutter-method,
  $grid-width     : $zen-grid-width,
  $box-sizing     : $zen-box-sizing
) {
  $width: $column-span * zen-unit-width($columns, $gutters, $gutter-method, $grid-width);

  // Add the margin gutters internal to the spanning grid item.
  @if $gutter-method == margin {
    $width: $width + (floor($column-span) - 1) * $gutters;
  }
  // For the original box model, remove the padding from the width.
  @elseif $box-sizing == content-box {
    $test: zen-compare-units('box-sizing: content-box', $gutters, $grid-width);
    $width: $width - $gutters;
  }
  @return $width;
}

// Returns the opposite direction, given "left" or "right".
// @see http://next.zengrids.com/reference/grids/#zen-direction-switch
@function zen-direction-switch(
  $dir
) {
  @if $dir == left {
    @return right;
  }
  @else if $dir == right {
    @return left;
  }
  @else if $dir == none or $dir == both {
    @return $dir;
  }
  @warn "Invalid direction passed to zen-direction-switch().";
  @return both;
}