Building Browsergames: Getting started with a templating system (Perl)

So far we’ve built a registration page and a login page for our game, but not much else. That’s because we’re hitting a bit of an important milestone for our game: what templating system will we use?

It’s important to choose a templating system before you start building any functionality more complex than your registration and login system – it will help you speed up your development time, and keep your code and your design separate. If you’re like me, that means that you can safely pass your template off to someone who actually can design, and get them to work their magic on your template – without having to worry about your code breaking.

To that end, what Perl templating systems are there out there?

There are a lot of Perl templating systems available. There’s Template::Toolkit, and HTML::Template, and scores of others. For the sake of this quick guide, I’ve chosen to use HTML::Template – although really, you can use whatever templating system you want to(although my examples will all use HTML::Template).

To begin with, we need to install HTML::Template. There are a number of ways to go about this, and if you’ve never installed a Perl module before I recommend that you read this guide to installing CPAN modules, and then install HTML::Template on your system. Alternately, a lot of systems with Perl on them come with the cpan shell – at which point all you need to do to install the module is run this command:

cpan install HTML::Template

At this point, HTML::Template is installed – so let’s build a quick tester script to take advantage of that. First off, we’ll set up the template for the index page that our login page from earlier sends non-administrator users to:

 

<html>
<head>
	<title>My Index Page</title>
</head>
<body>
	<p>Hello, <!--tmpl_var name='username'-->!</p>
</body>
</html>

It looks like a regular HTML file, doesn’t it? And that’s the great thing about templating systems. With a templating system, you can write regular HTML and just intersperse markers for whatever content you’re going to dynamically add, instead of hard-coding your content into your template.

We’ll call that template file index.tmpl – our index page will load it in when it outputs the user’s information. Really, you can use whatever extension you like – I just like .tmpl.

The next thing we need to do is write the code for the page that actually loads in and outputs the template. Here’s what that looks like:

 

#!/usr/bin/perl -w
 
use strict;
use CGI qw(:cgi);
use HTML::Template;
 
my $query = new CGI;
my $cookie = $query->cookie('username+password');
 
my ($username) = split(/\+/,$cookie);
 
my $template = HTML::Template->new(
		filename	=>	'index.tmpl',
	);
$template->param(username	=>	$username);
print $query->header(), $template->output;

All we do in this code is load in the value of the cookie that we set in our login page – named ‘username+password’. Then, we split it based on ‘+’, to return our username and password – because we only need the username, we discard the password:

 

my ($username) = split(/\+/,$cookie);

This obviously shows us that there’s a bit of a problem with our cookie – if a user signs up with a ‘+’ in their username, our split will no longer work! One good way to work around this is to use something a little more complex to divide our username and password, or modify our code slightly to use a regular expression capture instead of split:

$cookie =~ /(.+)\+/;
my $username = $1;

This way, we’ll retrieve all information that comes before the last ‘+’ sign – because crypt returns characters in the set [./0-9A-Za-z], we don’t need to worry about a ‘+’ sign cropping up and wrecking our regular expression.

Once that’s done, all we do is create a new template object, tell it where to load our template from, and then populate the paramater ‘username’ with the value we pulled out of our cookie. And then we’re finished!

As you can see, working with a templating system isn’t that hard – and the gains you make by being able to instantly use the same template accross many pages are huge. There’s really no reason not to be using some sort of templating system – whether you roll your own, or use a pre-existing system.

If you want to see the example code in action, register, and then login, and you’ll be redirected to the index page – which will display the value out of our cookie.