Answered How do i add a custom button on tinymce editor?

I looked in to that but i couldn't,

It is rather unfortunate that you have to write a plugin for so simple a task as "custom button". And an upgrade to that Extra might wipe your customization.

I looked in to that but i couldn't,

If you need assistance, don't hesitate to ask here:
https://forums.modx.com/thread/97694/support-comments-for-tinymcewrapper

Ok here is how i added a custom menu/button to tinymce editor.

For this i gone through many plugins they already have,

1) Create a folder inside modx/assets/components/tinymcerte/js/vendor/tinymce/plugins/vzaar
- Basic funda is to, whenever you want to add a custom button or menu you have to write a tinymce plugin for that. In my case its "vzaar". All the controls you see on tinymce are actually plugins.
2) Add below code, and save as plugin.min.js

tinymce.PluginManager.add("vzaar", function(a) {
    function b() {        
        var b = a.windowManager.open({ 
            title: "Vzaar Video List",
            width: '900',
            height: '700',
            url: 'http://localhost/modx/index.php?id=2',  
        });

    }
    a.addCommand("mceCodeEditor", b), 
    a.addButton("Vzaar", { 
        icon: "media", 
        tooltip: "Vzaar video", 
        onclick: b 
    }), 
    a.addMenuItem("Vzaar", { 
        icon: "media", 
        text: "Vzaar video", 
        context: "tools", 
        onclick: b 
    }) 
});

3) Open system settings in modx manager and navigate to tinymce settings and find for "tinymcerte.plugins" settings and append your plugin name to existing list like "vzaar"
4) To return a data from tinymce oppup window use below code

window.parent.tinyMCE.activeEditor.execCommand( 'mceInsertContent', 0, 'Your contents will go here' );