Magic Bubbles or Related Bubbles

First off you have to love the name, it comes from Amsterdam :}

Second, throw this code into any of your programs (along with a few other parameters) and you got yourself magic bubbles:

app.ShowRelatedBubbles(point, targetPoint, ("finModel" in this),context.event)

You can call this right from the console like this.

Example of calling magic bubbles

app.ShowActionButton({
    modal: true,
    label: "Do the thing",
    buttons: [
        {
            image: 'http://placehold.it/50x50',
            label: 'label',
        },
        {
            icon: 'icon-plus',
            styles: 'background: green',
            label: 'Label',
            action: 'app.set("showActionButton", false);'
        },
        {
            content: 'J',
            label: 'Jonathan',
        },
        {
            content: 'Hi',
            label: 'label',
            styles: 'background: #333; color: green'
        }
    ]
})

How to read the magic bubbles when they are open

Example of calling magic bubbles

/// This give me the magic bubbles object, make sure you have it open when you call this.
app.viewmodel.data.actionbuttonContext


//// If you want to get the json string call this below
JSON.stringify(app.viewmodel.data.actionbuttonContext)

More Examples of how you could call magic bubbles

Example of calling magic bubbles

app.ShowActionButton({
    modal: true,
    label: "Do the thing",
    buttons: [
        {
            image: 'http://placehold.it/50x50',
            label: 'label',
        },
        {
            icon: 'icon-plus',
            styles: 'background: green',
            label: 'Label',
            action: 'app.set("showActionButton", false);'
        },
        {
            content: 'J',
            label: 'Jonathan',
        },
        {
            content: 'Hi',
            label: 'label',
            styles: 'background: #333; color: green'
        }
    ]
})