Candidate Vote Difference with Formatting and Styling

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

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

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

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

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

你需要先安裝一款使用者腳本管理器擴展,比如 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
    });
})();