Image dialog — extend onOk, instead of total overwrite

问题

I have found out that I can hook into onOk with this:

editor.on('dialogShow', function (ev)
{
    var name = ev.data.getName();
    var definition = ev.data.definition;

    if (name == 'image')
    {
        definition.onOk = function(e)
        {
            console.log( e );
        };
    }
});

Awesome, unless now the default behavior is dropped, resulting in no image being added to the CK content.

Checking up on CK's source, I do not want to break 74 lines worth of functionality provided by default.

My goal is to simply run the image through a callback after it has been appended.

Is copy/paste, modify the only way to retain extend the functionality, or is there another way?

回答1:

Small improvement of maximkou's solution:

var oldImplementation = definition.onOk;
definition.onOk = function( e ) {
    oldImplementation.apply( this, [].slice.call( arguments ) );
    console.log( e );
};

This solution is ~~ok and AFAIK it's the cleanest one~~.

Update: I've found a better solution - there's dialog#ok event about which I've just learnt :). So you don't need to change dialog's definition - you can bind your event listener like this:

editor.on('dialogShow', function ( evt ) {
    if ( evt.data.getName() == 'image' ) {
        var listener = evt.data.on( 'ok', function() {
            console.log( 'ok!' );
        } );

        // We need to remove that listener, to avoid duplicating it on
        // next dialogShow.
        evt.data.on( 'hide', function() {
            listener.removeListener();
        } );
    }
} );

回答2:

var oldImplementation = definition.onOk;
definition.onOk = function(e)
{
    oldImplementation(e);
    console.log( e );
};

来源：https://stackoverflow.com/questions/16922424/image-dialog-extend-onok-instead-of-total-overwrite

标签

javascript

ckeditor