Google Meet support

[jhmk]

Normally RC is just supporting Jitsi & BigBlueButton for Video Conference. By changing the Domain in the settings for Jitsi to "hangouts.google.com/hangouts/_" you can use hangouts at the moment because a new Meeting will be created when opening this URL.

But because Hangouts will be deactivated this year and the new Google Meet don't support auto-creating a meeting URL by opening an URL this will stop working.

So it needs to push a request to generate a meeting. Docs: https://developers.google.com/calendar/create-events

The request Body would look like this: { "summary": "test", "end": { "dateTime": "2019-03-27T13:00:00-07:00" }, "start": { "dateTime": "2019-03-27T11:00:00-07:00" }, "conferenceData": { "createRequest": { "conferenceSolutionKey": { "type": "hangoutsMeet" } } } }

[wreiske]

You said that's what the request body would like, is that actually what it looks like, or an example?

Do you have any actual API documentation for generating a hangoutsMeet by a POST call to Google's API, with an apikey, that returns a meeting URL?

[geekgonecrazy]

Transferred to the feature request repo. This might totally be possible via an app though.

[jhmk]

You said that's what the request body would like, is that actually what it looks like, or an example?

Do you have any actual API documentation for generating a hangoutsMeet by a POST call to Google's API, with an apikey, that returns a meeting URL?

This is my working script for: https://developers.google.com/calendar/create-events conferenceDataVersion needs to be set to "1". It also returns a Meeting URL : { "summary": "Test", "end": { "dateTime": "2019-03-30T13:00:00-07:00" }, "start": { "dateTime": "2019-03-30T11:00:00-07:00" }, "conferenceData": { "createRequest": { "conferenceSolutionKey": { "type": "hangoutsMeet" }, "requestId": "abc-zzz-yyy" } } }

Here is more documentation: https://developers.google.com/calendar/v3/reference/events/insert#auth

How to generate a Token: https://www.daimto.com/google-authentication-with-curl/

[holzfelix]

is this functionality working and when how?

[jhmk]

is this functionality working and when how?

I got it working with some hacks in RC 1.2. But for a good functionality it needs to be implemented in RC.

[graywolf336]

So you have to create a calendar event to get a Google Meet link?

[jhmk]

So you have to create a calendar event to get a Google Meet link?

Yes

[jhmk]

Looks like Zulip has the same problem: https://github.com/zulip/zulip/issues/11440

[holzfelix]

any update on this?

[fredericocarneiro]

I also would like to know if there is an update on that. Thx

[narzero]

+1

[grimuz]

google meet is important to have in rocket-chat. @jhmk already provided examples how to do it, but google-meets should be available in rocket without hacks i think?

[holzfelix]

does the hack work?

[dombg1337]

any update on this?

+1

[fredericocarneiro]

I've tried the hack but no success :(

Em sex, 8 de mai de 2020 06:54, Felix Hohlwegler notifications@github.com escreveu:

does the hack work?

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/RocketChat/feature-requests/issues/65#issuecomment-625738256, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADDSCR7DPY4JHO6VSNOLR2DRQPJGBANCNFSM4HB4IPUQ .

[holzfelix]

hm thats poor, thanks for your feedback.

[fredericocarneiro]

Now that Google meet has a free tier, it'd be a great feature to add to rocket.chat. The problem is that I couldn't find a way to create a room only by changing the link or something easy like that. I saw that you could call an API that connects to Google calendar to schedule a meeting and then you get a Google meet link. It's kind of tricky.

Em sex, 8 de mai de 2020 09:35, Felix Hohlwegler notifications@github.com escreveu:

hm thats poor

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/RocketChat/feature-requests/issues/65#issuecomment-625794470, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADDSCRZWFSKYIQX6F5OURZDRQP4CNANCNFSM4HB4IPUQ .

[holzfelix]

Google meet has its own api I think: https://developers.google.com/admin-sdk/reports/v1/appendix/usage/customer/meet

[fredericocarneiro]

Hi there! That G-suite Api seems its for usage reporting purposes only. At the bottom of this message I´ve post some links that I believe point to the right apis.

The ideia would be something like this:

1 - The admin would create a new calendar on organizarion Google Calendar. I´d be called like "RC meetings" in order to store all meeting events (to create an event and get an "Calendar ID"). 2 - The admin would set this "Calendar ID" and the token or other authentication credential on RC config page in order to allow RC to connect to this specific calendar and create a meeting event (when needed). 3 - When a RC user needs a room, he´d click on a meeting icon and RC would connect on Ooogle calendar api, create an event (setting that exact datetime) and return its google meet link. 4 - The meeting link would be created and now the RC user could access/share it.

What do you think?

Links to Google Calendar API reference : [1] https://cloud.google.com/blog/products/application-development/hangouts-meet-now-available-in-google

[2] https://developers.google.com/calendar/create-events?_ga=2.129193676.-1375015108.1588943678#conferencing

[3] https://developers.google.com/calendar/v3/reference/events/insert

On Fri, May 8, 2020 at 9:44 AM Felix Hohlwegler notifications@github.com wrote:

Google meet has its own api I think: https://developers.google.com/admin-sdk/reports/v1/appendix/usage/customer/meet

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/RocketChat/feature-requests/issues/65#issuecomment-625797605, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADDSCRZXGLD55SPRORFCSHDRQP5DPANCNFSM4HB4IPUQ .

[jhmk]

Turns out you can now create a new Meet ID by open this URL https://meet.google.com/new (but you need to be Login in your Google account).

[fredericocarneiro]

😮 😮 😮 😮 😮

cool!

So its easy now to add it to RC.

On Fri, May 8, 2020 at 1:54 PM jhmk notifications@github.com wrote:

Turns out you can now create a new Meet ID by open this URL https://meet.google.com/new (but you need to be Login in your Google account).

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/RocketChat/feature-requests/issues/65#issuecomment-625912906, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADDSCR6HYQAMRPBT55KXXLLRQQ2N5ANCNFSM4HB4IPUQ .

[danielelisi]

 cool! So its easy now to add it to RC.

… On Fri, May 8, 2020 at 1:54 PM jhmk @.***> wrote: Turns out you can now create a new Meet ID by open this URL https://meet.google.com/new (but you need to be Login in your Google account). — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#65 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADDSCR6HYQAMRPBT55KXXLLRQQ2N5ANCNFSM4HB4IPUQ .

Would it be possible to use Hubot to create a /meet keyword shortcut to generate and share a Google Meet link on a RC channel?

I'm guessing you would just need to have Hubot authenticate against organization Gsuite via API keys and create a webhook for https://meet.google.com/new 🤔

[Raboo]

Would it be possible to use Hubot to create a /meet keyword shortcut to generate and share a Google Meet link on a RC channel?

I'm guessing you would just need to have Hubot authenticate against organization Gsuite via API keys and create a webhook for https://meet.google.com/new 🤔

I would say that to make this simple for non-tech users, having the phone/dial icon would be best. Most regular users won't learn keyword shortcuts. Also you want the meet to be integrated like jitsi. So if you are using the app, that you don't have to leave it.

[jhmk]

You can add this url to the Jitsi video settings in RC but need to manipulate the code so that RC don't add a random string after the URL. At the moment it will open the URL like this: https://meet.google.com/new/6GdScYHLebu5YfYDFGENERAL

So a option in RC to disable the String Extension would be nice

[holzfelix]

I would prefer a solution which allows to use jitsi and google meet.

[jhmk]

I would prefer a solution which allows to use jitsi and google meet.

Then it needs to be added as third solution in RC. Or you try you change Big Blue Button to jitsi

[mcsage]

https://g.co/meet/nickname is something that could work either.

Found here: https://gsuiteupdates.googleblog.com/2020/03/hangouts-meet-edu-updates.html

