After a trip to Dublin I finally launched the beginning of a new social tourist Dublin guide. It is exactly the same site as both the Swedish Fuengirola guide as well as the English Fuengirola guide I launched after living there for five months. The functionality is somewhat basic as of yet but every now and then I’ll add something more.

Basing three different sites, even though they are very similar, using two different languages gives me the possibility to try out several parts of Zend Framework. It also requires a good design both in the backend and frontend to keep it maintainable. I thought maybe some people would be interested in a basic overview of the different parts needed to put everything together.

Backend

The sites aren’t really that complicated. On a basic level there is a MySQL database and a database layer using Zend_Db/Zend_Db_Table, there is a Zend Framework MVC architecture using models, controllers, views, layouts with Zend_Layout as well as a few view helpers and some HTML, CSS as well as Javascript. All commonly needed. There is more needed to make it a sitethough.

I want as little configuration per site as possible but I naturally still use Zend_Config_Ini for settings. Zend_Registry is needed to keep the global scope clean and is used to store instantiated objects that need to be available throughtout the website logic.

I have been a bit particular on using ZF as often as possible on these sites. With few exceptions. Thus I also use Zend_Form, Zend_Locale, Zend_Translate, Zend_Cache and more. Zend_Cache is really a no brainer and mainly used to speed up translations. This is extremely easy as Zend_Translate and Zend_Locale both are connected to the cache with one simple method call each. It is not complete but how simple this is to setup is illustrated by the below code.

$configuration = new Zend_Config_Ini(
    APPLICATION_PATH .'/config/app.ini',
    APPLICATION_ENVIRONMENT
);
$frontendOptions = array(
    'lifetime' => $config->cache->lifetime,
    'automatic_serialization' => true
);
$backendOptions = array('cache_dir' => $config->cache->dir);
$cache = Zend_Cache::factory(
    'Core',
    'File',
    $frontendOptions,
    $backendOptions
);

$conf_locale = $configuration->locale;
$locale = new Zend_Locale($conf_locale);
$locale->setCache($cache);

Zend_Translate::setCache($cache);
$translate = new Zend_Translate(
    'array',
    APPLICATION_PATH .'/config/translation-' . $conf_locale . '.php',
    $conf_locale
);
$translate->setLocale($conf_locale);

Zend_Form have had a few problems in many versions of ZF. In my opinion it is also a bit bloated and limiting to be used all the way. (Even though I like the automatic connection to the translation functionality in Zend_Translate and the validation through Zend_Validate) So I have settled for a simpler way where I use Zend_Form fully for validation (with Zend_Validate) and then give the view access to the form through a Zend_Form subclass to be able to print the fields individually. I think this is easier to handle than all the overloading and coding needed to fully make Zend_Form create forms as I want them. Another good thing with the form classes is that they too are locale aware and are translated automatically by connecting them to Zend_Translate through the simple line Zend_Form::setDefaultTranslator($translate);. The sub classed Form utility class looks like below. The generated elements are translated automatically. Very convenient.

class Custom_Form extends Zend_Form  {
    /**
     * Render a field
     * @param string $name The name of the form element
     */
    public function _e($name) {
        $e = $this->getElement($name);
        return ($e) ? $e->render() : "<dt>Error</dt><dd>Missing <$name> field element</dd>";
    }
}

Another thing needed for these sites are to keep the urls understandable and thus translated into the language used on the site. For this the routes, or paths, are kept in the translation file as well. The translated paths are then registered to the router through the use of Zend_Controller_Router_Route and Zend_Controller_Router_Route_Regex objects.

$frontController = Zend_Controller_Front::getInstance();
$router = $frontController->getRouter();
$router->addRoute(
    'route_review',
    new Zend_Controller_Router_Route(
        $translate->translate('route_review'),
        array('controller' => 'review', 'action' => 'index')
    )
);

For image manipulation I haven’t looked further than ImageMagick. After a bit of tweaking you get very good quality when producing different image sizes.

Search

Last but not least, on the backend that is, there’s the search engine. ZF have an implementation of Lucene through Zend_Search_Lucene (derived from the Apache Lucene project). This is the one time I haven’t gone with ZF as I very much like the open source Sphinx search engine as it is so easy to integrate with MySQL. So Sphinx get to power the search.

This is convenient for several reasons. MySQL is not a great full text search engine, Sphinx give you better weighted results. The main reason though is the performance. Sphinx is very fast in itself but for a site with heavier traffic it is as simple as moving the search backend to it’s own machine to get a performance increase.

Frontend

On the frontend there is as clean html as possible to make it easy to change the design with only CSS as well as manipulate the client side with JQuery. If it wouldn’t be for the Google map the site would actually be pretty useful even without no css style at all.

A good practice I learned just recently (remember I’m mostly a backend developer) is to base all javascript functionality on modules that are instantiated depending on element ids present in the html. This makes it a lot simpler to split the javascript functionality into manageble pieces and also makes it a lot easier to maintain.

There are functionality in the client side javascript used to display error messages and information. This makes it necessary to create one javascript file with translation stirngs for each language. The correct javascript translation file is chosen in the layout (template/view file) depending on the current locale.

The map used is (are there any alternatives) Google Maps API. I chose to completely initiate the map by scanning the actual data displayed on the page. This is possible through clean html markup and also means that if I choose to list ten reviews on a page instead of five nothing need to be changed at all in the frontend. Only a loop limit on the backend.

Conclusion

Well. No conclusion. This was just a very basic walkthrough of most of the different pieces needed to create a fairly simple Zend Framework based website. Mostly it was a walkthrough of the bootstrap… I still hope it is useful or at least interesting.

I know I find it interesting to read about other sites and the architecture and design behind them.

I’ve been busy writing agents for retreiving and parsing data in many different formats from many different sources the last couple of weeks. These agents fetch data for the Swedish city portal (actually almost 50 portals) that we are working on. The data sources are a big mess of free text, HTML, weird XML formats and CSV. PHP 5 is a wonderful language to work with when creating these agents.

Today I stumbled upon a quote I had written down many years ago from the science fiction book The Childgarden written by Geoff Ryman and published early in 1994. Great book, great writer. The quote doesn’t really talk about the web as we know it but it felt so right.

“Below that, there’s the Web, That’s the memory. That’s where everything is stored, and the Web is a real mess. You can get tangled up in it.“

So today I decided to start doing something about dotvoid.com. The site is filled with comment spam. I hate it but I haven’t had the energy to do anything about it. So I cleaned out around 4500 comments with links to various “resources”. I still haven’t done anything about the main problem though – that it is so easy to spam the site.

I still use my own content management system (CMS) based on PHP and MySQL. It is a great system in many ways but it is not a very good blogging tool.  It wasn’t my intention in the beginning but dotvoid.com has more or less become a blog. So either I start implementing CAPTCHA, pingbacks and all that other stuff into Firesite CMS – or I can start using another system or tool that already has this in place. As I said – I’m full of energy and I’ll investigate my options the following days. I use s9y on another site so maybe I’ll go for that. Suggestions are welcome. Anyway – it is time to do something more with dotvoid.com. But first I’ll have a nice walk into town in the warm sunny weather with my girlfriend and my three year old daughter.

I personally prefer right aligned text but I still think left aligned text is better looking. I really like his formulas for the the eye movement over the different form designs. It almost make me wonder if it is a joke.

