Quick Review: Zalman VF1000 + RHS88

Just a quickie on some new equipment I just bought. I bought my new PC a couple of months ago, and got into overclocking a bit. My PC has a GeForce 8800 GTS 640 MB graphics card in it.. Of course, it overclocks nicely, but the temperatures are scary to say the least! With the stock cooler I did around 70 idle, 85 degrees at full load (fan auto, Windows Vista). With the fan manually turned up to 100% these temperatures were around 68 idle to 80 at load..

The Zalman VF1000 in combination with the RHS88 heatsink definitely knocked off a lot of degrees, 15 to be exact! My new load temperature is around 65 degrees (fan @ 100%). This, of course, is great! I can actually run the GPU stable at 650/1000 MHz at which the temperatures won't even reach 70! Superb!

Installation was quite doable, however I'd advise you to pay a lot of attention when removing the old heatsink! Also, be sure to clean the old cooling paste of properly (using special chemicals, which you can purchase at your local computer retailer).

The price of the set (you need the RHS88 heatsink if you want to use the VF1000 on a GeForce 8800) is quite high, but of course the performance is incredible! Furthermore it doesn't take up any extra space in your case, which is a big advantage over the HR-03 Plus! Good job Zalman, I'd say!

Screen resolutions

According to Google Analytics, 0% of all visitors ever viewing this blog were using a resolution lower than 1024x768. This, of course, is great news! Sadly though, still around 10% of the users world wide use 800x600 (the difference is that this blog is only read by techy people)..

When do you think web developers should drop support for 800x600 clients (and make them scroll)? Which percentage of visitors is acceptable? Does it depend on the target audience of your website? Or should we all start using fluid designs?

Lightbox, Leightbox and my improved Leightbox

For my latest project I wanted to include a nifty 'Lightbox effect'. The original Lightbox effect however is limited to displaying images and I wanted to show HTML.. So I searched the net and came across Leightbox. Leightbox is a modification to Lightbox which allows you to easily display a piece of HTML (a DOM node actually) using a lightbox effect..

The problem with Lightbox however is the way it binds itself to click events.. You can only load a Leightbox using a click event.. I wanted to have a Leightbox appear using a timer, so I looking into the source and came up with the following:

1) change the initialize function inside the lightbox.prototype to:

initialize: function(ctrl) {
if(ctrl) {
    this.content = ctrl.rel;
    Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
    ctrl.onclick = function(){return false;};
}
},

What this does is check if the 'ctrl' variable is actually passed.. If it isn't, the function does nothing..

2) Add a new function:

initCallable: function(rel) {
this.content = rel;
},

3) You can now manually load up your Leightbox of choice by calling the following:
lb = new lightbox();
lb.initCallable('idOfDiv');
lb.activate();

Update: this technique is no longer valid or neccesary in the current Leightbox version.

New instructions:

1) Leave the lightbox.js (from leightbox) unmodified (download the latest version at: http://eight.nl/files/leightbox/)

2) Remove the class="lbOn" from your lightbox activating links

3) Create a javascript var (outside a function):

var myLightbox;

[4) Use an intialization function (i.e. body onload="initFunction"):

myLightbox = new lightbox($("IDOfActivationLink"));

(Don't forget to set the rel property of the link to the DIV's id you want to show (like you normally would with Leightbox))]

You can now use myLightbox.activate() and myLightbox.deactivate() to turn on/off the lightbox.

Quick Tip: Listing your CakePHP app controllers

Hi! When I started development on my latest CakePHP project, I wanted the homepage to print out a list of all available controllers in my application. Since I'm still in the beginning of development, a lot is bound to change so I don't want to manually have to update my navigation all the time.. Here's a quick and dirty solution for my problem:

// Read all PHP files in the controllers directory, return only the filenames
foreach(r(CONTROLLERS.'/', '', glob(CONTROLLERS.'/*.php')) as $file)
{
// Now convert the filename to a controller name
// Use a static call to Inflector:camelize() to convert the filename (minus _controller.php) to a
// camelized controller name.
$controller = Inflector::camelize(r('_controller.php', '', $file));
echo "\t". '.$controller."\n";
}

