Count how many items belong to dynamic categories based on script names, display it vertically with total count and smooth design
// ==UserScript== // @name GreasyFork Count Script Items by Dynamic Categories // @namespace http://tampermonkey.net/ // @version 1.0 // @description Count how many items belong to dynamic categories based on script names, display it vertically with total count and smooth design // @author Mahmudul Hasan Shawon // @license MIT // @match https://greasyfork.org/en/users/1392874-mahmudul-hasan-shawon // @grant GM_addStyle // ==/UserScript== (function() { 'use strict'; // Initialize an empty dictionary to store categories and their counts const categories = {}; // Select all <li> items in the list const listItems = document.querySelectorAll('#user-script-list li'); // Loop through each <li> item and extract the script name listItems.forEach(item => { const scriptName = item.querySelector('.script-link').textContent.toLowerCase(); // Extract the category from the script name (for simplicity, we use the first word) const category = scriptName.split(' ')[0]; // This uses the first word of the script name as the category // If the category doesn't exist in the dictionary, initialize it with 0 if (!categories[category]) { categories[category] = 0; } // Increment the count for this category categories[category]++; }); // Calculate the total number of items const totalItems = listItems.length; // Create a div to display the r###lts visually const countDisplay = document.createElement('div'); countDisplay.innerHTML = ` <div class="count-header"><strong>Total Scripts: ${totalItems}</strong></div> <div class="category-list"> ${Object.keys(categories) .map(category => `${capitalizeFirstLetter(category)}: ${categories[category]} items`) .join('<br>')} </div> `; // Style the count display GM_addStyle(` @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap'); #category-count-display { position: fixed; top: 120px; right: 10px; background-color: #69247C; color: white; padding: 15px; border-radius: 10px; font-size: 16px; font-family: 'Inter', sans-serif; z-index: 9999; max-width: 250px; width: auto; transition: all 0.3s ease; animation: slideIn 0.5s ease-out; } .count-header { font-size: 18px; font-weight: bold; margin-bottom: 10px; } .category-list { font-size: 14px; line-height: 1.6; } .category-list br { margin-bottom: 5px; } #category-count-display:hover { background-color: rgba(0, 0, 0, 0.9); transform: scale(1.05); } /* Slide-in effect */ @keyframes slideIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } } `); // Function to capitalize the first letter of each category function capitalizeFirstLetter(string) { return string.charAt(0).toUpperCase() + string.slice(1); } // Add the div to the page countDisplay.id = 'category-count-display'; document.body.appendChild(countDisplay); })();