Stars rating, ligesom imdb

SKal lige siges at folk IKKE skal kunne rate. Den skal tage det fra databasen og lave stjerne ud fra det som er fast i databasen

Du siger vel bare:

$rating = round( #DIN RATING# );
for( $i=0; $i<$rating; $i++ )
echo '<img src="stjerne.gif" />';

for( $i=0; $i<(10-$rating); $i++ )
echo '<img src="stjerne_opac.gif" />';


Oder was?

Jo, det var jo nemt nok, men den laver det til hele stjerner, når der står 6.3/10 så skal den 7. stjerne værer en lille smule farvedet osse jo.

Den ser sådan her ud nu, og det virker, bort set fra at den ikke farver den sidste del af stjernen når den hedder 6,3. Den farver kun 6 stjerner, men skal osse farve lidt i den 7.
                <tr>
                  <td><strong>Rating </strong></td>
                  <td><?php print $movie->rating; ?>
          <?php $rating = round($movie->rating);
                for( $i=0; $i<$rating; $i++ )
                print '<img src="img/rating_orange.gif" />';
                for( $i=0; $i<(10-$rating); $i++ )
                echo '<img src="img/rating_grey.gif" />';
          ?>
                  </td>
                </tr>

Well.. Så skal du jo til at lave alle stjernerne.

Imdb. har desuden ikke decimal-stjerner(eller hvad man nu vil kalde dem :o)), men runder bare op/ned til nærmeste stjerne, andet er bare besværligt, og unødig brug af ressourcer - in my humble opinion of course.

imdb bruger osse halve stjerner til at farve lægge den 7. stjerne med fx. 6,3
er godt klar over at det er noget css styring eller direkte kode med nogen udregninger, kan bare ikke hitte ud af det. IMDB bruger css'en til det.

En skitse til en løsning:

1) Lav to stykker grafik:

En gif med 10 grå stjerner ved siden af hinanden.
En gif med 10 gykdne stjerner ved siden af hinanden.

De skal være tilpasset sådan at den ene kan lægges direkte oven på den anden.

2) Opret en tabel med to celler. Nulstil alt hvad der hedder cellspacing og -padding.

3) Sæt de grå stjerner som baggrund til tabellen. Tabellen skal i øvrigt have samme width som giffen.

4) Sæt width af første celle sådan at den svarer til 6.3/10 af tabellens width.

5) Sæt en div ind i den første celle og sæt "overflow: hidden" på denne.

6) Sæt de gyldne stjerner ind i denne.

Tabellen skulle nu vise de grå stjerner i deres fulde længde (10 stk.). Da de grå er baggrund bliver de gyldne stjerner placeret oven på dem. Antallet af gyldne stjerner, der er synlige, begrænses af bredden på den første tabel.

Ahh ja okay.. Det lagde jeg ikke mærke til.

Jeg har ingen erfaring med det, så det er rent gæt.
Men kan du ikke gøre sådan her:

$stars = 'stars.gif'; // Farvede stjerner.
$bg = 'stars_bg.gif'; // Baggrunds stjerner.

list( $width, $height ) = getimagesize( $stars );

$ratewidth = ( $width/100 )*$rate; //Rate er så din rate fra databasen.

echo '<div style="background:url( \'' . $bg . '\' );width:' . $width . 'px;height:' . $height . 'px;">';
echo '<div style="background:url( \'' . $starts . '\' );width:' . $ratewidth . 'px;height:' . $height . 'px;"></div>';
echo '</div>';



Jeg ved ikke om det vil virke, tror det, men vend evt. tilbage med fejl, det er skrevet i exp's comment formel, så det kan gøres 1000 gange pænere, men lads os lige få det til at virke først :-)

Zurekk >> hvordan får jeg den lige til at passe ind med. Blev lige tabt der.
<strong>Rating </strong>
    <?php print $movie->rating; ?>&nbsp;&nbsp;
          <?php $rating = round($movie->rating);
                for( $i=0; $i<$rating; $i++ )
                print '<img src="img/rating_orange.gif" />';
                for( $i=0; $i<(10-$rating); $i++ )
                print '<img src="img/rating_grey.gif" />';
          ?>

Du skal ikke bruge det tidligere script :D

