Traditionally these either had to be manually inserted into the code, like so:

static const gchar *ui_info =
"<ui>"
"  <menubar name='MenuBar'>"
"    <menu action='FileMenu'>"
"      <menuitem action='Quit'/>"
"    </menu>"
"  </menubar>"
"</ui>";

Or a file was stored in /usr/share/$application/ and you had to write code to manually find and load the file, and cache it if used often. This is not a lot of code, but it can be tricky as all I/O code needs to handle errors and the external file makes it harder to make the library/app relocatable.

Instead, with resources you store your data file as plain files in your source tree, edit them with your favourite editor, with full syntax highlighting, automatic indentation, etc. Then you reference these files from a resource description file (another xml file) and use glib-compile-resources to compile these into a binary chunk which is linked into the application.

The resource framework then automatically registers all such resource bundles in a global namespace, where you can quickly look up resource data by a resource path. There are API calls to get the data as a direct pointer, as well as streaming data, but in most cases there are helper functions that let you just specify the pathname. So, for instance, you can just do:

 gtk_builder_add_from_resource (builder, "/org/gnome/appname/menu.ui", &error);

Which would handle all the work for you. And while this looks like an I/O operation its really just a hashtable lookup on linked-in data, reading from the (shared, readonly) data section in your executable, so its very fast and safe.

Additionally there are some tricks the resource compiler can do for you. For instance, you can specify that a resource should be compressed, which means that the data is stored compressed, and the APIs uncompress for you automatically. You can also specify that xml files should be pre-processed to strip away whitespace, which avoids wasting time and memory on something that is not useful at runtime.

There is also support for resource:// URIs, which means you can easily reference resource data like icons from e.g. CSS and UI files.

On Linux we use some gcc specific extensions to store the resources in separate ELF sections, which means its very easy to extract resource data from the binaries. Glib even ships with a tool that lets you do this:

$ gresource list libgtk-3.so
/org/gtk/libgtk/cursor/dnd-ask.png
/org/gtk/libgtk/cursor/dnd-copy.png
/org/gtk/libgtk/cursor/dnd-link.png
/org/gtk/libgtk/cursor/dnd-move.png
/org/gtk/libgtk/cursor/dnd-none.png
/org/gtk/libgtk/gtk-default.css
/org/gtk/libgtk/gtk-win32.css
$ gresource extract libgtk-3.so /org/gtk/libgtk/gtk-default.css
@define-color fg_color #000;
@define-color bg_color #dcdad5;
@define-color text_color #000;
...

If you’re interested in using resources in your application, check out the documentation, or look at this example commit that converts Nautilus to use resources.

Then I forward ported all the work to the current Gtk 3 tree. It was mostly trivial, but one thing that changed a lot in Gtk3 is theming. The old windows theme was mostly a custom themeing engine, but in Gtk+ 3 we want to use engines less in favour of CSS. So, I had to completely redo the windows theme using CSS.

I added a few CSS extensions that access the win32 theming APIs, so you can get theme backgrounds, theme colors and theme sizes. Then the rest is just traditional CSS to bind the things together.

Here is an image of the current state:

There are clearly still some issues that need fixing, but it works impressively well for just being some CSS. Check it out.

I’m slowly getting most of the UI mockups implemented in preparation for the UI freeze next week, and the evolution-data-server backend in libfolks has landed and been made the default. We also have support in evolution-data-server for the new Online Accounts system. This means we’re currently in a pretty good shape for Gnome 3.2, although there is still a lot of work to do, like getting contacts linking working.

However, today I’d like to talk about something else that I’ve been working on. As you can see in my last update Gnome Contacts relies a great deal on avatars in the UI, and its often the case that your address book contains a lot of people that don’t have one. All these default avatar icons makes it hard to scan the contact lists.

To solve this I’ve been talking to the guy behind the awesome robohash site. It turns out that he’s actually somewhat of a Gnome fan, even helping out with news.gnome.org a long time ago. He’s agreed to let us use the source images and code (in exchange for pimping robohash.org, which you should use! It’s awesome!). I’ve been working on turning the code and images into a library that can be used locally by gnome-contacts. It’s still a work in progress, but here is a screenshot:

This is still a work in progress, but I’m very hopeful that we can land this for Gnome 3.2.

The code is still at an early state, but most non-editing functionality works, even if its not fully polished. Here are some screenshots to show the current state:

While Allans post showed how the UI looks I’d like to go a bit deeper into the technical side.

Gnome contacts uses libfolks for all access to contacts information. Folks then aggregates multiple sources of contact data, linking pieces of contacts into a whole. For instance, via telepathy it gets IM contacts and information about them, including presence status. Traditional addressbook information is taken from evolution-data-server (currently in progress) It can also connect to social websites such as facebook or twitter via libsocialweb.

The social website integration at first seemed like a very interesting source of information for contacts, but it turns out that there are some non-technical problems with it. All these sites require an application specific key for API access that is generally not distributable, which is not very compatible with open source. Furthermore they have really harsh terms of service that limit what you can do with the service data and how you are able to present it (for instance twitter recently did some very harsh changes for 3rd party apps).

So, while libsocialweb support is still available in Gnome 3.2 if you manage to set it up we’re primary focusing on IM integration (telepathy) and regular vcard style contacts.

