Skip to content

Instantly share code, notes, and snippets.

@eikowagenknecht
Last active January 30, 2024 08:42
Show Gist options
  • Select an option

  • Save eikowagenknecht/9a0eb7f2c31b4e2870cc559933426a3c to your computer and use it in GitHub Desktop.

Select an option

Save eikowagenknecht/9a0eb7f2c31b4e2870cc559933426a3c to your computer and use it in GitHub Desktop.
Kagi Grouped Result Enhancer
// ==UserScript==
// @name Kagi Grouped Result Enhancer
// @namespace http://tampermonkey.net/
// @version 0.2
// @description Enhance grouped results in Kagi with visible URLs
// @author Eiko Wagenknecht
// @match *://*kagi.com/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
const enhanceGroupedResults = () => {
// Select all grouped results
const groupedResults = document.querySelectorAll('.sr-group .__srgi');
// Iterate through each grouped result
groupedResults.forEach(group => {
// Find the URL from the anchor tag
const urlElement = group.querySelector('a._0_URL');
const url = urlElement ? urlElement.href : '';
// Skip if the URL is not found or already enhanced
if (!url || group.querySelector('.__sri-url-box-enhanced')) return;
// Format the path using the '›' character
const formattedPath = ' › ' + new URL(url).pathname.split('/').filter(part => part).join(' › ');
// Create a new div for the URL, styled similarly to normal results
const newUrlDiv = document.createElement('div');
newUrlDiv.className = '__sri-url-box __sri-url-box-enhanced';
newUrlDiv.innerHTML = `<a class="_0_URL __sri-url" href="${url}" rel="noopener noreferrer" tabindex="-1" aria-hidden="true"><div class="__sri_url_path_box"><span class="host">${new URL(url).hostname}</span>&nbsp;<span class="path">${formattedPath}</span></div></a>`;
// Insert the new URL div into the grouped result
group.appendChild(newUrlDiv);
// Add classes 'search-result' and 'opt_url_above' to the __srgi div
group.classList.add('search-result', 'opt_url_above');
// Set the __srgi div to display flex
group.style.display = 'flex';
});
};
// Enhance grouped results on initial load
enhanceGroupedResults();
// Enhance grouped results on AJAX content load (dynamic loading of results)
const observer = new MutationObserver(enhanceGroupedResults);
const config = { childList: true, subtree: true };
observer.observe(document.body, config);
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment