To be able to successsfully work with the DOM, first we need to understand what it is. DOM stands for Document Object Model and it is the way browsers represent the structure of your HTML (XHTML or XML) document so JS can navigate it (actually it is supposed to be language agnostic, but I’ll explain how to interact with it using JS), or modify it.

The way you can access the DOM in a typical browser is by refering to the window variable. The window variable gives you access to attributes like history, location and document. In this articule I will focus on window.document.

This is a very special scenario and you may never want to really do this, but I found myself in the necessity of changing the visibility of an object’s methods an attributes at runtime so I could access them directly.

To do this I had to use reflection and magic methods in a magic way. Since we can’t just plug methods to an object in PHP, I had to create a class with already defined magic methods that would allow me to access the protected and private members of an object using reflection.

This is the class I created with an explanation of what it does:

Xdebug is a PHP extension which provides debugging, tracing and profiling capabilities.

Installing xDebug in an Ubuntu based distribution is very easy using apt-get:

1
sudo apt-get install php5-xdebug

Just by installing xDebug you will get two very basic but useful rewards: Pretty var_dumps and pretty error messages.

I have been hearing a lot about SASS lately, so I wanted to find out what the fuss is about. SASS is a meta-language for writting CSS that allows you to use variables, nested rules, etc… that helps you write less code to achieve the same results.

SASS works with a ruby compiler that can be easily download in ubuntu based distrubutions:

1
2
3
4
sudo apt-get install ruby
sudo apt-get install rubygems
sudo gem install listen
sudo gem install sass

It is possible that you will need to restart your OS after running these commands.

By default Zend Framework has a front controller plugin that tries to send all exceptions and errors to a controller named ErrorController. If that controller is not found you will get this error.

The Zend Documentation explains how to make a simple error handler:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
class ErrorController extends Zend_Controller_Action
{
    public function errorAction()
    {
        $errors = $this->_getParam('error_handler');
        $exception = $errors->exception;
        $log = new Zend_Log(
            new Zend_Log_Writer_Stream(
                '/tmp/applicationException.log'
            )
        );
        $log->debug($exception->getMessage() . "\n" .
                $exception->getTraceAsString());
    }
}

A few days ago I was having problems getting my models autoloaded by Zend Framewok, after a little research I found the solution.

For this project I am using Zend_Application and Zend_Application_Bootstrap_Bootstrap for bootstraping my application. Enabling autoloading is as simple as adding this line to application.ini:

1
appnamespace = "Application"

or you could add a $_appNamespace property to your bootstrap class:

1
2
3
4
class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
    protected $_appNamespace = 'Application';
}

It is often necessary to differentiate different environments by setting an environment variable with a different value on each of your different systems (development, qa, production). This is very easy to achieve if you are using Apache and PHP. You just need to modify your virtual host definition (See: Creating local virtual hosts with apache) to include a SetEnv directive:

1
2
3
4
5
6
7
8
9
10
11
12
<VirtualHost *:80>
    ServerName ncona.dev
    ServerAlias www.ncona.dev
    SetEnv APPLICATION_ENV development
    DocumentRoot /home/adrian/www/ncona.dev
    <Directory /home/adrian/www/ncona.dev>
        Options FollowSymLinks
        AllowOverride All
        Order allow,deny
        allow from all
    </Directory>
</VirtualHost>

Now you have access to the environment variable from php:

1
getenv('APPLICATION_ENV');

In this article I am going to explain the CSS 3 standard way of applying a shadow to an object. Using only this technique is probably not going to give the cross browser behavior that you are expecting.

The shadow object

The first thing we need to understand in order to apply shadows to an object is how the shadows are constructed. A shadow object has this prototype:

1
<shadow> = inset? && [ <length>{2,4} && <color>? ]

In this post I am going to explain the syntax for Object Oriented Programming in Python. I am assuming you have already done it in other languages so if you have not done Object Oriented Programming previously you should probably look for another article about it’s principles.

At the beginning when I started learning python I found some things that I felt kind of weird, like the lack of braces and semicolons. Now that I started learning their syntax for OOP I realize that doing things weirdly is their standard. Python (kind of) allows you to implement all the principles of OOP but their syntax is not similar to the one of Java, C++, or PHP that I am familiar with. Anyway so far I don’t see any problem with their different way of doing things so I will just explain how things are done in Python.

In this article I am going to explain the CSS 3 standard way of achieving a linear-gradient background. Using only this technique is probably not going to give the cross browser behavior that you are expecting.

Linear gradient

The definition of a linear gradient from W3C documentation:

A linear gradient is created by specifying a gradient line and then several colors placed along that line. The image is constructed by creating an infinite canvas and painting it with lines perpendicular to the gradient line, with the color of the painted line being the color of the gradient line where the two intersect. This produces a smooth fade from each color to the next, progressing in the specified direction.

So, to set a linear gradient for a div or another DOM element we would need to imagine a straight line that goes through the object at an specific angle touching the center of the element. Then define the colors we which at specific points in the line.