Progress bar : classe php4

Commenter

Contenu du snippet

Cette classe est basée directement sur le code de "frop01" qui se trouve ici:
http://www.phpcs.com/code.aspx?id=32601

J'en ai juste fait une classe (et fait qques changement (timeout, ajout de texte, hide,..) car j'en avais besoin, et donc..ça peut servir..

je l'ai testé sous Firefox, je pense qu'elle doit fonctionne sous IE..

Source / Exemple : 


//la classe (fichier class_progressbar.inc)
<?php

class ProgressBar{

//----------------- parameters -----------------
	// position parameters
	var $top=60;
	var $left=50;
	var $width=200;
	var $height=30;

	//color parameters
	var $border_color='#000000';
	var $percent_color='#FFCC00';
	var $txt_color='#000000';
	var $background_color='#006699';
	
	//size parameters;
	var $percent_size=15;
	var $txt_size=15;

	//html parameter

//----------------- private functions -----------------
	function Hide(){
		echo '<script>';
		echo 'document.getElementById("myprogressbar").style.display="none";';
		echo "</script>";
	}

//----------------- public functions -----------------
	function setPosition($left,$top, $width, $height){
		$this->top=$top;
		$this->left=$left;
		$this->width=$width;
		$this->height=$height;		
	}

	function setColors($border_color,$percent_color,$txt_color,$background_color){
		$this->border_color=$border_color;
		$this->percent_color=$percent_color;
		$this->txt_color=$txt_color;
		$this->background_color=$background_color;
	}

	function setSizes($percent_size, $txt_size){
		$this->percent_size=$percent_size;
		$this->txt_size=$txt_size;
	}
	
	function generateHTML(){
		$html='<div id="myprogressbar" style="display:block;position:absolute;top:'.$this->top;
		$html.=';left:'.$this->left;
		$html.=';width:'.$this->width.'px;">';

		//progress bar div
		$html.='<div id="progrbar" style="position: relative; top: 0px';
		$html.=';left: 1px';
		$html.=';width:0px';
		$html.=';height:'.$this->height.'px';
		$html.=';background-color:'.$this->background_color.';z-index:0;"></div>';

		//percent div		
		$html.='<div id="percent" style="position:relative;top:-'.($this->height+1).'px';
		$html.=';left: 0px';
		$html.=';width: 100%';
		$html.=';height:'.$this->height.'px;border:1px solid '.$this->border_color.';font-family:Tahoma;font-weight:bold';
		$html.=';font-size:'.$this->percent_size.'px;color:'.$this->percent_color.';z-index:1;text-align:center;">0%</div>';
		
		//text div
		$txttop=$this->top+1+$this->height+1;
		$html.='<div id="progrbartxt" style="position:relative;top:-'.($this->height).'px';
		$html.=';left:0px';
		$html.=';width: 100%';
		$html.=';text-align:center';
		$html.=';font-size:'.$this->txt_size.'px;color:'.$this->txt_color.';z-index:1;text-align:center;">loading</div>';
		
		$html.='</div>';		
		return $html;
	}

	function SetTimeOut($timeout){
		set_time_limit($timeout); //need safe mode off !
	}
	
	function SetPercent($percent, $text=""){
		echo '<script>';
		echo 'document.getElementById("percent").innerHTML="'.$percent.'%";';
		echo 'document.getElementById("progrbar").style.width="'.($percent*2).'";';
		if (!empty($text))
		{
			echo 'document.getElementById("progrbartxt").innerHTML="'.$text.'";';
		}
		echo '</script>';
		flush();
	}	

	function End($hide=true){
		echo '<script>';
		echo 'document.getElementById("percent").innerHTML="100%";';
		echo 'document.getElementById("progrbar").style.width="200";\n';
		echo 'document.getElementById("progrbartxt").innerHTML="loaded !";';
		echo '</script>';
		flush();
		if (!empty($hide))
			$this->Hide();		
	}

}
?>

//la page de test
<html>
<body>
<?php
 include ('class_progressbar.inc');
$pb=new ProgressBar;

//optional
$pb->setPosition(200, 50, 200, 20); //optionnal (default value are defined)
$pb->setColors('#000000','#FFCC00','#FF0000','#006699'); ////optionnal (default value are defined)
$pb->setSizes(15, 18);
$pb->setTimeout(30);

//generate html
echo $pb->generateHTML();

//simulate a "time consuming" task
for ($i=0;$i<=100;$i++)
{
	$pb->setPercent($i,'loading message');
	for ($j=0;$j<=100000;$j++) {$p=1;}
		$p=1;
}
//end the progress bar (and hide it when finished)
$pb->End(); //or $pb->End(false) to avoid hidding progress bar
?>
<div style="positon:relative">your document is now loaded !</div>
</body>
</html>

Conclusion :


- des erreurs javascript sont générées... je les corrigerai ASAP.

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (davwart)