Digital Base – Blog » All

We just launched www.blesentres.be

Still alot to be done. But for now this is the online version. I added a few picture, if you want to see more just surf to www.blesentres.be

As a professional web developer i tried alot of software, this results in a great deal of expertise & experience with the most common design tools. In this post i will list the software i am currently using to create our websites.

First of all, all the developers at Digital Base work in a linux environment. All of our workstations are running an 64bit build of Ubunty Gutsy 7.10. So if you are hoping for a listing of windows software, you could stop right here, although some of the tools we are using have a windows version.

Because we all (or at least most of us, *wink* @ Jan) like "eye-candy", we are using Compiz Fusion on a Gnome Window Manager. The advantage of this package, besides having a kickass desktop environment, is you can set shortcut keys & customise almost every aspect of your user interface (maximise toggle buttons, window positioning etc..).

We develop all our websites on a LAMP platform (LAMP : Linux Apache MySQL PHP), it speaks for itself these packages are installed on all workstations for local development & debugging purposes. As for the programming we are still using Zend Studio 5.51 (the linux binary), this very nice (but never updated) IDE gives you the needed functions like :

• code completion
• syntax highlighting
• debugging capabilities
• code assist
• source/code templates

At this moment Zend is switching their IDE to an Eclipse based IDE (codename Zend Neon ), we did try it, but back then it wasn't stable enough for us to start using it. Although i am currently testing Eclipse PDT & Zend Neon, most of us still use the Zend IDE as it is rocksteady, responsive.

Next to that we're using the popular webbrowser Firefox with a few interesting developer plugins like Web Developer Toolbar, Firebug. To test the applications in IE webbrowsers we use an RDP connection to a virtual machine or Windows Server, or use the IE4Linux binaries to check/improve how a website looks when rendered by the IE engine.

So there you have a basic insight how we do things, i'll make sure to complete this list as we're using alot more tools, but my time is limited

To reduce the query count in your web application, you might consider using subqueries. I'll show you howto do that in propel/symfony :

[code]propel - subqueries[/code]

It's that easy

By default the scp/sftp support is not installed when running krusader in a gnome environment). If your 'new net connection' only lists ftp, this is the case for you.

This means you are missing some kde libraries allowing krusader (or other kde apps) to use the scp/sftp protocol

[code]gutsy - krusader fix[/code]

This should do the trick..

Before starting your design process it’s very important to take some time for choosing the base colors you are going to use in your design. Certain colors will give different impressions, so it’s pretty obvious these impressions should go hand in hand with the main theme and subject of your website.

If you do some research on some common topics you will see a pattern in the use of certain colors for certain subjects or impressions. For example, blue is a color assiciated with trust and reliability. No wonder you will often find blue tints on websites of lawyers, webhosting companies, etc.
The use of lost of white space is even more logical when you see it on medical websites because it has a very sterile feel to it. In contrast, black is used on websites that want their product or subject to have a very prestigous look.

So before selecting the base colors for your website design, think about what look and feel is commonly associated with your subject. Of course you can brek the pattern and suddenly use a color that doen’st seem related to the rest of the colors in your design to highlight a part on your site that needs special attention. No doubt when you have a design with very light shades of grey for example and you put in a section with a bright yellow color, people will automatically be attracted to this section instantly.

Web based color palettes can be very helpfull in the whole color selection process, so google it and perhaps you will be surprised what a difference it can make.

Simplifying Queries: Using sum, count, etc in Propel

$c->addSelectColumn('sum('.dbTimeBlockPeer::TOTAL.') as total');
$rs = dbTimeBlockPeer::doSelectRS($c);
while ($rs->next()) { $total = $rs->getInt(1); }

So, simply use addSelectColumn. You have to work with the ResultSet offcourse, since you won’t be able to populateObjects.

In this case you can simply use ‘1′ in getInt(column index), since we’re sure only one column is being fetched. Note that the index starts at 1 and not at 0.

Now, imagine a case where you are not sure what the index is (it could also change in the project’s life cycle). Then you can use, dbTimeBlockPeer::translateFieldName(dbTimeBlockPeer::TOTAL, BasePeer::TYPE_COLNAME, BasePeer::TYPE_NUM)), which will return the position of column ‘total’.

