energy bars

[almightyegg]

right, to start off, I don't know whether I need php for this but....

I am making a text based game and want to have energy bars like when you are attacked and you lose energy, a bit of read shows on the end like...
G=energy left R=energy gone
if you have a max of 100 energy and lose 40 it will look like
GGGGGGGGGGGGRRRRRRRR
GGGGGGGGGGGGRRRRRRRR

how would i do this??

[marcus]

You can always just use a table

[code]
<table border=0 cellspacing=0 cellpadding=0>
<tr>
<td name=health width="<?=$g?>" background=backgroundurl>&nbsp;</td>
<td name=gone width="<?=$r?>" background=backgroundurl>&nbsp;</td>
</tr>
</table>
[/code]

[Psycho]

You could do something like this:

[code]<div style="background-color:red; width:200px;">
<div style="background-color:green; width:60%;"></div>
</div>[/code]

Just set the value of te inner div width to the correct percentage value. You can customize the look using additional style attributes.

[almightyegg]

but...it changes...so one person could have 90/1111111 and another 1/1 so the first person would have an awfully long lf bar  :o is there another way to do it but keep it all at the same length???

[marcus]

then do this:

[code]
<?php
$g = amountleft;
$r = amountgone;

echo "
<div style=background-color:red; width:$gpx;>
<div style=background-color:green; width:$r;></div>
</div>
";
?>
[/code]

[almightyegg]

surely that still makes it the same length ???

[marcus]

lol, he typed it wrong.

[code]
<?php
$g = amountleft;
$r = amountgone;

echo "
<div style=background-color:red; width:$gpx;></div>
<div style=background-color:green; width:$r;></div>
";
?>
[/code]

[Psycho]

You also need to add the percent symbol!

Set the width of the container div to whatever width you want all of them to be. The percentage width of the inner div will be determined by the user's properties.

[code]<?php
$maxhealth = 100; //This is set per the user's properties
$currenthealth = 60; //This is set per the user's properties

$percentHealth = round($currentHealth/$maxHealth*100);
echo "<div style=\"background-color:red; width:200px;\">";
echo "<div style=\"background-color:green;width:".$percentHealth."%;\"></div>";
echo "</div>";
?>[/code]

[marcus]

[code]
<?php
$g = amountleft;
$r = amountgone;

echo "
<div style=width:100px;>
<div style=width:$g%; background-color:red;>
<div style=width:$r%; background-color:green;>
</div>
";
?>
[/code]

this should produce something like:

(if g = 55 and  r = 45)

GGGGGGRRRR

[almightyegg]

doesnt show anything at all :(

[code=php:0]
$percent = round($mem[curlf]/$mem[maxlf]*100);
echo "$mem[country]<br><img src=$mem[img]><br><br>
<div style=\"background-color:green;width:200;\">
<div style=background-color:red; width:%".$percent.";></div></div>
";
[/code]

[marcus]

Have you tried mine, the alteration of his w/o the round?

[almightyegg]

but surely yours will be perminantly fixed like that  ??? it has no variables

[marcus]

yes it does, lol, i had to edit it, i was messing with it

[almightyegg]

nothing is echoed out...

[almightyegg]

o wait...i lied...it is now showing a green bar 15px long (thats how much energy i have) so that makes it show 15%

[marcus]

is it showing the red bar?

[almightyegg]

no because my energy is 15/15 therefore it is all green

[marcus]

oh, that's good

[Psycho]

[quote author=almightyegg link=topic=114987.msg468037#msg468037 date=1163536138]
doesnt show anything at all :(

[code=php:0]
$percent = round($mem[curlf]/$mem[maxlf]*100);
echo "$mem[country]<br><img src=$mem[img]><br><br>
<div style=\"background-color:green;width:200;\">
<div style=background-color:red; width:%".$percent.";></div></div>
";
[/code]
[/quote]

Well, I did not name the variables consistently, but you made some mistakes in your implementation. You have the percent symbol coming before the number. And you should add 'px' after the width in the first div.

Put this code into a file and run it
[code]<?php
$maxHealth = 100; //This is set per the user's properties
$currentHealth = 60; //This is set per the user's properties

$percentHealth = round($currentHealth/$maxHealth*100);
echo "<div style=\"background-color:red; width:200px;\">";
echo "<div style=\"background-color:green;width:".$percentHealth."%;\"></div>";
echo "</div>";

echo "<br><br>";
$maxHealth = 200; //This is set per the user's properties
$currentHealth = 60; //This is set per the user's properties

$percentHealth = round($currentHealth/$maxHealth*100);
echo "<div style=\"background-color:red; width:200px;\">";
echo "<div style=\"background-color:green;width:".$percentHealth."%;\"></div>";
echo "</div>";
?>[/code]

You can also see a live site where I used the same type of functionality here: http://repeat-offenders.org/modules.php?name=BF2ServerView&op=leaderboard

[Barand]

Save this as "bar.php"
[code]
<?php
// set dimensions
    $w = 102;
    $h = 6;
// create image
    $im = imagecreate($w, $h);
// set colours to be used
    $bg = imagecolorallocate($im, 0x00, 0xE0, 0x00);
    $black = imagecolorallocate($im, 0x00, 0x00, 0x00);
    $barcolor  = imagecolorallocate($im, 0xFF, 0x00, 0x00);
// draw border
    imagerectangle($im, 0,0,$w-1,$h-1,$black);
// get value and max value from query string
    $val = $_GET['val'];
    $max = $_GET['max'];
// calculate dimensions of inner bar
    $barw = $max ? floor(($w-2) * $val / $max) : 0;
    $barh = $h - 2;
// draw inner bar
if ($barw)
    imagefilledrectangle($im, 1, 1, $barw, $barh, $barcolor);
// send image header
    header("content-type: image/png");
// send png image
    imagepng($im);
    imagedestroy($im);
?>
[/code]

In another page
[code]
<?php
$energy = 15;
echo "Energy : <img src='bar.php?val=$energy&max=100' > $energy%";
?>
[/code]

[The Little Guy]

http://d-top.org/webdeveloper/form.html

Here is the PHP code for that:

[code]<table style="width:500px;" border="1">
<tr>
<td>
<?php
if($_POST['percent'] > 100){
$stat_bar = "green.gif";
$length = 100;
}
elseif($_POST['percent'] >= 50){
$stat_bar = "green.gif";
$length = $_POST['percent'];
}elseif($_POST['percent'] < 50 && $_POST['percent'] > 30){
$stat_bar = "yellow.gif";
$length = $_POST['percent'];
}elseif($_POST['percent'] <= 30){
$stat_bar = "red.gif";
$length = $_POST['percent'];
}
echo'<img alt="'.$stat_bar.'" style="width:'.$length.'%;height:5px;" src="'.$stat_bar.'">';
?>
</td>
</tr>
</table>[/code]