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 🙂


May 27, 2008

The least exciting screenshot ever :)

Posted in GSoC tagged , , , , , , , , at 3:23 am by fadinlight

Yes, I know… this is not what is expected to be a great “first day working” post, especially when talking about the great Google Summer of Code. But most of the time, what can be seen can play tricks on us. This is what I achieved today:

Not really astonishing, huh? 🙂 Let’s see what’s behind that javascript alert.


Following my purpose of having a Object representation of Osmarender’s rules and/or css classes (to better manage and pointing to them in my code), I should make a relation that involves, for example, a rule with the features (key/value pairs) involved. Furthermore, I should be sure that a rule can be applied to the matching feature (for example “circle” can be applied only to nodes). Not enough, a feature can be applied to more than one type (for example, “highway=pedestrian” can be applied to ways and areas as well). So a model representation of standard features must be considered.

As you can see, in the alert is printed a linearized version of a tree. You can see “macrocategory”,”category”, and “key”,”value”. To improve the usability of the GUI, and to encourage templating for newbie users in the future, I’ve thought about giving a faceted approach on map features classification. What can’t be seen from this printing, is that all the features listed are in a single facet (which I called “wiki”), but multiple facets are allowed within the code. This was not a major overhead of coding time beside the original purpose of modeling key/value pairs, but can lead to a great end user usability feature when dealing with the GUI.


To achieve this goal, many Javascript tricks are involved, for example protecting the code itself to external overwriting. If I have a Javascript object to represent element types (node, way, area), I should be sure that the integer that represents internally those elements (and can be called, for example with a simple “elements.WAY”) will be not overwritten. This is not so simple to achieve in Javascript, because all objects can be overwritten at any time. I’m not sure this is the right way to go (but I’m sure is prone to bugs at the moment, for example a double check for arguments is needed), because I couldn’t test it so much (I’ll dig the Net for common patterns, if any), but it’s an handy solution at the moment, even if home-made. A simple example of Javascript function overloading is shown as well.

var elementTypes = function() {
	// if the object that calls the function is not already an instance return a new object. This example provide a rough overloading implementation of object constructors
	if (!(this instanceof arguments.callee)) {
		// if the function is not called with an argument (e.g. elements.WAY) then only a reference to the internal representation is wanted
		if (arguments.length==0) return new elementTypes();
		if (arguments.length == 1) {
			// if the function is called with an argument, which is an array of types (e.g. [elements.WAY,elements.NODE]), then an object that should be included in a Feature object is wanted. The object returned will call itself the section "if (arguments.length==1)" below
			if (!(arguments[0] instanceof Array)) throw new Error("not an array");
			return new elementTypes(arguments[0]);

	// Public variables that references names of functions that returns the integers
	this.WAY = "_WAY";
	this.NODE = "_NODE";
	this.AREA = "_AREA";

	// Private variable that will store the types compatible with the feature
	var _mytype=null;

	// Private functions that returns the integer that represent a type
	var _NODE = function() {
		return 0;
	var _WAY = function() {
		return 1;
	var _AREA = function() {
		return 2;

	// If this is an object that should be included in a feature
	if (arguments.length==1) {
		// Unnullify the _mytype private variable, it will be an array of types (for example highway=pedestrian can be applied to ways and areas as well)
		_mytype=new Array();
		// Iterate the array passed as the argument of the function
		for (type_defined in arguments[0]) {
			// Create a new object in the array
			_mytype[_mytype.length] = {
				// Assign the value of the object. This is achieved by eval() the type in the argument and adding "()" to call the desired function
				value: eval(arguments[0][type_defined] + "()"),
				// Create a value that remember the type requested
				toString: arguments[0][type_defined]

	// This is a public function that returns the types associated to the feature
	this.getTypes = function() {
		//returning a clone object to avoid accidental overwriting
		return clone(_mytype);

Beside any further testing, even if it’s easy to use, I don’t like the fact that I should call the function one time to retrieve the constants I want, and then apply the function to a public variable of that instance to achieve the goal. Perhaps, in the future, if I won’t have the time to search a better solution, I can hide this calling in the library in some way.

var elements = elementTypes();
var typeToIncludeInAFeature = elementTypes([elements.WAY,elements.NODE]);


The most interesting part of my community bonding period, beside happy talking with my mentor, Frederik, and OSM community in the irc channel and/or in the italian community and/or with Dieterdreist, was to explore and dig further in Javascript. As stated in the MDC, Javascript is the world’s most misunderstood programming language. And this is surprising what Javascript can do with its functional programming support. Studying more of it, let me realize that all that I’ve learnt and practised about object oriented programming (including design techniques, UML, etc.), even if greatly useful most of the time, was a lightly incomplete view of the world, and sometimes ineffectual for the scope of the project.

At this time, I’ve learnt a lot about Javascript programming and patterns, but I can’t say I achieved the right confidence to do a graceful design. Even if I’m traditionally a light supporter of BDUF development (“light” because I’m always open to intelligent compromises), I think that I would stay with some Agile influences. Furthermore, I would like to lower the technologies involved, thus embracing a little of KISS: I’ve seen that Dojo has lot of commodities for object orientation and such, but what about people who wants to extend my code in the future? They should learn my code, Dojo internals, Sarissa, etc… not so much inviting.

May 22, 2008

Meeting Dieterdreist, meeting end users

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

This afternoon I’ve met Dieterdreist (and his great mapping bike ;)) to discuss about OSM in general, the state of Rome’s map and another little brainstorming about my project’s usability.

After a drink in a bar under the heavy rain, we used some bar’s towels to draw some mockups about the project’s GUI interface. We had also talked a bit about the object model behind all the functionalities, that should meet Osmarender’s great ruling managing, giving a simple and beautiful interface to end users.

He was agree about my idea on faceting OSM features and gave me also a hint about letting end users manage all zoom levels colors with the same interface at the same time, with cool features to reduce the effort and time the end user would spend in the setup.

More on that later…!

May 20, 2008

Lightning Talk @ SOTM

Posted in GSoC tagged , , at 6:18 pm by fadinlight

Great news from my mentor today: I will participate at SOTM conference, giving a Lightning Talk about my SoC project! I cannot describe how excited I am about this talk, and I’ll do my best to have something working gracefully for that date!

May 19, 2008

Mapping Sardinia 2

Posted in OSM Contributions tagged , , , , at 12:36 pm by fadinlight

Having been busy awhile, I didn’t have the time to map a bit anymore. So yesterday night I’ve updated and opened my JOSM and mapped (and uploaded) some GPS traces I’ve made during my Sardinia holiday. The best effort has been completing SS131 mapping (that is the main road connecting Sardinia’s North with South), but only in a direction at the moment, with a particular attention on mapping the sections actually under construction with corresponding deviations.

After few days, now I can update some images:



After that, I’ve spent a little time on mapping some parts of Cagliari (especially near the sea)) and surrounding towns like Quartu S.Elena and Sestu (with special attention to SS554, the parts I’ve updated were not a “double one way”):

Cagliari and Quartu S. Elena before

Cagliari and Quartu S. Elena after

Sestu and SS554 before

Sestu and SS554 after

What can’t be seen from these images, but can be explored visiting the slippy map, are all the waypoints my beloved girlfriend Claudia has collected while I was driving, such as banks, fuel stations, bridleway, service roads inside car parkings…

May 17, 2008

Where to start

Posted in GSoC tagged , at 5:21 pm by fadinlight

Yesterday night I had a great conversation via IM with my mentor, Frederik, about my actual thinkings about the project design and where to start coding. We actually decided to start with simple color handling (so CSS play) instead of begin to handle all rules.

The aim here is to have something working as soon as possible, something that other OSM users could manage to use in little time, to have the most feedback about it, and to assure a working deliverable for GSoC ending anyway.

Rules handling will be difficult to achieve and to communicate to end users, so I’m going to posticipate this hard work, even if I have to go with a proper object model for layers, selectors and all the logic inside Osmarender.

May 15, 2008

Usability matters

Posted in GSoC tagged at 10:21 pm by fadinlight

Beside any technical insight, beside any coding technique, beside any great tech solution… 99% of times usability can write in the stone the destiny of an application.

My concern for usability has always been a primary concern: you can write the best application in the world, but still, if deadly lacking usability, no one is going to use it. The primary goal of my project is OSM spreading thanks to its inner power of open customizability of everything.

But… OSM innersights (all features, key/value pairs) and the great Osmarender’s ruling power are probably highly complex for newbies: how to get a simple way to interact? At the moment, after inspecting a lot, I think that probably there is no silver bullet: advanced users probably want all ruling/CSS power, while intermediate users (whom don’t want to bother with CSS) want however the whole OSM tagging/Osmarender power at hand, while newbies probably just want a nice map, with some color/font size tweaking. How to join these three worlds together?

I’ve drawn a little hand-made mockup, just to fix some GUI ideas, but I’m not so satisfied with it. It’s intermediate-user-oriented, but would be probably confusing for newbies. However, I’m starting to think that, during SoC, I should deal with them. After the deadline, however, I already have some idea to improve usability for newbie users: for example, there could be a sort of templating facility, where newbie users could select a template thing (street, rail, power lines, ferry, etc…) and then tweaking them a bit, changing all colors/font sizes, etc. In the meantime, during SoC, I can develop some facility in the wiki for intermediate users to propose such templates to be included in the “next release”.

More on that later…

May 14, 2008

To SOTM, or not to SOTM… that is the question

Posted in GSoC tagged at 11:02 pm by fadinlight

It’s been few days since I’ve known about the yearly OSM conference, State Of The Map. Can’t hide the fact that I think it’s very cool 🙂 So last night I asked my mentor in chat if it would be a good idea if coming. His reply surprised me enough because from that moment on we had a great chat about it (flights, accomodations, etc), and that gave me a lot of enthusiasm. So I think I’ll do my best to go to Limerick 🙂

I’ve heard some talks from last year’s SOTM (one workshop from Osmarender‘s author, 80n, and one talk from my mentor, Frederik), and enjoyed a lot watching another Frederik’s talk @ ccc congress.

Great talk, Frederik! 🙂

May 13, 2008

When OSM is better…

Posted in GSoC tagged at 8:41 pm by fadinlight

Today I had some conversation with Dieterdreist. We wanted to do a little meeting to talk about my project and to do some mapping here in Rome, but we’ve been unable to do so. However we had a little IRC meeting to talk about my project and about OSM in general.

About my project, we talked about the GUI, which is actually the most problematic thing I’ll have to face during my development phase. How to show logical operators to users in the most usable way? I don’t like the way existing softwares do, so I should provide some kind solution to it.

He told me about one great site, Sautter, which provides a nice-looking way to show OSM and Google Maps at the same time, with a user-controlled transparency. So we tried to search for areas in which OSM is already over the top: thinking about Cyprus, Baghdad, Iceland, Iceland again (this is fantastic..). There are many other great-mapped regions too.

That’s the power of… OSM!

May 12, 2008

Mentor bonding

Posted in GSoC tagged at 6:39 pm by fadinlight

Today I’ve got a little conversation in Jabber and a “huge” email (which I replied soon) with my mentor Frederik. I’ve known that 80n and him talked a little about my project during London hack-a-thon meeting. So Frederik and I chatted a bit about what I’ve done till now about brainstorming, design and GUI ideas and sent me an email about some issues I have to face with to show in the most usable way some OSM stuff like key/value and rule handling with logical operators.

I think that it’s a big issue, so we should choose if developing a single interface to make novice and power users happy at once or (which is what I’m thinking of right now) have at least a double interface. It’s difficult to have novice users (who just want to change colors or show specific features/amenities) deal with logical operators, I think quite impossible because they probably don’t want to bother with them. So a template-driven interface (with a sort of pluggable interface in the application, as also suggested by Dieterdreist) could be a solution for them. The problem here is GSoC deadline, so I think I should deal with code issues and power users interface first, and prepare things for novice users in the code. The most “novice” GUI I can get during SoC the better!

Next page