[mariusmarais]

@mcsage That link seems to only work on a logged-in primary domain. So as long as you're only logged into a single GSuite account other people will see the same meeting, but across accounts, or when logged out it wont work.

You still need the "real" meeting link for other people to join.

[tdlockard]

Maybe someone can expand upon this, but this works for my own purposes. Still not ideal. Basically just a button for @jhmk 's comment with https://meet.google.com/new

Go to the Administration panel > Layout > Custom Scripts > add the following code to the Custom Script for Logged In Users area. Refresh the chat page and there should be a little button on the top-left nav area.

It'd be cool if it could grab the meeting room URL after it's created, and automatically post it in your current Rocket Chat room, but this is beyond me at the moment.

/* ----------------------------------------------------------- */
/* Add a custom Google Meet button to spawn a new meeting room */
const meetBaseUrl = 'https://meet.google.com/new';

/* Google Meet SVG */
const meetSymbol = `
<svg id="icon-meet" viewBox="0 0 468 468" fill="currentColor">
  <path d="M 238.5,421.7502 V 387.5 l -10.80713,-0.6693 C 190.25427,384.5122 154.14002,371.1781 123.02577,348.1858 113.90356,341.4448 96.855431,325.0588 89.019172,315.5 76.281547,299.9624 64.156705,277.9322 58.087931,259.2995 33.715022,184.46833 66.347377,98.13147 136.21304,52.6004 180.89993,23.47821 236.61288,15.06651 289.45785,29.46307 c 66.89494,18.22419 119.73348,75.21313 133.59773,144.09166 2.76051,13.71437 3.78323,43.62827 1.99037,58.21657 -9.18324,74.7226 -63.02462,149.0915 -145.99323,201.6545 -12.70446,8.0486 -38.24275,22.574 -39.68991,22.5744 -0.47455,2e-4 -0.86281,-15.4123 -0.86281,-34.25 z m 50.94617,-140.0311 c 6.6072,-2.9819 10.26549,-6.4304 13.21334,-12.4556 2.69603,-5.5105 2.83071,-6.486 3.19379,-23.1345 l 0.37906,-17.3815 24.38382,24.3686 L 355,277.4847 V 208.5 139.51531 l -24.41499,24.39973 -24.41499,24.39974 -0.33958,-17.40739 c -0.37876,-19.41617 -1.40213,-23.32523 -7.77471,-29.69781 -7.12934,-7.12934 -2.09969,-6.67875 -78.05573,-6.99283 -77.15948,-0.31905 -73.63703,-0.63235 -81.5202,7.25082 -7.54646,7.54646 -7.4798,6.95352 -7.4798,66.52903 0,58.4869 0.071,59.2215 6.44445,66.6675 3.85086,4.4988 8.95106,7.3527 15.05555,8.4243 2.2,0.3862 33.025,0.6368 68.5,0.5569 59.52503,-0.1341 64.80437,-0.2827 68.44617,-1.9262 z"></path>
</svg>
`;

/* Description-Text on Hover: Customize this for different languages */
const meetText = {
        'en': 'New Google Meet Room',
        'de': 'Öffne Google-Konferenz Raum',
        'fr': 'New Google Meet Room',
        'es': 'New Google Meet Room',
        'it': 'New Google Meet Room',
        'nl': 'New Google Meet Room',
        'pl': 'New Google Meet Room',
        'pt': 'New Google Meet Room',
        'ru': 'Смена оформления'
}[defaultUserLanguage()] || 'New Google Meet Room';

