From 005507a4193d9087beba74898d9d4e71f78ecd46 Mon Sep 17 00:00:00 2001 From: John Riviello Date: Sat, 20 Feb 2021 15:02:40 -0500 Subject: [PATCH 1/2] Works with Feb 2021 Google Meet update --- extension/recentMeetingCodes.css | 17 +++---- extension/recentMeetingCodes.js | 86 +++++++------------------------- 2 files changed, 26 insertions(+), 77 deletions(-) diff --git a/extension/recentMeetingCodes.css b/extension/recentMeetingCodes.css index 2553332..d428edc 100644 --- a/extension/recentMeetingCodes.css +++ b/extension/recentMeetingCodes.css @@ -5,10 +5,10 @@ opacity: 1; text-align :center; transition: box-shadow .03s linear, opacity .25s linear; - z-index: 4990; + z-index: 890; position: absolute; top: 70px; - left: 50px; + right: 47px; padding: 12px 0; } @@ -50,7 +50,7 @@ flex: 10; border-top-left-radius: 0; border-bottom-left-radius: 0; - z-index: 4992; + z-index: 892; padding-left: 0; } @@ -58,7 +58,7 @@ flex: 1; border-top-right-radius: 0; border-bottom-right-radius: 0; - z-index: 4991; + z-index: 891; } .rmc-button .rmc-button__remove::before { @@ -76,7 +76,7 @@ .rmc-error { position: absolute; width: 33vw; - right: calc(-33vw - 6em); + right: 300px; top: 0; background:#fff; box-shadow: 0 1px 2px 0 rgba(60,64,67,0.6),0 2px 6px 2px rgba(60,64,67,0.3); @@ -87,7 +87,7 @@ text-align: left; transform: scale(0.1); opacity: 0; - transition: opacity 0.25s, transform 0.5s ease-out 0.1s; + transition: opacity 0.25s, transform 0.3s ease-out 0.1s; } .rmc-error h3, .rmc-error p { @@ -106,9 +106,6 @@ @media (max-width: 767px) { .rmc-list { - top: 290px; - } - .rmc-list__lowerForTablet { - top: 355px; + top: 180px; } } \ No newline at end of file diff --git a/extension/recentMeetingCodes.js b/extension/recentMeetingCodes.js index 8ee96e2..0e81b44 100644 --- a/extension/recentMeetingCodes.js +++ b/extension/recentMeetingCodes.js @@ -1,8 +1,8 @@ -const BUTTON_SELECTOR = 'div[role="button"]'; -const OPENER_TEXT = 'Join or start a meeting'; -const OPENER_TEXT_RESTRICTED = 'Use a meeting code'; -const MEETING_CODE_SELECTOR = '[data-keyboard-title="Use a meeting code"]'; -const MEETING_CODE_SUBMIT_TEXT = 'Continue'; +const BUTTON_SELECTOR = 'button[jsaction]'; +const MEETING_CODE_INPUT_SELECTOR = 'input[placeholder="Enter a code or nickname"]'; // input for meeting code +// const MEETING_CODE_INPUT_SELECTOR_UNAUTH = 'input[placeholder="Enter meeting code"]'; +// const MEETING_CODE_INPUT_SELECTOR_PERSONAL = 'input[placeholder="Enter a code or link"]'; +const MEETING_CODE_SUBMIT_BTN_TEXT = 'Join'; // button that submits the form const STORAGE_KEY = 'recentMeetingCodes'; const MAX_CODES = 15; const RMC_CONTAINER_CLASS = 'rmc-list'; @@ -14,41 +14,23 @@ const RMC_ERROR_TIMEOUT = 15; let rmcErrorTimeoutId; let errorContainer; -const getMeetingCodeModalOpener = _ => { -  return Array.from(document.querySelectorAll(BUTTON_SELECTOR)).find(node => (node.innerText.includes(OPENER_TEXT) || node.innerText.includes(OPENER_TEXT_RESTRICTED))); -} - -const modalOpener = getMeetingCodeModalOpener(); - -const launchMeeting = meetingCode => { -  if (modalOpener && modalOpener.click) { -    modalOpener.click(); -    setTimeout(submitMeetingCodeForm.bind(this, meetingCode), 250); -  } else { - displayError(`Cannot open meeting`, "Try typing it yourself"); - } -} +const meetingCodeInput = document.querySelector(MEETING_CODE_INPUT_SELECTOR); const getMeetingCodeFormSubmitButton = _ => { -  return Array.from(document.querySelectorAll(BUTTON_SELECTOR)).find(node => node.innerText == MEETING_CODE_SUBMIT_TEXT); -} - -const removeLastClass = elem => { -  const lastClass = elem.classList.value.split(" ").pop(); -  elem.classList.remove(lastClass); +  return Array.from(document.querySelectorAll(BUTTON_SELECTOR)).find(node => node.innerText == MEETING_CODE_SUBMIT_BTN_TEXT); } const submitMeetingCodeForm = meetingCode => { -  const meetingCodeInput = document.querySelector(MEETING_CODE_SELECTOR);   if (meetingCodeInput) {     meetingCodeInput.value = meetingCode;     const submitButton = getMeetingCodeFormSubmitButton();     if (submitButton && submitButton.click) { -      removeLastClass(submitButton);       submitButton.tabIndex = 0; -      submitButton.removeAttribute("aria-disabled"); +      submitButton.removeAttribute("disabled");       submitButton.click(); -    } +    } else { + displayError(`Cannot open meeting`, "Try typing it yourself and press Enter or Return"); + }   } } @@ -72,7 +54,6 @@ const storagePush = value => { } const saveMeetingCode = _ => { - const meetingCodeInput = document.querySelector(MEETING_CODE_SELECTOR); if (meetingCodeInput) { storagePush(meetingCodeInput.value); rerenderButtons(); @@ -111,33 +92,19 @@ const handleMeetingCodeButtonClick = e => { const addMeetingCodeSubmitListeners = _ => { // when "Enter" is pressed while text input is focused - const meetingCodeInput = document.querySelector(MEETING_CODE_SELECTOR); if (meetingCodeInput) { meetingCodeInput.addEventListener("keydown", handleMeetingCodeKey); } const submitButton = getMeetingCodeFormSubmitButton(); if (submitButton) { - // when "Enter" or "Space" is pressed while Continue "button" is focused + // when "Enter" or "Space" is pressed while MEETING_CODE_SUBMIT_BTN is focused submitButton.addEventListener("keydown", handleMeetingCodeButtonKey); - // when Continue "button" is clicked + // when MEETING_CODE_SUBMIT_BTN is clicked submitButton.addEventListener("click", handleMeetingCodeButtonClick); } } -const handleModalOpened = e => { - if (e.type != "keydown" || ((e.type == "keydown") && (e.code == "Space" || e.code == "Enter"))) { - setTimeout(addMeetingCodeSubmitListeners, 250); - } -} - -const addModalOpenListeners = _ => { -  if (modalOpener && modalOpener.click) { -    modalOpener.addEventListener("click", handleModalOpened); -    modalOpener.addEventListener("keydown", handleModalOpened); -  } -} - const getRecentMeetingCodes = _ => { const codes = localStorage.getItem(STORAGE_KEY); if (codes) { @@ -154,7 +121,7 @@ const createMeetingCodeButton = code => { btn.classList.add("rmc-button__launch") btn.innerText = code; btn.title = "Launch Meet Code " + code; - btn.addEventListener("click", launchMeeting.bind(this, code)); + btn.addEventListener("click", submitMeetingCodeForm.bind(this, code)); const remove = document.createElement("button"); remove.classList.add("rmc-button__remove"); const removeSpan = document.createElement("span"); @@ -186,25 +153,10 @@ const displayError = (heading, msg) => { rmcErrorTimeoutId = window.setTimeout(hideError, RMC_ERROR_TIMEOUT * 1000); } -const isHeightOfCWizLarger = _ => { - let val = false; - let cWizChild = modalOpener; - while (cWizChild && cWizChild.parentElement && cWizChild.parentElement.nodeName != "C-WIZ") { - cWizChild = cWizChild.parentElement; - } - if (cWizChild.offsetHeight > 175) { - val = true; - } - return val; -} - const addRecentMeetingCodes = _ => { const codes = getRecentMeetingCodes(); const list = document.createElement("div"); list.classList.add(RMC_CONTAINER_CLASS); - if (isHeightOfCWizLarger()) { - list.classList.add("rmc-list__lowerForTablet"); - } const heading = document.createElement("h2"); if (codes.length == 0) { heading.innerText = "Recently used Meeting Codes will appear here"; @@ -219,9 +171,9 @@ const addRecentMeetingCodes = _ => { codes.forEach(code => { list.appendChild(createMeetingCodeButton(code)); }); - const firstDivInBody = document.querySelector("div"); - if (firstDivInBody) { - firstDivInBody.appendChild(list); + const googleHeader = document.querySelector("header"); + if (googleHeader && googleHeader.parentElement) { + googleHeader.parentElement.appendChild(list); } else { document.body.appendChild(list); } @@ -233,8 +185,8 @@ const rerenderButtons = _ => { } const initRecentMeetingCodesExtension = _ => { - if (modalOpener) { - addModalOpenListeners(); + if (meetingCodeInput) { + addMeetingCodeSubmitListeners(); addRecentMeetingCodes(); } } From d89212a69ebfe37adf50d4bd1c78ca8217197016 Mon Sep 17 00:00:00 2001 From: John Riviello Date: Sat, 20 Feb 2021 15:03:09 -0500 Subject: [PATCH 2/2] Updating to manifest v3 --- extension/manifest.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/extension/manifest.json b/extension/manifest.json index 7217cb4..3a6833f 100644 --- a/extension/manifest.json +++ b/extension/manifest.json @@ -1,8 +1,8 @@ { "name": "Recent Meeting Codes", - "version": "1.0.1", + "version": "2.0.0", "description": "Adds buttons to launch recently used Meeting Codes to the Google Meet page for Google Classroom", - "manifest_version": 2, + "manifest_version": 3, "content_scripts": [ { "matches": [