User:Pavitrased29/common.js

// Create container for toggle button var toggleContainer = document.createElement('div'); toggleContainer.id = 'toggleContainer'; toggleContainer.style.position = 'fixed'; toggleContainer.style.bottom = '55px'; toggleContainer.style.right = '15px'; toggleContainer.style.zIndex = '9999';

// Create toggle button (as an image) var toggleButton = document.createElement('img'); toggleButton.src = 'https://upload.wikimedia.org/wikipedia/commons/thumb/2/21/Speaker_Icon.svg/800px-Speaker_Icon.svg.png'; toggleButton.alt = 'Toggle Speech'; toggleButton.id = 'toggleSpeech'; toggleButton.style.width = '20px'; // Set width toggleButton.style.height = '20px'; // Set height toggleButton.style.borderRadius = '25%'; // Make it circular toggleButton.style.backgroundColor = 'transparent'; // Transparent initially toggleButton.style.cursor = 'pointer'; toggleButton.style.boxShadow = '0px 4px 8px rgba(0, 0, 0, 0.1)'; // Shadow effect toggleButton.style.transition = 'background-color 0.3s'; // Smooth transition

// Add event listener for button hover toggleButton.addEventListener('mouseenter', function {   toggleButton.style.backgroundColor = '#cfcfcf'; // Change background color on hover });

// Define quiz questions var questions = [ {       question: "What is the capital of France?", options: ["Paris", "London", "Berlin", "Madrid"], answer: "Paris" },   {        question: "Who painted the Mona Lisa?", options: ["Leonardo da Vinci", "Pablo Picasso", "Vincent van Gogh", "Michelangelo"], answer: "Leonardo da Vinci" }   // Add more questions as needed ];

// Function to display quiz question function displayQuestion { // Select a random question var randomIndex = Math.floor(Math.random * questions.length); var randomQuestion = questions[randomIndex];

// Create quiz element var quizElement = document.createElement("div"); quizElement.classList.add("quiz"); quizElement.style.position = "fixed"; quizElement.style.top = "50%"; quizElement.style.right = "50px"; quizElement.style.transform = "translateY(-50%)"; quizElement.style.backgroundColor = "#fff"; quizElement.style.padding = "20px"; quizElement.style.border = "1px solid #ccc"; quizElement.style.borderRadius = "5px"; quizElement.style.zIndex = "9999";

// Create question element var questionElement = document.createElement("p"); questionElement.textContent = randomQuestion.question; quizElement.appendChild(questionElement);

// Create options element var optionsElement = document.createElement("ul"); randomQuestion.options.forEach(function(option) {       var optionItem = document.createElement("li");        optionItem.textContent = option;        optionItem.addEventListener("click", function { if (option === randomQuestion.answer) { alert("Correct!"); } else { alert("Incorrect. The correct answer is: " + randomQuestion.answer); }           quizElement.remove; // Remove quiz after answering });       optionsElement.appendChild(optionItem);    }); quizElement.appendChild(optionsElement);

// Append quiz element to document body document.body.appendChild(quizElement);

// Remove quiz after 5 seconds setTimeout(function {       quizElement.remove;    }, 5000); }

// Display quiz question every 10 seconds setInterval(displayQuestion, 10000);

// Add event listener for button mouseout toggleButton.addEventListener('mouseleave', function {   toggleButton.style.backgroundColor = 'transparent'; // Reset background color on mouseout });

// Append toggle button to toggle container toggleContainer.appendChild(toggleButton);

// Append toggle container to the document body document.body.appendChild(toggleContainer);

var enterPressed = false; var timer;

// Function to handle key press event function handleKeyPress(event) { if (event.keyCode === 13) { // Check if Enter key is pressed if (!enterPressed) { enterPressed = true; timer = setTimeout(function {               enterPressed = false; // Reset after a delay if no second Enter key press            }, 300); // Adjust the delay as needed } else { clearTimeout(timer); toggleSpeech; // Activate the action when Enter is pressed twice enterPressed = false; // Reset after action is triggered }   } }

// Add event listener for key press document.addEventListener('keypress', handleKeyPress);