function addMeetButton() {
    const buttonMeet = `
    <button class="sidebar__toolbar-button rc-tooltip rc-tooltip--down js-button" aria-label="${meetText}">
        <svg class="rc-icon sidebar__toolbar-button-icon sidebar__toolbar-button-icon--meet" aria-hidden="true" viewBox="0 0 468 468">
            <use xlink:href="#icon-meet"></use>
            ${meetSymbol}
        </svg>
    </button>`;

    const sidebarToolbar = $('.sidebar__toolbar');

    // wait for the sidebar toolbar to be visible
    if(!sidebarToolbar.is(':visible')) {
            setTimeout(addMeetButton, 250);
            return;
    }

    var MeetButton = $(`.js-button[aria-label="${meetText}"]`);

    // do nothing if button is already on the screen
    if (MeetButton.is(':visible')) {
            return;
    }

    MeetButton = $(buttonMeet).prependTo(sidebarToolbar);
    MeetButton.on('click', function() {
        var win = window.open(meetBaseUrl, '_blank');
    });
}

$(addMeetButton);

[holzfelix]

Amazing

[PatrickTetz]

A minor tweak to tdlockard's implementation which creates a named channel with a guid and posts it into the current open chat for the colleagues to join.

DISCLAIMER: Might have glitches; tested in rocketchat:latest ;) This solution might only work with gSuite accounts.

/* ENTER - gMeetButton */
function addMeetButton() {
    // preconditions
    const toolbar = $('.rc-room-actions');
    // exit if toolbar isn't visible
    if (!toolbar.is(':visible')) {
        return;
    }

    // exit if button is present already
    if ($(`.rc-room-actions__action[data-id="meet"]`).is(':visible')) {
        return;
    }

    /* local functions */
    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    function uuidv4() {
        return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
            (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
        );
    }

    /* Google Meet SVG */
    const meetButtonSymbol = `
<svg id="icon-meet" viewBox="0 0 468 468" fill="currentColor">
  <path d="M 238.5,421.7502 V 387.5 l -10.80713,-0.6693 C 190.25427,384.5122 154.14002,371.1781 123.02577,348.1858 113.90356,341.4448 96.855431,325.0588 89.019172,315.5 76.281547,299.9624 64.156705,277.9322 58.087931,259.2995 33.715022,184.46833 66.347377,98.13147 136.21304,52.6004 180.89993,23.47821 236.61288,15.06651 289.45785,29.46307 c 66.89494,18.22419 119.73348,75.21313 133.59773,144.09166 2.76051,13.71437 3.78323,43.62827 1.99037,58.21657 -9.18324,74.7226 -63.02462,149.0915 -145.99323,201.6545 -12.70446,8.0486 -38.24275,22.574 -39.68991,22.5744 -0.47455,2e-4 -0.86281,-15.4123 -0.86281,-34.25 z m 50.94617,-140.0311 c 6.6072,-2.9819 10.26549,-6.4304 13.21334,-12.4556 2.69603,-5.5105 2.83071,-6.486 3.19379,-23.1345 l 0.37906,-17.3815 24.38382,24.3686 L 355,277.4847 V 208.5 139.51531 l -24.41499,24.39973 -24.41499,24.39974 -0.33958,-17.40739 c -0.37876,-19.41617 -1.40213,-23.32523 -7.77471,-29.69781 -7.12934,-7.12934 -2.09969,-6.67875 -78.05573,-6.99283 -77.15948,-0.31905 -73.63703,-0.63235 -81.5202,7.25082 -7.54646,7.54646 -7.4798,6.95352 -7.4798,66.52903 0,58.4869 0.071,59.2215 6.44445,66.6675 3.85086,4.4988 8.95106,7.3527 15.05555,8.4243 2.2,0.3862 33.025,0.6368 68.5,0.5569 59.52503,-0.1341 64.80437,-0.2827 68.44617,-1.9262 z"></path>
</svg>
`;

    /* Description-Text on Hover: Customize this for different languages */
    const meetButtonLabel = {
        'en': 'New Google Meet Room',
        'de': 'Öffne Google-Konferenz Raum',
        'fr': 'New Google Meet Room',
        'es': 'New Google Meet Room',
        'it': 'New Google Meet Room',
        'nl': 'New Google Meet Room',
        'pl': 'New Google Meet Room',
        'pt': 'New Google Meet Room',
        'ru': 'Смена оформления'
    }[defaultUserLanguage()] || 'New Google Meet Room';

    const meetButtonHtml = `
    <div class="rc-room-actions__action" data-id="meet">
        <button class="rc-room-actions__button" aria-label="${meetButtonLabel}" data-title="${meetButtonLabel}">
            <svg class="rc-icon tab-button-icon tab-button-icon--meet" aria-hidden="true" viewBox="0 0 468 468">
                <use xlink:href="#icon-meet"></use>
                ${meetButtonSymbol}
            </svg>
        </button>
    </div>`;

    const meetButton = $(meetButtonHtml).prependTo(toolbar);
    meetButton.on('click', async function () {
        var meetUri = "http://g.co/meet/r" + uuidv4();
        var chatInput = $('textarea[name="msg"]');
        if (chatInput.length == 1) {
            var keyboardEvent = {
                altKey: false,
                bubbles: true,
                cancelBubble: false,
                cancelable: true,
                charCode: 0,
                code: "Enter",
                composed: true,
                ctrlKey: false,
                currentTarget: document,
                defaultPrevented: false,
                detail: 0,
                eventPhase: 1,
                isComposing: false,
                isTrusted: true,
                key: "Enter",
                keyCode: 13,
                location: 0,
                metaKey: false,
                repeat: false,
                returnValue: true,
                shiftKey: false,
                srcElement: chatInput.get()[0],
                target: chatInput.get()[0],
                type: "keydown",
                which: 13
            };

            chatInput.get()[0].value = 'Meet: ' + meetUri;
            chatInput.change();
            chatInput.focus();
            chatInput.trigger(keyboardEvent);

            await sleep(500);
        }
        window.open(meetUri, '_blank');
    });
}