The formula for the Left Aligned Form
X*N + ((N-1)*(SQRT of( X^2 + Y^2))

The formula for the Right Aligned Form
(X/2)*N + ((N-1)*(SQRT of( (X/2)^2 + Y^2))

Now ajax and web 2.0 is cool. So this ajax whois service wants to be web 2.0. In order to be web 2.0 it must be simple and things must be fetched asynchronously. The service is also using the captha technique – ajaxified. A service as basic as this, with only a search field, should allow the user to click “search” or “go” or whatever. Oh no. That’s not cool. Instead you have to wait for the forms to decide that you are finished typing. So stupid. If you are too slow with the captha form it is submitted anyway and then you have to start over again as the input field is cleared.

Just because something can be done doesn’t necessarily mean it is a good idea.

As a side note my wysiwyg editor, FireEditor, is coming along nicely. It’ll soon be ready for a first release. As soon as the extension api is stable. It’ll be copyrighted to my Swedish company Mesh but under a free/gratis license.

I wasn’t very happy with wither either FCKeditor or any of the alternatives as they were either bloated or badly implemented or both. To be honest I didn’t do a very thorough analysis. But as stupid as I can be at time I told myself that I could do it better. Another voice (?) instantly challenged me with the words “prove it”.

Implementing things like a good and simple extensions api, i18n and theming and still keep the total file size to a minimum is not that easy… Well it is finally starting to evolve into something really nice. I won’t release the source yet as I want the basic features to be rock solid but here is a nice little screenshot of the editor in Swedish using a Gnome theme.

FireEditor - wysiwyg editor in Firesite. The icons are made by my girlfriend for another project.

Starting this weekend I will take a couple of days off and attend the PHP Conference in Frankfurt. I really hope it will be as good as when I was there in 2003. It would be fun to know if there are more people coming down from Sweden. If you’d fancy a beer or two in the bar with a fellow Swedish just send me an email through my contact form.

However, there are a few applications lately that have received lots of attention. Flock – what’s the deal with Flock? I’ve tried it and I like the way the back and forward buttons are joined together. But I suspect that is not what the buzz is all about. The idea of adding online tools in the browser, which Flock does, is not new. Flock is, to me, just another skin around gecko. If you think I just don’t get it – feel free to enlighten me.

Basecamp, the project management application of the year it seems, must have a few people really good at marketing behind it. The application has a nice interface and is simple to use. Other than that – it’s just a very simple application.

Don’t take me wrong – both these examples are nice applications. They are just not that much of a revolution.

I recently received two weird email messages. The first one, I could see, came from the contact form here on dotvoid.com. The second looked more like ordinary spam with faked from and to fields. The spam email was however curiously empty of any real content. I soon figured out what was happening. Someone was, successfully, trying to crack my email form so he could use it to relay spam…

In my contact form I only let the visitor enter two fields, a message and his email address. The user supplied email address is then used to set the From header in the email that is going to be generated. The To header in the email is set to a hard coded “secret” value by the script.

Obviously I was sloppy when I created the contact form. I’m very much ashamed to admit I was not sanitizing the user entered email address properly. Not sanitizing user input is, as we all know, a disaster waiting to happen.

If you can add a newline/carriage return on the end of any value that is going to be written in the email headers you can also add any email header you would want. In this case  the attacker added Bcc headers. Suddenly my email contact form was effectively functioning as a spam relay.

I again learned the lesson I thought I knew. Always sanitize user input!

More on this particluar issue:

• Email injection – Secure PHP
  
• Interesting Crack Attempt to Relay Spam

It would be fun – and useful – to add more translations to the list. If you find this useful – please help out and I will add export possibilities in csv and xml.

It seems that Google has filed a patent regarding their search engine technology recently. In doing so Google have had to reveal more information on how they actually rank web sites and pages. Some things I knew to be important; like how many links to a site there is. That however is only partly true. What I didn’t know is that they seem to weigh in how fast the number of links to your site increases. If they increase too fast Google might think it is search engine spam. There are many more tips…

Another weird thing they do, probably to prevent spam and malicious sites getting to much attention, is that they check the domain registration date as well as the domain contact and billing details. I have found two sites discussing this in more detail.

• buzzle.com
• readwriteweb.com

The best thing, apart from having more details revealed, is that it actually looks like they are trying to prevent the impact of search engine spam and comment spam.