// ==UserScript==
// @name ClopoStars Navigation Menu
// @namespace http://tampermonkey.net/
// @version 1.3
// @description A simple script to enhance the ClopoStars.com navigation menu for a smoother, more intuitive experience.This script is shared with the hope that it helps, but please remember—use it at your own risk. I’m not responsible for any unexpected issues, data loss, or account problems. Tinker wisely, stay safe, and happy browsing!
// @author ChatGPT-4-turbo
// @match https://clopostars.com/*
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
const menus = [
{
name: 'MY BASE',
selector: '.dropdown-base ul',
items: [
{ name: 'My Cards', url: 'https://clopostars.com/base', icon: '../../../../assets/icons/heroicons/outline/credit-card.svg' },
{ name: 'My Profile', url: 'https://clopostars.com/base/profile', icon: '../../../../assets/icons/heroicons/outline/user-circle.svg' }
]
},
{
name: 'COMPETITIONS',
selector: '.dropdown-competition ul',
items: [
{ name: 'UpComing', url: 'https://clopostars.com/competitions/upcoming', icon: '../../../../assets/icons/heroicons/outline/forward.svg' },
{ name: 'In Progress', url: 'https://clopostars.com/competitions/progress', icon: '../../../../assets/icons/heroicons/outline/cupe-transparent.svg' },
{ name: 'Finished', url: 'https://clopostars.com/competitions/finished', icon: '../../../../assets/icons/heroicons/outline/check.svg' }
]
},
{
name: 'ALLIES',
selector: '.dropdown-allies ul',
items: [
{ name: 'Prestige ranking', url: 'https://clopostars.com/allies/prestige', icon: '../../../../assets/icons/heroicons/outline/academic-cap.svg' },
{ name: 'Cards', url: 'https://clopostars.com/allies/cards', icon: '../../../../assets/icons/heroicons/outline/swatch.svg' },
{ name: 'Yesterday Scores', url: 'https://clopostars.com/allies/yesterday-scores', icon: '../../../../assets/icons/heroicons/outline/swatch.svg' },
{ name: 'Statistics', url: 'https://clopostars.com/allies/statistics', icon: '../../../../assets/icons/heroicons/outline/swatch.svg' },
{ name: 'Card Comparison', url: 'https://clopostars.com/allies/cards-comparison', icon: '../../../../assets/icons/heroicons/outline/swatch.svg' },
{ name: 'Help', url: 'https://clopostars.com/allies/help', icon: '../../../../assets/icons/heroicons/outline/question-mark-circle.svg' }
]
},
{
name: 'SHOP',
selector: '.dropdown-base ul',
findByText: 'SHOP',
items: [
{ name: 'Offers', url: 'https://clopostars.com/shop/offers', icon: '../../../../assets/icons/heroicons/outline/shopping-bag.svg' }
]
}
];
function waitForElement(selector, callback) {
const interval = setInterval(() => {
const element = document.querySelector(selector);
if (element) {
clearInterval(interval);
callback(element);
}
}, 500);
}
function initializeMenus() {
menus.forEach(menu => {
const menuElement = menu.findByText
? [...document.querySelectorAll('.dropdown-nav')].find(nav => nav.textContent.includes(menu.findByText))?.querySelector(menu.selector)
: document.querySelector(menu.selector);
if (menuElement) {
menuElement.innerHTML = '';
menu.items.forEach(item => {
const li = document.createElement('li');
li.className = 'flex font-semibold text-gray-600';
li.innerHTML = `
<div class="dropdown relative flex w-full">
<a href="${item.url}" class="mx-3 flex w-full items-center justify-start rounded-md py-2 px-2 text-xs font-semibold text-gray-600 hover:bg-gray-100 hover:text-primary-500">
<span class="mr-2 text-gray-400">
<img src="${item.icon}" class="w-5 h-5">
</span>
<span class="ml-1">${item.name}</span>
</a>
</div>
`;
menuElement.appendChild(li);
});
}
});
// Special handling for 'MARKETPLACE' menu
const marketplaceMenu = [...document.querySelectorAll('.dropdown')].find(nav => nav.textContent.includes('MARKETPLACE'));
if (marketplaceMenu) {
const link = document.createElement('a');
link.href = 'https://clopostars.com/market';
link.className = 'menu-btn text-gray-600 hover:text-primary-500 px-3 py-2 text-xs font-semibold';
link.style.textDecoration = 'none';
link.innerHTML = '<span>MARKETPLACE</span>';
marketplaceMenu.innerHTML = '';
marketplaceMenu.appendChild(link);
}
}
waitForElement('.dropdown-nav', initializeMenus);
})();
