Tooltips in Wonderland

Last week I posted a new module to our (brand new!) Module Warehouse. It’s the Tooltip module. I originally wrote this module as an example of how to develop Cell Components (which are called Capabilities in the UI). I really do intend to write a tutorial around this example, but for now, I decided to upload it to the Warehouse. You can of course get the code too: it’s in the unstable/ section of the wonderland-modules project (see this tutorial for instructions on how to download this, and other, module source code).

The Tooltip module displays a tooltip in the HUD when a user hovers over an Object in the world. To add the Tooltip Capability, right-click on the Object and select Properties… from the context menu to bring up the Object Editor. Then click the ‘+’ in the lower left-hand corner of the Object Editor (see picture below). Choose the Tooltip Capability from the dialog which appears and click OK. Then in the Object Editor, select Tooltip in the Capabilities list, enter the tooltip text on the right and click Apply.

Tooltip property sheet with text

The following shows what a tooltip with simple text looks like in-world:

Lunar Rover with plain text tooltip

What’s cool about the Tooltip Capability (if I do say so myself), is you can enter HTML text as well. Just enclose your text in the <html>…</html> tags. Although the available support for HTML is limited, I’ve tested some common tags like <br> (to achieve multi-line tooltips), <b>, <table>, and even <img>.

The property sheet below shows an example of displaying formatted text in a tooltip:

Tooltip property sheet with HTML

And here’s the result in-world:

Lunar rover with HTML tooltip


10 Responses to Tooltips in Wonderland

  1. gary says:

    Jordan, this will be incredibly useful. Thanks! I wonder if links work — and how that event should be handled: browser instance in-world?

  2. Jordan Slott says:

    We did try links — unfortunately when you move your mouse, the tooltip disappears, so there is no opportunity to click on the link.

  3. matty_x says:

    This looks like a very cool module. Can’t wait to try it out!

  4. Nigel Wynne says:

    This looks great, a really useful development. However when we tried it we got an instantaneous response on one client, but a 30 second delay on mine, both supported by the same servers, same world etc..
    That said, if we can iron this out this could provide a solution to educational scaffolding that we really need for our health care scenarios.

  5. Jordan Slott says:

    Can you provide some specs on the client with the slow performance? Do you notice slow performance of other windows on the HUD? (e.g. Users list, FPS window, etc)
    Naturally, each client responds independently to its own mouse movement — the visibility of tooltips are not synchronized across clients.
    We’ll try this out today in our community test and let you know if we can repeat what you are describing.

  6. Nigel Wynne says:

    my client is has an intelcore 2 quad CPU @ 2.83Ghz, 3 GB RAM, Nvidia Geforce 9400 GT,
    This has about a 20 sec delay, when the mouse hovers over the object in this case a post it note, everything freezes except for avatar movement. i.e. the frame rate window stops, user list and text chat become non functional.
    Have replicated this just on two brand new macbookpros. frp aprox 190.
    Thinking this may relate to the fact that we used a post it note to attach the tooltip to, have just tried it on an object and it work great across all clients. Appears within 3 secs.
    We’ll be attending the test so look forward to seeing you there.

  7. Jordan Slott says:

    There are picking issues with the Post-it note for some reason (nothing related to the tooltip). Glad to hear it works for all other objects.

  8. nigel wynne says:

    Have just used tool tip to display patient observation charts in our main world. Works like a dream. Have sent kevin a screen grab and asked him to forward on.
    Thanks Again

  9. […] of places. The latest module in the Project Wonderland Module Warehouse was inspired by two events: Jordan’s tooltip component and the +Spaces EU […]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: