How to access methods and arguments of self-calling functions?

Question

JavaScript

All the best!
Can you please tell me how to call a function from a self-calling function?
That is, the js file is connected to the page as

<script type="text/javascript" src="/content/js/card.js"></script>

in which the self-calling function is:

(function () {
    var modal = (function () {

        var modal = null,
            content = null;

        function generate() {
            var template = '<div id="modal-attach-card" class="modal">' +
                '<div class="modal-content"></div></div>';

            $('#modal-attach-card').remove();
            $('.lean-overlay').remove();
            modal = $(template).appendTo('body');
        }

        function open(uid) {
            $.ajax({
                url:"url"
                type: "GET",
                success: function (data) {
                    generate();
                    modal.find('.modal-content').html(data);
                    modal.openModal();
                    modal.draggable({
                        // axis: 'x',
                        containment: 'window',
                        cancel: '.global-content, #modal-confirm',
                        drag: function(e, ui) {

                            if(ui.position.left < 265) {
                                ui.position.left = 265;
                            }

                            if(ui.position.top > window.innerHeight - ($(this).height())) {
                                ui.position.top = window.innerHeight - ($(this).height());
                            }
                        }
                    })
                },
                error: function (data) {
                    toast.error(data.responseText)
                }

            });

        }

        function close() {
            if (modal) {
                modal.find('.modal-content').empty();
                modal.closeModal();
            }
        }

        return {
            open: open,
            close: close
        }
    }());

var socket = (function () {
    var uri = 'localhost:8080/path', socket, client;
    connect();
    function connect(callback) {
        socket = new SockJS(uri);
        client = Stomp.over(socket);

        armAPP.socketClient = socket;

        client.connect({}, function () {
            this.subscribe('/queue/attach', function (obj) {
                var data = JSON.parse(obj.body);
                modal.open(data.uid);
                console.log('######## attach');
                console.log(data);
                console.log('####################');
            });
            this.subscribe('/queue/de-attach', function (obj) {
                modal.close();
                console.log('######## de-attach ');
                console.log(obj);
                console.log('####################');
            });

            console.log('connected');
            if (callback) {
                callback();
            }
        }, function () {
            setTimeout(function () {
                connect(function () {
                    console.log("restart current")
                });
            }, 5000);
        });
    }


    function close() {
        client.disconnect();
    }

    return {
        close: close
    }
}());

I don’t understand how you can call the modal.openModal() function from there; or another?
Or how to call subscription events this.subscribe ....
Tried through windows.cards. ... get through , but it doesn't work...
I want to use it to call from the Chrome extension, through the content script

Answer 1

You seem to miss the end "}());" closing the call to the very first function.
There are two problems here.
Firstly, it is impossible to simply reach any methods and objects from the JS environment of the web page from content_script, they specifically act in different ones. But there is such a trick when the code from content_script will already have access to the page environment:
// make a line with the function
var injectedCode = '(' + function(stringParameter) {
// this code will already be executed in the context of the target page
// here you can call any global methods that were connected on the site page
// you can even pass some string value in a fancy way
// for example, as we passed in stringParameter
} + ')("' + '12345' + '");';
// create a script element, put this line there and connect it to the site page
var script = document.createElement('script');
script.textContent = injectedCode;
(document.head || document.documentElement).appendChild(script);
// you can immediately cut it out =)
script.remove();
The second problem is that if there is no global object "sticking out" outside the self-calling function, then we cannot refer to that code in any way. But usually there has to be something available outside, otherwise what's the point of creating these modal and socket objects.