igoogle like drag drop portal: make a page with movable containers

Searching for Habra and not finding a similar, I decided to distribute the note. A long time ago, going to the igoogle page, I found an interesting idea with movable containers. Recently I decided to use this beauty locally for personal convenience. A little googling stumbled upon a implementation from michel hiemstra, which already had version 2.0 and had support for maintaining the position of containers in mysql database.
Below are some setup details.

The first cases download code .
At the beginning of save.php, the procedure for creating a database for a standard example is closed. If you need more containers, just add additional ones.
for example:
INSERT INTO `blocks` VALUES(1, 'block-1', 'column-1', 0);
INSERT INTO `blocks` VALUES(2, 'block-3', 'column-2', 0);
INSERT INTO `blocks` VALUES(3, 'block-2', 'column-3', 0);
INSERT INTO `blocks` VALUES(4, 'block-4', 'column-2', 1);
The first field is just the index, the second block name, the third column number and the last container number in the column.
To save the values ​​in the database, you also need to uncomment the line with mysql Insert in save.php
Also in save.php and get_blocks.php you need to specify the parameters for the connection to the database.
All changes in the size of the width of the containers, caps and etc. are made in the css, located in the folder assets / css.
In particular, I needed only two columns above and one below. For this task, it was enough to change the width of .menu .blocks and .sidebar to 620px 620px and 1235px in portal.css, respectively (this is for 1280x1024).
In the demo in the container is plain text, but in practice, in such a container, you can put anything you like (for example, I have pictures of graphs there).
In general, the above would like to note the general customizability and scalability of the system, rather than give any specific recommendations.
Shl author asked to leave comments here .