Using facebox with jwysiwyg

Recently I worked on a project which is required me to create an interface for emailing. I decided to use an ajax form, and I found facebox which is initial made by defunkt (founder of github): https://github.com/defunkt/facebox. I folked and modified facebox to fit my project's needs: https://github.com/dangtrinh/facebox.

All I have to do is apply the power of jwysiwyg library (https://github.com/jwysiwyg/jwysiwyg) to apply the rich format text-editor to the textarea:

facebox.js:

...

    reveal: function(data, klass) {
      $(document).trigger('beforeReveal.facebox')
      if (klass) $('#facebox .content').addClass(klass)
      $('#facebox .content').empty().append(data)
   
      // check if there is a textarea, if yes, apply make it a wysiwyg editor
      // using jwysiwyg library https://github.com/jwysiwyg/jwysiwyg
      if ($('#facebox .content #mytextarea').length) {
 $('#facebox .content #mytextarea').wysiwyg();
 };
   
      $('#facebox .popup').children().fadeIn('normal')
      $('#facebox').css('left', $(window).width() / 2 - ($('#facebox .popup').outerWidth() / 2))
      $(document).trigger('reveal.facebox').trigger('afterReveal.facebox')
    },

...

Remember to put a textarea in the html file you want to load with facebox:

myhtml.html:

...

<textarea id='mytextarea'></textarea>

...


Here is the results: