A simple image gallery using class and objects

class and objects php
For several months I’ve been coding the hard way. When I say the hard way, I mean using the Procedural Programming Paradigm where I wrote tons of code spanning over 1000 lines. Take for example this project. Now, I may be a noob when it comes to other developers but trust me, if you are not the one who write its program, you will have a hard time understanding its code as you may have to jump hundreds of lines of code just to trace where the values and functions are coming from. And since my code is just as messed up as my apartment… I’m pretty sure it’ll give you a headache.

After taking the advice of some fellow developers in the company where I provided my service, most especially Michael Bitokhov, who criticized my coding method as something not developer-friendly, telling me that if someday I am to pass my project to another developer, that developer will have a hard time developing it. I kind of agree actually, and I also realize that my coding style is eccentric, messy, and unprofessional. Which is why I am now trying to improve my methods by learning another coding paradigm. This time… I’m going for object-oriented programming.

Adapting a new programming paradigm is not easy and does not just happen over night. Since I was used to Procedural Programming, I have a problem grouping my code into a more structured format. For this, it needs practice and constant exposure to this paradigm. OOP or Object-Oriented Programming is a practical way to code. It is more organized, structured, and practical. Since codes are grouped into classes and objects, it would be easier to call them and the need to write repetitive codes can be avoided. Instead of longer and many lines of code, we can shorten it and reduce it to a few lines.

I took a beginner’s lesson from here. After learning the style, I began applying it in a small Image Gallery project. Now, I don’t have the files this time, but I’m sharing my code below. By the way, the project is shown in the picture above.

Here’s my code:

<?php
	class image_gallery {
		const br = '<br />';

		var $title;
		var $author;
		var $image;
		var $dir = 'images/';

		public function display_image(){
			echo "<div style=\"float: left; margin-right: 40px;\">";
			echo "<img src=\"{$this->dir}{$this->image}\" width=\"200px\" height=\"200px\">".self::br;
			echo "<font size=\"4px\"><b>{$this->title}</b></font>".self::br;
			echo "<font size=\"3px\">Author: {$this->author}</font>".self::br;
			echo "</div>";
		}

		public function disp_image($title,$author,$image){
			$this->image = $image;
			$this->title = $title;
			$this->author = $author;
		}
	}

	$content = new image_gallery;
	$content->image = 'newport-nj-hudson.jpg';
	$content->title = 'Newport New Jersey';
	$content->author = 'AL2Meta';
	$content->display_image();

	$content->disp_image('Newport New York Skyline','AL2Meta','newport-ny-skyline-enhanced-ii.jpg');
	$content->display_image();

	$content->disp_image('Riverview Park','AL2Meta','riverview-park.jpg');
	$content->display_image();

	$content->disp_image('Riverview Park Yellow','AL2Meta','riverview-park-nj-ny-skyline-enhanced.jpg');
	$content->display_image();
?>

Now, as you can see, the code is much cleaner and shorter than writing in a procedural way.

Talk Code

OK, let’s talk about the code I wrote. Let’s begin by defining what is a class…

A class is a group of objects. An object is a function that contains the program. In the code I made (refer to the code above), we have a class named image_gallery. Inside the class, we need to set the variables and the constants. Constants are like variables, the only difference is that once they are defined, they cannot be changed or undefined, unlike the variables. Constants are represented by const while variables by var. Notice that the variables inside the class are not defined… yes, unlike in procedural programming, we can actually set the variables here as placeholders. We can give them value on the fly and without having to declare them over and over again. For now, they are left empty. But you can also define it just as what I did with $dir. However, once defined, it gets a value. Since it now has a value, it has to be redefined again if we want it to take another value, but for this project, we can make it work like a constant.

After the variables, we have the objects — public function display_image() and public function disp_image. Actually, the two works pretty much the same in this project, but the second one (public function disp_image) won’t work without function display_image(). In this case, the first is stand alone and the second is dependent to the first object. The functions as we know contains the set of instructions. In the case of display_image, it contains a value that creates a <div> with an image, a title, and author content. Notice the {$this-> variable? For example, $this->image. $this is a placeholder telling PHP that $this or this variable is for var $image, thus $this->image. The same with $this->title and $this->author. Also note of .self::br. self is use to call a property or method inside a class. In this case, we are calling the const br, which contains the line break (<br />).

Outside of the class, we are calling the class objects for execution. $content is a dynamic placeholder (actually you can name it whatever you want [ie. $whatever, $my_ass]). The purpose for this placeholder is to contain the value of the objects or instances inside the class. But before that can be done, PHP has to be instructed to run the objects first. That’s why we have the line $content = new image_gallery. It means we are going to run the contents of class image_gallery. The following line is $content->image. It means, call the line of code in an object where $this->image can be found. The same for $content->title, and $content->author that calls for the lines for $this->title and $this->author. Now, the last code is $content->display_image(). This line of code will execute the object in the format we describe in the lines before it (line 26-28).

Beginning at line 31, we use another object, disp_image, which is a simplified version of function display_image(). However, note that this object is dependent to display_image(). The purpose of this object is to group the variable values contained in function display_image() into a single line format. In the function disp_image, notice that all that it contains are $this->image, $this->title, and $this->author. They actually contain the values for line 12-14, and instructs PHP that it should return $image, $title, and $author, which are yet to be defined. To call object disp_image, we simply write it as $content->disp_image. Note that the values for $title, $author, and $image are still empty, so we need to define its contents inside the ( ), example we enter $content->disp_image(‘Newport New York Skyline’,’AL2Meta’,’newport-ny-skyline-enhanced-ii.jpg’). The order should follow the order of how $title, $author, $image has been ordered in function disp_image. Object $disp_image will be entered as the new values for $display_image $this variables, now all we have to do is call $content->display_image();. If you notice, in this case, disp_image is merely playing a supporting role by instructing what the values for the variables inside display_image would be.

Trivia

In using classes, sometimes you get a weird error called T_PAAMAYIM_NEKUDOTAYIM. That error has something to do with the wrong placement of double colons. It is actually a hebrew word and was incorporated into PHP when some parts of the ZEND engine were integrated into it. Read more about it here.

Follow me at:

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.