CODEWITHSUNDEEP
javascriptangularjstinymce-4
sapphire
sapphire

Reputation: 7

How to catch fullscreen event of tinyMCE in Angular

I have add tinyMCE in may website which is using angular. I'm not able to catch full screen event of tinyMCE. I've checked the topic here and tried many method, but still no success.

-With the code below in editor setting I'm able to catch "change", "redo", "undo" event:

setting = {
  selector: 'textarea',
  ...
  setup: function(e) {
    e.on('undo', function () {
      some codes;
    });
  },
};

but 'fullscreen' seems not work here, neither the button on the toorbar, nor the one in the menu.

-I also tried to get it by finding the fullscreen class in the DOM:

if ( angular.element('.mce-fullscreen').length ) {
    console.log('fullscreen');
  }

Anyone have some hints, please? Thank you very much.

Upvotes: 0

Views: 1477

Answers (1)

Michael Fromin
Michael Fromin

Reputation: 13746

If you look at the source code for the fullscreen plugin you will see this line:

editor.fire('FullscreenStateChanged', {state: fullscreenState});

...so when you go to full screen the editor will emit the FullscreenStateChanged event. You can then use that event like this:

setup: function (editor) {
   editor.on('FullscreenStateChanged', function () {
       console.log('FullscreenStateChanged event fired.');
   });
}

Upvotes: 4

Related Questions