/* Interval to check if the icon is there; required for room/chat changes */
setInterval(addMeetButton, 250);
/* LEAVE - gMeetButton */

[fthiery]

This works really well, i think it should even be included in the project source. I ended up replacing Jitsi by this, our users are really happy with it. I think the button should probably be located in the channel area instead of the current location (to contextualize).

To anyone interested, here's how it looks.

Thanks to who made this possible !

[PatrickTetz]

I think my suggestion will give you what you want @fthiery :)

Makes it part of the chat area and posts the meet in the current channel.

[holzfelix]

amazing feature.

[jhmk]

How someone push this to Dev?

[fthiery]

I think my suggestion will give you what you want @fthiery :)

Makes it part of the chat area and posts the meet in the current channel.

Indeed, i don't understand how i missed it, thanks !

[tdlockard]

In case anyone's interested in using Google's latest logo, you can switch out the meetButtonSymbol code with the following. I still like the monochromatic logo personally.

    /* Google Meet SVG */
    const meetButtonSymbol = `
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 87.5 72">
    <path fill="#00832d" d="M49.5 36l8.53 9.75 11.47 7.33 2-17.02-2-16.64-11.69 6.44z"/>
    <path fill="#0066da" d="M0 51.5V66c0 3.315 2.685 6 6 6h14.5l3-10.96-3-9.54-9.95-3z"/>
    <path fill="#e94235" d="M20.5 0L0 20.5l10.55 3 9.95-3 2.95-9.41z"/>
    <path fill="#2684fc" d="M20.5 20.5H0v31h20.5z"/>
    <path fill="#00ac47" d="M82.6 8.68L69.5 19.42v33.66l13.16 10.79c1.97 1.54 4.85.135 4.85-2.37V11c0-2.535-2.945-3.925-4.91-2.32zM49.5 36v15.5h-29V72h43c3.315 0 6-2.685 6-6V53.08z"/>
    <path fill="#ffba00" d="M63.5 0h-43v20.5h29V36l20-16.57V6c0-3.315-2.685-6-6-6z"/>
</svg>
`;

[Patrick92bs]

Anyone has an update? :)

The solution of @PatrickTetz is only working on the Gsuite or how its now called Google Workspace.