stars.gif skal være 10 stjerner i ét billede.
stars_bg.gif skal være ovenstående billede bare hvor de alle er grå - altså baggrunden :-)

så begge billedere skal være 10 stjerner, en med grå og en med orange. Er det det du mener ??

Denne kode bruger jeg.
<?php
  $stars = 'img/front.gif'; // Farvede stjerner.
  $bg = 'img/back.gif'; // Baggrunds stjerner.

  list( $width, $height ) = getimagesize( $stars );

  $ratewidth = ( $width/100 )*$movie->rating; //Rate er så din rate fra databasen.

  echo '<div style="background:url( \'' . $bg . '\' );width:' . $width . 'px;height:' . $height . 'px;">';
  echo '<div style="background:url( \'' . $starts . '\' );width:' . $ratewidth . 'px;height:' . $height . 'px;"></div>';
  echo '</div>';
?>

Den kommer kun med baggrunden, og det gør den i 4½ linje nedaf.

undskyld 2½ linje nedaf laver den baggrunds billedet, men front billedet kommer slet ikke på

Har fundet de 2 billedere her
front.gif = http://www.romguy.com/images/stars/10star.gif
back.gif = http://www.applianceplanet.co.uk/eshop/img/10stars.gif
de begge er 120x12

Okay. den nye kode sersådan her ud:
<?php
  $stars = 'img/rating_orange.gif'; // Farvede stjerner.
  $bg = 'img/rating_grey.gif'; // Baggrunds stjerner.

  list( $width, $height ) = getimagesize( $stars );

  $ratewidth = ( $width/100 )* $movie->rating; //Rate er så din rate fra databasen.

  print '<div style="background:url( \'' . $bg . '\' );width:' . $width . 'px;height:' . $height . 'px;">';
  print '<div style="background:url( \'' . $stars . '\' );width:' . $ratewidth . 'px;height:' . $height . 'px;"></div>';
  print '</div>';
?>

Men den laver 3 rækker stjerner under hianden. Og en rate på 5,8/10 makere den kun 2½ stjerne.

Prøver lige at lave en, vender lige tilbage efter :D

$stars = 'http://www.romguy.com/images/stars/10star.gif'; // Farvede stjerner.
  $bg = 'http://www.applianceplanet.co.uk/eshop/img/10stars.gif'; // Baggrunds stjerner.

  list( $width, $height ) = getimagesize( $stars );

  $ratewidth = round( ( $width/100 )*( $movie->rating*10 ) );

  print '<div style="background:url( \'' . $bg . '\' );width:' . $width . 'px;height:' . $height . 'px;">';
  print '<div style="background:url( \'' . $stars . '\' );width:' . $ratewidth . 'px;height:' . $height . 'px;"></div>';
  print '</div>';



Den kode virker fint hos mig.

Du kan se den her:
http://mmkay.dk/start.php

Ja den virker, bortset fra fra at den laver 1½ linje ned af med stjerner

Hmmm, din kode laver så 3 rækker nedaf med stjerner her.

Hej

Her er en du kan downloade, det er godt nok java script / ajax

http://www.masugadesign.com/the-lab/scripts/unobtrusive-ajax-star-rating-bar/

mvh gf

fandt selv løsninen, og ingen af dem her virker.

Hvordan kom den så til at se ud?

Nielle :
Php fil :
          <?php if ($rating_position == $SHOW_RATING_IN_TABLE){ ?>
                <tr>
                  <td valign="top"><strong>Rating</strong></td>
                  <td>
                          <span class="rating">
                          <span style="width: <?php print $rating_width; ?>px; display:block;">&nbsp;</span>
                          </span><?php if ($movie->votes != "") print  $movie->votes . " votes"; ?>
                  </td>
                </tr>
        <? } ?>

CSS fil :
.rating{
  width: <?php print $rating_image_width_px * $rating_number_of_stars; ?>px;
  height: <?php print $rating_image_height_px; ?>px;
  background-image: url(img/rating_grey.gif);
  background-repeat: repeat-x;
  display: block;
}
.rating span{
  height: <?php print $rating_image_height_px; ?>px;
  background-image: url(img/rating_orange.gif);
  background-repeat: repeat-x;
}