Thanks noobster. If this is usefull for anybody, here is what i did and how i achieved what i wanted.
1. I disabled the bbcode editor from Komento backend settings
- i don't need the entire text formatting stuff like italic, bold, underline, lists ... and so on
- i just needed the basic stuff: insert link, insert video, insert custom smileys, insert attachments.
2. I figure out the shortcode "structure" from the bbcode editor for video, link and custom emoticons
3. Custom emoticons shortcode (are the ones defines in Komento backend)
4. Next, i customized the Komento form template file (/html/com_komento/comment/form.php) and play with it until i obtained the designed i liked.
5. Now, we must figure out a way to insert the attachments, links, videos and emoticons into textarea, without cluttering the entire design.
I figure out that the best thing to do this is within my own modal boxes that are launched from the custom form footer (see attachments)
6. I designed the modal boxes content and setup modal box "launch" from it's corresponding button
7. Now, we must figure out a way to "insert" the shortcodes into textarea, in our own custom way.
For this, i put together some javascript that will read the "input" field from modal box, take the inserted text and "translate" it in a shortcode format inside the textarea of comment form.
This my be a little complicated for an average user, but here is a code example for inserting the video shortcode into textarea
<script>
$(document).ready(function(){
$( '#insert_video' ).on('click', function(){
var VDO = document.getElementById('vdo');
var video = '[video]' + VDO.value + '[/video]'
var cursorPos = $('#commentInput').prop('selectionStart');
var v = $('#commentInput').val();
var textBefore = v.substring(0, cursorPos );
var textAfter = v.substring( cursorPos, v.length );
$('#commentInput').val( textBefore+ video +textAfter );
$('#vdo').val("");
});
});
</script>
This will "read" the video link inserted by user in the input field (our custom modal box for inserting videos), apply the shortcode format to it, insert it to textarea ... and clear the input (maybe user wants to add many videos, not just one, so we need to clear the input after we inserted the video into textarea)
Obviously, we will have different javascript code, for each modal (insert simley, insert link, insert video) ... since the shortcode formatting is different for each type.
Anyway, it may be a little difficult for an average user, but i managed to put it together the way i want it. It needs just a little bit more layout touch-ups , but it looks good