I use this in home.thtml, so I get a quick link list to all the controllers I have. You could also modify this and print it in your default.thtml template, so you can access every controller everywhere!

More on Creative X-Fi Xtreme Audio

A month ago, I posted about my frustrations concerning the Creative X-Fi Xtreme Audio soundcard I recently bought. The card is not really compatible with Vista (no control panel, no surround, etc.), so when some time ago the Vista X-Fi drivers were released, I was quite thrilled! This feeling didn't last long however, as the new drivers are only compatible with every other X-Fi card, except for the Xtreme Audio. I let this pass, as Creative has promised it will have proper drivers for it sometime in Q2-2007... But as times goes, I'm getting more and more frustrated.. So I Googled this, and guess what turns up..

The Xtreme Audio version of the X-Fi line does not feature a X-Fi chipset at all! It is merely a tuned up version of the Live 24! card, with some software features that emulate X-Fi functions.

For more information on this, please visit this thread:
http://forums.guru3d.com/showthread.php?t=200348

I don't know yet what frustrates me the most.. Either the fact that Creative published a card that clearly deceives consumers, or the fact that my computer vendor doesn't mention this (complete misinformation actually)...

Anyway, I hope the above mentioned computer vendor will offer me some solution for my problem..

For now, be warned: if you are looking for a soundcard that actually reduces your CPU load (when gaming, for instance), don't go for the X-Fi Xtreme Audio, instead purchase X-Fi XtremeGamer or something alike!

Google SketchUp on Windows Vista

Google has recently released version 6 of the amazing SketchUp. Even though they do not officially support Windows Vista, I have found that it will install and run if you follow the following procedure:

1. Download Google SketchUp;
2. Go to your download directory:
1. Right click the downloaded file -> Properties;
2. Go to Compatability;
3. Activate Compatability mode, select Windows XP (Service Pack 2)
4. Activate 'run this program in administrator mode' (or something like that, I have a Dutch Vista, so translated this myself)
   
3. Now run the setup file

It should all work fine now!

How to remove Ubuntu from a Vista dual-boot config

On my new PC I wanted (still want) to have to a go with Linux. I chose to experiment with Ubuntu. I downloaded the desktop CD, burned it, freed up some disk space (inside Vista) and loaded up Ubuntu from the CD. After some experimenting I figured out how to install Ubuntu in the empty disk space and it all worked fine (GRUB took over my booting (recognized Vista automatically!) and Ubuntu loaded up fine).

Then I tried to install my GPU drivers and everything went wrong.. For some reason Ubuntu wouldn't boot anymore (failed to load X-Server or something). I was completely lost and wanted to remove Ubuntu.

This is where things start to get really messy!

If you simply remove the Ubuntu partition, GRUB (Linux boot loader) will still be on your PC (in control). It will trip out, as the Ubuntu partition will be removed.. Bad thing!

So you need to restore your Master Boot Record (MBR) for Vista (so that Vista will handle the booting, not GRUB).

Google only pointed me to sites that explained how to REMOVE VISTA, which isn't what I wanted. Many sites talked about the 'fixmbr' command, but this is really only available in Windows XP.

So how do you restore your MBR for Windows Vista?

1. Put the Windows Vista installation disc in the disc drive, and then start the computer.
2. Press a key when you are prompted.
3. Select a language, a time, a currency, a keyboard or an input method, and then click Next.
4. Click Repair your computer.
5. Click the operating system that you want to repair, and then click Next.
6. In the System Recovery Options dialog box, click Command Prompt.
7. Type Bootrec.exe /FixMbr, and then press ENTER.

That's it. Now when you reboot your PC, Vista will load automatically... You can now safely boot using your Ubuntu desktop CD, to use the built in Gnome Partition Manager to remove your Ubuntu partition!

