<html lang="en">
<head>
    <meta charset="UTF-8"></meta>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"></meta>
    <title>Grade 8, Geography, The Solar System, worksheet 1</title>
    <style>
    
            h1 {
            font-size: 24px; /* Adjust this value as needed */
            color: green;
        }
        .correct {
            color: green;
        }
        .wrong {
            color: red;
        }
        body, html {
            -webkit-user-select: none; /* Safari */
            -moz-user-select: none; /* Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera, and Edge */
        }
        label {
            font-size: 20px;
        }
        p {
            font-size: 20px;
        }
        .question {
            display: flex;
            align-items: center;
            margin-bottom: 15px;
            font-size: 20px; /* Ensure font size consistency */
        }
        .question label {
            margin-right: 10px;
        }
        .question input[type="text"] {
            width: 50px;
            text-align: center;
            margin-right: 10px;
            font-size: 20px; /* Match font size with the label */
        }
        .question .answer-display {
            font-size: 20px;
            margin-left: 10px;
        }
        .exercise-instructions {
            font-size: 20px;
            margin-bottom: 20px;
            font-weight: bold; /* Make the instructions bold */
        }
        .result-images img {
            width: 50px;
            height: 50px;
        }
        .buttons {
            margin-top: 20px;
        }
        .buttons button {
            font-size: 18px;
            padding: 10px 20px;
            margin: 5px;
            color: white;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
        .check-button {
            background-color: #4CAF50; /* Green */
        }
        .retry-button {
            background-color: #f44336; /* Red */
        }
        .marks {
            color: blue;
            font-size: 20px;
            font-weight: bold;
        }
    </style>
    <script>
        document.addEventListener('contextmenu', event => event.preventDefault());

        document.addEventListener('keydown', event => {
            if (event.key === "F12" || (event.ctrlKey && event.shiftKey && event.key === 'I') || (event.ctrlKey && event.shiftKey && event.key === 'J') || (event.ctrlKey && event.key === 'U')) {
                event.preventDefault();
            }
        });

        document.addEventListener('copy', event => {
            event.preventDefault();
        });

        function shuffle(array) {
            for (let i = array.length - 1; i > 0; i--) {
                const j = Math.floor(Math.random() * (i + 1));
                [array[i], array[j]] = [array[j], array[i]];
            }
            return array;
        }

const questions1 = [
 
    {"q": "How many planets are there in the solar system?", "options": ["7", "8", "9", "10"], "a": "8"},
    {"q": "What are asteroids?", "options": ["Small stars", "Fragments of rock left over from the formation of the solar system", "Gaseous planets", "Natural satellites"], "a": "Fragments of rock left over from the formation of the solar system"},
    {"q": "What is the solar system believed to have formed from?", "options": ["Dust particles and gases", "Exploding stars", "Black holes", "Comets"], "a": "Dust particles and gases"},
    {"q": "How old is the solar system believed to be?", "options": ["1 billion years", "4.6 billion years", "10 billion years", "100 million years"], "a": "4.6 billion years"},
    {"q": "What is the Sun?", "options": ["A planet", "A star", "A comet", "A satellite"], "a": "A star"},
    {"q": "What percentage of the solar system's mass does the Sun hold?", "options": ["50%", "75%", "99.86%", "100%"], "a": "99.86%"},
    {"q": "What is the temperature at the core of the Sun?", "options": ["1 million °C", "15 million °C", "6000 °C", "100,000 °C"], "a": "15 million °C"},
    {"q": "How long does it take for the Sun to rotate around its own axis?", "options": ["24 hours", "25.4 Earth days", "365 days", "10 years"], "a": "25.4 Earth days"},
    {"q": "What are solar storms?", "options": ["Explosions on the Sun's surface", "Flames bursting out from the Sun", "Solar eclipses", "Meteor showers"], "a": "Flames bursting out from the Sun"},
    {"q": "Which planet is closest to the Sun?", "options": ["Venus", "Earth", "Mercury", "Mars"], "a": "Mercury"},
    {"q": "Which planet is known as the 'Red Planet'?", "options": ["Venus", "Mars", "Jupiter", "Saturn"], "a": "Mars"},
    {"q": "Which planet is the largest in the solar system?", "options": ["Earth", "Jupiter", "Saturn", "Neptune"], "a": "Jupiter"},
    {"q": "Which planet has the highest surface temperature?", "options": ["Mercury", "Venus", "Earth", "Mars"], "a": "Venus"},
    {"q": "Which planet is known as the 'Blue Planet'?", "options": ["Earth", "Neptune", "Uranus", "Saturn"], "a": "Earth"},
    {"q": "Which planet has the most natural satellites?", "options": ["Jupiter", "Saturn", "Uranus", "Neptune"], "a": "Jupiter"},
    {"q": "Which planet is known for its rings?", "options": ["Jupiter", "Saturn", "Uranus", "Neptune"], "a": "Saturn"},
    {"q": "Which planet is the farthest from the Sun?", "options": ["Uranus", "Neptune", "Pluto", "Saturn"], "a": "Neptune"},
    {"q": "Which planet has no atmosphere?", "options": ["Mercury", "Venus", "Earth", "Mars"], "a": "Mercury"},
    {"q": "Which planet is known as the 'Morning Star' and 'Evening Star'?", "options": ["Mercury", "Venus", "Mars", "Jupiter"], "a": "Venus"},
    {"q": "How many dwarf planets are currently recognized?", "options": ["3", "5", "7", "9"], "a": "5"},
    {"q": "Which of the following is a dwarf planet?", "options": ["Mars", "Pluto", "Saturn", "Jupiter"], "a": "Pluto"},
    {"q": "Which dwarf planet was once considered the ninth planet?", "options": ["Ceres", "Eris", "Pluto", "Haumea"], "a": "Pluto"},
    {"q": "Which dwarf planet is located in the asteroid belt?", "options": ["Pluto", "Ceres", "Eris", "Makemake"], "a": "Ceres"},
    {"q": "Which dwarf planet is the largest?", "options": ["Pluto", "Eris", "Haumea", "Makemake"], "a": "Eris"},
    {"q": "What is a natural satellite?", "options": ["A man-made object orbiting a planet", "A celestial object that orbits a planet", "A star", "A comet"], "a": "A celestial object that orbits a planet"},
    {"q": "How many natural satellites does Earth have?", "options": ["0", "1", "2", "3"], "a": "1"},
    {"q": "Which planet has the most natural satellites?", "options": ["Jupiter", "Saturn", "Uranus", "Neptune"], "a": "Jupiter"},
    {"q": "What is the name of Earth's natural satellite?", "options": ["Phobos", "Deimos", "Moon", "Titan"], "a": "Moon"},
    {"q": "Which planet has no natural satellites?", "options": ["Mercury", "Venus", "Both a and b", "Mars"], "a": "Both a and b"},
    {"q": "Where is the asteroid belt located?", "options": ["Between Earth and Mars", "Between Mars and Jupiter", "Between Jupiter and Saturn", "Between Saturn and Uranus"], "a": "Between Mars and Jupiter"},
    {"q": "What are asteroids made of?", "options": ["Ice", "Gas", "Hard rocks", "Metal"], "a": "Hard rocks"},
    {"q": "What is the shape of most asteroids?", "options": ["Spherical", "Irregular", "Square", "Triangular"], "a": "Irregular"},
    {"q": "What is the largest asteroid in the solar system?", "options": ["Ceres", "Vesta", "Pallas", "Eros"], "a": "Ceres"},
    {"q": "What is the main difference between asteroids and comets?", "options": ["Asteroids are made of ice, comets are made of rock", "Asteroids are made of rock, comets are made of ice", "Asteroids orbit the Sun, comets orbit planets", "Asteroids are larger than comets"], "a": "Asteroids are made of rock, comets are made of ice"},
    {"q": "What is astrology based on?", "options": ["The movements of the Sun and Moon", "The positions of stars", "The alignment of planets", "All of the above"], "a": "All of the above"},
    {"q": "Which festival is associated with the Sun?", "options": ["Thaipongal", "Diwali", "Christmas", "Eid"], "a": "Thaipongal"},
    {"q": "What is the belief behind 'Shanthe karma'?", "options": ["Planets have malefic effects", "Planets bring good luck", "Planets control the weather", "Planets influence farming"], "a": "Planets have malefic effects"},
    {"q": "What is the significance of the Sinhala and Hindu New Year festival?", "options": ["It is based on the Sun's movement", "It is based on the Moon's movement", "It is based on the stars", "It is based on the planets"], "a": "It is based on the Sun's movement"},
    {"q": "What is the belief about the Moon in Ayurvedic treatment?", "options": ["The Moon influences the direction of collecting herbs", "The Moon influences the taste of herbs", "The Moon influences the color of herbs", "The Moon influences the smell of herbs"], "a": "The Moon influences the direction of collecting herbs"},
    {"q": "Who first used a telescope to observe the universe?", "options": ["Isaac Newton", "Galileo Galilei", "Nicolaus Copernicus", "Johannes Kepler"], "a": "Galileo Galilei"},
    {"q": "When was the first artificial satellite launched?", "options": ["1957", "1969", "1975", "1980"], "a": "1957"},
    {"q": "Which country launched the first artificial satellite?", "options": ["USA", "USSR", "China", "India"], "a": "USSR"},
    {"q": "What is the name of the organization established by the USA to explore space?", "options": ["NASA", "ESA", "ISRO", "CNSA"], "a": "NASA"},
    {"q": "What was Pluto reclassified as in 2006?", "options": ["A planet", "A dwarf planet", "An asteroid", "A comet"], "a": "A dwarf planet"},
    {"q": "What is the name of the hypothetical ninth planet?", "options": ["Planet X", "Planet 9", "Planet Pluto", "Planet Eris"], "a": "Planet 9"},
    {"q": "Who was the first person to step on the Moon?", "options": ["Neil Armstrong", "Buzz Aldrin", "Yuri Gagarin", "John Glenn"], "a": "Neil Armstrong"},
    {"q": "What is the main source of energy for the solar system?", "options": ["The Moon", "The Sun", "The planets", "The stars"], "a": "The Sun"},
    {"q": "What is the temperature of the Sun's surface?", "options": ["6000 °C", "15 million °C", "100,000 °C", "1 million °C"], "a": "6000 °C"},
    {"q": "What is the diameter of the Sun compared to Earth?", "options": ["10 times", "50 times", "100 times", "109 times"], "a": "109 times"}
]

        function displayQuestions() {
            shuffle(questions1);

            const questionsContainer1 = document.getElementById('questionsContainer1');
            questionsContainer1.innerHTML = `
                <div class="exercise-instructions">Exercise 1: Choose the correct answer.</div>
            `;
            questions1.forEach((question, index) => {
                const options = shuffle(question.options).map(option => 
                    `<label>
                        <input type="radio" name="question1${index}" value="${option}">
                        ${option}
                    </label><br>`
                ).join('');

                const questionHTML = `
                    <div>
                        <p>${index + 1}. ${question.q}</p>
                        ${options}
                        <p id="feedback1${index}"></p>
                    </div>
                `;
                questionsContainer1.innerHTML += questionHTML;
            });

   





            document.querySelectorAll('#questionsContainer4 .remainder-input').forEach(input => {
                input.addEventListener('keydown', event => {
                    if (event.key === 'Enter') {
                        event.preventDefault();
                        const quotientInputs = Array.from(document.querySelectorAll('#questionsContainer4 .quotient-input'));
                        const currentIndex = quotientInputs.indexOf(input.parentElement.querySelector('.quotient-input'));
                        const nextRowQuotient = quotientInputs[currentIndex + 1];
                        if (nextRowQuotient) {
                            nextRowQuotient.focus();
                        }
                    }
                });
            });
        }

        function checkAnswers() {
            let score1 = 0;

            const totalQuestions1 = questions1.length;


            // Check answers for Exercise 1
            questions1.forEach((question, index) => {
                const selectedAnswer = document.querySelector(`input[name="question1${index}"]:checked`);
                const feedback = document.getElementById(`feedback1${index}`);

                if (selectedAnswer) {
                    if (selectedAnswer.value === question.a) {
                        feedback.innerHTML = '<span class="correct">Correct!</span>';
                        score1++;
                    } else {
                        feedback.innerHTML = `<span class="wrong">Wrong! The correct answer is: ${question.a}</span>`;
                    }
                } else {
                    feedback.innerHTML = `<span class="wrong">No answer selected. The correct answer is: ${question.a}</span>`;
                }
            });

            // Hide the "Check Answers" button after checking the answers

            document.getElementById('checkAnswersButton').style.display = 'none';

            // Calculate percentage
            const totalScore = score1;
            const totalQuestions = totalQuestions1;
            const percentage = (totalScore / totalQuestions) * 100;

            // Display individual and total results
            const resultText = `
                <div class="marks">Exercise 1 Score: ${score1}/${totalQuestions1}</div>

                <div class="marks"><strong>Total Score: ${totalScore}/${totalQuestions} (${percentage.toFixed(2)}%)</strong></div>
                <div>${getGradeFeedback(percentage)}</div>
                ${percentage === 100 ? '<div class="result-images"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2-ubMp9uAa6YdIe_kBJ5KHLm9lvzYdypfXpvij7BtmhFONiFt9j3D7r1V_M4wPnIkIsocug7NzEHIYr35z4J8KqsKIXqw2YCpi_HY6C3OiGkC9ADz9Ee2ne-gO0VgladOU5r5FbSk2jrIy8rdgM0G895UGG_ayI0Bkeh1CU5ZswyoeWQyHsaICeB6Z7k/s1600/star.jpg" alt="Star"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQ6tyya1xafjBJ3poGtUE9T5Tj-YAnRsc1SnByb_1pebaR-LBVZYtBJyZ2y_0BMix1y5byTXw2FDWyRzK7_6gAq3duQofJEibkjoQYhCQ-qGcisr9uR6jJ2IN0P510osrhyphenhyphencjOEYoC9uuYnnnL6L61GTgAoWhtcUHu2sXs5RTwaLZAsIwGlePDW-ZXBb8/s1600/happy%20face.jpg" alt="Happy Face"></div>' : ''}
            `;
            document.getElementById('result').innerHTML = resultText;
            document.getElementById('result').style.fontSize = '20px'; // Ensure font size matches questions
            document.getElementById('result').style.fontWeight = 'bold'; // Make the result text bold
            document.querySelectorAll('.marks').forEach(element => {
                element.style.color = 'blue'; // Set color for all marks
            });
        }

        function getGradeFeedback(percentage) {
            if (percentage <= 25) {
                return 'Keep trying, you are improving! Keep up the effort!';
            } else if (percentage <= 50) {
                return 'Good job! You are doing well, keep practicing!';
            } else if (percentage <= 75) {
                return 'Great work! You are almost there, keep it up!';
            } else if (percentage <= 85) {
                return 'Excellent! You are doing fantastic!';
            } else if (percentage <= 99) {
                return 'Almost perfect! Keep up the great work!';
            } else {
                return 'Perfect score! You did an amazing job!';
            }
        }

        window.onload = function() {
            displayQuestions();

            document.getElementById('checkAnswersButton').addEventListener('click', checkAnswers);
document.getElementById('retryButton').addEventListener('click', () => {
    location.reload(); // This will refresh the page
       document.getElementById('result').innerHTML = '';
                displayQuestions();
            });
        }
    </script>
</head>
<body>
  
   <h1>Grade 8, Geography, The Solar System, worksheet 1</h1> <!-- Add a title heading here -->
  
  
    <div id="questionsContainer1"></div>

    <div id="result"></div>
    <div class="buttons">
        <button class="check-button" id="checkAnswersButton">Check Answers</button>
        <button class="retry-button" id="retryButton">Retry</button>
    </div>
</body>
</html>
