Can you explain how to transfer / generate html code to another html code - PHP?

Question

I have the following php code: this php code generates 5 litags

<?php
function calculate_stars($max, $rating){
    $full_stars=floor($rating);
    $half_stars = ceil($rating-$full_stars);
    $gray_stars = $max-($full_stars + $half_stars);
    return array ($full_stars, $half_stars, $gray_stars);
}

function display_star($rating){
    $output="";
    $number_stars = calculate_stars(5,$rating);
    $full = $number_stars[0];
    $half = $number_stars[1];
    $gray = $number_stars[2];
    $output ='<ul class="star-rating">';
    if($gray)
        for ($i=0;$i<$gray;$i++)
        {
            $output .= '<li class="star-icon">&#9734;</li>';
        }

    if($half){
        $output .= '<li class="star-icon half">&#9734;</li>';
    }

    if($full){
        for($i=0; $i<$full;$i++)
        {
            $output .= '<li class="star-icon full">&#9734;</li>';
        }
    }

    $output .='</ul>';
    return $output;

}

echo display_star(0.3);

exit;
?>

Result:

<ul class="star-rating">
  <li class="star-icon">&#9734;</li>
  <li class="star-icon">&#9734;</li>
  <li class="star-icon">&#9734;</li>
  <li class="star-icon">&#9734;</li>
  <li class="star-icon half">&#9734;</li>
</ul>

Explanation of $halfand$full

Variable $halfadd class class="star-icon half"result:

Variable $fulladd class class="star-icon full"result:

Semiglasova is equivalent to: 0.5 1.5 2.5 3.5 4.5

A full star is equivalent to: 1 2 3 4 5

And all this is controlled by:

echo display_star(0.5);

You can do the tests here in php code and the generated html code, which you can paste here to see the results.

---

Now my question

How can I generate 10 tags liin the following order regarding my data and classes according to php value display_star(4.5);?

li class class="c-rating__item" left ( li) data-index , , html- php display_star(0.5);.

<ul class="c-rating">
    <li class="c-rating__item is-active left" data-index="0"></li>
    <li class="c-rating__item" data-index="1"></li>
    <li class="c-rating__item left" data-index="2"></li>
    <li class="c-rating__item" data-index="3"></li>
    <li class="c-rating__item left" data-index="4"></li>
    <li class="c-rating__item" data-index="5"></li>
    <li class="c-rating__item left" data-index="6"></li>
    <li class="c-rating__item" data-index="7"></li>
    <li class="c-rating__item left" data-index="8"></li>
    <li class="c-rating__item" data-index="9"></li>
</ul>

0 2 4 6 8

is-active .

, html- display_star(3.5);, :

<ul class="c-rating">
    <li class="c-rating__item is-active left" data-index="0"></li>
    <li class="c-rating__item is-active" data-index="1"></li>
    <li class="c-rating__item is-active left" data-index="2"></li>
    <li class="c-rating__item is-active" data-index="3"></li>
    <li class="c-rating__item is-active left" data-index="4"></li>
    <li class="c-rating__item is-active" data-index="5"></li>
    <li class="c-rating__item is-active left" data-index="6"></li>
    <li class="c-rating__item" data-index="7"></li>
    <li class="c-rating__item left" data-index="8"></li>
    <li class="c-rating__item" data-index="9"></li>
</ul>

: css : , .

Answer 1

UPDATE:

function calculate_stars($rating){
    // step starting from 0
    return (($rating/0.5)-1);
}

function display_star($rating){
    $output="";
    $step = calculate_stars($rating);
    $output ='<ul class="c-rating">';
    for ($i=0;$i<10;$i++)
    {
        $class = '';
        if($i<=$step)  $class = ' is-active';
        if($i%2 == 0) $class .= ' left';
        $output .= '<li class="c-rating__item'. $class.'" data-index="'.$i.'"></li>';
    }

    $output .='</ul>';
    return $output;

}

echo display_star(3.5);

exit;

: 10 0. 0,5

• 1 li 0 1 is-active - scale = 1 is-active
• 1,5 li 0,1 2 is-active - scale = 2 is-active
• 3,5 li 0,1,2,3,4,5,6 is-active - scale = 6 assign is-active

Answer 2

function display_star($rating){
    $output="";
    $max = 10;

    if($rating > 5){return;}

    $num = $rating *2;
    $num_half = ceil($rating) * 2;
    echo $num_half . '<br>';

    $output ='<ul class="c-rating">';

        for($i=0;$i<$num;$i++){
            $class = ($i % 2 == 0) ? "is-active left" : "is-active";
            $output .=  '<li class="c-rating__item ' . $class . '" data-index=' . $i . ' >c-rating__item ' . $class . '</li>';
        }

        $class = ($class != "is-active left") ? "left" : "";

        for($i=$num;$i<$max;$i++){
            $output .=  '<li class="c-rating__item ' . $class . '" data-index=' . $i . ' >c-rating__item ' . $class . '</li>';
            $class = ($class != "left") ? "left" : "";
        }

    $output .='</ul>';

    return $output;

}


echo display_star(2.5);

Answer 3

Try changing:

$number_stars = calculate_stars(5,$rating);

To:

$number_stars = calculate_stars(10,$rating);