Blurring is the act of altering images so they appear out of focus. My Maestro[2] and other illustriuos people already talked extensively about this topic here on planet KDE. However you don’t improve the world until a technology becomes available to everybody, right?

Then some days ago I read on notmart‘s blog that plasma and kwin supported blurring the background on windows.. so I rebuilt KDE4 svn, restarted it, and… boy.. does it make a difference! Look at Marco’s blog or at this picture I stole from him! All the popups become instantly more readable, even krunner does, and you immediately get the feeling that the plasma panel and all the systray applets really are above your desktop and they look as they were made of some glass/plastic material.

So: why limiting this just to some plasma applets? Well, I think that the usage of this effect must be wise, however I wanted that for my app too…

…’cause I like eye-candy!

After a quick tour through the beautiful KDE svn I grabbed all the needed source code and loaded Fotowall in creator. Since I already had the structure for the blur-behind on windows in place, adding the KDE4 effect was really easy. Here are some samples of what you can get:

To activate the back blur you need:

• obviously an application with a transparent background. Qt easily allows to work with transparency on top-level windows.
• you have to enable the “blur” effect in kwin’s “desktop effects” configuration.
• a couple of lines of code to ask kwin to activate blurring to your window.

Here is the code that does the magic:

#if defined(Q_WS_X11)
/**
  Blur behind windows (on KDE4.5+)
  Uses a feature done for Plasma 4.5+ for hinting the window manager to draw
  blur behind the window.
*/
#include <X11/Xlib.h>
#include <X11/Xatom.h>
#include <QX11Info>
static bool kde4EnableBlurBehindWindow(WId window, bool enable, const QRegion &region = QRegion())
{
    Display *dpy = QX11Info::display();
    Atom atom = XInternAtom(dpy, "_KDE_NET_WM_BLUR_BEHIND_REGION", False);

    if (enable) {
        QVector<QRect> rects = region.rects();
        QVector<quint32> data;
        for (int i = 0; i < rects.count(); i++) {
            const QRect r = rects[i];
            data << r.x() << r.y() << r.width() << r.height();
        }

        XChangeProperty(dpy, window, atom, XA_CARDINAL, 32, PropModeReplace,
                        reinterpret_cast<const unsigned char *>(data.constData()), data.size());
    } else {
        XDeleteProperty(dpy, window, atom);
    }
}
#endif

And then you can activate the blur on the caller widget with:

    kde4EnableBlurBehindWindow(winId(), true);

You could add the back blur to your application too, however I advise you that the interface is not standardized, so don’t blame either me or the kwin authors if something changes. Here is another picture, because everybody loves them

And now, as a side note, a picture from my new work place: the beautiful city of San Diego, blessed by the sun and by a ton of great programmers that by some chance happen to be co-workers of me With all the blue sky and long days, I can’t imagine a more inspiring place for making new blog posts and code experiments!

Notes:
[1] obviously the name is completely made up
[2] Italian word meaning “teacher” as in school or life teacher

The KDE login Manager

The login manager is the “insert password” dialog that gets in the way when you want to use your computer. Of course you may not be the only user of the machine, so it’s somewhat needed when you share the seat. Some facts:

Kdm Top to Bottom

Qml to the rescue!

What if we throw away (or keep for “retro-compatibility”) the classic and themer frontends and just add a frontend using QML? This is the name of the language of the Qt Declarative module, that has just seen the light and will be merged into Qt for the 4.7 release.

Imagine this:

• theme creators will have 100X or more expressive power: make snow! login via a tetris puzzle! bounce my webcam picture!
• there will be animated themes (for login, user change, logout, etc..) or simple ones for more ‘classic’ kind of people
• kdm only needs to add a couple of bindings to the qml runtime, like functions for logging in and shutting down / suspend the system
• there is no need for compiled binaries, packages will be interpreted by the qml runtime – finally a painless get-hot-new-stuff (compared to plasma widgets, at least).

Conclusion

MultiTouch can be Fun !

I couldn’t resist, so for 99€ (120$) I bought a Bamboo Fun Pen & Touclh tablet. I find this really affordable, since you get: A. the precision of a graphics tablet (with 1024 pressure levels, back eraser, etc..) and B. a real 2-Pointers input device!

I tried the tablet on vista, with the latest drivers and the bundled applications bot I got disappointed because:
1. the scroll gesture is remapped to the mouse wheel.. so you lose all the ‘analog’ fun and it feels unconfortable.
2. the zoom gesture is remapped to CTRL+wheel, awkward fixed-steps again.
3. the rotate gesture is not supported by any app even the bundled ones i tried.

