Last active
May 11, 2024 12:02
-
-
Save Daan-Grashoff/57c40bc355bcb4d1ebc1290094f57ddf to your computer and use it in GitHub Desktop.
Bring back the google maps button when searching on google
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Google maps addon | |
// @namespace http://tampermonkey.net/ | |
// @version 2024-03-21 | |
// @description Bring google maps button back | |
// @author You | |
// @match https://www.google.com/search* | |
// @include https://www.google.tld/search* | |
// @icon https://www.google.com/images/branding/googleg/1x/googleg_standard_color_128dp.png | |
// @grant none | |
// ==/UserScript== | |
(function() { | |
'use strict'; | |
function addMapsButton() { | |
// Find the list container of existing tabs | |
const tabsContainer = document.querySelector('.crJ18e'); | |
// If tabs exist, proceed | |
if (tabsContainer) { | |
// Create the Maps button elements (updated) | |
const mapsListItem = document.createElement('div'); | |
mapsListItem.jsname = 'VIftV'; | |
// mapsListItem.classList.add('Ap1Qsc'); | |
mapsListItem.setAttribute('role', 'listitem'); | |
// Replace this entire section with the provided <a> element | |
const mapsButton = document.createElement('a'); | |
mapsButton.jsname = "ONH4Gc"; | |
mapsButton.classList.add("LatpMc"); | |
mapsButton.classList.add("nPDzT"); | |
mapsButton.classList.add("T3FoJb"); | |
mapsButton.dataset.navigation = "server"; // Update the attribute name | |
mapsButton.dataset.hveid = "CAEQCA"; | |
// Get the search query from the URL | |
const searchQuery = new URLSearchParams(window.location.search).get('q'); | |
// Construct the Maps link with the query | |
const mapsLink = `//maps.google.com/maps?q=${searchQuery}`; | |
mapsButton.href = mapsLink; | |
//mapsButton.textContent = "Maps"; // Set the inner text | |
const mapsButtonText = document.createElement('div'); | |
mapsButtonText.jsname = "bVqjv"; | |
mapsButtonText.classList.add("YmvwI"); | |
mapsButtonText.textContent = "Maps"; | |
mapsButton.appendChild(mapsButtonText); | |
// Append the mapsButton to the list item | |
mapsListItem.appendChild(mapsButton); | |
// Insert the Maps button at the beginning of the tabs container | |
tabsContainer.prepend(mapsListItem); | |
} | |
} | |
// Call the function to add the button | |
addMapsButton(); | |
})(); |
If you rename the file to .user.js
when opening raw Tampermonkey automatically detects it's a userscript you're trying to install and directly opens up an "installation" tab, rather than needing to manually copy-paste. Appreciate the bringing back of Google Maps.
noobie q, sorry: how do i install this (to Firefox)?
@juhorepository You need the extension "Tampermonkey" and then install this script (to do so: click on the Tampermonkey icon in the extension toolbar of Firefox -> "Create a new Script" and copy-paste the script above
Sweet :)
Thank you very much, @Daan-Grashoff, for writing this script. I adjusted it to make it compatible with different Google styles. Here is my code. I hope it could help.
// ==UserScript==
// @name Google Maps Addon
// @namespace http://tampermonkey.net/
// @version 2024-05-11
// @description Bring Google Maps Button Back
// @author You
// @include https://www.google.tld/search*
// @icon https://www.google.com/images/branding/googleg/1x/googleg_standard_color_128dp.png
// @grant none
// ==/UserScript==
(function() {
'use strict';
function addMapsButton() {
// Find the list container of existing tabs
const tabsContainer = document.querySelector('.crJ18e').firstChild;
// If tabs exist, proceed
if (tabsContainer) {
// Get the search query from the URL
const searchQuery = new URLSearchParams(window.location.search).get('q');
// Construct the Maps link with the query
const mapsLink = `//www.google.com/maps/@?api=1&q=${searchQuery}`;
// Create the <div> element
const mapsListItem = document.createElement('div');
mapsListItem.setAttribute('role', 'listitem');
// Create the <a> element
var existing_a_elements_classes = tabsContainer.children[1].firstChild.getAttribute("class");
var existing_a_elements_jsname = tabsContainer.children[1].firstChild.getAttribute("jsname");
var existing_a_elements_role = tabsContainer.children[1].firstChild.getAttribute("role");
const mapsButton = document.createElement('a');
mapsButton.href = mapsLink;
mapsButton.setAttribute("class", existing_a_elements_classes);
mapsButton.setAttribute("jsname", existing_a_elements_jsname);
mapsButton.setAttribute("role", existing_a_elements_role);
// Set the <div> element
var existing_div_elements_classes = tabsContainer.children[1].firstChild.firstChild.getAttribute("class");
var existing_div_elements_jsname = tabsContainer.children[1].firstChild.firstChild.getAttribute("jsname");
const mapsButtonInnerDiv = document.createElement('div');
mapsButtonInnerDiv.setAttribute("jsname", existing_div_elements_jsname);
mapsButtonInnerDiv.setAttribute("class", existing_div_elements_classes);
// Set the <span> element (if needed)
var existing_span_element = tabsContainer.children[1].firstChild.firstChild.firstChild;
if (existing_span_element.tagName == "SPAN") {
const mapsButtonInnerSpan = document.createElement("span");
mapsButtonInnerSpan.classList.add("FMKtTb");
mapsButtonInnerSpan.classList.add("UqcIvb");
mapsButtonInnerSpan.setAttribute("jsname", "pIvPIe");
mapsButtonInnerSpan.textContent = "Maps";
mapsButtonInnerDiv.appendChild(mapsButtonInnerSpan);
} else {
mapsButtonInnerDiv.textContent = "Maps";
}
mapsButton.appendChild(mapsButtonInnerDiv);
mapsListItem.appendChild(mapsButton);
// Insert the Maps button
tabsContainer.insertBefore(mapsListItem,tabsContainer.children[tabsContainer.children.length - 1]);
}
}
// Call the function to add the button
addMapsButton();
})();
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@kubinka0505
You need to replace line 54 (
tabsContainer.prepend(mapsListItem);
) with one of these :If you want it to be second to last as such :
If you want it to be at a given position (for example the second position, so position
1
since you count from 0) :