Customizing HTML Editor Quicktags button to open a dialog for selecting insert choices

I’m on the lookout for including customized quicktag buttons, that will permit me to show a middleman dialog earlier than inserting the code.

State of affairs

1. Clicking a quicktag button opens a dialog or thickbox modal window.
2. Opened dialog shows some choices on the category, and so forth and an Insert button.
3. Clicking “Insert” button inserts the code.

Background

So as to add an quicktags button, we’d use

edButtons[ edButtonsLength+ ] = new edButton(
    'ed_mybutton' , 'Insert button', '<div class="class-name">', '</div>'
);
////
edHTML += '<enter sort="button" worth="Insert customized code" id="ed_my_button" class="ed_button" onclick="edInsertTag( edCanvas, edButtonLength_t + 1)" title="Insert code" />';

Now how am i able to bypass the button to open a dialog(or thickbox modal) as an alternative?

I can add a button with out defining it, like

edHTML += '<enter sort="button" worth="Insert customized code" id="ed_my_button" class="ed_button" onclick="customFunction()" title="Insert code" />';
// and
var customFunction = perform() {
   openURL = '<?php admin_url() ?>admin-ajax.php?motion="insertCodeAction&TB_iframe=true';
   tb_show( 'Insert customized code', openURL );
};

Please share your knowledge. Thanks prematurely.

PS: doing this with TinyMCE is comparatively straightforward, i ponder how do i try this with HTML quicktags. 🙂