DekuDeals - This Week's New Deals Filter

Add sale type filters to "This Week's New Deals" page

目前為 2024-02-04 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name        DekuDeals - This Week's New Deals Filter
// @namespace   MKScripts
// @match       https://www.dekudeals.com/weekly*
// @grant       none
// @version     1.1
// @author      MKScripts
// @description Add sale type filters to "This Week's New Deals" page
// ==/UserScript==

(function() {
    'use strict';

    // Find the heading element
    const headingElement = document.querySelector('h3.display-3.mb-3');

    if (headingElement) {
        // Create a container div for the radio buttons
        const radioContainer = document.createElement('div');
        radioContainer.style.display = 'flex'; // Use flexbox for layout
        radioContainer.style.marginBottom = '20px'; // Make room below the div

        // Create radio buttons
        const radioButtons = [
            createRadioButton('Show All', 'showAll', showAll),
            createRadioButton('Regular Sale', 'regularSale', regularSale),
            createRadioButton('Matches Previous Low', 'matchesPreviousLow', matchesPreviousLow),
            createRadioButton('Lowest Price Ever', 'lowestPriceEver', lowestPriceEver)
        ];

        // Set "Show All" as checked by default
        radioButtons[0].input.checked = true;

        // Append radio buttons to the container
        radioButtons.forEach(({ container }) => radioContainer.appendChild(container));

        // Insert the container after the heading element
        headingElement.insertAdjacentElement('afterend', radioContainer);
    }

    // Function to create a radio button
    function createRadioButton(label, value, handler) {
        const radioButton = document.createElement('input');
        radioButton.type = 'radio';
        radioButton.name = 'dealType';
        radioButton.value = value;
        radioButton.style.cursor = 'pointer';

        const labelElement = document.createElement('label');
        labelElement.textContent = label;
        labelElement.style.marginLeft = '7px'; // Add margin-left to the labels
        labelElement.style.cursor = 'pointer';

        // Append the radio button and label to a div
        const container = document.createElement('div');
        container.style.marginRight = '20px'; // Spacing between radio buttons
        container.style.cursor = 'pointer';
        container.appendChild(radioButton);
        container.appendChild(labelElement);

        // Attach event listener to the container
        container.addEventListener('click', function() {
            radioButton.checked = true;
            handler();
        });

        return { input: radioButton, container };
    }


    // Selectors
    const divItemSelector = '.col-lg-2.col-md-3.col-sm-4.col-6.cell';
    const spanBadgeWarningSelector = '.badge-warning';

    // Event listener for "Show All"
    function showAll() {
        // Get all DIVs with the specified classes
        var divs = document.querySelectorAll(divItemSelector);

        // Iterate through each DIV and display them
        divs.forEach(function(div) {
            div.style.display = 'block';
        });
    }

    // Event listener for "Regular Sale"
    function regularSale() {
        // Get all DIVs with the specified classes
        var divs = document.querySelectorAll(divItemSelector);

        // Iterate through each DIV and hide them if they match the conditions
        divs.forEach(function(div) {
            var badge = div.querySelector(spanBadgeWarningSelector);

            if (badge && (badge.textContent.includes('Lowest price ever') || badge.textContent.includes('Matches previous low'))) {
                // Text found, hiding the div
                div.style.display = 'none';
            } else {
                div.style.display = 'block';
            }
        });
    }

    // Event listener for "Matches Previous Low"
    function matchesPreviousLow() {
        // Get all DIVs with the specified classes
        var divs = document.querySelectorAll(divItemSelector);

        // Iterate through each DIV and hide them if they don't match the conditions
        divs.forEach(function(div) {
            var badge = div.querySelector(spanBadgeWarningSelector);

            if (badge && badge.textContent.includes('Matches previous low')) {
                // Text found, show the div
                div.style.display = 'block';
            } else {
                // Text not found, hide the div
                div.style.display = 'none';
            }
        });
    }

    // Event listener for "Lowest Price Ever"
    function lowestPriceEver() {
        // Get all DIVs with the specified classes
        var divs = document.querySelectorAll(divItemSelector);

        // Iterate through each DIV and hide them if they don't match the conditions
        divs.forEach(function(div) {
            var badge = div.querySelector(spanBadgeWarningSelector);

            if (badge && badge.textContent.includes('Lowest price ever')) {
                // Text found, show the div
                div.style.display = 'block';
            } else {
                // Text not found, hide the div
                div.style.display = 'none';
            }
        });
    }

})();