XF 1.5 Editor on focus/blur events

[Siropu]

I'm using this code:

<script>
$(function()
{
        var ed = $('textarea.BbCodeWysiwygEditor').data('XenForo.BbCodeWysiwygEditor');

        if (ed && ed.api.isMobile())
        {
            ed.api.$editor.on('focus', function()
            {
                 // do something
            });
            ed.api.$editor.on('blur', function()
            {
               // do something
            });
        }
});
</script>

It works fine in Chrome but in Firefox, I get this error: TypeError: ed.api is undefined
If I use console.log(ed); I can see the api object.

Is there a way to fix the issue in FF or is there a better way to listen to editor's focus/blur events?

 

[delicatebobster]

@Chris D @Mike

This bug is causing me big problems, please can we find a solution to fix this problem

thanks all

 

[Chris D]

What's happening is most likely that your code is running before the editor is actually initialized. You'll likely need a slightly more robust approach, which essentially involves listening to the editor being initialized. Your file would end up looking something like this:

!function($, window, document, _undefined)
{
   XenForo.YourFunction = function($textarea) { this.__construct($textarea); };
   XenForo.YourFunction.prototype =
   {
      __construct: function($textarea)
      {
         this.textarea = $textarea;

         $(document).bind(
         {
            EditorInit: $.context(this, 'editorInitFunc')
         });
      },

      editorInitFunc: function(e, data)
      {
         if (data.$textarea[0] == this.textarea[0])
         {
            var ed = this.textarea.data('XenForo.BbCodeWysiwygEditor');

            if (ed && ed.api.isMobile())
            {
               ed.api.$editor.on('focus', function()
               {
                  // do something
               });
               ed.api.$editor.on('blur', function()
               {
                  // do something
               });
            }
         }
      }
   };

   XenForo.register('textarea.BbCodeWysiwygEditor', 'XenForo.YourFunction');

}(jQuery, this, document);

 

[Siropu]

Thank you. I have tried the code and it seems that editorInitFunc never gets called. Em I missing something?

 

[delicatebobster]

Hello @Chris D any help over here very greatful!

 

[Chris D]

That’s the code we use in XFMG to add buttons to the editor so it should work. I don’t really have anything additional to add at this point.