Candidate Vote Difference with Formatting and Styling

Calculate and display vote difference between two candidates with formatted numbers, improved styling, and time

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

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

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

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

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

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

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

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

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

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

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

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

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

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

// ==UserScript==
// @name         Candidate Vote Difference with Formatting and Styling
// @namespace    http://tampermonkey.net/
// @version      0.3
// @description  Calculate and display vote difference between two candidates with formatted numbers, improved styling, and time
// @author       You
// @match        https://prezenta.roaep.ro/prezidentiale24112024/pv/romania/results/
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Function to extract candidate data
    function extractData() {
        // Candidates you're interested in
        const candidates = ["ION-MARCEL CIOLACU", "ELENA-VALERICA LASCONI"];

        // Wait for the page to load properly and then execute the logic
        const rows = document.querySelectorAll("tr");

        let candidateVotes = {};

        rows.forEach(row => {
            const nameElement = row.querySelector("span");
            if (nameElement) {
                const candidateName = nameElement.innerText.trim();

                // If it's one of the candidates we're tracking
                if (candidates.includes(candidateName)) {
                    const numbers = row.querySelectorAll("span");
                    if (numbers.length >= 2) {
                        const votes = parseInt(numbers[1].innerText.trim().replace(/\D/g, ''));  // Remove non-numeric characters
                        candidateVotes[candidateName] = votes;
                    }
                }
            }
        });

        // Check if both candidates' votes were found
        if (candidateVotes["ION-MARCEL CIOLACU"] && candidateVotes["ELENA-VALERICA LASCONI"]) {
            const ciolacuVotes = candidateVotes["ION-MARCEL CIOLACU"];
            const lasconiVotes = candidateVotes["ELENA-VALERICA LASCONI"];
            const voteDifference = ciolacuVotes - lasconiVotes;

            // Display the result on the page
            displayResult(ciolacuVotes, lasconiVotes, voteDifference);
        }
    }

    // Function to format numbers with a dot as a thousands separator
    function formatNumber(number) {
        return number.toLocaleString('en-GB');  // 'en-GB' uses a dot as the thousands separator
    }

    // Function to get the current time in a readable format
    function getCurrentTime() {
        const now = new Date();
        return now.toLocaleTimeString();  // Returns time in the format HH:MM:SS AM/PM
    }

    // Function to display the result on the page
    function displayResult(ciolacuVotes, lasconiVotes, voteDifference) {
        // Create a div element to show the result
        const resultDiv = document.createElement("div");
        resultDiv.style.position = "fixed";
        resultDiv.style.top = "10px";
        resultDiv.style.right = "10px";
        resultDiv.style.backgroundColor = "#333"; // Dark background for better readability
        resultDiv.style.color = "#fff";  // White text for contrast
        resultDiv.style.borderRadius = "15px"; // Rounded corners
        resultDiv.style.padding = "20px"; // Padding around the content
        resultDiv.style.boxShadow = "0 4px 8px rgba(0, 0, 0, 0.2)"; // Subtle shadow for depth
        resultDiv.style.fontFamily = "'Arial', sans-serif"; // Clean font style
        resultDiv.style.zIndex = "9999";
        resultDiv.style.fontSize = "16px";  // Slightly larger text for better readability
        resultDiv.style.maxWidth = "300px"; // Limit the width for better layout

        resultDiv.innerHTML = `
            <h3 style="font-size: 18px; font-weight: bold;">Vote Difference:</h3>
            <p style="color: rgb(201, 35, 43);">ION-MARCEL CIOLACU Votes: <strong>${formatNumber(ciolacuVotes)}</strong></p>
            <p style="color: rgb(45, 111, 163);">ELENA-VALERICA LASCONI Votes: <strong>${formatNumber(lasconiVotes)}</strong></p>
            <p>Vote Difference: <strong>${formatNumber(voteDifference)}</strong></p>
            <p style="font-size: 14px;">Last Updated: <strong>${getCurrentTime()}</strong></p>
        `;

        // Append the result div to the body
        document.body.appendChild(resultDiv);
    }

    // Wait for the page to load and then extract data
    window.addEventListener('load', () => {
        setTimeout(extractData, 3000);  // Wait a few seconds for the page to fully load
    });
})();