IT.COM

[PHP] Progress/Status Bar

Spaceship Spaceship
Watch
Impact
9
I've just made this when i was messing about with GD functions in PHP, it is a progress bar type thing (not sure of the exact name). It takes 2 inputs, the total and used then creates a status bar type thing, could be useful for showing the amount of disk used.

Heres the main code:

ProgressBar.class.php
PHP:
<?php
/*
	Class For creating a progress bar, using gd image library
	
    Created by: Lee Findlow
    Contact:     [email protected]
    Website:     http://lee.conceptsublime.com/
*/ 

class ProgressBar{
	//Variables to be used
	var $Width = 200; //Width of the Bar
	var $Height = 20; //Height of the bar
	var $Total; //The total amount, i.e. upper limit
	var $Highlight; //The amount to be lit
	
		//Background color attributes
		var $ColorBG_R = 255; //Red
		var $ColorBG_G = 255; //Green
		var $ColorBG_B = 255; //Blue
		
		//Highlight Color Attributes
		var $ColorHighlight_R = 0; //Red
		var $ColorHighlight_G = 255; //Green
		var $ColorHighlight_B = 0; //Blue
		
		//Border Attributes
		var $ColorBorder_R = 0; //Red
		var $ColorBorder_G = 0; //Green
		var $ColorBorder_B = 0; //Blue
		
	//Function to create image
	function Create(){
		//Send out type header
			header ('Content-type: image/png');
		//Create Image
			$img = imagecreatetruecolor($this->Width, $this->Height);
		//Colors and Borders
			//Background
			$back = imagecolorallocate($img, $this->ColorBG_R, $this->ColorBG_G, $this->ColorBG_B);
			imagefilledrectangle($img, 0, 0, $this->Width, $this->Height, $back);
			//Filled Area
			$Highlight = imagecolorallocate($img, $this->ColorHighlight_R, $this->ColorHighlight_G, $this->ColorHighlight_B);
				//Calculate Length of lit area
				$length = (($this->Width - 2)/$this->Total) * $this->Highlight;
			//Create Full
			imagefilledrectangle($img, 1, 0, $length, $this->Height, $Highlight);
			//Lines around border
			$line = imagecolorallocate($img, $this->ColorBorder_R, $this->ColorBorder_G, $this->ColorBorder_B);
			imagerectangle($img, 0, 0, $this->Width - 1, $this->Height - 1, $line);
		//Create Image
			imagepng($img);
			echo $img;
		//Destroy temp image file
			imagedestroy($img);
	}
};
?>
It creates it in PNG format, which can be changed but i've been experimenting and PNG seemed to eb the smallest filesize, below are example usages of it:

Basic - will take the default values set in the script
PHP:
<?php
include_once('ProgressBar.class.php');
$ProgressBar = new ProgressBar;
$ProgressBar->Total = 1024;
$ProgressBar->Highlight = 137;
$ProgressBar->Create();
?>

Or a more advanced version, where you can set additional variables (not everything needs to be set)

PHP:
<?php
include_once('ProgressBar.class.php');
$ProgressBar = new ProgressBar;
$ProgressBar->Width = 300;
$ProgressBar->Height = 45;
$ProgressBar->Total = 1024;
$ProgressBar->Highlight = 137;
//Background of Bar (RGB)
$ProgressBar->ColorBG_R = 255;
$ProgressBar->ColorBG_G = 255;
$ProgressBar->ColorBG_B = 255;
//Highlighted portion
$ProgressBar->ColorHighlight_R = 0;
$ProgressBar->ColorHighlight_G = 205;
$ProgressBar->ColorHighlight_B = 0;
//Border
$ProgressBar->ColorBorder_R = 0;
$ProgressBar->ColorBorder_G = 0;
$ProgressBar->ColorBorder_B = 0;
$ProgressBar->Create();
?>
The only variables that need setting are total and highlight, any feedback appreciated

Thanks,
Lee :)
 
1
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
Very nice, very nice indeed.

- Steve
 
0
•••
The function imagecreatetrueimage() is not valid ;)

Maybe its just my GD acting up.

Anyways, you have to move the header() call to the line before the include("ProgressBar.class.php"); line ;)
 
0
•••
Works fine for me.
The header call just needs to be before any actual output, to it's fine where it is.
 
0
•••
I think that my GD is odd...gotta fix that.

Ah, I put some whitespace in the wrong place. That's why.
 
0
•••
Great script! Rep updated :)
Thanks for nice scriptie :)
 
0
•••
Thanks Hans :)
Just wondered if you've had any problems with it, it's the first time I''ve used GD and it [surprisingly] seems to be working

Lee :)
 
0
•••
Nice one, although you might want to look into just using an image and resizing it to a percentage of the table it's in.
 
0
•••
I hope you don't mind me posting this but I modified your code so I could just call it as an image file. I also changed some variable names to clear the code a little bit.

PHP:
<?php

/*
 * ProgressBar.php by c0demonger
 * Based on by ProgressBar.class.php by Lee Findlow / [email protected] 
 * ---------------------
 * Sample Usage: <img src="ProgressBar.php?t=100&h=56" alt="56 Percent Full" />
*/

$Total = (int) $_GET['t'];
$Highlight = (int) $_GET['h'];

$Width = 200; //Width of the Bar
$Height = 20; //Height of the bar

//Background color attributes
$ColorBG_R = 255; //Red
$ColorBG_G = 255; //Green
$ColorBG_B = 255; //Blue

//Highlight Color Attributes
$ColorHighlight_R = 0; //Red
$ColorHighlight_G = 121; //Green
$ColorHighlight_B = 0; //Blue

//Border Color Attributes
$ColorBorder_R = 0; //Red
$ColorBorder_G = 0; //Green
$ColorBorder_B = 0; //Blue

//Send out type header
header ('Content-type: image/png');

//Create Image
$img = imagecreatetruecolor($Width, $Height);

//Colors and Borders
//Background
$color_back = imagecolorallocate($img, $ColorBG_R, $ColorBG_G, $ColorBG_B);
//Filled Area
$color_highlight = imagecolorallocate($img, $ColorHighlight_R, $ColorHighlight_G, $ColorHighlight_B);
//Border
$color_line = imagecolorallocate($img, $ColorBorder_R, $ColorBorder_G, $ColorBorder_B);

//Calculate Length of lit area
$length = (($Width - 2)/$Total) * $Highlight;

// draw background
imagefilledrectangle($img, 0, 0, $Width, $Height, $color_back);

// draw highlighted percentage
imagefilledrectangle($img, 1, 0, $length, $Height, $color_highlight);

// draw the border
imagerectangle($img, 0, 0, $Width - 1, $Height - 1, $color_line);

//Create Image
imagepng($img);

//Destroy temp image file
imagedestroy($img); 

?>

Might come in handy for some one :)


Cheers.
 
0
•••
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back