I tested it on a free account where google meet is integrated in gmail

Its says the link is to long

[Patrick92bs]

by the way its also not working at the GSuite (now Google Workspace). I just bought it and tried it.

[jhmk]

by the way its also not working at the GSuite (now Google Workspace). I just bought it and tried it.

When I open https://meet.google.com/new in a browser it creates a new Meeting ID for me. I just need to join manually. Tested on Google Workplace Business & Enterprise

[Raboo]

@PatrickTetz Your awesome script stopped working in Rocket.Chat 3.10.3. You don't happen to have an update?

[holzfelix]

@Raboo on 3.10.4 it still works fine.

[Raboo]

@holzfelix I tried both 3.10.4 and 3.10.5. None of them work for me. Are you talking about @PatrickTetz script or @tdlockard script?

[oussjarrousse]

This would be a nice feature for small businesses and NGOs using Gsuite (workspaces) internally and want to replace Slack/whatsapp with something better/safer like Rocket.Chat and still use their Gsuite for emails/docs/drive etc.

[deichbewohner]

A minor tweak to tdlockard's implementation which creates a named channel with a guid and posts it into the current open chat for the colleagues to join.

DISCLAIMER: Might have glitches; tested in rocketchat:latest ;) This solution might only work with gSuite accounts.

/* ENTER - gMeetButton */
function addMeetButton() {
    // preconditions
    const toolbar = $('.rc-room-actions');
    // exit if toolbar isn't visible
    if (!toolbar.is(':visible')) {
        return;
    }

    // exit if button is present already
    if ($(`.rc-room-actions__action[data-id="meet"]`).is(':visible')) {
        return;
    }

    /* local functions */
    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    function uuidv4() {
        return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
            (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
        );
    }

    /* Google Meet SVG */
    const meetButtonSymbol = `
<svg id="icon-meet" viewBox="0 0 468 468" fill="currentColor">
  <path d="M 238.5,421.7502 V 387.5 l -10.80713,-0.6693 C 190.25427,384.5122 154.14002,371.1781 123.02577,348.1858 113.90356,341.4448 96.855431,325.0588 89.019172,315.5 76.281547,299.9624 64.156705,277.9322 58.087931,259.2995 33.715022,184.46833 66.347377,98.13147 136.21304,52.6004 180.89993,23.47821 236.61288,15.06651 289.45785,29.46307 c 66.89494,18.22419 119.73348,75.21313 133.59773,144.09166 2.76051,13.71437 3.78323,43.62827 1.99037,58.21657 -9.18324,74.7226 -63.02462,149.0915 -145.99323,201.6545 -12.70446,8.0486 -38.24275,22.574 -39.68991,22.5744 -0.47455,2e-4 -0.86281,-15.4123 -0.86281,-34.25 z m 50.94617,-140.0311 c 6.6072,-2.9819 10.26549,-6.4304 13.21334,-12.4556 2.69603,-5.5105 2.83071,-6.486 3.19379,-23.1345 l 0.37906,-17.3815 24.38382,24.3686 L 355,277.4847 V 208.5 139.51531 l -24.41499,24.39973 -24.41499,24.39974 -0.33958,-17.40739 c -0.37876,-19.41617 -1.40213,-23.32523 -7.77471,-29.69781 -7.12934,-7.12934 -2.09969,-6.67875 -78.05573,-6.99283 -77.15948,-0.31905 -73.63703,-0.63235 -81.5202,7.25082 -7.54646,7.54646 -7.4798,6.95352 -7.4798,66.52903 0,58.4869 0.071,59.2215 6.44445,66.6675 3.85086,4.4988 8.95106,7.3527 15.05555,8.4243 2.2,0.3862 33.025,0.6368 68.5,0.5569 59.52503,-0.1341 64.80437,-0.2827 68.44617,-1.9262 z"></path>
</svg>
`;

    /* Description-Text on Hover: Customize this for different languages */
    const meetButtonLabel = {
        'en': 'New Google Meet Room',
        'de': 'Öffne Google-Konferenz Raum',
        'fr': 'New Google Meet Room',
        'es': 'New Google Meet Room',
        'it': 'New Google Meet Room',
        'nl': 'New Google Meet Room',
        'pl': 'New Google Meet Room',
        'pt': 'New Google Meet Room',
        'ru': 'Смена оформления'
    }[defaultUserLanguage()] || 'New Google Meet Room';

    const meetButtonHtml = `
    <div class="rc-room-actions__action" data-id="meet">
        <button class="rc-room-actions__button" aria-label="${meetButtonLabel}" data-title="${meetButtonLabel}">
            <svg class="rc-icon tab-button-icon tab-button-icon--meet" aria-hidden="true" viewBox="0 0 468 468">
                <use xlink:href="#icon-meet"></use>
                ${meetButtonSymbol}
            </svg>
        </button>
    </div>`;

    const meetButton = $(meetButtonHtml).prependTo(toolbar);
    meetButton.on('click', async function () {
        var meetUri = "http://g.co/meet/r" + uuidv4();
        var chatInput = $('textarea[name="msg"]');
        if (chatInput.length == 1) {
            var keyboardEvent = {
                altKey: false,
                bubbles: true,
                cancelBubble: false,
                cancelable: true,
                charCode: 0,
                code: "Enter",
                composed: true,
                ctrlKey: false,
                currentTarget: document,
                defaultPrevented: false,
                detail: 0,
                eventPhase: 1,
                isComposing: false,
                isTrusted: true,
                key: "Enter",
                keyCode: 13,
                location: 0,
                metaKey: false,
                repeat: false,
                returnValue: true,
                shiftKey: false,
                srcElement: chatInput.get()[0],
                target: chatInput.get()[0],
                type: "keydown",
                which: 13
            };

            chatInput.get()[0].value = 'Meet: ' + meetUri;
            chatInput.change();
            chatInput.focus();
            chatInput.trigger(keyboardEvent);

            await sleep(500);
        }
        window.open(meetUri, '_blank');
    });
}

