{"id":226,"date":"2025-04-13T12:16:16","date_gmt":"2025-04-13T06:46:16","guid":{"rendered":"https:\/\/cmseducation.org\/shux\/?page_id=226"},"modified":"2025-04-26T11:45:42","modified_gmt":"2025-04-26T06:15:42","slug":"shuxyaan","status":"publish","type":"page","link":"https:\/\/cmseducation.org\/shux\/shuxyaan\/","title":{"rendered":"ShuxYaan"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"226\" class=\"elementor elementor-226\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9c960dc elementor-section-height-min-height elementor-section-full_width elementor-section-height-default elementor-section-items-middle\" data-id=\"9c960dc\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t\t<div class=\"elementor-background-overlay\"><\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-6b918c8\" data-id=\"6b918c8\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-33a6c78 elementor-widget elementor-widget-heading\" data-id=\"33a6c78\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">ShuXYaan<\/h1>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-3b06ea5 elementor-section-full_width elementor-section-height-full elementor-section-height-default elementor-section-items-middle\" data-id=\"3b06ea5\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-9013691\" data-id=\"9013691\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-91d101e elementor-widget elementor-widget-html\" data-id=\"91d101e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"space-flappy-container\">\r\n    <div class=\"space-flappy-game\">\r\n        <canvas class=\"space-flappy-canvas\"><\/canvas>\r\n        \r\n        <div class=\"space-flappy-score\">0<\/div>\r\n        \r\n        <div class=\"space-flappy-start-screen\">\r\n            <h1 style=\"font-weight:700; color: #FFF\">ShuxYaan<\/h1>\r\n            <p>Glide through the asteroid field<\/p>\r\n            <div class=\"mobile-instructions\">Tap to ascend<\/div>\r\n            <div class=\"desktop-instructions\">Press SPACE or CLICK to ascend<\/div>\r\n            <button class=\"space-flappy-btn start-btn\">BEGIN MISSION<\/button>\r\n        <\/div>\r\n        \r\n        <div class=\"space-flappy-game-over-screen\">\r\n            <h1 style=\"font-weight:700; color: #FFF\">MISSION FAILED<\/h1>\r\n            <p>Your Score: <span class=\"final-score\">0<\/span><\/p>\r\n            <p class=\"high-score\">High Score: <span class=\"high-score-value\">0<\/span><\/p>\r\n            <button class=\"space-flappy-btn restart-btn\">RETRY<\/button>\r\n            <div class=\"share-buttons\">\r\n                <button class=\"space-flappy-btn share-btn whatsapp-share\">WhatsApp<\/button>\r\n                <button class=\"space-flappy-btn share-btn fb-share\">Facebook<\/button>\r\n                <button class=\"space-flappy-btn share-btn sms-share\">SMS<\/button>\r\n                <button class=\"space-flappy-btn share-btn generic-share\">More Options<\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n    .space-flappy-container {\r\n        position: relative;\r\n        width: 100%;\r\n        max-width: 360px;\r\n        margin: 0 auto;\r\n        aspect-ratio: 9\/16;\r\n    }\r\n    \r\n    .space-flappy-game {\r\n        position: relative;\r\n        width: 100%;\r\n        height: 100%;\r\n        background-color: #0a0a1a;\r\n        overflow: hidden;\r\n        border: 2px solid #2a2a4a;\r\n        box-sizing: border-box;\r\n    }\r\n    \r\n    .space-flappy-canvas {\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n    }\r\n    \r\n    .space-flappy-start-screen,\r\n    .space-flappy-game-over-screen {\r\n        position: absolute;\r\n        width: 100%;\r\n        height: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        background-color: rgba(10, 10, 26, 0.9);\r\n        color: white;\r\n        text-align: center;\r\n        z-index: 10;\r\n        padding: 20px;\r\n        box-sizing: border-box;\r\n    }\r\n    \r\n    .space-flappy-game-over-screen {\r\n        display: none;\r\n    }\r\n    \r\n    .space-flappy-btn {\r\n        margin-top: 20px;\r\n        padding: 12px 24px;\r\n        background: #2a2a4a;\r\n        color: white;\r\n        border: 2px solid #4a4a8a;\r\n        border-radius: 4px;\r\n        font-size: 16px;\r\n        cursor: pointer;\r\n        transition: all 0.2s;\r\n    }\r\n    \r\n    .space-flappy-btn:hover {\r\n        background: #3a3a5a;\r\n        border-color: #5a5a9a;\r\n    }\r\n    \r\n    .space-flappy-btn:active {\r\n        transform: translateY(1px);\r\n    }\r\n    \r\n    .space-flappy-game h1 {\r\n        color: #4a8aff;\r\n        margin-bottom: 10px;\r\n        font-size: clamp(24px, 6vw, 32px);\r\n        font-weight: normal;\r\n    }\r\n    \r\n    .space-flappy-score {\r\n        position: absolute;\r\n        top: 20px;\r\n        width: 100%;\r\n        text-align: center;\r\n        color: white;\r\n        font-size: clamp(18px, 5vw, 24px);\r\n        font-weight: normal;\r\n        z-index: 5;\r\n    }\r\n    \r\n    .share-buttons {\r\n        display: flex;\r\n        gap: 10px;\r\n        margin-top: 20px;\r\n        flex-wrap: wrap;\r\n        justify-content: center;\r\n    }\r\n    \r\n    .share-btn {\r\n        padding: 8px 16px;\r\n        font-size: 14px;\r\n        border-radius: 4px;\r\n        min-width: 80px;\r\n    }\r\n    \r\n    .instructions {\r\n        margin-top: 30px;\r\n        font-size: 14px;\r\n        color: #8a8aaa;\r\n    }\r\n    \r\n    .desktop-instructions {\r\n        display: none;\r\n    }\r\n    \r\n    @media (hover: hover) {\r\n        .mobile-instructions {\r\n            display: none;\r\n        }\r\n        .desktop-instructions {\r\n            display: block;\r\n        }\r\n    }\r\n    \r\n    .high-score {\r\n        margin-top: 10px;\r\n        font-size: clamp(16px, 4vw, 18px);\r\n        color: #ffcc00;\r\n    }\r\n    \r\n    .space-flappy-game p {\r\n        color: #8a8aaa;\r\n        max-width: 80%;\r\n        line-height: 1.4;\r\n        font-size: clamp(12px, 3vw, 14px);\r\n    }\r\n<\/style>\r\n\r\n<script>\r\n(function() {\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        \/\/ Game container elements\r\n        const container = document.querySelector('.space-flappy-container');\r\n        const gameDiv = document.querySelector('.space-flappy-game');\r\n        const canvas = document.querySelector('.space-flappy-canvas');\r\n        const ctx = canvas.getContext('2d');\r\n        const startScreen = document.querySelector('.space-flappy-start-screen');\r\n        const gameOverScreen = document.querySelector('.space-flappy-game-over-screen');\r\n        const startBtn = document.querySelector('.start-btn');\r\n        const restartBtn = document.querySelector('.restart-btn');\r\n        const scoreDisplay = document.querySelector('.space-flappy-score');\r\n        const finalScoreDisplay = document.querySelector('.final-score');\r\n        const highScoreDisplay = document.querySelector('.high-score-value');\r\n        const whatsappBtn = document.querySelector('.whatsapp-share');\r\n        const facebookBtn = document.querySelector('.fb-share');\r\n        const smsBtn = document.querySelector('.sms-share');\r\n        const genericBtn = document.querySelector('.generic-share');\r\n        \r\n        \/\/ Current page URL for sharing\r\n        const currentPageUrl = window.location.href;\r\n        \r\n        \/\/ Set canvas size based on container\r\n        function resizeCanvas() {\r\n            const rect = gameDiv.getBoundingClientRect();\r\n            canvas.width = rect.width;\r\n            canvas.height = rect.height;\r\n        }\r\n        \r\n        \/\/ Game state\r\n        let gameRunning = false;\r\n        let score = 0;\r\n        let highScore = localStorage.getItem('spaceFlappyHighScore') || 0;\r\n        let speed = 1.5;\r\n        let gravity = 0.3;\r\n        let difficultyInterval = 10;\r\n        let lastFrameTime = 0;\r\n        let debrisSpawnTimer = 0;\r\n        let starSpawnTimer = 0;\r\n        let keys = {};\r\n        \r\n        \/\/ Colors\r\n        const colors = {\r\n            bg: '#0a0a1a',\r\n            player: '#4a8aff',\r\n            debris: '#4a4a8a',\r\n            star: '#ffcc00',\r\n            text: '#ffffff',\r\n            secondaryText: '#8a8aaa'\r\n        };\r\n        \r\n        \/\/ Astronaut image\r\n        const astronautImg = new Image();\r\n        let isImageLoaded = false;\r\n        astronautImg.onload = function() {\r\n            isImageLoaded = true;\r\n        };\r\n        astronautImg.src = 'https:\/\/cmseducation.org\/shux\/wp-content\/uploads\/sites\/41\/2025\/04\/shuxyaan.png';\r\n        \r\n        \/\/ Astronaut (player)\r\n        let astronaut = {\r\n            x: 0,\r\n            y: 0,\r\n            width: 0,\r\n            height: 0,\r\n            velocity: 0,\r\n            jump: -8,\r\n            rotation: 0\r\n        };\r\n        \r\n        \/\/ Space debris (obstacles)\r\n        let debris = {\r\n            width: 0,\r\n            minGap: 0,\r\n            maxGap: 0,\r\n            gap: 0,\r\n            list: [],\r\n            minDistance: 0\r\n        };\r\n        \r\n        \/\/ Stars (bonuses)\r\n        let stars = {\r\n            width: 0,\r\n            height: 0,\r\n            list: []\r\n        };\r\n        \r\n        \/\/ Background stars\r\n        let bgStars = [];\r\n        \r\n        \/\/ Initialize game dimensions\r\n        function initGameDimensions() {\r\n            const baseWidth = 360;\r\n            const scale = canvas.width \/ baseWidth;\r\n            \r\n            astronaut = {\r\n                x: 80 * scale,\r\n                y: canvas.height \/ 2,\r\n                width: 50 * scale,  \/\/ Slightly larger for your astronaut image\r\n                height: 50 * scale, \/\/ Slightly larger for your astronaut image\r\n                velocity: 0,\r\n                jump: -8 * scale,\r\n                rotation: 0\r\n            };\r\n            \r\n            debris = {\r\n                width: 50 * scale,\r\n                minGap: 180 * scale,\r\n                maxGap: 220 * scale,\r\n                gap: 180 * scale,\r\n                list: [],\r\n                minDistance: 250 * scale\r\n            };\r\n            \r\n            stars = {\r\n                width: 20 * scale,\r\n                height: 20 * scale,\r\n                list: []\r\n            };\r\n            \r\n            \/\/ Create background stars\r\n            bgStars = Array.from({ length: 100 }, () => ({\r\n                x: Math.random() * canvas.width,\r\n                y: Math.random() * canvas.height,\r\n                size: (Math.random() * 1.5 + 0.5) * scale,\r\n                speed: (Math.random() * 0.3 + 0.1) * scale\r\n            }));\r\n        }\r\n        \r\n        \/\/ Share functions\r\n        function shareOnWhatsApp() {\r\n            const message = `\ud83d\ude80 I scored ${score} in ShuxYaan! Can you beat my high score? Play now: ${currentPageUrl}`;\r\n            window.open(`https:\/\/wa.me\/?text=${encodeURIComponent(message)}`);\r\n        }\r\n        \r\n        function shareOnFacebook() {\r\n            window.open(`https:\/\/www.facebook.com\/sharer\/sharer.php?u=${encodeURIComponent(currentPageUrl)}&quote=${encodeURIComponent(`I scored ${score} in ShuxYaan!`)}`);\r\n        }\r\n        \r\n        function shareViaSMS() {\r\n            const message = `I scored ${score} in ShuxYaan! Can you beat it? Play here: ${currentPageUrl}`;\r\n            window.open(`sms:?body=${encodeURIComponent(message)}`);\r\n        }\r\n        \r\n        function genericShare() {\r\n            if (navigator.share) {\r\n                navigator.share({\r\n                    title: 'ShuxYaan',\r\n                    text: `I scored ${score}! Can you beat it?`,\r\n                    url: currentPageUrl\r\n                }).catch(err => console.log('Error sharing:', err));\r\n            } else {\r\n                \/\/ Fallback for desktop\r\n                const shareText = `I scored ${score} in ShuxYaan! Can you beat my high score? ${currentPageUrl}`;\r\n                if (navigator.clipboard) {\r\n                    navigator.clipboard.writeText(shareText).then(() => {\r\n                        alert('Copied to clipboard! Share it anywhere.');\r\n                    });\r\n                } else {\r\n                    prompt('Copy this message to share:', shareText);\r\n                }\r\n            }\r\n        }\r\n        \r\n        \/\/ Event listeners\r\n        startBtn.addEventListener('click', startGame);\r\n        restartBtn.addEventListener('click', startGame);\r\n        whatsappBtn.addEventListener('click', shareOnWhatsApp);\r\n        facebookBtn.addEventListener('click', shareOnFacebook);\r\n        smsBtn.addEventListener('click', shareViaSMS);\r\n        genericBtn.addEventListener('click', genericShare);\r\n        \r\n        document.addEventListener('keydown', (e) => {\r\n            keys[e.code] = true;\r\n            if (gameRunning && (e.code === 'Space' || e.code === 'ArrowUp')) {\r\n                e.preventDefault();\r\n                astronaut.velocity = astronaut.jump;\r\n            }\r\n        });\r\n        \r\n        document.addEventListener('keyup', (e) => {\r\n            keys[e.code] = false;\r\n        });\r\n        \r\n        canvas.addEventListener('click', () => {\r\n            if (gameRunning) {\r\n                astronaut.velocity = astronaut.jump;\r\n            }\r\n        });\r\n        \r\n        canvas.addEventListener('touchstart', (e) => {\r\n            e.preventDefault();\r\n            if (gameRunning) {\r\n                astronaut.velocity = astronaut.jump;\r\n            }\r\n        });\r\n        \r\n        \/\/ Start game function\r\n        function startGame() {\r\n            resizeCanvas();\r\n            initGameDimensions();\r\n            \r\n            gameRunning = true;\r\n            score = 0;\r\n            speed = 1.5 * (canvas.width \/ 360);\r\n            debris.gap = debris.minGap;\r\n            astronaut.y = canvas.height \/ 2;\r\n            astronaut.velocity = 0;\r\n            astronaut.rotation = 0;\r\n            debris.list = [];\r\n            stars.list = [];\r\n            debrisSpawnTimer = 0;\r\n            starSpawnTimer = 0;\r\n            \r\n            startScreen.style.display = 'none';\r\n            gameOverScreen.style.display = 'none';\r\n            scoreDisplay.textContent = '0';\r\n            highScoreDisplay.textContent = highScore;\r\n            \r\n            lastFrameTime = performance.now();\r\n            requestAnimationFrame(gameLoop);\r\n        }\r\n        \r\n        \/\/ Game over function\r\n        function gameOver() {\r\n            gameRunning = false;\r\n            finalScoreDisplay.textContent = score;\r\n            \r\n            if (score > highScore) {\r\n                highScore = score;\r\n                localStorage.setItem('spaceFlappyHighScore', highScore);\r\n                highScoreDisplay.textContent = highScore;\r\n            }\r\n            \r\n            gameOverScreen.style.display = 'flex';\r\n        }\r\n        \r\n        \/\/ Create new debris\r\n        function createDebris() {\r\n            const minHeight = 80 * (canvas.width \/ 360);\r\n            const maxHeight = canvas.height - debris.gap - minHeight;\r\n            const height = Math.floor(Math.random() * (maxHeight - minHeight + 1) + minHeight);\r\n            \r\n            debris.list.push({\r\n                x: canvas.width,\r\n                height: height,\r\n                passed: false\r\n            });\r\n        }\r\n        \r\n        \/\/ Create new star bonus\r\n        function createStar() {\r\n            if (debris.list.length > 0 && Math.random() < 0.5) {\r\n                const lastDebris = debris.list[debris.list.length - 1];\r\n                stars.list.push({\r\n                    x: lastDebris.x + debris.width \/ 2 - stars.width \/ 2,\r\n                    y: lastDebris.height + debris.gap \/ 2 - stars.height \/ 2,\r\n                    collected: false,\r\n                    pulse: 0\r\n                });\r\n            }\r\n        }\r\n        \r\n        \/\/ Check collision between astronaut and rectangle\r\n        function checkCollision(astronaut, rectX, rectY, rectWidth, rectHeight) {\r\n            return astronaut.x < rectX + rectWidth &&\r\n                   astronaut.x + astronaut.width > rectX &&\r\n                   astronaut.y < rectY + rectHeight &&\r\n                   astronaut.y + astronaut.height > rectY;\r\n        }\r\n        \r\n        \/\/ Update game state\r\n        function update(deltaTime) {\r\n            if (!gameRunning) return;\r\n            \r\n            \/\/ Update astronaut\r\n            astronaut.velocity += gravity;\r\n            astronaut.y += astronaut.velocity;\r\n            \r\n            \/\/ Rotate astronaut based on velocity\r\n            astronaut.rotation = Math.max(-25, Math.min(25, astronaut.velocity * 3));\r\n            \r\n            \/\/ Check if astronaut hits top or bottom\r\n            if (astronaut.y < 0) {\r\n                astronaut.y = 0;\r\n                astronaut.velocity = 0;\r\n            } else if (astronaut.y + astronaut.height > canvas.height) {\r\n                gameOver();\r\n                return;\r\n            }\r\n            \r\n            \/\/ Update debris\r\n            debrisSpawnTimer += deltaTime;\r\n            if (debrisSpawnTimer > 2000) {\r\n                debrisSpawnTimer = 0;\r\n                createDebris();\r\n                createStar();\r\n            }\r\n            \r\n            \/\/ Move and check debris\r\n            for (let i = 0; i < debris.list.length; i++) {\r\n                const d = debris.list[i];\r\n                d.x -= speed;\r\n                \r\n                \/\/ Check collision with top debris\r\n                if (checkCollision(astronaut, d.x, 0, debris.width, d.height)) {\r\n                    gameOver();\r\n                    return;\r\n                }\r\n                \r\n                \/\/ Check collision with bottom debris\r\n                if (checkCollision(astronaut, d.x, d.height + debris.gap, debris.width, canvas.height - d.height - debris.gap)) {\r\n                    gameOver();\r\n                    return;\r\n                }\r\n                \r\n                \/\/ Check if passed debris\r\n                if (!d.passed && astronaut.x > d.x + debris.width) {\r\n                    d.passed = true;\r\n                    score++;\r\n                    scoreDisplay.textContent = score;\r\n                    \r\n                    \/\/ Gradually increase difficulty\r\n                    if (score % difficultyInterval === 0) {\r\n                        speed += 0.1 * (canvas.width \/ 360);\r\n                        debris.gap = Math.max(debris.minGap, debris.maxGap - Math.floor(score\/10) * 5 * (canvas.width \/ 360));\r\n                    }\r\n                }\r\n            }\r\n            \r\n            \/\/ Remove off-screen debris\r\n            debris.list = debris.list.filter(d => d.x + debris.width > 0);\r\n            \r\n            \/\/ Update stars\r\n            for (let i = 0; i < stars.list.length; i++) {\r\n                const s = stars.list[i];\r\n                s.x -= speed;\r\n                s.pulse = (s.pulse + deltaTime * 0.01) % (Math.PI * 2);\r\n                \r\n                \/\/ Check collision with star\r\n                if (!s.collected && checkCollision(astronaut, s.x, s.y, stars.width, stars.height)) {\r\n                    s.collected = true;\r\n                    score += 2;\r\n                    scoreDisplay.textContent = score;\r\n                    speed = Math.max(1.5 * (canvas.width \/ 360), speed - 0.3 * (canvas.width \/ 360));\r\n                }\r\n            }\r\n            \r\n            \/\/ Remove off-screen or collected stars\r\n            stars.list = stars.list.filter(s => s.x + stars.width > 0 && !s.collected);\r\n        }\r\n        \r\n        \/\/ Draw game elements\r\n        function draw() {\r\n            \/\/ Clear canvas with dark space color\r\n            ctx.fillStyle = colors.bg;\r\n            ctx.fillRect(0, 0, canvas.width, canvas.height);\r\n            \r\n            \/\/ Draw background stars\r\n            ctx.fillStyle = colors.secondaryText;\r\n            bgStars.forEach(star => {\r\n                ctx.beginPath();\r\n                ctx.arc(star.x, star.y, star.size, 0, Math.PI * 2);\r\n                ctx.fill();\r\n                \r\n                \/\/ Move stars\r\n                star.x -= star.speed;\r\n                if (star.x < 0) {\r\n                    star.x = canvas.width;\r\n                    star.y = Math.random() * canvas.height;\r\n                }\r\n            });\r\n            \r\n            \/\/ Draw debris (simple rectangles)\r\n            ctx.fillStyle = colors.debris;\r\n            for (const d of debris.list) {\r\n                \/\/ Top debris\r\n                ctx.fillRect(d.x, 0, debris.width, d.height);\r\n                \/\/ Bottom debris\r\n                ctx.fillRect(d.x, d.height + debris.gap, debris.width, canvas.height - d.height - debris.gap);\r\n            }\r\n            \r\n            \/\/ Draw stars\r\n            ctx.fillStyle = colors.star;\r\n            for (const s of stars.list) {\r\n                if (!s.collected) {\r\n                    const pulseSize = stars.width * (1 + Math.sin(s.pulse) * 0.1);\r\n                    ctx.beginPath();\r\n                    ctx.arc(s.x + stars.width\/2, s.y + stars.height\/2, pulseSize\/2, 0, Math.PI * 2);\r\n                    ctx.fill();\r\n                }\r\n            }\r\n            \r\n            \/\/ Draw astronaut image or fallback\r\n            ctx.save();\r\n            ctx.translate(astronaut.x + astronaut.width\/2, astronaut.y + astronaut.height\/2);\r\n            ctx.rotate(astronaut.rotation * Math.PI \/ 180);\r\n            \r\n            if (isImageLoaded) {\r\n                ctx.drawImage(\r\n                    astronautImg, \r\n                    -astronaut.width\/2, \r\n                    -astronaut.height\/2, \r\n                    astronaut.width, \r\n                    astronaut.height\r\n                );\r\n            } else {\r\n                \/\/ Fallback triangle\r\n                ctx.fillStyle = colors.player;\r\n                ctx.beginPath();\r\n                ctx.moveTo(0, -astronaut.height\/2);\r\n                ctx.lineTo(astronaut.width\/2, astronaut.height\/2);\r\n                ctx.lineTo(-astronaut.width\/2, astronaut.height\/2);\r\n                ctx.closePath();\r\n                ctx.fill();\r\n                \r\n                \/\/ Visor effect\r\n                ctx.fillStyle = 'rgba(200, 240, 255, 0.3)';\r\n                ctx.beginPath();\r\n                ctx.arc(0, 0, astronaut.width\/3, 0, Math.PI * 2);\r\n                ctx.fill();\r\n            }\r\n            ctx.restore();\r\n        }\r\n        \r\n        \/\/ Main game loop with delta time\r\n        function gameLoop(timestamp) {\r\n            if (!lastFrameTime) lastFrameTime = timestamp;\r\n            const deltaTime = timestamp - lastFrameTime;\r\n            lastFrameTime = timestamp;\r\n            \r\n            update(deltaTime);\r\n            draw();\r\n            \r\n            if (gameRunning) {\r\n                requestAnimationFrame(gameLoop);\r\n            }\r\n        }\r\n        \r\n        \/\/ Initialize on window load\r\n        window.addEventListener('load', function() {\r\n            resizeCanvas();\r\n            initGameDimensions();\r\n            highScoreDisplay.textContent = highScore;\r\n            \r\n            \/\/ Handle Elementor resize events\r\n            if (typeof jQuery !== 'undefined') {\r\n                jQuery(window).on('elementor\/resize', resizeCanvas);\r\n            }\r\n            \r\n            \/\/ Regular resize handler\r\n            window.addEventListener('resize', function() {\r\n                if (!gameRunning) {\r\n                    resizeCanvas();\r\n                    initGameDimensions();\r\n                }\r\n            });\r\n        });\r\n    });\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-bf25b8d elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"bf25b8d\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t\t<div class=\"elementor-background-overlay\"><\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-fd6c3e9\" data-id=\"fd6c3e9\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-b4eb7be elementor-widget elementor-widget-heading\" data-id=\"b4eb7be\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Submit Your Score<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7eda8ae elementor-widget elementor-widget-shortcode\" data-id=\"7eda8ae\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><div class=\"forminator-ui forminator-custom-form forminator-custom-form-436 forminator-design--material  forminator_ajax\" data-forminator-render=\"0\" data-form=\"forminator-module-436\" data-uid=\"69d94f0dde999\"><br\/><\/div><form\r\n\t\t\t\tid=\"forminator-module-436\"\r\n\t\t\t\tclass=\"forminator-ui forminator-custom-form forminator-custom-form-436 forminator-design--material  forminator_ajax\"\r\n\t\t\t\tmethod=\"post\"\r\n\t\t\t\tdata-forminator-render=\"0\"\r\n\t\t\t\tdata-form-id=\"436\"\r\n\t\t\t\t\r\n\t\t\t\tdata-design=\"material\"\r\n\t\t\t\tdata-color-option=\"theme\"\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\tdata-grid=\"open\"\r\n\t\t\t\t\r\n\t\t\t\t\r\n\t\t\t\tstyle=\"display: none;\"\r\n\t\t\t\t\r\n\t\t\t\tdata-uid=\"69d94f0dde999\"\r\n\t\t\t><div role=\"alert\" aria-live=\"polite\" class=\"forminator-response-message forminator-error\" aria-hidden=\"true\"><\/div><div class=\"forminator-row\"><div id=\"name-1\" class=\"forminator-field-name forminator-col forminator-col-12 \"><div class=\"forminator-field\"><label for=\"forminator-field-name-1_69d94f0dde999\" id=\"forminator-field-name-1_69d94f0dde999-label\" class=\"forminator-label\">Name <span class=\"forminator-required\">*<\/span><\/label><input type=\"text\" name=\"name-1\" value=\"\" placeholder=\"E.g. John Doe\" id=\"forminator-field-name-1_69d94f0dde999\" class=\"forminator-input forminator-name--field\" aria-required=\"true\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"phone-1\" class=\"forminator-field-phone forminator-col forminator-col-6 \"><div class=\"forminator-field\"><label for=\"forminator-field-phone-1_69d94f0dde999\" id=\"forminator-field-phone-1_69d94f0dde999-label\" class=\"forminator-label\">Phone <span class=\"forminator-required\">*<\/span><\/label><input type=\"text\" name=\"phone-1\" value=\"\" placeholder=\"E.g. +1 300 400 5000\" id=\"forminator-field-phone-1_69d94f0dde999\" class=\"forminator-input forminator-field--phone\" data-required=\"1\" aria-required=\"true\" autocomplete=\"off\" \/><\/div><\/div><div id=\"email-1\" class=\"forminator-field-email forminator-col forminator-col-6 \"><div class=\"forminator-field\"><label for=\"forminator-field-email-1_69d94f0dde999\" id=\"forminator-field-email-1_69d94f0dde999-label\" class=\"forminator-label\">Email Address<\/label><input type=\"email\" name=\"email-1\" value=\"\" placeholder=\"E.g. john@doe.com\" id=\"forminator-field-email-1_69d94f0dde999\" class=\"forminator-input forminator-email--field\" data-required=\"\" aria-required=\"false\" \/><\/div><\/div><\/div><div class=\"forminator-row\"><div id=\"number-1\" class=\"forminator-field-number forminator-col forminator-col-6 \"><div class=\"forminator-field\"><label for=\"forminator-field-number-1_69d94f0dde999\" id=\"forminator-field-number-1_69d94f0dde999-label\" class=\"forminator-label\">My score<\/label><input name=\"number-1\" value=\"\" placeholder=\"E.g. 100\" id=\"forminator-field-number-1_69d94f0dde999\" class=\"forminator-input forminator-number--field\" inputmode=\"decimal\" data-required=\"\" data-decimals=\"0\" aria-required=\"false\" data-inputmask=\"&#039;groupSeparator&#039;: &#039;&#039;, &#039;radixPoint&#039;: &#039;&#039;, &#039;digits&#039;: &#039;0&#039;\" data-hidden-behavior=\"zero\" type=\"number\" step=\"any\" min=\"1\" max=\"150\" \/><\/div><\/div><div id=\"text-1\" class=\"forminator-field-text forminator-col forminator-col-6 \"><div class=\"forminator-field\"><label for=\"forminator-field-text-1_69d94f0dde999\" id=\"forminator-field-text-1_69d94f0dde999-label\" class=\"forminator-label\">Enter link for your screenshot<\/label><input type=\"text\" name=\"text-1\" value=\"\" placeholder=\"Save Screenshot in G-Drive or post on Social media and share the link here\" id=\"forminator-field-text-1_69d94f0dde999\" class=\"forminator-input forminator-name--field\" data-required=\"\" \/><\/div><\/div><\/div><input type=\"hidden\" name=\"referer_url\" value=\"\" \/><div class=\"forminator-row forminator-row-last\"><div class=\"forminator-col\"><div class=\"forminator-field\"><button class=\"forminator-button forminator-button-submit\"><span>Submit my entry<\/span><span aria-hidden=\"true\"><\/span><\/button><\/div><\/div><\/div><input type=\"hidden\" id=\"forminator_nonce\" name=\"forminator_nonce\" value=\"e97acbb242\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/shux\/wp-json\/wp\/v2\/pages\/226\" \/><input type=\"hidden\" name=\"form_id\" value=\"436\"><input type=\"hidden\" name=\"page_id\" value=\"226\"><input type=\"hidden\" name=\"form_type\" value=\"default\"><input type=\"hidden\" name=\"current_url\" value=\"https:\/\/cmseducation.org\/shux\/shuxyaan\/\"><input type=\"hidden\" name=\"render_id\" value=\"0\"><input type=\"hidden\" name=\"action\" value=\"forminator_submit_form_custom-forms\"><\/form><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>ShuXYaan 0 ShuxYaan Glide through the asteroid field Tap to ascend Press SPACE or CLICK to ascend BEGIN MISSION MISSION [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-226","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>ShuxYaan - Shux<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cmseducation.org\/shux\/shuxyaan\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"ShuxYaan - Shux\" \/>\n<meta property=\"og:description\" content=\"ShuXYaan 0 ShuxYaan Glide through the asteroid field Tap to ascend Press SPACE or CLICK to ascend BEGIN MISSION MISSION [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cmseducation.org\/shux\/shuxyaan\/\" \/>\n<meta property=\"og:site_name\" content=\"Shux\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-26T06:15:42+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/shuxyaan\\\/\",\"url\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/shuxyaan\\\/\",\"name\":\"ShuxYaan - Shux\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#website\"},\"datePublished\":\"2025-04-13T06:46:16+00:00\",\"dateModified\":\"2025-04-26T06:15:42+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/shuxyaan\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/cmseducation.org\\\/shux\\\/shuxyaan\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/shuxyaan\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"ShuxYaan\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#website\",\"url\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/\",\"name\":\"Shux\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#organization\",\"name\":\"Shux\",\"url\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/wp-content\\\/uploads\\\/sites\\\/41\\\/2025\\\/08\\\/top-logo.webp\",\"contentUrl\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/wp-content\\\/uploads\\\/sites\\\/41\\\/2025\\\/08\\\/top-logo.webp\",\"width\":363,\"height\":107,\"caption\":\"Shux\"},\"image\":{\"@id\":\"https:\\\/\\\/cmseducation.org\\\/shux\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"ShuxYaan - Shux","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cmseducation.org\/shux\/shuxyaan\/","og_locale":"en_US","og_type":"article","og_title":"ShuxYaan - Shux","og_description":"ShuXYaan 0 ShuxYaan Glide through the asteroid field Tap to ascend Press SPACE or CLICK to ascend BEGIN MISSION MISSION [&hellip;]","og_url":"https:\/\/cmseducation.org\/shux\/shuxyaan\/","og_site_name":"Shux","article_modified_time":"2025-04-26T06:15:42+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/cmseducation.org\/shux\/shuxyaan\/","url":"https:\/\/cmseducation.org\/shux\/shuxyaan\/","name":"ShuxYaan - Shux","isPartOf":{"@id":"https:\/\/cmseducation.org\/shux\/#website"},"datePublished":"2025-04-13T06:46:16+00:00","dateModified":"2025-04-26T06:15:42+00:00","breadcrumb":{"@id":"https:\/\/cmseducation.org\/shux\/shuxyaan\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cmseducation.org\/shux\/shuxyaan\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/cmseducation.org\/shux\/shuxyaan\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cmseducation.org\/shux\/"},{"@type":"ListItem","position":2,"name":"ShuxYaan"}]},{"@type":"WebSite","@id":"https:\/\/cmseducation.org\/shux\/#website","url":"https:\/\/cmseducation.org\/shux\/","name":"Shux","description":"","publisher":{"@id":"https:\/\/cmseducation.org\/shux\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cmseducation.org\/shux\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cmseducation.org\/shux\/#organization","name":"Shux","url":"https:\/\/cmseducation.org\/shux\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cmseducation.org\/shux\/#\/schema\/logo\/image\/","url":"https:\/\/cmseducation.org\/shux\/wp-content\/uploads\/sites\/41\/2025\/08\/top-logo.webp","contentUrl":"https:\/\/cmseducation.org\/shux\/wp-content\/uploads\/sites\/41\/2025\/08\/top-logo.webp","width":363,"height":107,"caption":"Shux"},"image":{"@id":"https:\/\/cmseducation.org\/shux\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/pages\/226","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/comments?post=226"}],"version-history":[{"count":48,"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/pages\/226\/revisions"}],"predecessor-version":[{"id":446,"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/pages\/226\/revisions\/446"}],"wp:attachment":[{"href":"https:\/\/cmseducation.org\/shux\/wp-json\/wp\/v2\/media?parent=226"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}