In the end I thought this was not “multi-touch”, but some silly gesture-detection broken hardware. I was wrong.

Linux to the rescue

Step 1. After loading the wacom.ko module (updated with this patch) the Linux kernel prints out stuff like this:

[default   ] data: 02 00  00 00 00 00 00  00 00 00 00  00 00 00 00 00  00 00 00 00
[finger 1  ] data: 02 00  7d 80 fe 00 8a  80 fc 00 87  00 00 00 00 00  81 11 00 00
[finger 1+2] data: 02 00  ae 80 b6 00 72  81 08 00 70  87 81 5b 00 72  81 21 00 00
[finger   2] data: 02 00  00 00 00 00 00  81 59 00 b4  6d 81 59 00 ba  80 11 00 00

Can you see it ? This is a 2-finger device!

Step 2. The Kernel understands the data and splits it into 2 input devices that Udev maps to /dev/input/wacom and /dev/input/wacom-touch. From here you can read higher level information for each finger such as the decoded position, pressure, click type (tap, doubletab), and more.

I WANT QTouchEvents AND QGestures !!

I do too And I wanted to hack something about that. But I stopped here:

We get the input from evdev and the Application needs QTouchEvents and QGestures, so the easy way would be to hack up a touchpoint feeder to the Qt framework that directly reads from evdev (evdev -> qt). This would work fine for 1 application, but what about two? And what about moving the X cursor too? I think evdev->Xdriver->XInput2->qt is the solution, but we must be sure that no valuable information is lost in the chain, that the event filtering is done in the right place and obviously, that the X driver does a good job. Unfortunately xf86-input-wacom (X input driver for wacom’s kernel driver) doesn’t support my Bamboo Fun Touch & Pen yet and moreover I don’t see MPX support in the sources, so I’m wondering how far away is the Qt multi-touch backend from seeing the light.

Conclusion

I don’t know which way the multi-touch will happen on linux, but I know for sure that we want to play with gestures and we want it soon

For more information:

• Peter Hutterer’s blog. Peter is the MPX (Multi Pointer X) author and plays a big role in the X.org community.
• X Input Extension 2.0 features.
• The Linux Wacom project. A community-driven effort to develop kernel and X drivers.

I confess, I’m addiQted. You obviously think it’s normal (you’re not reading this blog by accident, aren’t you?) but it wasn’t always like this: I’ve liked some previous versions, but the upcoming Qt 4.6 really rocks!

The Fotowall case

As I shown previosly, Fotowall already uses some features of Qt 4.6. How much?
Qt 4.6 is referenced in 32 places, for example in snippets like this:

    // center the path
    QPointF pathCenter = path.boundingRect().center();
    #if QT_VERSION >= 0x040600
        path.translate(-pathCenter);
    #elif QT_VERSION >= 0x040500
        path = QTransform::fromTranslate(-pathCenter.x(), -pathCenter.y()).map(path);
    #else
        QTransform tx;
        tx.translate(-pathCenter.x(), -pathCenter.y());
        path = tx.map(path);
    #endif

