Tweakers PriceGraph Mover

Move priceGraph below listings

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

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

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

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

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

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

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

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

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

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

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

// ==UserScript==
// @name         Tweakers PriceGraph Mover
// @namespace    http://tampermonkey.net/
// @version      1.1
// @description  Move priceGraph below listings
// @author       Markisoke
// @match        https://tweakers.net/pricewatch/*
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    function moveAndResize() {
        const priceGraph = document.querySelector('.priceGraph');
        const listing = document.getElementById('listing');
        const reference = document.querySelector('.top-banner.hideInGradeXS.loading.reserveSpace');

        if (priceGraph && listing && reference) {
            // Move priceGraph after listing
            if (listing.nextSibling !== priceGraph) {
                listing.parentNode.insertBefore(priceGraph, listing.nextSibling);
            }

            // Match width
            const refWidth = window.getComputedStyle(reference).width;

            [listing, priceGraph].forEach(el => {
                el.style.width = refWidth;
                el.style.maxWidth = refWidth;
                el.style.margin = '0 auto';
                el.style.boxSizing = 'border-box';
            });

            const listingTable = listing.querySelector('table');
            if (listingTable) {
                listingTable.style.width = '100%';
                listingTable.style.tableLayout = 'auto';
            }
        }
    }

    // Observe for dynamic content
    const observer = new MutationObserver(() => {
        const listing = document.getElementById('listing');
        const priceGraph = document.querySelector('.priceGraph');
        const reference = document.querySelector('.top-banner.hideInGradeXS.loading.reserveSpace');

        if (listing && priceGraph && reference) {
            moveAndResize();
            observer.disconnect();
        }
    });

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

    // Also run after full DOM load
    window.addEventListener('load', moveAndResize);
})();