CODEWITHSUNDEEP
php
Karem
Karem

Reputation: 18113

PHP: Showing full/half/empty star out from number

I have: fullstar.png, halfstar.png, greystar.png

<?php
$average_stars = round(4);
for($i=0; $i<$average_stars; $i++)
{
    ?>
    <img src="<?php echo url::site('images/desktop/fullstar.png'); ?>" />
    <?php
}
for($i=5; $i>$average_stars; $i--)
{
    ?>
    <img src="<?php echo url::site('images/desktop/greystar.png'); ?>" />
    <?php
}
?>

This gives me, now when $average_stars is 4, four fullstars and 1 greystar.

Works perfectly fine.

Now I would like this to work and display half stars.

So if its 4.5, the last star should be a halfstar.

How can I do this? I think i would need to first make it work, so the round() rounds up to either nearest integer OR nearest .5

Upvotes: 0

Views: 1578

Answers (6)

djot
djot

Reputation: 2947

<?php

  $cfg_min_stars = 1;
  $cfg_max_stars = 5;

  $average_stars = 3.76;
  $temp_stars = $average_stars;

  for($i=$cfg_min_stars; $i<=$cfg_max_stars; $i++) {
    if ($temp_stars > 1) {
      print 'FULL ';
      $temp_stars--;
    }
    else {
      if ($temp_stars >= 0.5) {
        print 'HALF ';
        $temp_stars -= 0.5;
      }
      else {
        print 'GREY ';
      }
    }
  }

Upvotes: 1

djot
djot

Reputation: 2947

For fun ...

See live: http://sandbox.onlinephpfunctions.com/code/84c3a6d9de3170227841d6fd3dce0c2a0b10dd9e

<?php

    $stars_for_fun = function($avg, $max) {
      $avg = round($avg, 2);
      $starly = str_repeat('FULL ', floor($avg)).str_repeat('HALF ', round( ($avg-floor($avg)), 0, PHP_ROUND_HALF_UP)).str_repeat('GREY ', round(($max-$avg)-0.01, 0, PHP_ROUND_HALF_UP) );
      print $avg.': '.$starly.'<br>';

    };

    //$cfg_min_stars = 1;
    $cfg_max_stars = 5;

    $stars_for_fun(3.76, $cfg_max_stars);
    $stars_for_fun(3.5, $cfg_max_stars);
    $stars_for_fun(2.51, $cfg_max_stars);
    $stars_for_fun(2.49, $cfg_max_stars);
    $stars_for_fun(2.01, $cfg_max_stars);
    $stars_for_fun(1.99, $cfg_max_stars);
    $stars_for_fun(0.99, $cfg_max_stars);
    $stars_for_fun(0.51, $cfg_max_stars);
    $stars_for_fun(0.50, $cfg_max_stars);
    $stars_for_fun(0.49, $cfg_max_stars);
    $stars_for_fun(0.01, $cfg_max_stars);

?>

Upvotes: 0

nni6
nni6

Reputation: 1000

<?php

    $number = 3.5;
    $average_stars = round($number * 2) / 2;
    $drawn = 5;
    for ($i = 0; $i < floor($average_stars); $i++)
    {
        $drawn--;
        echo ' fullstar';
    }

    if ($number - floor($average_stars) == 0.5)
    {
        $drawn--;
        echo ' halfstar';
    }

    for($i = $drawn; $i > 0; $i--)
    {
        echo ' greystar';
    }

?>

Upvotes: 0

Ultimater
Ultimater

Reputation: 4738

Pretty simple:

<?php
$stars=4.7449;
$average_stars = round($stars*2)/2;
for($i=0; $i<floor($average_stars); $i++)
{
    ?>
    <img src="<?php echo url::site('images/desktop/fullstar.png'); ?>" />
    <?php
}
if(floor($average_stars)!=$average_stars)
{?>
   <img src="<?php echo url::site('images/desktop/halfstar.png'); ?>" />
<?php
}

for($i=5; $i>ceil($average_stars); $i--)
{
    ?>
    <img src="<?php echo url::site('images/desktop/greystar.png'); ?>" />
    <?php
}

Upvotes: 0

Jaroslav
Jaroslav

Reputation: 1389

I will suppose you will output it to html.

You can make two images with max number of stars (one for full and one for grey ones). Put grey stars in parent DIV background. Then add another div inside first one. This time with background set with full stars image and set its width to a percentage of the first one. Don't forget to set overflow:hidden on this div.

I haven't checked that code, but it could look something like this:

<div style="background-image:url(grey-5-stars.png); width: 50px;">
<div style="background-image:url(full-5-stars.png); width: <?= (50 * $stars / $maxStars) ?>px; ">
&nbsp;
</div>
</div>

Now you always display all grey stars, and overlay them with some percentage of full stars. This way you will not be bounded only by half stars.

Upvotes: 0

SylvainD
SylvainD

Reputation: 1763

Using half stars when ranking from 0 to 5 stars is somewhat the same thing as using 10 full stars.

Once you have your 10 stars ranking working, the point is to use different images depending on the indices : each even index should be the left part of the star, the right hand side should be he right part of the star.

Upvotes: 1

Related Questions