static function responsive_grid(array $wrapper_settings)
{
global $wrapper_css_flags;
/* If wrapper is mirrored then use settings from it for the grid */
if ($potential_wrapper_mirror = HeadwayWrappers::get_wrapper_mirror($wrapper_settings)) {
$wrapper_settings = $potential_wrapper_mirror;
}
$round_precision = 9;
$return = '';
$grid_number = headway_get('columns', $wrapper_settings);
$column_width = headway_get('use-independent-grid', $wrapper_settings) ? headway_get('column-width', $wrapper_settings) : HeadwayOption::get('column-width', false, HeadwayWrappers::$default_column_width);
$gutter_width = headway_get('use-independent-grid', $wrapper_settings) ? headway_get('gutter-width', $wrapper_settings) : HeadwayOption::get('gutter-width', false, HeadwayWrappers::$default_gutter_width);
/* Render the Grid into arrays to see if sub column CSS will be needed */
$wrapper_blocks = HeadwayBlocksData::get_blocks_by_wrapper(headway_get('layout-in-use'), $wrapper_settings['id']);
$wrapper_rendered = new HeadwayGridRenderer($wrapper_blocks, $wrapper_settings);
/* Process the blocks into arrays */
$wrapper_rendered->process();
$blocks_in_sub_columns = !empty($wrapper_rendered->blocks_in_sub_columns) ? true : false;
/* Keep extraneous CSS from be created by wrappers that have the same settings */
$grid_class = 'grid-fluid-' . $grid_number . '-' . $column_width . '-' . $gutter_width;
/* If there are no sub columns and the main CSS has already been outputted, just stop here */
if (isset($wrapper_css_flags[$grid_class]) && !$blocks_in_sub_columns) {
return;
}
/* End extraneous CSS check */
/* Make calculations for the percentages */
$grid_wrapper_width = $column_width * $grid_number + ($grid_number - 1) * $gutter_width;
$resp_width_ratio = $column_width * $grid_number / $grid_wrapper_width;
$resp_gutter_ratio = $gutter_width * $grid_number / $grid_wrapper_width;
$resp_single_column_width = 100 / $grid_number * $resp_width_ratio;
$resp_single_column_margin = 100 / $grid_number * $resp_gutter_ratio;
/* Add CSS prefix */
$prefix = 'div.' . $grid_class . ' ';
/* Generate the main Grid CSS */
if (!isset($wrapper_css_flags[$grid_class])) {
$return .= $prefix . '.column { margin-left: ' . round($resp_single_column_margin, $round_precision) . '%; }' . "\n";
for ($i = 1; $i <= $grid_number; $i++) {
/* Vars */
$resp_grid_width = $resp_single_column_width * $i + $i * $resp_single_column_margin;
$resp_grid_left_margin = ($resp_single_column_width + $resp_single_column_margin) * $i + $resp_single_column_margin;
/* Output */
$return .= $prefix . '.grid-width-' . $i . ' { width: ' . round($resp_grid_width - $resp_single_column_margin, $round_precision) . '%; }' . "\n";
if ($i < $grid_number) {
$return .= $prefix . '.grid-left-' . $i . ' { margin-left: ' . round($resp_grid_left_margin, $round_precision) . '%; }' . "\n";
}
}
/* Create a flag keeping this same Grid CSS from being outputted */
$wrapper_css_flags['grid-fluid-' . $grid_number . '-' . $column_width . '-' . $gutter_width] = true;
}
/* End main grid CSS */
/* Responsive Sub Column CSS */
if ($blocks_in_sub_columns) {
/* Get the columns required for sub columns */
$required_columns_for_sub_columns = array();
foreach ($wrapper_rendered->blocks_in_sub_columns as $block_in_sub_column_id) {
if (isset($wrapper_rendered->blocks[$block_in_sub_column_id]['parent-column-width'])) {
$required_columns_for_sub_columns[] = $wrapper_rendered->blocks[$block_in_sub_column_id]['parent-column-width'];
}
}
$required_columns_for_sub_columns = array_filter(array_unique($required_columns_for_sub_columns));
/* End getting columns required for sub columns */
for ($i = 1; $i <= $grid_number; $i++) {
/* Don't output the sub column CSS if there's no column of this number with sub columns and don't output it if has already by a previous wrapper. */
if (!in_array($i, $required_columns_for_sub_columns) || isset($wrapper_css_flags['grid-fluid-' . $grid_number . '-' . $column_width . '-' . $gutter_width . '-sub-columns-column-' . $i])) {
continue;
}
/* Vars */
$resp_grid_width = $resp_single_column_width * $i + $i * $resp_single_column_margin;
$resp_grid_left_margin = ($resp_single_column_width + $resp_single_column_margin) * $i + $resp_single_column_margin;
$sub_column_single_width = $resp_single_column_width / $resp_grid_width * 100;
$sub_column_single_margin = $resp_single_column_margin / $resp_grid_width * 100;
$return .= $prefix . '.grid-width-' . $i . ' .sub-column { margin-left: ' . round($sub_column_single_margin, $round_precision) . '%; }' . "\n";
for ($sub_column_i = 1; $sub_column_i < $i; $sub_column_i++) {
/* Sub column vars */
$sub_column_width = $sub_column_single_width * $sub_column_i + $sub_column_i * $sub_column_single_margin;
$sub_column_margin = ($sub_column_single_width + $sub_column_single_margin) * $sub_column_i + $sub_column_single_margin;
$return .= $prefix . '.grid-width-' . $i . ' .sub-column.grid-width-' . $sub_column_i . ' { width: ' . round($sub_column_width - $sub_column_single_margin, $round_precision) . '%; }' . "\n";
$return .= $prefix . '.grid-width-' . $i . ' .sub-column.grid-width-' . $sub_column_i . '.column-1 { width: ' . round($sub_column_width, $round_precision) . '%; }' . "\n";
$return .= $prefix . '.grid-width-' . $i . ' .sub-column.grid-left-' . $sub_column_i . ' { margin-left: ' . round($sub_column_margin, $round_precision) . '%; }' . "\n";
$return .= $prefix . '.grid-width-' . $i . ' .sub-column.grid-left-' . $sub_column_i . '.column-1 { margin-left: ' . round($sub_column_margin - $sub_column_single_margin, $round_precision) . '%; }' . "\n";
}
/* Create a flag keeping this same sub column CSS from being outputted */
$wrapper_css_flags['grid-fluid-' . $grid_number . '-' . $column_width . '-' . $gutter_width . '-sub-columns-column-' . $i] = true;
}
}
/* End responsive sub column CSS */
return $return;
}
