Using Textbox.io -Toolbar custom commands

HTML

<script src="https://s3.amazonaws.com/ephox-static-ephox-com/jsfiddle/textboxio/textboxio.js"></script>
<div id="editableDiv">
    <p>This is the Editor content</p>
</div>

CSS

#editableDiv {
    margin:10px 0;
    height:200px;
}

JavaScript

var customCommand = {
    id : 'myCommand',
    text : 'my custom command', 
    action : function () {
        alert('hello world');
        // write custom functionality to occur when the button is clicked here.
    }
};


textboxio.replace('#editableDiv',{
    ui: {
        toolbar :  {
                        items : [ 
                            {
                                label: 'Insert group',
                                items: [
                                    {
                                        id    : 'insert',
                                        label  : 'Insert Menu',
                                        items : [ 'fileupload', 'table' ]
                                    }
                                    
                                ]
                            },
                        
                        'listindent',
                        {
                            label: 'ListIndent',
                            items: []
                        },
                        {
                            label: 'Miscellaneous',
                            items: ['link', 'hr']
                        },
                        'format',
                        {
                            label: 'Format',
                            items: []
                        },
                        'tools',
                        {
                            label: 'tools',
                            items: []
                        }
                        
                       ]
                    }
    }
});