/* Interval to check if the icon is there; required for room/chat changes */
setInterval(addMeetButton, 250);
/* LEAVE - gMeetButton */

The selector in line 4 isn't working in newer versions of Rocket.Chat. The following selector works for me: const toolbar = $('.rcx-icon--name-discussion').parent().parent();

[Raboo]

@deichbewohner doesn't seem to work for me.

[fgendorf]

works on 3.12.1 with selector https://github.com/RocketChat/feature-requests/issues/65#issuecomment-799309696

[vishnus]

@deichbewohner thanks!

@Raboo you have to change it in Line 4, 11, 47 and 48. Also, I made some changes to the classes:

const meetButtonHtml = `
    <div class="rcx-icon--name-discussion__action" data-id="meet">
        <button class="rcx-box rcx-box--full rcx-box--animated rcx-button--tiny-square rcx-button--square rcx-button--ghost rcx-button rcx-button-group__item" aria-label="${meetButtonLabel}" data-title="${meetButtonLabel}">
            <svg class="rcx-box rcx-box--full rcx-icon--name-thread rcx-icon " aria-hidden="true" viewBox="0 0 468 468">
                <use xlink:href="#icon-meet"></use>
                ${meetButtonSymbol}
            </svg>
        </button>
    </div>`;

[Raboo]

@vishnus This is exactly what I pasted into Rocket.Chat Custom Script for Logged In Users

