June 1, 2008

Weekly Report #1: How to obtain the ugliest map ever

Posted in GSoC tagged , , , , , , at 11:32 pm by fadinlight

(To see the screencast, visit this link and download 20080601_osmarender_frontend_screencast.zip file – 14 Mb)

Despite my weekly report’s title, this week I’ve obtained the first successful step of my project!

New features

These are the new features:

  • I’ve seen that my application is now compatible with Firefox 3 RC1 for Windows (worked in beta 4 but didn’t in beta 5)
  • Don’t really know what’s happened (perhaps some issues with my previous Kubuntu installation? perhaps some Firefox 3 module kept when downgrading in my 8.04?), but I’ve seen that the application seems to be compatible even with Firefox for Linux
  • Can load a predefined rule file or a custom rule file, giving its name in an input box
  • Thanks to this CSS Parser, with some modifications, the application will parse the CSS section of the rule file
  • A combo box will appear in the application, and selecting a CSS class, you can modify any preset
  • I’ve written a little function for CSS Writing, so the application will automatically store in memory any new value
  • I’ve found a little trick for saving to disk the edited XML file, and successfully reloading it.


So what about the title? As I’ve done during application phase, I’ve produced a little screencast to show those features. In the screencast you’ll see the real meaning of this weekly report’s title 🙂

So, if you have time (it’s 10 minutes long, but I’ve spent 3-4 hours to produce it, so give me some satisfaction 😉 ), you can download and view this SWF screencast! (download the 20080601_osmarender_frontend_screencast.zip file, about 14 Mb) After downloading, unzip it in a directory of your choice and point your browser at 20080601_Osmarender_frontend_screencast.html, playing it in full screen mode (F11).

Next steps

During next week I hope to achieve the following tasks:

  • Refactoring of all my code (now it’s a mess)
  • Begin using JSDoc for documentation
  • Create new CSS properties/classes or delete them
  • If time helps, I would like to enrich the internal CSS data model to let the frontend know how to edit single properties with a proper widget. To do this I’ll try to encapsulate some existing JS libraries in the future.

May 31, 2008

CSS parsing

Posted in GSoC tagged , , , at 1:51 am by fadinlight

I think that, if someone had to ask me what’s the temptation I have to deal with the most, I would reply without any further thinking: “Reinventing the wheel!“. This is not so much evil, reinventing the wheel can lead to new improvement and new techniques, but it has a great enemy: time! 🙂

So, after I’ve spent some time trying to get some structure out of my demo and started building the library that will stay behind the frontend, I’ve begun writing a rough CSS parser, following my agreement with my mentor about starting with CSS instead of rules. After some minutes of working, I came in touch with an already beautifully written Javascript CSS parser. Even if the code has made public, I’m going to contact the author to see if there is any problem on including (crediting him) some of his code into mine.

However, after some adaptation to the code (some issues with DOM, the library supposed to work with innerHTML and I had to change that reading nodeValue from a childNode… or better, cycling all childNodes because of the Mozilla’s 4k bound limit for textNodes; some issues with regular expressions too), some structuring of my library and some UI tweaking in my old demo (just using that for debugging purpose), I’ve got this:

Here you can see an ordered list of CSS classes defined in the z17 t@h rule file. Clicking on one of those classes… here it is:

Let’s click on another class:

So, what about next steps?

The first thing I’ll do now is to code a little “CSS writer” to get the CSS back from the data model. This will be not enough, because a “blind” CSS writer would scramble the original code (as 80n already pointed out during community bonding phase), so some more tweaking on the original parser is probably needed. However, it will be enough to try some little interactivity, even if only modifying existing CSS classes and properties, and deliver a little screencast for the weekly report 🙂