Simple PHP Progress Bar

Jonathan — Mon, 15 Feb 2010 03:55:38 +0000

The other day i was looking to create a simple progress bar for a test application. So this is what i came up with in. Keep in mind this is nothing super intelligent or sophisticated.

Lets start by starting creating the function which will be used to create this progress bar.


function progressBar($percentage) {
	print "\"progress-bar\" class=\"all-rounded\">\n";
	print "\"progress-bar-percentage\" class=\"all-rounded\" style=\"width: $percentage%\">";
		if ($percentage > 5) {print "$percentage%";} else {print "\"spacer\"> 
";}
	print "
";
}
?>

Next lets give the Div’s some style.

.all-rounded {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
 
.spacer {
	display: block;
}
 
#progress-bar {
	width: 300px;
	margin: 0 auto;
	background: #cccccc;
	border: 3px solid #f2f2f2;
}
 
#progress-bar-percentage {
	background: #3063A5;
	padding: 5px 0px;
 	color: #FFF;
 	font-weight: bold;
 	text-align: center;
}

Once the CSS has been set, to run this function we just need to throw the function where you want to display it! Change the number inside the function to display a different percentage value.
1
progressBar(60); ?>
Keep in mind you can use some MySQL queries to dynamically change the progress bar. This can be combined with other calculating formula’s also if you would really want this to be effective.

You can review more code snippits on PHP Code Examples

Flickr API and PHP, display images!

Jonathan — Tue, 09 Feb 2010 00:33:13 +0000

Flickr in the past couple years has really turned into a great service. PHP too has been a vital item to internet development! Now lets make them play nice together to grab some of your recent images in your flikr account!

The first step to get this working is to create a Flickr account.
Once your account is created, get a API. You can do that by clicking this link: Create a Flickr API. It should be a 32 character (number and letter) random combination. This will be YOUR API so keep that somewhere easy to get to.

At this point open your favorite development program (for me, CODA or Espresso) and FTP client. Create the file: flickr.class.php and apply the following code:


class flickr {
 
    function flickr($username,$api_key) {
        $this->username = $username;
        $this->api_key  = $api_key;
        $this->user_id  = '';
        $this->response = array();
        $this->timeout  = 5;
    }
 
    function getUserId() {
        $url = 'http://api.flickr.com/services/rest/?api_key=' . urlencode($this->api_key) . '&method=flickr.urls.lookupUser&url=http://www.flickr.com/photos/' . urlencode($this->username) . '/';
        $return = $this->fetch($url);
        return $return->user->attributes()->id;
    }
 
    function getImages($count) {
        $url = 'http://api.flickr.com/services/rest/?api_key=' . urlencode($this->api_key) . '&method=flickr.photos.search&user_id=' . $this->getUserId() . '&per_page=' . urlencode($count);
        return $this->fetch($url);
    }
 
    function fetch($url,$post = false) {
        $ch = curl_init($url);
        curl_setopt($ch, CURLOPT_NOBODY, 0);
        curl_setopt($ch, CURLOPT_HEADER, 0);
        curl_setopt($ch, CURLOPT_USERAGENT, 'Flickr');
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        curl_setopt($ch, CURLOPT_TIMEOUT, $this->timeout);
        $output = curl_exec($ch);
        $this->response = curl_getinfo($ch);
        curl_close($ch);
        if((int)$this->response['http_code'] == 200) {
            return new SimpleXMLElement($output);
        }
        else {
            return false;
        }
    }
 
}
?>

The above code will be complicating if you do not understand PHP Classes and Functions. Hopefully you do understand enough of the syntax to breakdown some of the code.

Next, enter into a page where you would want to display your photos! This is some example code, make sure your “flickr.class.php” require is looking at the correct location. After setting that, change where it says: “username” and “your-api-key”.


 
require_once('flickr.class.php'); 
 
$flickr = new flickr('username','your-api-key');
$images = $flickr->getImages(5);
if($images === false) {
    echo 'Flickr Feed Unavailable';
}
else {
    foreach($images->photos->photo as $photo) {
        echo '. $flickr->username . '/' . $photo->attributes()->id . '"> . $photo->attributes()->farm . '.static.flickr.com/' . $photo->attributes()->server . '/' . $photo->attributes()->id . '_' . $photo->attributes()->secret . '_s.jpg" /> ';
    }
}
?>

Save your files and then take it for a test drive!

Riot Riot » HTML

Simple PHP Progress Bar

Flickr API and PHP, display images!