Syntax Highlighting on Blogger

Since this is a Technical Blog, concerning topics that have to do with programming mostly I wanted to add some sort of syntax highlighting library to this website. Blogger allows you do fully edit your HTML (actually XML) template, so I did the following:

1. Looked up syntax highlighting on blogger
2. Ended up here: http://www.sitepoint.com/blogs/2006/08/29/flickr-mysql-dba-blog/
   Note how someone states in the comments that it SHOULD be possible to add dp.SyntaxHighlighter since the template is editable.
3. I did as instructed.. I upload the library to my personal website, and editted the template so that the files were included.
4. I surrounded code blocks as instructed by dp.SyntaxHighligher...

The end result: I ended up with each block of code showing as one line of code, with a <br /> tag at the beginning and at the end.

What I discovered was that blogger prints a post on a SINGLE LINE. All new line are omitted (even if you didn't use 'Compose' mode, but editted the HTML directly). SyntaxHighlighter can't cope with this (expects newline characters, etc.).

Blogger, this is seriously messed up and I would REALLY appreciate native syntax highlighting support, or if that is not going to happen a way to include third party libraries and make it work properly!

Furthermore I do like to recommend dp.SyntaxHighlighter if you can't syntax highligh server side! The library is very extensive, easy to use and produces very nice syntax!

An easy way to add (web 2.0 like) tags to your posts

One of the features that is closely linked to the web 2.0 developments is the use of Tags. Tags are short phrases (/words) that describe the article they accompany. Tags are great for categorizing posts and give the reader of an article information on it's subject instantly.

You see, for Tags to be effective it would be best to minimize the variety being used. If all tags concerning programming have a tag 'programming' attached to them, we could use that tag to effectively categorize those posts. Using standard tags for posts helps us create a more structured and better organized category system. The problem however is that you can't remember all the tags you already use and you probably don't have enough room (or want for that matter) to show all the tags in a row.

Using script.aculo.us however this problem is solved very easily! First of all, if you didn't know this already, Scripaculous is an open source Javascript framework. It used the Prototype framework and it provided many graphical effects and other powerful tools to it's users. One of the things it offers is an Autocompletion class, which we are going to use to make our lives a lot easier. Basically autocompletion presents matching options while the user is typing. The user can click the options (or use his keyboard) to select an option after which the text is inserted in his input field. Go to this Scriptaculous demonstration to see what I'm talking about.

First of all we need a database that contains the tags. This database must at least contain these fields:
- id (int, primary key, auto_increment)
- tag (varchar, unique)

Then we need a table to link tags to posts:
- tag_id (int)
- post_id (int)

Next, let's set up the input page. First of all we need an INPUT field, e.g.:
<input name="tags" id="tags" value="" style="width: 300px;" type="text">

Next we need an invisible DIV that Scriptaculous will use to show it's autocompletion results, e.g.:

<div id="auto_complete" style="display: none;"></div>

Now on to the Javascript!
For the sake of easy testing, let's add a local array containing the tags that are already used on the website (the tags the autocompleter will use):
var tags = new Array('news', 'websites', 'links', 'programming', 'php', 'mysql', 'apache', 'games', 'hardware', 'holiday', 'business', 'ICT', 'music');

Be sure to add that inside a Javascript block!

Here comes the magic! Below the form field containing the tags, add the following Javascript function (inside a javascript block:
new Autocompleter.Local('tags', 'auto_complete', tags, {});

This function will add the autocompleter. It will use the INPUT field 'tags', fill the DIV 'auto_complete' with results and use Javascript array 'tags' as it's source. The {} at the end signify the options array (empty for now).

The above works! However there is a small problem with it.. It will only allow you to add one tag! After that, autocompletion won't work.. Luckily, Scriptaculous can fix that! In the empty brackets ({}) at the end, add the following: tokens: ','

Or make it like this:
new Autocompleter.Local('tags', 'auto_complete', tags,
{
tokens: ','
});

Now you can add multiple tags and seperate them using commas! How neat is that! You can also set more options (for instance partial searching, minimum characters for autocomplete to start, etc), which are described here.

Of course it's also possible to load the autocompletion tags using Ajax. I think however it would be better to render the tags array using PHP at page load, because of performance (each Ajax request takes time, while the tags won't change..).

Click here to view my demonstration page for the above!

Next is the PHP part!

I won't go into much detail here.. This part basically requires 2 steps:

1. Split up the tags;
2. Save each one. If they already exist in your table, only add a link from the new post to the tag, if they didn't exist add the new tag and link the post to it.

Splitting up requires a small 'heads-up': scriptaculous will allow whitespace after the seperating comma, so you need to watch out for that aswell. Here's how:

// Strips whitespace at the beginning of a string
$_POST['tags'] = ltrim($_POST['tags']);

// Splits up the tags
$tags = preg_split('/[ \t]*,[ \t]*/', $_POST['tags']);

Now all you need to to is loop through $tags and store the tags (as described in point #2). Make sure you first check if the tag already exists! If it does, only store the link from this post to the tag! If it doesn't, add the tag, then get it's id (mysql_insert_id()) and then store the post->tag link.

On great thing to do with tags is create a (Web 2.0) tag cloud!

Also be sure to check out my demonstration for the above!

Happy web 2.0'ing!

CakePHP Routing Explained

I'm currently playing around a bit more with CakePHP. I'm rewriting our CMS system based on the CakePHP framework. It's a great learning exercise because you constantly have to deal with real life problems!

Just now I was wondering about the url structure of the website. The CMS has two different "areas" designed for two different end users. First there is the site itself (displayed to the visitor of the website) and second there is the CMS administration panel. Because I started designing the system from the administration panel's perspective, I soon discovered that thát part of the website was going to be accessed at the root (/). This of course isn't a logical structure, as it would require the pages the visitors visit to have a prefix or something.. So I looked into CakePHP's routing system and came up with some solutions to my problem.

First of all, there is CakePHP's CAKE_ADMIN config setting. This is a routing solution that allows a function called: index() in controller: users to be accessed like this: /admin/users/index. All you need to do is rename the method to: admin_index() and set the CAKE_ADMIN variable to 'admin'. This seemed like a nice solution, but frankly it wasn't. You can still access the controller without the /admin/ prefix, but it will then give out errors (view for admin_index() could not be found). So I went to play a bit more, and found out the following:

1. You can easily reconstruct Cake's default routing (i.e.: /controller/action/param1/param2/...) by using the following route:
   $Route->connect('/:controller/:action/*', array());
2. The order in which routes are set matter: if one route is successful, Cake will not bother to look at the rest of the routes.

So I designed my own /admin/ prefix, like so:
$Route->connect('/admin/:controller/:action/*', array());

Then by changing the default route (for '/') to the following line:
$Route->connect('/:page/*', array('controller' => 'posts', 'action' => 'output'));

I can have nice page structures, which are rerouted to /posts/output... Using this structure /posts/output knows which page to load by looking at $this->params['page'] (:page is a custom parameter!). Even better, secondary parameters are still passed (thanks to the trailing /*)!

Since CakePHP uses ordering in the routing, it stops routing after a route was successful. So if you place the /admin/ route above the /:page/* route, administration should be fine!
Also, you might want /admin/ to be accessible without passing on controller/action, etc. (i.e. you would end up at the start page for the administration panel). To do this, include the following route (place it at the top):
$Route->connect('/admin*', array('controller' => 'posts', 'action' => 'index', 'page'));

This will reroute a request to /admin to a default routing location (for me: /posts/index/page)

What I find strange is the fact that the above route doesn't stop Cake from looking on (it will still find the more elabore one; /admin/:controller/:action/*). This is possibly because of the trailing Asterix (*)?

You can of course use these techniques to set up different "areas" for your website (while physically all files are located in the same Cake folder). For instance you could have the following areas:
/blog/
/shop/
/customer_service/

simply by setting up your routings properly.

Please note the 'standard' routing variables:
/somedir/:controller/:action

Here: :controller sets the controller Cake will use and :action sets the action that will be invoked. Furthermore you can set custom parameters with this:
/blog/:page
Now the value for page will be available by using: $this->params['page'].
By the way, other parameters are available in the following array: $this->params['pass']!

I know the post is a bit messy, still I hope it might help some people out! Good luck!

Creating an Favicon

A favicon is an icon that is displayed left of the url in your browser (well, in most browsers it is). The icon is also stored in your bookmarks and is thus a very easy way for users to identify your website.

Since a favicon file is a .ico file, I supposed it was kind of hard to create. Guess again. Just create a simple .gif or .jpg file (make sure that it is clear at 16x16 pixels) and upload it on this website. It automatically creates a preview for you and of course you can download the icon and place it on your website. How? Simple, just insert the following lines in the <head> section of your website:

<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />

Also make sure you place the favicon.ico file in your webroot/document root!

Update: I would advise that you create a gif or jpg image of 32x32 pixels, which is also clear at 16x16 pixels. The favicon.ico stores 2 versions of the icon, one is 16x16 while ther other is 32x32 so you should make sure that your submitted image is fine at both sizes!

Further endeavours into baking Cake(PHP)

I have been playing around with CakePHP for the past several days. I've started work on two projects using Cake; a financial administration system (for my company) and a redesign of ITKA's iCMS Content Management System (link is in Dutch). I feel that I'm learning CakePHP quite quickly, which of course is a good thing. A word of warning though to other aspiring Bakers (see, I've already copied their slang!): CakePHP takes somes time to master, and I really wouldn't advice anyone using it without complete knowledge of how the system works.

The point is that CakePHP takes convention over configuration. Personally I love this concept, what's the point in being able to configure everything if you could also just play by the rules. You see, reading up on configuration in the manual is just as time consuming as reading up on Cake conventions. Furthermore Cake offers configuration exactly where you need it. Who cares that you need to access functionality via the controller (e.g. www.example.com/posts/edit/1) if that is only visible to the user. Routing is a powerful CakePHP function that is quite similar to mod_rewriting, except that it is more powerful. You can easily prefix /admin/... to administration functions and make pretty urls like www.example.com/blog/my-first-post using routing. Even if you use exceptional names and stuff the standard Cake conventions can be manually overwritten, it's all possible!

The one major question that currently still has my concern is performace. If you print_r() some objects used by Cake during runtime you can see that they are truly massive containing information on the database tables, related database tables (and models), etc. etc. Anyone have any thoughts on this?

For now I have got some tips for beginning Cake developers (like myself).

1. Use scaffolding and only scaffolding when you are designing your database structure. At the start of a project, first build all the necessary models, controllers and db tables. Link them using Cake's $hasMany/$belongsTo/$hasOne/etc. functions and check to see if all relations work properly (i.e. when viewing one thing, you get 'related [other things]'. Scaffolding will really help you out here, as you can instantly check everything (no need to rewrite any HTML, etc).
2. At the start of an application get your internal structure right. Like mentioned in #1, use scaffolding to get your database/model relation structure right. In the early stages it's a) easier and b) less time consuming to set everything right for final implementation. Consider Cake's MVC approach: you need to seperate data, business logic and presentation. First get your data and data structure right, then add business rules and logic and only at the end worry about presentation. The method is not the same as the MVC approach (which is only about code seperation). This is an engineering approach that takes on different parts of the project one-by-one, in a logical order.
3. Learn by experience. This by the way goes for any programming language learning and is generally the way I advice people to learn programming. The point is that programming isn't something you know, it's something you feel. It's a creative process! Building a program can be done in many different ways and quite often there isn't even a best way. You need consider your alternatives, choose and finally go with that choice. You will always encounter new problems as a developer and so you will always need to come up with creative solutions for those problems. The best way to learn to do this is by gathering experience. Create a small but challenging project for you to take on, take it on and come up with solutions for the problems you encounter. Search the web, talk to other developers on forums, but get your problems solved. CakePHP, due to it's extremely intuitive conventions, is perfect for this learning method. Finding the answer you are looking for in Cake is easy as for some reason you just know where to look.
   

As you can see I am very enthusiastic on Cake. I'm looking forward to finishing up the applications I've started work on. Those projects should provide me with a sufficient knowledge base for implementing CakePHP in customer projects, which would be great considering the development time Cake saves you :)

Creative X-Fi frustrations

When I recently purchased a new computer, I chose for the Creative X-Fi Extreme Audio sound card. That version is actually the cheapest of the X-Fi series and right now I am really frustrated by Creative. There still is not Vista driver available that enables the X-Fi functionalities. Right now the only Vista driver is seriously crippled, which means I can't even get more that stereo sound out of my speakers. In windows testing I do get sound out of the rear speakers and subwoofer, but in applications it just doesn't work. Apparently this has to do with the lack of support for CMSS-3D (creative surround sound of something), but clearly this is just bad service by Creative. Vista has been available for 2 months now, please hurry up with proper driver support!

CakePHP: Setting up the ACL tables

I am currently exploring my way into CakePHP. Have to say I am really enjoying working with it. Everything is starting to get clearer to me step by step.. Just now I've been struggling with getting the ACL tables properly set up. The manual suggests that I simply ran the /cake/scripts/acl.php scripts from the command line. I appeared that this was easier said than done, so here's what I eventually came up with:

1. Open your command prompt (Windows Key + R);
2. Move to your PHP directory (which contains php.exe)
3. Run the following command:
   php.exe -f "x:\webroot\cake project\cake\scripts\acl.php" initdb

The script now properly executes and creates the aros, acos and acos_aros tables. Please make sure your database is properly configured and for the rest just follow on what the manual has to say!

Apache server on Windows Vista

In the past I always configured my own Apache webserver / PHP, etc. I don't know why (I'm not that much of a server expert), but it just fellt better. On my new PC with Windows Vista however, I couldn't get it to work easily. So I looked around a bit and stumbled upon an all-in-one solution called Wamp. According to the developers it works fine on Vista (takes care of UAC), and after some testing I can happily confirm that it does! The setup asks a few questions, so it automatically configures the web servers. Another cool thing is that Wamp runs an icon in the taskbar (next to the clock) that let's you quickly configure stuff! Nice!

Running multiple version of IE on one machine

Microsoft auto updating can be quite annoying for us web developers.. A large amount of users still use IE6 (some even use IE 5/5.5) and after IE7 is (automatically) installed for you, you can't test your websites using olders browsers anymore. At least, not without a little effort. Luckily Yousif has created this amazing package called Multple IE, that actually installs Internet Explorer versions 3, 4, 5, 5.5, and 6 as standalone applications! It creates shortcuts for the chosen versions (you can configure which versions to install) which is truly great! A must have for web developer's, I'd say. Right now I've tested version 5, 5.5 and 6 in Windows XP SP2 and they work fine.

My own first taste of CakePHP

I've started experimenting with CakePHP yesterday. This was actually the first time I've used any framework and even though I don't completely grasp how it works yet, I was already pretty impressed by what I could build up in just half an hour (using Sitepoint's CakePHP tutorial).

The idea with CakePHP is as follows:

Cake is a rapid development framework for PHP which uses commonly known design patterns like ActiveRecord, Association Data Mapping, Front Controller and MVC. Our primary goal is to provide a structured framework that enables PHP users at all levels to rapidly develop robust web applications, without any loss to flexibility.

Personally the main advantages I take out of this is that using such a framework forces you to use a certain approach to programming, which usually means following a good practice one. The MVC (Model View Controller; seperation of data, output and business logic) approach brings more structure into your applications and with the help of all the built in functions provided by CakePHP is very powerful, yet also quite flexible!

I recommend any PHP developer with some spare time on their hands to take a look at this tutorial and the CakePHP website. The website contains a pretty elaborate manual with detailed installation and configuration instructions (don't worry, takes about 5-10 minutes). Getting started with CakePHP with just the manual was a bit difficult though, so that's why I recommend the Sitepoint tutorial. This tutorial will take you around 30 minutes to complete and really gives great insight in what CakePHP (or a development framework for that matter) is all about.

Update #1: acutally this post on Giga Promoters Blog has some very interesting things to tell about CakePHP before you get started.

Update #2: another great tutorial by IBM. Actually part of a series. (requires registration with IBM, free).

CryEngine 2 movie

I have been following the development of Crysis and the CryEngine 2 game engine for some time now, and it is simply amazing. Just take a look at this movie, which demonstrates some ingame image rendering capabilities, A.I. and next-generation physics. If all the stuff your read about and see of this engine/game is true, it truly is an amazing piece of work. This is truly next generation stuff!

Integrating DIGG into your blogger

In a (successful) attempt to include a 'Digg this' button into this blog I came across this website which quite clearly explains how it is done. I have only one addition, when replacing the code you need to 'download the full template' first, edit that file and upload it again.

Why you want Object Oriented Programming in PHP

First let me explain what the issue is around Object Oriented Programming (OOP). Traditionally (from the beginning of the computer era), programming was done by combining conditional statements with GOTO blocks to create a program flow. In the early '70s a Dutch computer scientist Edsger Dijksma strongly advocated the use of procedural programming, which means abandoning GOTO statements and creating a sort of chronological program flow in your code (from top to bottom). This style has been widely adapted and for most people is the way they program PHP applications. It is however already a thing of the past. Most modern programming languages are based on an OO approach and don't even allow for procedural coding anymore (for instance in languages as Java, C++, C#, Python, and Ruby). Explaining OOP goes beyond the scope of this article, so for understanding OOP in PHP I'd like to point you in this direction. For now let's just say that OOP is about creating relatively small objects with specific functions that interact with each other to form a complete application.

Typically, the main advantages of OOP are:

• Reusability of code; a well designed object has only one specific function and is therefore completely independent of the environment it is placed in and thus can be reused easily.
• Clearer structure of code; again a well designed object has only one specific function which means that all the code supporting that function is located in one place which increase maintainability.

A major disadvantage of OOP is that it requires more lines of code and is therefore more time consuming to produce.

In PHP we as developers are left with a choice. Typically, anyone who started out with PHP without any (OO) programming background will have started with learning procedural coding. Most tutorials on the web only cover procedural coding and quite honestly, the old fashioned way is just easier to use in many situations (for instance in small applications, or when you just start out with PHP).

However (here comes the wise lesson) Object Oriented Programming in PHP is definitely the way to go for any serious PHP developer taking on serious projects. For the past 8 months my web development firm has been working on a huge project for a real estate agent. The application takes care of many aspects of the clients administration, publishes it's information to multiple people (each with different clearances) and in multiple formats (web content, PDF, RTF). Using OOP in projects such as this is so incredibly superior over using procedural coding. Using OOP, we for instance model a real estate object (a house...) as a PHP object. The (PHP) object contains over 60 variables (all stored in a MySQL database but intelligently retrieved by the object) and many functions that allow the object to update it's data and return information on itself based on the users clearance levels. The data itself can be interpreted by either our web content generator object, or by our PDF generator object, no changes required. This goes for all the little parts the application has and you wouldn't believe how much time it has saved us in making small adjustments and adding small new features.

Doing this project in procedural code would have been horrible and messy. Just imagine having new additions to your project specifications on a weekly basis for several months and jotting all those things in between the already existing code using if/else statements etc. in procedural coding. You would probably go screaming mad about the PHP files containing more than 500 lines of code without any clear structure in them..

What's more, many of the classes we have designed for this project are useful in other projects as well (this actually already proved true). Furthermore we are experiencing nice and clean work divisions since we switched to OOP which definitely increased both our productivity and efficiency.

The thing is that the extra work needed when using OOP will be earned back with huge interest in a little while. Maintenance time is dramatically reduced, there is no more code overlap in your application and you (and your fellow programmers) will work more efficiently due to clearer work divisions and structure. Switching to OOP is really not that difficult, given the many tutorials (for instance this one, by Harry Fuecks) and will save you valuable time and most of all make your life easier.

If you are still not convinced I strongly suggest you read Harry Fuecks' tutorial mentioned in the previous paragraph as it will point out more advantages to you. Also you mind want to start learning OOP because of the PEAR project (standard libraries written in OO PHP, designed to really make your life easier by offering standard functions in freely available packages). Feel free to ask questions if you have any!

Gray out page with pop-up

Honestly, I don't know a better name for this technique than a page gray-out with a dialogue box pop-up (if this actually has a name, or you know a better one, please do inform me). What I'm talking about here is a technique that instantly grays-out the entire web site when you click a link, so that all your attention shifts to the pop-up that is loaded. The technique is used quite often by Web 2.0 enabled websites, so I bet that you have already seen something like it and probably thought that it was pretty cool.. That was exactly what I thought, so I tried it out and came up with a simplesolution which I want to share with you all.

A demonstration is available right here, and I suggest you load it up so you know what I am talking about! The simple (ugly) page has a neat Javascript application build in, that allows you to dynamically fill an Unordered List (UL html element). The fun part is of course the way the dialogue box is presented! After you click the link the entire page grays-out (it's not even accessible anymore) and a dialogue box pop-up is presented where you can fill in the new entry's value.

Some neat things about this solution:

• Enter/Return key is enabled, so you don't have to (mouse) click the Add button.
• You can press the ESCAPE button, which will close the dialogue box. If the new value field is not empty, the script will first ask for confirmation.
• 'Focus' shifts to the pop-up (so the user can start typing right away).
  
• The gray overlay always fills out the entire page, even if the resize the page later on.
• The script is both MSIE and Firefox compatible (tested in MSIE7 and Firefox 2.0, should work in older versions as well, perhaps not IE4/IE5).

The code on the demonstration page is available for all public use, so feel free to copy it. The code itself contains plenty of documentation which should make it understandable and adaptable to your own personal needs.

Please note: this script uses the Prototype and Scriptaculous libraries, which are available for free on the respective websites.

How it is done
The most important part is the overlay. This DIV element is hidden at first, but can be made visible using Javascript. The CSS style of the element is very important:

• position: absolute;
• left: 0px; top: 0px;
• width: 100%; height: 100%;
• background-color: #666666; /* dark gray */
• opacity: .7; filter: alpha(opacity=70); /* opacity: partly transparent */
• z-index: 1000;
  

(please view the demonstration page code for more details).

The dialogue pop-up is positioned above the gray overlay, so that it is accessible and visible to the user. After the dialogue box is either submitted or closed (using the close link, or the escape button) the gray overlay and dialogue box are hidden again.

First of

Welcome to my Technology Blog! In the past I was part of the (late) Genesis Evolved tech blog team. The site sadly died, but after taking a little break I have decided to get back at writing some technical articles for your reading pleasure and interest. The topics covered on this weblog will mainly be web development and web technology. You can expect useful tutorials, tips and links, alongside interesting technical/ethical debates.

About the author:
My name is Paul van Iterson. I'm a 21 year old Dutch web developer / Information Technology & Economics student at the Erasmus University Rotterdam. I work for a web development company and run a small web dev firm on the side. I have an active interest in the Internet and its surrounding technologies and through this blog I hope to share my knowledge and insights with the world.

Enjoy.