Add article menu item

This user script will add menu options to to each article in BuildWise.

当前为 2024-12-13 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Add article menu item
// @namespace    http://tampermonkey.net/
// @version      1.0.2
// @description  This user script will add menu options to to each article in BuildWise.
// @author       [email protected]
// @match        *://*.buildwise.ai/*
// @icon         https://images.buildwise.ai/BuildWise_logo_without_name.png
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // Function to add click event listeners to buttons
    function addMenuButtonListeners() {
        const menuButtons = document.querySelectorAll('.article-menu-btn');

        if (!menuButtons.length) return;

        menuButtons.forEach(button => {
            if (!button.dataset.listenerAdded) {
                button.addEventListener('click', handleMenuButtonClick);
                button.dataset.listenerAdded = true;
            }
        });
    }

    // Helper function to find an element by class name and text content
    function findElementByClassNameAndTextContent(className, textContent) {
        const elements = document.querySelectorAll(`.${className}`);
        for (const element of elements) {
            if (element.textContent.trim() === textContent) {
                return element;
            }
        }
        return null;
    }

    // Handles the click event for menu buttons
    function handleMenuButtonClick() {
        setTimeout(() => {
            const menuContainer = document.getElementById('menu-list-container');
            const menuItemToClone = document.querySelector('.menu-list-item');

            if (!menuContainer || !menuItemToClone) return;

            const items = [
                {
                    svgIcon: `
                        <svg width="17" height="17" viewBox="0 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path d="M5.44019 2.97528C4.7482 3.04007 4.12246 3.25208 3.58948 3.60544C3.37011 3.74973 3.22435 3.86898 3.03147 4.06186C2.5353 4.5595 2.18931 5.22352 2.03913 5.96998C1.9449 6.43524 1.95226 5.89784 1.94637 12.4261C1.94343 16.7297 1.94637 18.417 1.95815 18.5878C2.01263 19.3475 2.23495 20.0306 2.61039 20.5901C2.80768 20.8831 3.12718 21.2247 3.3863 21.4176C3.94873 21.8387 4.61569 22.0963 5.35921 22.1802C5.65368 22.2126 18.4953 22.2141 18.8015 22.1802C19.5347 22.1022 20.1884 21.8563 20.7243 21.4588C21.5003 20.8816 21.9861 20.0645 22.1569 19.0442C22.2143 18.7041 22.2173 18.5745 22.2173 16.7945V15.0616L19.8822 15.0645L17.5486 15.0689L16.5282 16.8136L15.5079 18.5583H12.0067H8.50556L6.75644 15.5695L5.00586 12.5822L5.04119 12.5218C5.07653 12.4614 7.8813 7.6661 8.28471 6.97852L8.50409 6.60308H12.0067H15.5094L16.5268 8.34778L17.5441 10.0925L19.8807 10.0969L22.2173 10.0998V8.40078C22.2173 6.65314 22.2129 6.48235 22.1569 6.14224C22.0185 5.2986 21.6799 4.61839 21.1204 4.05597C20.5948 3.5274 19.9543 3.19466 19.1681 3.04007C18.7352 2.95614 19.1048 2.95909 12.0583 2.96203C8.49084 2.96203 5.51381 2.96792 5.44019 2.97528Z" fill="black"/>
                            <path d="M10.2356 9.27804C10.2194 9.30454 9.83067 9.99212 9.37131 10.8063C8.91195 11.6205 8.49675 12.3522 8.45111 12.4332L8.36719 12.5819L9.31094 14.1779L10.2547 15.7754H12.1525H14.0503L14.9764 14.2074C15.4859 13.3446 15.9099 12.6246 15.9187 12.6084C15.932 12.5805 15.8009 12.3419 14.9882 10.9035L14.043 9.23093H12.154H10.265L10.2356 9.27804Z" fill="#EC5F2A"/>
                        </svg>
                    `,
                    name: 'Send to Procore'
                }
            ];

            const targetEle = findElementByClassNameAndTextContent('menu-list-item', 'Bookmark');
            items.forEach(item => {
                const clonedItem = menuItemToClone.cloneNode(true);

                const svgElement = clonedItem.querySelector('svg');
                if (svgElement) svgElement.outerHTML = item.svgIcon;

                const textNode = clonedItem.querySelector('.menu-item-title');
                if (textNode) textNode.textContent = item.name;

                if (targetEle?.nextSibling) {
                    menuContainer.insertBefore(clonedItem, targetEle.nextSibling);
                } else {
                    menuContainer.appendChild(clonedItem);
                }

                clonedItem.addEventListener('click', handleNewMenuItemClick);
            });
        }, 0);
    }

    // Function to handle the click event for new menu items
    function handleNewMenuItemClick(event) {
        event.preventDefault();

        const token = JSON.parse(localStorage.getItem('bwAuthStorage'));

        if (!token || !token?.state?.accessToken) {
            console.error('Access token not found in localStorage');
            return;
        }

        const apiUrl = 'https://your-backend-api-endpoint.com'; // Replace with your actual API endpoint
        const payload = {
            itemName: event.target.textContent,
            timestamp: new Date().toISOString()
        };

        fetch(apiUrl, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${token.state.accessToken}`
            },
            body: JSON.stringify(payload)
        })
        .then(response => response.ok ? response.json() : Promise.reject('API call failed'))
        .then(data => console.log('API response:', data))
        .catch(error => console.error('Error:', error));
    }

    // Set up a MutationObserver to detect DOM changes
    const observer = new MutationObserver(() => {
        addMenuButtonListeners();
    });

    observer.observe(document.body, { childList: true, subtree: true });

    // Initial check in case buttons are already in the DOM
    addMenuButtonListeners();
})();