Extend Javascript files

Need Help
#1

I would like to add custoim functionality to

modules/media/widgets/mediamanager/assets/js/mediamanager.popup.js

I need to add a custom command

MediaManagerPopup.prototype.onPopupCommand = function(ev, command, param) {
        switch (command) {
            case 'insert':
                this.insertMedia();
                break;
            case 'customCommand':
                this.customCommandFunction();
                break;
            case 'insert-cropped':
                this.insertCroppedImage(param);
                break;
        }

        return false
    }

and also to add the function

function customCommandFunction

MediaManagerPopup.prototype.customCommandFunction= function() {
  console.log('Custom function');
}

how can i accomplish it so that the update wont effect my code.

Thanks alot

1 Like
#2

just a hint… try to check out this kind of code from vanilla theme where is created / updated some controls.

1 Like
#3

@apinard, @snipi

the problem was that i was extending the plugin even it was not intiated. the following step fixed the extension.

$( document ).ready(function() {

    let currentMediaPopup = $.oc.mediaManager.popup;

});
2 Likes
#4

You can try this

var NewMediaManagerPopup = $.oc.mediaManager.popup

NewMediaManagerPopup.prototype.onPopupCommand = function(ev, command, param) {
        switch (command) {
            case 'insert':
                this.insertMedia();
                break;
            case 'customCommand':
                this.customCommandFunction();
                break;
            case 'insert-cropped':
                this.insertCroppedImage(param);
                break;
        }

        return false
    }
NewMediaManagerPopup.prototype.customCommandFunction= function() {
  console.log('Custom function');
}

$.oc.mediaManager.popup = NewMediaManagerPopup

and then extend and add the js in Plugin.php

2 Likes
#5

@jackyhuynh0407 thanks alot. it works very well.