/* ENTER - gMeetButton */
function addMeetButton() {
    // preconditions
    const toolbar = $('.rcx-icon--name-discussion').parent().parent();
    // exit if toolbar isn't visible
    if (!toolbar.is(':visible')) {
        return;
    }

    // exit if button is present already
    if ($(`.rcx-icon--name-discussion__action[data-id="meet"]`).is(':visible')) {
        return;
    }

    /* local functions */
    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    function uuidv4() {
        return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
            (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
        );
    }

    /* Google Meet SVG */
    const meetButtonSymbol = `
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 87.5 72">
    <path fill="#525252" d="M49.5 36l8.53 9.75 11.47 7.33 2-17.02-2-16.64-11.69 6.44z"/>
    <path fill="#545454" d="M0 51.5V66c0 3.315 2.685 6 6 6h14.5l3-10.96-3-9.54-9.95-3z"/>
    <path fill="#6b6b6b" d="M20.5 0L0 20.5l10.55 3 9.95-3 2.95-9.41z"/>
    <path fill="#777777" d="M20.5 20.5H0v31h20.5z"/>
    <path fill="#6d6d6d" d="M82.6 8.68L69.5 19.42v33.66l13.16 10.79c1.97 1.54 4.85.135 4.85-2.37V11c0-2.535-2.945-3.925-4.91-2.32zM49.5 36v15.5h-29V72h43c3.315 0 6-2.685 6-6V53.08z"/>
    <path fill="#bababa" d="M63.5 0h-43v20.5h29V36l20-16.57V6c0-3.315-2.685-6-6-6z"/>
</svg>
`;

    /* Description-Text on Hover: Customize this for different languages */
    const meetButtonLabel = {
        'en': 'New Google Meet Room',
        'de': 'Öffne Google-Konferenz Raum',
        'fr': 'New Google Meet Room',
        'es': 'New Google Meet Room',
        'it': 'New Google Meet Room',
        'nl': 'New Google Meet Room',
        'pl': 'New Google Meet Room',
        'pt': 'New Google Meet Room',
        'ru': 'Смена оформления'
    }[defaultUserLanguage()] || 'New Google Meet Room';

    const meetButtonHtml = `
    <div class="rcx-icon--name-discussion__action" data-id="meet">
        <button class="rcx-box rcx-box--full rcx-box--animated rcx-button--tiny-square rcx-button--square rcx-button--ghost rcx-button rcx-button-group__item" aria-label="${meetButtonLabel}" data-title="${meetButtonLabel}">
            <svg class="rcx-box rcx-box--full rcx-icon--name-thread rcx-icon " aria-hidden="true" viewBox="0 0 468 468">
                <use xlink:href="#icon-meet"></use>
                ${meetButtonSymbol}
            </svg>
        </button>
    </div>`;

    const meetButton = $(meetButtonHtml).prependTo(toolbar);
    meetButton.on('click', async function () {
        var meetUri = "http://g.co/meet/r" + uuidv4();
        var chatInput = $('textarea[name="msg"]');
        if (chatInput.length == 1) {
            var keyboardEvent = {
                altKey: false,
                bubbles: true,
                cancelBubble: false,
                cancelable: true,
                charCode: 0,
                code: "Enter",
                composed: true,
                ctrlKey: false,
                currentTarget: document,
                defaultPrevented: false,
                detail: 0,
                eventPhase: 1,
                isComposing: false,
                isTrusted: true,
                key: "Enter",
                keyCode: 13,
                location: 0,
                metaKey: false,
                repeat: false,
                returnValue: true,
                shiftKey: false,
                srcElement: chatInput.get()[0],
                target: chatInput.get()[0],
                type: "keydown",
                which: 13
            };

            chatInput.get()[0].value = 'Meet: ' + meetUri;
            chatInput.change();
            chatInput.focus();
            chatInput.trigger(keyboardEvent);

            await sleep(500);
        }
        window.open(meetUri, '_blank');
    });
}

/* Interval to check if the icon is there; required for room/chat changes */
setInterval(addMeetButton, 250);
/* LEAVE - gMeetButton */

Still does not work for me.

[kosmas-formulatrix]

I just tried it and it seems the problem not shown in the Desktop application. When using web, the icon is shown. A little adjustment that we need to add is width="20" when using Desktop Application in the line around 47/48.

`

            ${meetButtonSymbol}
        </svg>

`