Layout in CSS

Doing my own design using div and float was really painfull - not even talking about the table time. You often need header, menu or tabs, content, footer,etc... and also have to take into consideration specific browser interpretation (box model and so on).

Discovering in the Yahoo! UI library a Grid CSS component, I just decided to give it a try.
Great documentation, quite simple use, in half an hour I have done a simple layout (header, left menu, main content divided into 3 different blocks, right content, and footer ). Not to mention that it is same rendering for different browsers. Everything I needed!

There are three main components:

• the document : defines the width of the layout
• templates: ready to use layouts
• grids: to make more complicated and structured components.
  

Combining all three components should meet the requirements of most web pages layout.

What is just missing is to have a really simple way to add custom grids (like 40% + 20% + 30%)

If you want to play with it just test the builder.

Generating a thumbnail image of a PDF document

Like it exists for HTML pages, I wanted to created thumbnail (preview) image of a pdf document, same as I can get on a Wind*ws Explorer for example.
On the web, given the time it takes to open a PDF document in the Reader, better know before what it looks like, so I don't have to download wrong one.

So I used the PDF Box library. It can convert easily a PDF document to an image.

First need to load the document, get the first page of the document, and convert it to an image:

// Converting first Page to an image
url = new URL(documentPath);
document = PDDocument.load(url);
PDDocumentCatalog catalog = document.getDocumentCatalog();
List allPages = catalog.getAllPages();
if (null == allPages || (allPages.size() == 0)) {
throw new Exception("The document is Empty");
}
PDPage page = (PDPage) allPages.get(0);
BufferedImage image = page.convertToImage();

Then just write the image.

All this can be done calling directly the PDFToImage Main class passing the right arguments (Start page and end page =1).

I tried to reduce the size of the image on a second step (to make it small like a thumbnail) using the code from here, but it often gets to a really bad quality. On web page , better simply size the image.

Also, the underlying code is "beta quality". So shouldn't expect too much from it. ( I tried random PDF from the net, and some of them didn't work. Basically if it standard text it should work.)