This needs no explanation, but I’ll give it anyway: translateFieldName accepts as first argument a string (source), the source type name and the destination type name. You can go and look in the basePeer which type you need.

basedbTimeBlockPeer (generated by Propel)

private static $fieldNames = array ( BasePeer::TYPE_PHPNAME => array ('Id', 'UserId', 'ProjectId', 'Ticketnr', 'Changeset', 'Description', 'TimeIn', 'TimeOut', 'Total', ), BasePeer::TYPE_COLNAME => array (dbTimeBlockPeer::ID, dbTimeBlockPeer::USER_ID, dbTimeBlockPeer::PROJECT_ID, dbTimeBlockPeer::TICKETNR, dbTimeBlockPeer::CHANGESET, dbTimeBlockPeer::DESCRIPTION, dbTimeBlockPeer::TIME_IN, dbTimeBlockPeer::TIME_OUT, dbTimeBlockPeer::TOTAL, ), BasePeer::TYPE_FIELDNAME => array ('id', 'user_id', 'project_id', 'ticketnr', 'changeset', 'description', 'time_in', 'time_out', 'total', ), BasePeer::TYPE_NUM => array (0, 1, 2, 3, 4, 5, 6, 7, 8, ) );

We’re proud to announce a new addition to the digital base team. This new reinforcement goes by the name of “Hans Bekaert” and will be responsable for graphic design (photoshop, gimp, flash, etc) and the html/css implementation.

New project online, go have a look at goddessclothes.be

source: goddessclothes.be

We just launched the website Eucia.org.

Source : eucia.org

As you can read on Gijs’ Lifelog, he started developing a custom datagrid a while ago. The idea was to create some kind of module/object, which would be used for generating datagrids fast, easy and intuitive, without too much code.

Over time, it has been extended and rewritten to interact with our CriteriaBuilder (read blog).

This week, I’ve been refactoring/cleaning the code to clearly separate the code for our Propel driven datagrid from the basic html grid whose data could come from anywhere.

Underlying code

Due to several questions about releasing this code, here is some insight in how the code is structured, at this moment. Perhaps it will be released in the future, perhaps even as a symfony plugin, but we’re still indecisive about that.

So, we have an abstract grid class which contains all code needed to generate a basic html table. It has an array $columns, which holds grid_columns, and an $options array to manipulate its behaviour. One of them is the option â “pagable”, and if enabled the grid has to have a grid_pager set.

Grid_pager is an interface which defines what methods a pager (at least) should have and our grid_propel_pager implements that interface.

On __toString, the abstract function initfirstload is called. Its purpose is to set all columns and options, i.e. to define the grid. Then it calls display, which calls initdisplay. This function will do everything that has to be done before actually displaying the grid. The difference is that tostring is called once, and thus initfirstload too, while display & initdisplay are called multiple times through xajax.

The displayHeader function calls displayHeaderon each column. The displayRows method is abstract. For a very simple grid it could call displayContent on each column.A grid_column holds all data for showing an html column, like its header name, alignment, whether it’s shown, sortable, etc… It has the following display methods (among others): displayHeader & displayContent, which obviously return th and td strings.

Now that’s all pretty abstract !

Here’s how we use all of that in our grid_propel class, which uses grid_column_propels. The idea is that we could represent a table’s data fetched via Propel.

Grid_propel extends the grid_paged class (containing the code for a grid to be paged via xajax), which extends the abstract grid class. Some display methods are overridden and the abstract displayRows method is implemented. It loops all objects we retrieve from the grid_propel_pager (which implements the grid_pager interface, remember). In the loop, displayContent is called on eachcolumn and the object is passed.

Grid_column_propel extends grid_column_method which extends grid_column. In grid_column_propel::displayContent, we use call_user_func_array to retrieve the content to be shown. It also has a guessGetter method which guesses the method based on the column’s peer constant name, so you don’t have to provide it!

And voila, we have a fully Propel driven html table, which is sorted and paged via xajax.

Put it to work!

If that’s Chinese to you, don’t worry because of the great principle of encapsulation:

YOU DON’T HAVE TO UNDERSTAND IT!

Or to quote the textbook

You don’t have know how a car works to drive it!

Simply define your object class and columns that need to be shown. That’s all! Grid_propel will do the work for you!

Here’s an example:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<?php
class grid_users extends grid_propel {
 
 public function __construct($name) {
   parent::__construct($name,"_User");
 }
 
 public function init_firstload() {
   $this->option_enable("sortable");
 
   $gridcontent =  page_minimal::get_grid_contentobject();
   $bid = new grid_column_propel("id",_UserPeer::ID);
   $bid->display = false;
   $this->column_add_unique($bid);
 
   $this->column_add(new grid_column_propel($gridcontent->getContent("Login"), _UserPeer::LOGIN, "", 40));
   $this->column_add(new grid_column_propel($gridcontent->getContent("First Name"), _UserPeer::NAME_FIRST, "", 40));
   $this->column_add(new grid_column_propel($gridcontent->getContent("Family Name"), _UserPeer::NAME_FAMILY, "", 40));
   $this->column_add(new grid_column_propel($gridcontent->getContent("Email"), _UserPeer::EMAIL, "", 100));
   $this->column_add(new grid_column_propel($gridcontent->getContent("Country"), _CountryPeer::COUNTRY, array("get_Country", "getCountryShort"), 25, "center"));
 }
}

When we use this in a page (and register the necessary xajax functions), this will result in:

You can also use your own methods (not propel-generated)!

This really blows the grid wide open. You can call any method for the grid’s object class. You can even pass an array of methods. Every method is called on the result for the last call. The last method should of course return a string.

For example, adding

1
2
3

$view = new grid_column_method("", "getLink", 10, "center");
$view->setArgs(array(false, true));
$this->column_add($view);

will result in a clickable image that will pop up an information window:

Note that you can now use grid_column_method, the parent class of grid_column_propel. But, TIMTOWTDI, you could also use grid_column_propel, with an empty peer constant name.

1

$view = new grid_column_propel("", "", "getLink", 10, "center");

If you provide a name for such a non-propel column, you should also disable sorting for that column, since it has no peer constant name.

Foreign key values

Our user grid also contains a special column, Country. It’s actually a foreign key for the _user table.

1

$this->column_add(new grid_column_propel($gridcontent->getContent("Country"), _CountryPeer::COUNTRY, array("get_Country", "getCountryShort"), 25, "center"));

We provide _CountryPeer::COUNTRY, the column used for sorting, so the results would be alphabetically sorted instead of being sorted by the foreign key. Our grid_propel takes care of the necessary joins.

We also provide an alternative method array, otherwise the getter is guessed by grid_column_propel, which would result in the methodarray(->get_Country->getCountry).

Other descendants of grid_column

We have also created a special grid_column, grid_action, which almost does the same as the information image. But again, it groups code.Grid_action_url extends this class and its goal is to easy generate such images.

1

$this->action_add(new grid_action_url("application_edit.jpg","","/userid/", "", 15));

Will produce an image linked to /userid/$id

1

$this->action_add(new grid_action_js_delete("_User","Delete"));

Will produce a “stop”-image which calls _User::Delete, via xajax, on the object related to the row.

That’s all pretty neat, isn’t it? But, of course, that ain’t enough !

Last week I’ve added some functionality to export the datagrid to an excel workbook using the Spreadsheet_Excel_Writer class. Grid_column_propel accepts extra arguments

1

$excelwidth=null, $excelname=null, $exportmethod=null, $exportargs=null, $export=true"));

By default all columns will be exported. But if you want the export button to be shown, you need to enable the boolean export for the grid_propel.

You could also add columns (propel or method) to the grid which will only appear in the excel file, by simply disabling display for that column. Soon, I’ll add an extra argument $format, to control the layout in excel, column per column. And some constants to represent often used formatting.

All together, our user grid looks like this

If that still isn’t enough for you…

There’s also a class called grid_hook, which uses a grid_column_checkbox. Without going into details, this code

1

$this->addHook(new grid_hook(page_minimal::get_grid_contentobject()->getContent("edit"),"multiEdit"));

generates the edit hook on the bottom of this grid