// Function to toggle speech synthesis function toggleSpeech { if (window.speechSynthesis.speaking) { window.speechSynthesis.cancel; } else { var textToSpeak = document.body.innerText; var utterance = new SpeechSynthesisUtterance(textToSpeak); window.speechSynthesis.speak(utterance); } } // Create controls container var controlsContainer = document.createElement('div'); controlsContainer.id = 'controls'; controlsContainer.style.position = 'fixed'; controlsContainer.style.top = '10px'; controlsContainer.style.right = '10px'; controlsContainer.style.zIndex = '9999'; controlsContainer.style.background = '#fff'; controlsContainer.style.padding = '10px'; controlsContainer.style.border = '1px solid #ccc'; controlsContainer.style.borderRadius = '5px'; controlsContainer.style.display = 'none'; // Hide initially

// Create font size control var fontSizeLabel = document.createElement('label'); fontSizeLabel.textContent = 'Font Size:'; var fontSizeInput = document.createElement('input'); fontSizeInput.type = 'range'; fontSizeInput.id = 'fontSize'; fontSizeInput.min = '10'; fontSizeInput.max = '30'; fontSizeInput.value = '16';

// Create container width control var containerWidthLabel = document.createElement('label'); containerWidthLabel.textContent = 'Container Width:'; var containerWidthInput = document.createElement('input'); containerWidthInput.type = 'range'; containerWidthInput.id = 'containerWidth'; containerWidthInput.min = '50'; containerWidthInput.max = '100'; containerWidthInput.value = '80';

// Append elements to controls container controlsContainer.appendChild(fontSizeLabel); controlsContainer.appendChild(fontSizeInput); controlsContainer.appendChild(document.createElement('br')); controlsContainer.appendChild(containerWidthLabel); controlsContainer.appendChild(containerWidthInput); controlsContainer.appendChild(document.createElement('br')); controlsContainer.appendChild(document.createElement('hr')); // Separation line controlsContainer.appendChild(document.createElement('br'));

// Append controls container to the document body document.body.appendChild(controlsContainer);

// Create container for toggle button/logo var toggleContainer = document.createElement('div'); toggleContainer.id = 'toggleContainer'; toggleContainer.style.position = 'fixed'; toggleContainer.style.top = '35px'; toggleContainer.style.right = '15px'; toggleContainer.style.zIndex = '9999';

// Create toggle button/logo var toggleButton = document.createElement('button'); toggleButton.textContent = '▲'; // Arrow icon toggleButton.style.padding = '4px';

// Append toggle button/logo to toggle container toggleContainer.appendChild(toggleButton);

// Append toggle container to the document body document.body.appendChild(toggleContainer);

// Function to toggle controls visibility function toggleControls { if (controlsContainer.style.display === 'none') { controlsContainer.style.display = 'block'; } else { controlsContainer.style.display = 'none'; } }

// Add event listener for toggle button/logo toggleButton.addEventListener('click', toggleControls);

// Function to update font size fontSizeInput.addEventListener('input', function {   document.body.style.fontSize = fontSizeInput.value + 'px'; });

// Function to update container width containerWidthInput.addEventListener('input', function {   document.body.style.width = containerWidthInput.value + '%'; }); // Reward system logic let coins = 0;

function rewardUser { coins++; document.getElementById('rewardMessage').textContent = `You have received 1 coin! Total coins: ${coins} Thanks for your contribution!`; }

// Create button element const rewardButton = document.createElement('button'); rewardButton.id = 'rewardButton'; rewardButton.innerHTML = 'Reward';

// Create message element const rewardMessage = document.createElement('div'); rewardMessage.id = 'rewardMessage';

// Append button and message elements to body document.body.appendChild(rewardButton); document.body.appendChild(rewardMessage);

// Add event listener to reward button document.getElementById('rewardButton').addEventListener('click', rewardUser);

// Apply CSS styles to position both the button and message at the top right corner rewardButton.style.position = 'fixed'; rewardButton.style.bottom = '30px'; rewardButton.style.left = '10px';

rewardMessage.style.position = 'fixed'; rewardMessage.style.bottom = '18px'; // Adjust the distance from the top to your preference rewardMessage.style.left = '10px'; // Align with the reward button