Create formula to add classes based on field length - php

Question

I need some insight on how to create a formula that will determine what class to add to a div element based on the number of div's being displayed.
Currently I am using ACF to create a repeater field that will have one sub-field that links to a page based what the admin selects. These fields will display in their own div's based on a while loop. I am using Bootstrap classes such as col-sm-12, col-sm-6, and col-sm-4.
while( have_rows( 'project_repeater' ) ): the_row();
$post_object = get_sub_field( 'project_type' );
$count = count( get_field('project_repeater') ); // Output 4
$mod = $count % 3; // Output 1
if( $post_object ):
$post = $post_object;
setup_postdata( $post );
$classname = '';
if( $mod == 1 ) {
if( $count == 1 ) {
$classname .= 'col-sm-12';
} elseif( $count == 4 ) {
$classname .= 'col-sm-6';
} else { // $count == 7
$classname .= 'col-sm-4';
}
} elseif( $mod == 2 ) {
if( $count == 2 ) {
$classname .= 'col-sm-6';
} elseif( $count == 5 ) {
// $classname .= 'col-sm-12';
} else { // $count == 8
// $classname .= 'col-sm-4';
}
} else { // $mod == 0
$classname .= 'col-sm-4';
}
?>
<div class="project-cat <?php echo $classname; ?>">
<a href="<?php the_permalink( $post ); ?>">
<h5><?php the_title(); ?></h5>
<p><?php the_excerpt(); ?></p>
</a>
</div>
<?php
wp_reset_postdata();
endif;
endwhile;
Now when $count == 5, I need it to set the first 3 div's to have col-sm-4 and then the last 2 div's to have col-sm-6 (this will display the divs in this order stacked on top of each other: 3,2).
When $count == 7, it will need to be similar to when $count == 5 but have the first 3 as col-sm-4 and the last 4 as col-sm-6 (3,2,2)
When $count == 8, it will be slightly different where I have the first 6 as col-sm-4 and the last 2 as col-sm-6 (3,3,2).
Instead of using if statement after if statement, there has to be a better way to create a formula that will determine which class to use based on the number of div elements that are being displayed.

Answer 1

This is more math and logic problem rather than coding problem.
Why don't you 1. get the number of elements.
divide by 3 and floor the result. So you can know how many rows of col-xx-4 you are going to have.
let's say you have 14 items in total. Than fist 12 element should have col-md-4.
if you round 14/3 = 4
what is left is 14 - (3*4) = 2 so if what is left is 1 than you can use col-md-12 class, if it is 2 than col-md-6.
so while outputting you assign class col-md-4 to first 12 elements (round 14/3 = 4) and then assign appropriate class to the remaining elements (14 - (3*4) = 2) based on their number (1 or 2)
Do you think it will work for you?
Sequence
set a few variables
$total = total number of items. You can simply run the loop with a counter.
$md4-limit = floor($total/3)*3;
$remaining = $total - $md4-limit;
then when you are running the loop, use the $i and for each element increment that value and when outputting check
if ($i <= $md4-limit) {
$class = ' col-md-4 ';
} else {
if($remaining == 1) { $class = ' col-md-12 '; }
if($remaining == 2) { $class = ' col-md-6 '; }
}
then echo class into column html where the class should be :)
ANOTHER option is to add row width options to the your ACF repeater field and just construct the grid on the back end.

Answer 2

Thanks to you Nick you helped me out a lot, I did find what I was doing wrong and why it wasn't displaying like you said it would. I was not defining $i properly. But here is the code and everything works! Thanks again to you Nick!
$count = count( get_field('project_repeater') );
$limit = floor( $count / 3 ) * 3;
$remaining = $count - $limit;
$i = 0;
while( have_rows( 'project_repeater' ) ): the_row();
$post_object = get_sub_field( 'project_type' );
if( $i < $limit ) {
$classname = 'col-sm-4';
} else {
if( $remaining == 1 ) {
$classname = 'col-sm-12';
}
if( $remaining == 2 ) {
$classname = 'col-sm-6';
}
}
if( $post_object ):
$post = $post_object;
setup_postdata( $post );
?>
<div class="project-cat <?php echo $classname; ?>">
<a href="<?php the_permalink( $post ); ?>">
<h5><?php the_title(); ?></h5>
<p><?php the_excerpt(); ?></p>
</a>
</div>
<?php
wp_reset_postdata();
endif;
$i++;
endwhile;