1

I'd like to know if it's possibile to "extend" the function named canvas_listeners that is defined inside this module and how to do it. I'm very new to javascript, I'm sorry, I'm not even sure if this is a module at all :(

plugin.js

var XYZ = (function ($, xyz) {
    'use strict';
    var xyz = {};
    xyz.canvas = {};

    $(document).ready(function () {
        canvas_start();

        function canvas_start()
        {
            //something
            canvas_listeners();
            //something
        }

        function canvas_listeners()
        {
            xyz.canvas.on('object:selected', function (options) {
                //something
            });
        }
    });

    return xyz;
}(jQuery, XYZ));

From another js file, I'd like to add to canvas_listeners something on the event object:modified. This is my attempt but obviously it doesn't fire because it's not inside canvas_listeners..

myscript.js

$(document).ready(function () {
    var XYZ = (function ($, xyz) {
        xyz.jailBox = function() {
            xyz.canvas.on('object:modified', function (options) {
                //something
            });
        }
    return xyz;
    }(jQuery, XYZ || {}));
});

I've searched but I can't find how to add my event to the original function.

Adding methods to JavaScript module pattern

http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.htm

Thanks for your help. Regards Ziqu

EDIT Ok, I've found a way to add a public function to the module but it still won't fire. The plugin uses fabric.js: the canvas object is created inside canvas_start() that is private as canvas_listeners() and I can't hook into both the functions. In myscript.js XYZ.canvas is: {} so I get the error XYZ.canvas.on is not a function In plugin.js xyz.canvas is: #

Still looking for a solution, any help will be very appreciated.

myscript.js

$(document).ready(function () {
    XYZ = (function ($, xyz) { //without 'var'
        xyz.jailBox = function() {
            XYZ.canvas.on('object:modified', function (options) { 
                //my function code here
            });
        }
    return xyz;
    }(jQuery, XYZ || {}));
});
Ziqurrat
  • 21
  • 3
  • Actually what you want to do here is changing a local variable which is not possible as far as I think. Instead you can implement and invoke your own method – binariedMe May 04 '17 at 07:01
  • Or use reflection type of technique to change plugin.js file altogether. – binariedMe May 04 '17 at 07:01
  • @binariedMe, thanks for the reply. I can't say I fully understand what you've said. How can I chain my method so that it fires togheter with the other? Can you point me to an example ? Thanks. – Ziqurrat May 04 '17 at 07:19
  • Can you please provide a plunker with your plugin.js file attached too? – binariedMe May 04 '17 at 08:35
  • I'm sorry, I can't because the plugin is a copyrighted one and I can't share the original code ;( – Ziqurrat May 04 '17 at 08:54
  • Ohkay. Let me try explaining again. You can always import js file as text using ajax. Then in the response data, you can read and edit function and then save this function for your own use. – binariedMe May 04 '17 at 08:58
  • Sorry, I don't know how to do this. – Ziqurrat May 17 '17 at 08:59

0 Answers0