The default contacts store for libfolks will be evolution-data-server, which supports several backends including local databases and google contacts. These two will be the primary focus initially so that people can use local databases or easy sync with e.g. android devices via google contacts.

Tomorrow I’m leaving for the IM, social and contacts hackfest in Cambridge where I hope to continue working on the contacts application and the frameworks its using. Also, we want to work on integrating contacts with other applications, including the gnome shell. For instance, it would be very nice if contacts appeared in the gnome-shell overview search.

I don’t want to bore you with technical mumbo jumbo though. Lets see some video instead! (Original source availible here)

Click here to view the embedded video.

Update: Tested this with safari on OSX, and it worked too. Also we now have nicer browser-side window decorations.

I managed to get rid of all roundtrips, which should make remote access snappier. I also fixed a bunch of bugs and added some missing features (including in-process cut and paste).

All that stuff  is nice, but not really all that interesting to show off.

However, I also implemented a cool idea I’ve had for a while about using chromeless browser windows with a canvas inside to get real toplevel windows. It turns out that this works pretty well. Although you have to disable the dom.disable_window_feature_open.location config option to get rid of the location bar at the top of each window.

Here is a short video showing how this looks: (original webm source here)

Click here to view the embedded video.

Cool, eh? Its all in git, go play with it.

PS: I have no idea why google thinks I’m in france…

Also, I’ve been using gnome-shell now for some time, and I’m really liking it. Going back to gnome 2 now feels clumsy and painful. You should all try it out and make up your own mind, but please try to avoid immediately tweaking it to your old ways, instead try the new defaults for a while, you might like it more than you expect.

Make sure to read the cheat sheet to learn all the new tricks. I really like the new alt-<key over tab> feature!

Here is an example desktop with a 1920×1080 primary monitor and a 1280×1024 monitor on the left:

And the corresponding overview:

There are a number of issues here:

• All previews are on a single monitor. So, while we have a lot of space for normal windows with two monitors we need to cram them all into part of a single monitor in overview mode. This makes the windows way to small to be usable.
• Due to internal issues the part of the overview that shows the windows is always the same aspect ratio as the screen (i.e. the total size of all monitors). This is fine in the case of one monitor, but with two monitors it doesn’t match the monitor aspect ratio making windows even smaller.
• During the overview switch the windows on the extra monitor fly a long way, making the animation not work really well, as well as breaking the natural grouping of related windows being on the same monitor.
• The extra monitor space is unused
• The thumbnails that normally slide in from the side in a slick way instead overlap the other monitor and its hard to make slide in since the mouse enters the other monitor instead.
• The thumbnails include the “dead” area due to the different sized monitors and generally look weird.

Additionally, but not visible here:

• Its hard to hit the hot corner on the primary monitor if there is a monitor to the left. (And to hit the menu in the right corner if there is a monitor to the right.)
• If the top-left monitor is not the primary there is no hot corner in the easy to reach corner, instead you have to mouse into the primary and then try to hit the corner.
• If another monitor is taller than the primary, its very hard to hit the message tray on the bottom of the primary monitor, as the pointer passed over to the dead area.
• In most typical cases the external monitor is used to show something static, like always visible information, a presentation on a projector, or a movie on a TV. However, the extra monitors are connected to the same virtual workspaces as the primary, so when you switch workspace the apps on the extra monitors switch around too.

The last few weeks I’ve been working on this, and these changes have now landed in git.

Here is how it looks now:

And the overview:

We can see here:

• There is a window overview on each monitor, showing the windows on that monitor.
• The window overview area is not artificially constrained by aspect ratios but as large as it can be, so the windows are larger in the overview.
• The thumbnails are always slided in if there is a monitor to the right of the primary monitor.
• The thumbnails only show the primary monitor. This is because the whole workspace feature only affects the primary monitor. Windows on extra monitors stay in place when switching workspaces, only the primary monitor changes.

Additionally some things we can’t see:

• Every monitor with a natural top-left corner (i.e. the top left monitor, or a monitor to the right that is taller but aligned at the bottom) gets a hot corner that activates the overview.
• The ever-rocking ajax has added pointer barrier support to the Xserver for us. If this is available (he backported it to Fedora 15, yay!) we add one-sided barriers in the panel and the message tray so that its easier to hit these, even if there are monitors on the sides.
• Additionally, as part of the pointer barrier support the Xserver now automatically blocks the mouse from entering the dead areas that are not shown on any monitor. This is great if monitors have different resolutions.

These are not enormous changes, but the difference in day to day use in a multimonitor setup is like day and night. These should be in the next release which is out soon, so if you’re a multimonitor user, do try it out!

Yo dawg! I herd you like browsers, so i put a browser in your browser so you can browse while you browse.

The new multi-backends setup in Gtk+ 3.0 makes this much easier to test. All you have to do is build Gtk+ with –enable-x11-backend –enable-broadway-backend.This will give you a normal X11-based Gtk+ where you can enable the broadway backend at runtime by setting the GDK_BACKEND enviroment variable.

The backend only supports firefox 4 atm, and Mozilla disabled websockets by default, so you have to enable enable websockets for any input to work. However when this is done you can test any app by running:

GDK_BACKEND=broadway your-application&
firefox http://127.0.0.1:8080/

I recorded a small screencast to show this stuff: (webm source file here)

Click here to view the embedded video.

Note that the recording is using a local connection, it will be slower over the network depending on the network bandwidth.