From simple path translations to more complex property manipulations, everything got better. See this code snipped about extending QGraphicsObject in 4.6 versus 4.5 and 4.4.

    #if QT_VERSION >= 0x040600
    class AbstractContent : public QGraphicsObject
    #else
    class AbstractContent : public QObject, public QGraphicsItem
    #endif
    {
        Q_OBJECT
    #if QT_VERSION < 0x040600
        Q_PROPERTY(QPointF pos READ pos WRITE setPos)
        Q_PROPERTY(qreal rotation READ rotation WRITE setRotation NOTIFY rotationChanged)
    #endif
    #if QT_VERSION < 0x040600 && QT_VERSION >= 0x040500
        Q_PROPERTY(qreal opacity READ opacity WRITE setOpacity)
    #endif

Do you feel the pain?

I Need it

I need a world with Qt 4.6 only, because:

• It’s too much of a pain to support older versions in the same codebase
• It’s not even fair, because non-4.6 users won’t enjoy the program as it’s meant to be
• I can’t use A TON of new features because they’ll either simplify too much the code, or just because they don’t have a pre-4.6 equivalent
• and because I’d like to finally use
  • QGraphicsEffect for Fotowall’s content
  • QVector3D to say goodbye to enricomath.h
  • QGesture for multi-finger interaction
  • QPropertyAnimation to its full potential!

More 4.6 TEASING

1. As you seem to like videos, here is a preview of something we’re working on for Amarok Qt 4.6 only!!
   

   Click here to view the embedded video.

2. Also, since I’m soooo much a giver, see the new Fotowall’s Word Cloud feature, coming in 0.9

See you @ Munich

I’m packing for the DevDays 2009 Munich. See you there

Indirect Benefits, or ‘what you get for free’

• Improved quality and better speed in the OpenGL QPainter
• Better speed in the GraphicsView framework

Direct Benefits

• Animation Framework: this simply r0cks! I don’t know about the whole Kinetic stuff, I just mean the ability to create simple property animations.
  I don’t have a video to show you but just take a look at the Fotowall’s Top-Bar, the tabs appear and disappear with a nice and smooth grow-shrink animation, that make the program look soo 2009-ish! finally!
• QNetworkReply::isFinished(): thanks to this method I could implement a smart time-saver: when the user starts to drag a flickr picture, Fotowall starts downloading it. It can happen that, upon drop, the content has already been completely downloaded (so it can be placed in the canvas) or partially downloaded (so the used only needs to wait for the missing percent)

Drawbacks

• There are some graphics glitches when animating the opacity property of a QGaphicsProxyWidget (in OpenGL)
• Even by setting the QGraphicsItem::ItemSendsGeometryChanges flag, the previous behavior is not perfectly restored (we used itemChange, and the new behavior doesn’t allow Fotowall’s mirrors to sync properly to the objects)

Movie Time!

I’ve tried hard to record a screencast about the Cuteness & Performance of Qt 4.6, but in the end I had to use my camera.

Click here to view the embedded video.

Thanks Nokia for this great release!

[1] Fotowall is a creative program to mix local and online graphics content and build original work.

Cherry picked  features from the delicious 0.8 release:

• Now you’ll be able to deform text changing the shape of its baseline visually (see the “Fotowall” string in the image above and its Bezier control points)
• Pictures can be cropped to a certain area, for example to select a single person from a group. Also picture’s transparency can be adjusted, to create nice fading effects
• A lot of work has been put into enabling OpenGL acceleration, really useful if your canvas has 100+ semi-transparent objects
• You can now work with a transparent window (or blurred, on Vista)
• The top-bar is now context-sensitive. We’ll move more and more content properties to that instead of the old content configuration window

Plus a lot of user suggestions and fixes have been implemented to make Fotowall always easier and intuitive to use. The 0.8 release now ships in 6 different languages: english, italian, french, german, brazilian, polish. You can even contribute your own translations.

But our favorite news is that Fotowall now has it’s official website

What about next: we’re working hard on the 0.9 release and we already have lots of new features! You’ll be surprised by what you’ll be able to achieve with the next version

A final special thank to Zack Rusin who created the Text on path example that was the basis of our shaped text.

New features in Fotowall 0.7. In the top left area you can see the web image selector.

With this release Fotowall integrates with the deep web. You can now search the network with the embedded flickr search pane and add the images to the canvas. This opens up an infinite can of content, all available for your pleasure .

Other relevant features include:

• support for Qt 4.6 (brings animations and transparencies)
• usability fixes (rubberband selection, deletion, etc..)
• cleaner design (new icons, loadable frames, better property dialogs)
• italian, french and german translation
• check for updates and web links

Don’t hesitate to ask for missing features and always remember that you can rotate pictures by dragging corners with the right mouse button

Enjoy your Fotowall!!

Please enjoy this HQ stream of deceptive video pixels while I explain this fine new piece of trickery

Click here to view the embedded video.

As you can see, this other frustration-driven program lets you climb the ladder of a typical facebook game while drinking coffee or feeding your pet!

So, before starting you need:

1. a dictionary file for your language of choice (1 word per line)
2. a dictionary file with the names of your facebook friends (for the ‘bonus’ levels)
3. a compiler, because I’m not making binary packages this time
4. the source code of AutoGram, published here and available as a tar.gz here.

Build it with your favourite compiler (tested on Linux with gcc and on Windows with msvc) or your favourite IDE (you can download QtCreator if you don’t know what an IDE is and click on the autogram.pro project file). Then Run it and embarass your friends

Here is how the program works:

1. grabs the screen image and cuts off the 6 images representing the letters.  [ScreenCapture.h]
2. recognizes each character by comparing the image to the alphabet and picks the match that has less differential energy. (is like xor-ing 2 pictures and computing the energy of that)  [Ocr.h]
3. performs all the permutations of the characters, to find out all the words that can be made out of the given alphabet. [Scrambler.h]
4. validates with a dictionary to filter out unknown words. the dictionary is the “main language dictionary” if the screen is yellow-ish (indicating normal game) or the “bonus game dictionary” if the screen is red-ish (indicating a bonus game, where all the words are picked from the names of your friends).  [Scrambler.h]
5. injects the words (as keystrokes + return) to the browser window.  [InputUtils.h]
6. there is a timer-based loop that performs the operations 1-5 while updating the GUI.  [WCGame.h contains the logic, AppWidget.h handles the GUI]

If you run AutoGram on a virtual machine, please remember to switch it off after a while! I take no responsability of any score overflow

Again here is the source code, stay tuned for more web automation articles, and enjoy

update: XP/Vista download here

You are happily wasting time on facebook (that site with all the ignore buttons, with noisy stuff from people who call themselves ‘friends’ of you.. you know..) when you unfortunately get hooked up with Biotronic. This flash game is quite nice, but there is a rank ladder on bottom and you’re last. So you play and play … still last, play even more.. still last.. can you see the frustration?! The layman’s answer is to play (aka waste hours) to get better and climb the ladder..

And then there’s the programmer’s answer: I’ll write a Qt program to get me on top!! (yes, and still waste hours ) — Here is the result: BioCheat

Click here to view the embedded video.

The game is in FLASH, so no HTML or DOM tricks, you have to emulate eyes, brains and hands (only 1). Or in other words you have to see, think and act. Or in other words you have to recognize the image, solve the puzzle and send the clicks back.

Not only I became the first among my friends, I was the world #1 for a month (with 5Million points) Then they wisely reset my score to zero (was too high for a human player) and many people started using and modifying BiCheat!

Here is the simple work flow of the program:

Plus when there is near 60% of recognized blocks, a condition telling that the level is finished, we press the “next” button (a mouse click at an absolute position) to go to the next level. Then you can go grooming your cat while BioCheat plays for you.

In the end it’s a machine vs machine fight, not a human-to-machine one

Again here is the source code, stay tuned for more web automation articles, and enjoy

Nuove caratteristiche presenti in Fotowall 0.6

Se non vi sono bastate le tonnellate di migliorie della 0.5 ecco che arriva una 0.6 che quasi raddoppia la base di codice e introduce una serie di caratteristiche che danno un taglio professionale senza intaccare la facilità di interazione e la libertà di giocare con Fotowall E ancora non avete letto nulla…

Integrazione con PosteRazor

Non ci vuole un pennello  grande, ma un grande pen Fotowall 0.6!

PosteRazor, di Alessandro Portale, è un programma che consente di stampare a casa propria dei poster grandi a piacere con una stampante comune.In pratica divide l’immagine in tanti fogli che una volta ritagliati ed incollati vanno a formare un Poster.  La capacità di Fotowall di sintetizzare immagini in altissima definizione e l’esportazione con PosteRazor permettono di creare composizioni grafiche di risoluzione notevole in uno spazio piccolo, quale lo schermo del PC.

Oltretutto, l’unione di Fotowall e PosteRazor, rappresenta un avvenimento davvero raro nel panorama opensource. Sono infatti frequenti i fork, quando gruppi di persone vogliono evolvere un software in modo diverso dalla linea prestabilita e così si finisce con più programmi che fanno la stessa cosa, ma i join, come questo caso, sono davvero rarissimi!

Oggetto Video, o Specchio

E” un oggetto manipolabile (come le Foto o il Testo) che contiene il video ripreso dalle webcam collegate al PC. E’ detto anche specchio perchè spesso i portatili sono dotati di una webcam che ti riprende, quindi è un po’ come inserire degli specchietti in Fotowall

Export Guidato

L’assistente consente di esportare la scena attuale in 4 modi: impostando lo sfondo del desktop, salvando un’immagine, creando un poster (vedi PosteRazor), o stampando su carta. Ci sono tutte le opzioni necessarie per divertirsi Consiglio anche di vedere il modo “Dimensione Esatta” (accessibile dalla finestra principale di Fotowall), che consente lavorare a schermo all dimensione fisica specificata (tipo 15x6cm) e stampare alla medesima dimensione. WYSIWYG

Formato XML

La scena può essere salvata e recuperata (quasi, ehm.. esattamente..) nel nuovo formato XML, che assicura compatibiltà in avanti. Da oggi in poi potrete mettere via le vostre scene Fotowall preferite.

Selezione, Prospettiva &  altri 50 commit

E’ possibile selezionare più oggetti, spostarli o cambiare le proprietà in gruppo, cambiare la prospettiva degli oggetti (rotazione attorno agli assi X ed Y ), riscalare il testo come si roto-scalano le immagini, c’è l’effetto Seppia, e molto altro ancora

Enjoy your Fotowall!!