conversejs / community-plugins Goto Github PK

Error: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
    at worker.onmessage (VM578 vmsg-lib.js:238:18)

startVoiceChat ReferenceError: $ is not defined
    at onLocalTracks (voicechat.js:193:20)
(anonymous) @ voicechat.js:153
Promise.catch (async)
startVoiceChat @ voicechat.js:152
performAudio @ voicechat.js:106
handleEvent @ converse.min.js:2

        voicechat = {
                        ["serviceUrl"] = "wss://beta.meet.jit.si/xmpp-websocket",
                        ["prefix"] = "voicechat-",
                        ["transcribe"] = false,
                        ["transcribeLanguage"] = "en-GB",
                        ["start"] =  "Start Voice Chat",
                        ["stop"] = "Stop Voice Chat",
                        ["started"] = "has started speaking",
                        ["stopped"] = "has stopped speaking",
                        ["hosts"] =
                        {
                                ["domain"] = "beta.meet.jit.si",
                                ["muc"] = "conference.beta.meet.jit.si"
                        }
                };

conversejs_options = {
        ....
        whitelisted_plugins = {"actions"};
}

TypeError: converse.env.Backbone is undefinedsearch.js:23:55
    initialize https://convorb.im/plugins/search/search.js:23

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        // AMD. Register as a module called "myplugin"
        define(["converse"], factory);
    } else {
        // Browser globals. If you're not using a module loader such as require.js,
        // then this line below executes. Make sure that your plugin's <script> tag
        // appears after the one from converse.js.
        factory(converse);
    }
}(this, function (converse) {

    // Commonly used utilities and variables can be found under the "env"
    // namespace of the "converse" global.
    var Strophe = converse.env.Strophe,
        $iq = converse.env.$iq,
        $msg = converse.env.$msg,
        $pres = converse.env.$pres,
        $build = converse.env.$build,
        b64_sha1 = converse.env.b64_sha1,
        _ = converse.env._,
        moment = converse.env.moment;
        var _converse = null,  baseUrl = null, default_domain = null, bosh = null, muc = null;
        var conferenceView;
    var options ;
    var confOptions = {
        openBridgeChannel: true,
        p2p: {
            // Enables peer to peer mode. When enabled the system will try to
            // establish a direct connection when there are exactly 2 participants
            // in the room. If that succeeds the conference will stop sending data
            // through the JVB and use the peer to peer connection instead. When a
            // 3rd participant joins the conference will be moved back to the JVB
            // connection.
            enabled: false,
      
            // Use XEP-0215 to fetch STUN and TURN servers.
            // useStunTurn: true,
      
            // The STUN servers that will be used in the peer to peer connections
            stunServers: [
              { urls: 'stun:stun.l.google.com:19302' },
              { urls: 'stun:stun1.l.google.com:19302' },
              { urls: 'stun:stun2.l.google.com:19302' }
            ],
      
            // If set to true, it will prefer to use H.264 for P2P calls (if H.264
            // is supported).
            preferH264: true
      
            // If set to true, disable H.264 video codec by stripping it out of the
            // SDP.
            // disableH264: false,
      
            // How long we're going to wait, before going back to P2P after the 3rd
            // participant has left the conference (to filter out page reload).
            // backToP2PDelay: 5
          }
    };
    
    var connection = null;
    var isJoined = false;
    var room = null;
    
    var localTracks = [];
    var remoteTracks = {};
    var initOptions = {
        disableAudioLevels: true,
    
        // The ID of the jidesha extension for Chrome.
        desktopSharingChromeExtId: 'mbocklcggfhnbahlnepmldehdhpjfcjp',
    
        // Whether desktop sharing should be disabled on Chrome.
        desktopSharingChromeDisabled: false,
    
        // The media sources to use when using screen sharing with the Chrome
        // extension.
        desktopSharingChromeSources: [ 'screen', 'window' ],
    
        // Required version of Chrome extension
        desktopSharingChromeMinExtVersion: '0.1',
    
        // Whether desktop sharing should be disabled on Firefox.
        desktopSharingFirefoxDisabled: true
    };
    var jid;
    var passeord;
    // The following line registers your plugin.
    converse.plugins.add("jitsimeet", {

        /* Dependencies are other plugins which might be
         * overridden or relied upon, and therefore need to be loaded before
         * this plugin. They are "optional" because they might not be
         * available, in which case any overrides applicable to them will be
         * ignored.
         *
         * NB: These plugins need to have already been loaded via require.js.
         *
         * It's possible to make these dependencies "non-optional".
         * If the setting "strict_plugin_dependencies" is set to true,
         * an error will be raised if the plugin is not found.
         */
        'dependencies': ['converse-roomslist','converse-muc-views'],

        /* Converse.js's plugin mechanism will call the initialize
         * method on any plugin (if it exists) as soon as the plugin has
         * been loaded.
         */
        'initialize': function () {
            /* Inside this method, you have access to the private
             * `_converse` object.
             */
            _converse = this._converse;
            // _converse.log("The \"myplugin\" plugin is being initialized");

            /* From the `_converse` object you can get any configuration
             * options that the user might have passed in via
             * `converse.initialize`.
             *
             * You can also specify new configuration settings for this
             * plugin, or override the default values of existing
             * configuration settings. This is done like so:
            */
            _converse.api.settings.update({
                'initialize_message': 'Initializing myplugin!'
            });

            /* The user can then pass in values for the configuration
             * settings when `converse.initialize` gets called.
             * For example:
             *
             *      converse.initialize({
             *           "initialize_message": "My plugin has been initialized"
             *      });
             */
            // alert(this._converse.initialize_message);

            /* Besides `_converse.api.settings.update`, there is also a
             * `_converse.api.promises.add` method, which allows you to
             * add new promises that your plugin is obligated to fulfill.
             *
             * This method takes a string or a list of strings which
             * represent the promise names:
             *
             *      _converse.api.promises.add('myPromise');
             *
             * Your plugin should then, when appropriate, resolve the
             * promise by calling `_converse.api.emit`, which will also
             * emit an event with the same name as the promise.
             * For example:
             *
             *      _converse.api.emit('operationCompleted');
             *
             * Other plugins can then either listen for the event
             * `operationCompleted` like so:
             *
             *      _converse.api.listen.on('operationCompleted', function { ... });
             *
             * or they can wait for the promise to be fulfilled like so:
             *
             *      _converse.api.waitUntil('operationCompleted', function { ... });
             */
            baseUrl = location.protocol+"//" + _converse.api.settings.get("bosh_service_url").split("/")[2];
            bosh = '//'+_converse.api.settings.get("bosh_service_url").split("/")[2]+"/http-bind";
            default_domain = _converse.api.settings.get("default_domain");
            muc = _converse.api.settings.get("muc_domain")
          console.log('connection',_converse.connection);
            options = {
                hosts: {
                    domain: default_domain,
                    muc: muc // FIXME: use XEP-0030
                },
                bosh: bosh, // FIXME: use xep-0156 for that
            
                // The name of client node advertised in XEP-0115 'c' stanza
                clientNode: 'http://jitsi.org/jitsimeet'
            };
            videoDialog = _converse.BootstrapModal.extend({
                initialize() {
                    _converse.BootstrapModal.prototype.initialize.apply(this, arguments);
                    // this.model.on('change', this.render, this);
                    JitsiMeetJS.init(initOptions);
                    JitsiMeetJS.setLogLevel(JitsiMeetJS.logLevels.DEBUG);
                    jitisInitalize()
                },
                toHTML() {
                  return '<div class="modal" id="myModal"> <div class="modal-dialog modal-lg"> <div class="modal-content">' +
                         '<div class="modal-body">' +
                         '</div>' +
                         '</div> </div>' +
                         '<div style="width:100px;height:100px" id="localVideo"> </div>' +
                         '</div>';
                },

            });
            function jitisInitalize(){
                connection = new JitsiMeetJS.JitsiConnection(null, null, options);
                console.log('connecttion jitsi meet',connection)
                connection.addEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_ESTABLISHED,
                    onConnectionSuccess);
                connection.addEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_FAILED,
                    onConnectionFailed);
                connection.addEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_DISCONNECTED,
                    disconnect);
                
                JitsiMeetJS.mediaDevices.addEventListener(
                    JitsiMeetJS.events.mediaDevices.DEVICE_LIST_CHANGED,
                    onDeviceListChanged);
                    console.log('passwrd',password)
                    //>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
                connection.connect({id:_converse.connection.jid.split('/')[0],password:_converse.connection.pass});
                
                JitsiMeetJS.createLocalTracks({ devices: [ 'audio', 'video' ] })
                    .then(onLocalTracks)
                    .catch(error => {
                        throw error;
                    });
                
                if (JitsiMeetJS.mediaDevices.isDeviceChangeAvailable('output')) {
                    JitsiMeetJS.mediaDevices.enumerateDevices(devices => {
                        const audioOutputDevices
                            = devices.filter(d => d.kind === 'audiooutput');
                
                        if (audioOutputDevices.length > 1) {
                            $('#audioOutputSelect').html(
                                audioOutputDevices
                                    .map(
                                        d =>
                                            `<option value="${d.deviceId}">${d.label}</option>`)
                                    .join('\n'));
                
                            $('#audioOutputSelectWrapper').show();
                        }
                    });
                }
            }
            function onConnectionSuccess() {
                room = connection.initJitsiConference('test', confOptions);
                console.log('room',room)
                room.on(JitsiMeetJS.events.conference.TRACK_ADDED, onRemoteTrack);
                room.on(JitsiMeetJS.events.conference.TRACK_REMOVED, track => {
                    console.log(`track removed!!!${track}`);
                });
                room.on(
                    JitsiMeetJS.events.conference.CONFERENCE_JOINED,
                    onConferenceJoined);
                room.on(JitsiMeetJS.events.conference.USER_JOINED, id => {
                    console.log('user join');
                    remoteTracks[id] = [];
                });
                room.on(JitsiMeetJS.events.conference.USER_LEFT, onUserLeft);
                room.on(JitsiMeetJS.events.conference.TRACK_MUTE_CHANGED, track => {
                    console.log(`${track.getType()} - ${track.isMuted()}`);
                });
                room.on(
                    JitsiMeetJS.events.conference.DISPLAY_NAME_CHANGED,
                    (userID, displayName) => console.log(`${userID} - ${displayName}`));
                room.on(
                    JitsiMeetJS.events.conference.TRACK_AUDIO_LEVEL_CHANGED,
                    (userID, audioLevel) => console.log(`${userID} - ${audioLevel}`));
                room.on(
                    JitsiMeetJS.events.conference.PHONE_NUMBER_CHANGED,
                    () => console.log(`${room.getPhoneNumber()} - ${room.getPhonePin()}`));
                    
                room.join();
            }
            function onRemoteTrack(track) {
                if (track.isLocal()) {
                    return;
                }
                const participant = track.getParticipantId();
            
                if (!remoteTracks[participant]) {
                    remoteTracks[participant] = [];
                }
                const idx = remoteTracks[participant].push(track);
            
                track.addEventListener(
                    JitsiMeetJS.events.track.TRACK_AUDIO_LEVEL_CHANGED,
                    audioLevel => console.log(`Audio Level remote: ${audioLevel}`));
                track.addEventListener(
                    JitsiMeetJS.events.track.TRACK_MUTE_CHANGED,
                    () => console.log('remote track muted'));
                track.addEventListener(
                    JitsiMeetJS.events.track.LOCAL_TRACK_STOPPED,
                    () => console.log('remote track stoped'));
                track.addEventListener(JitsiMeetJS.events.track.TRACK_AUDIO_OUTPUT_CHANGED,
                    deviceId =>
                        console.log(
                            `track audio output device was changed to ${deviceId}`));
                const id = participant + track.getType() + idx;
            
                if (track.getType() === 'video') {
                    $('#localVideo').append(
                        `<video style="width:100px;height:100px" autoplay='1' id='${participant}video${idx}' />`);
                } else {
                    $('#localVideo').append(
                        `<audio autoplay='1' id='${participant}audio${idx}' />`);
                }
                track.attach($(`#${id}`)[0]);
            }
            function onLocalTracks(tracks) {
                localTracks = tracks;
                for (let i = 0; i < localTracks.length; i++) {
                    localTracks[i].addEventListener(
                        JitsiMeetJS.events.track.TRACK_AUDIO_LEVEL_CHANGED,
                        audioLevel => console.log(`Audio Level local: ${audioLevel}`));
                    localTracks[i].addEventListener(
                        JitsiMeetJS.events.track.TRACK_MUTE_CHANGED,
                        () => console.log('local track muted'));
                    localTracks[i].addEventListener(
                        JitsiMeetJS.events.track.LOCAL_TRACK_STOPPED,
                        () => console.log('local track stoped'));
                    localTracks[i].addEventListener(
                        JitsiMeetJS.events.track.TRACK_AUDIO_OUTPUT_CHANGED,
                        deviceId =>
                            console.log(
                                `track audio output device was changed to ${deviceId}`));
                    if (localTracks[i].getType() === 'video') {
                        $('#localVideo').append(`<video autoplay='1' style="width:100px;height:100px;margin-left:500px" id='localVideo${i}' />`);
                        console.log('localVideo',$('localVideo'),i);
                        localTracks[i].attach($(`#localVideo${i}`)[0]);
                        
                    } else {
                        $('#localVideo').append(
                            `<audio autoplay='1' muted='true' id='localAudio${i}' />`);
                        localTracks[i].attach($(`#localAudio${i}`)[0]);
                    }
                    if (isJoined) {
                        room.addTrack(localTracks[i]);
                    }
                }
            }
            function disconnect() {
                console.log('disconnect!');
                connection.removeEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_ESTABLISHED,
                    onConnectionSuccess);
                connection.removeEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_FAILED,
                    onConnectionFailed);
                connection.removeEventListener(
                    JitsiMeetJS.events.connection.CONNECTION_DISCONNECTED,
                    disconnect);
            }
            function onDeviceListChanged(devices) {
                console.info('current devices', devices);
            }
            function onConnectionFailed() {
                console.error('Connection Failed!');
            }
            function onConferenceJoined() {
                console.log('conference joined!');
                isJoined = true;
                for (let i = 0; i < localTracks.length; i++) {
                    room.addTrack(localTracks[i]);
                }
            }
            function onUserLeft(id) {
                console.log('user left');
                if (!remoteTracks[id]) {
                    return;
                }
                const tracks = remoteTracks[id];
            
                for (let i = 0; i < tracks.length; i++) {
                    tracks[i].detach($(`#${id}${tracks[i].getType()}`));
                }
            }
            
        },

        /* If you want to override some function or a Backbone model or
         * view defined elsewhere in converse.js, then you do that under
         * the "overrides" namespace.
         */
        'overrides': {
            /* For example, the private *_converse* object has a
             * method "onConnected". You can override that method as follows:
             */
            'onConnected': function () {
                // Overrides the onConnected method in converse.js

                // Top-level functions in "overrides" are bound to the
                // inner "_converse" object.
                var _converse = this;
                jid = _converse.connection.jid
                password = _converse.connection.password
                // Your custom code can come here ...

                // You can access the original function being overridden
                // via the __super__ attribute.
                // Make sure to pass on the arguments supplied to this
                // function and also to apply the proper "this" object.
                _converse.__super__.onConnected.apply(this, arguments);

                // Your custom code can come here ...
            },
            ChatRoomView:{
                initialize(){
                     var _converse = this;
                    this.createConferenceView();
                    _converse.__super__.initialize.apply(this, arguments);
                },
                createConferenceView(){
                    console.log('create conference view',_converse.connection.pass);
                },
                videoCall(){
                    videoDialog = new videoDialog();
                    videoDialog.show();
                }

            },

            /* Override converse.js's XMPPStatus Backbone model so that we can override the
             * function that sends out the presence stanza.
             */
            'XMPPStatus': {
                'sendPresence': function (type, status_message, jid) {
                    // The "_converse" object is available via the __super__
                    // attribute.
                    var _converse = this.__super__._converse;

                    // Custom code can come here ...

                    // You can call the original overridden method, by
                    // accessing it via the __super__ attribute.
                    // When calling it, you need to apply the proper
                    // context as reference by the "this" variable.
                    this.__super__.sendPresence.apply(this, arguments);

                    // Custom code can come here ...
                }
            }
        }
    });
    function newElement(el, id, html)
    {
        var ele = document.createElement(el);
        if (id) ele.id = id;
        if (html) ele.innerHTML = html;
        document.body.appendChild(ele);
        return ele;
    }
    
}));