Balloon Browser widget

[mramato]

I would like to see a BalloonWidget in Cesium which behaves similarly to balloons in other applications (such as Google Earth, Leaflet, etc..). Eventually we can add other features we might need as well, but lets start with the basics.

BalloonWidget is a simple widget which acts as a container for user supplied HTML (and perhaps eventually other markup). It would have the following features

1. Accepts HTML content and sanitizes it using Google Caja.
2. The origin of the balloon can either be a position in screen coordinates or a position in world coordinates. For world coordinates, the balloon can either be in "keep on screen" mode, or in "static" mode that allows the balloon to go off-screen.
3. The balloon can be either closed with an "X" button in the upper right, or programatically closed by the application using it.
4. Styling of the balloon happens via CSS like any other widget.

I think that's all there is to it. Once we have a basic Balloon widget, we can hook it up to Viewer and CZML, GeoJSON, KML, TopoJSON can take advantage of it. We would add a new balloon property on DynamicObject which is the HTML content of the balloon.

Here are some thoughts on other features that we might not need in the short term, but would be good in the future

1. Determine how to let links/buttons present in the Balloon interact with the containing application. For example, clicking a link in a balloon that contains KML in Google Earth causes that KML to be loaded.
2. Dynamic balloon content. Most useful when combines with CZML to show time-dynamic content in sync with simulation time.

How do you guys feel about this plan? Any concerns or things I missing?

[pjcozzi]

Not exactly my area of expertise but I dig it. +1

[jsbrujy]

+1 as well. Having Ballon available to display Metadata also natively in CZML format will be very usefull
Could be balloon and why not in option a left or right additional column to the 2D/3D view (like in STK to display HUD data)

[mramato]

@hpinkos is going to take a stab at this.

[pjcozzi]

For Open Philly Globe, I wanted to change the fade in/out speed of the balloons since we were fading other objects on mouse over. Is this possible? I assume a user has to override .cesium-balloon-wrapper-visible and .cesium-balloon-wrapper-hidden. Can they do that trivially? No rush, just asking.

Also, we might not want to default to linear fade. Linear is generally considered boring, at least in the game world. Cubic ease in/out might be OK.

[emackey]

Changed to ease in/out transitions in dcc7c46. Yes, the official way for users to customize them is with CSS (there's no need for us to create API for all the stuff that users can override with CSS, it would be too big).

[mramato]

Closing this since #1419 has our alternative (and in my opinion better) solution which is still based on the work @hpinkos originally did. I don't plan on deleting the original balloon branch until I have a chance to grab some screenshots of it in action that I plan on using for a blog post.