Minichan

Topic: having some database issues?

Anonymous A started this discussion 2 years ago #110,700

@1,231,327
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
        body,
        html {
            margin: 0;
            padding: 0;
            width: 100vw;
            height: 100vh;
            overflow: hidden;
            background-color: #000;

        }

        game-window {
            position: absolute;
            width: 100vw;
            height: 100vh;
            margin: 0;
            left: 0px;
            top: 0px;
        }

        .game-container {
            position: absolute;
        }

        @keyframes blink {

            0%,
            100% {
                opacity: 1;
            }

            50% {
                opacity: 0;
            }
        }

        .lights {
            animation: blink 2s linear infinite;
        }

        svg {
            position: absolute;
            z-index: 2;
        }


canvas {
            position: absolute;
            border: 4vh inset #a9a9a9;
            border-radius: 25vh;
            height: 90vh;
            width: 60vw;
            top: 1vh;
            left: 1vw;
            bottom: 0vh;
            z-index: 3;
            margin: 0 auto;
        }


.HUD {
            position: absolute;
            padding: 0;
            margin: 0 auto;
            top: 1vh;
            right: 1vw;
            z-index: 3;
            border: 4vh ridge #a9a9a9;
            border-radius: 30vh;
            background: #000000;
            width: 26vw;
            height: 44vh;
            overflow: hidden;
        }

        .radar {
            position: absolute;
            margin: 0 auto;
            height: 44vh;
            width: 26vw;
            background-image: conic-gradient(#000000, #39ff14);
            animation: radar linear infinite 10s;
        }

        @keyframes radar {
            from {
                transform: rotate(0deg);
            }

            to {
                transform: rotate(360deg);
            }

        }

        .RocketFlame { 
        animation: RocketFlame 1ms linear 0s infinite normal none;
        }

        @keyframes RocketFlame {
	0%,
	100% {
		transform: rotate(0deg);
		transform-origin: 50% 0;
	}

	10% {
		transform: rotate(2deg);
	}

	20%,
	40%,
	60% {
		transform: rotate(-4deg);
	}

	30%,
	50%,
	70% {
		transform: rotate(4deg);
	}

	80% {
		transform: rotate(-2deg);
	}

	90% {
		transform: rotate(2deg);
	}
}

.Rocketboost {
    animation: Rocketboost 1ms linear 0s infinite normal none;
}

@keyframes Rocketboost {
	0% {
		animation-timing-function: 3s ease-in;
		opacity: 1;
		transform: translateY(-45px);
	}

	24% {
		opacity: 1;
	}

	40% {
		animation-timing-function: ease-in;
		transform: translateY(-24px);
	}

	65% {
		animation-timing-function: ease-in;
		transform: translateY(-12px);
	}

	82% {
		animation-timing-function: ease-in;
		transform: translateY(-6px);
	}

	93% {
		animation-timing-function: ease-in;
		transform: translateY(-4px);
	}

	25%,
	55%,
	75%,
	87% {
		animation-timing-function: ease-out;
		transform: translateY(0px);
	}

	100% {
		animation-timing-function: ease-out;
		opacity: 1;
		transform: translateY(0px);
	}
}

.eye {
    animation: eye 3s linear 6s infinite alternate-reverse forwards;}

@keyframes eye {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotate(5deg);
	}
}


.Dashboard {
            position: absolute;
            margin: 0vh;
            bottom: 1vh;
            right: 1vw;
            z-index: 3;
            border: 2vh inset #a9a9a9;
            border-radius: 10vh;
            width: 28vw;
            height: 40vh;
            padding-left: 0;
        }
    </style>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/SAT.min.js"></script>
</head>

<body>
    <game-window>
        <canvas></canvas>
        <div class="HUD">
            <div class="radar">
                <svg width="28vw" height="44vh" xmlns="http://www.w3.org/2000/svg">
                    <circle cx="13vw" cy="22vh" r="13.375vw" stroke="#49fb35" stroke-width="1vh" fill-opacity="0.33 " />
                </svg>
            </div>
            <svg width="28vw" height="44vh" xmlns="http://www.w3.org/2000/svg">
                <circle cx="13vw" cy="22vh" r="10.4vw" stroke="#49fb35" stroke-width="0.0625vh" fill-opacity="0.33 " />
                <circle cx="13vw" cy="22vh" r="7.8vw" stroke="#49fb35" stroke-width="0.125vh" fill-opacity="0.33 " />
                <circle cx="13vw" cy="22vh" r="5.2vw" stroke="#49fb35" stroke-width="0.0625vh" fill-opacity="0.33 " />
                <circle cx="13vw" cy="22vh" r="2.6vw" stroke="#49fb35" stroke-width="0.125vh" fill-opacity="0.33 " />
                <line x1="13vw" y1="0vh" x2="13vw" y2="44vh" stroke="#49fb35" stroke-width="0.25vh" />
                <line x1="0vw" y1="22vh" x2="28vw" y2="22vh" stroke="#49fb35" stroke-width="0.25vh" />
            </svg>
        </div>


<div class="Dashboard" style="background-color:#494949">
            <svg width="120" height="372" viewBox="0 0 62 372" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g transform="translate(16 32)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>RADAR</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#4a4a"></rect><circle cx="6" cy="6" r="6" transform="translate(11 6)" fill="#33ff00";"></circle></g></g></g><g transform="translate(16 76)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>iDENT</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(11 6)" fill="GREEN"></circle></g></g></g><g transform="translate(16 120)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>GYRO</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#4a4a"></rect><circle cx="6" cy="6" r="6" transform="translate(11 6)" fill="#33ff00"></circle></g></g></g><g transform="translate(16 164)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>VOR</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 208)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>NBD</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#4A4A"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="#33FF00"></circle></g></g></g><g transform="translate(16 252)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>ADi</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 296)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>ASYNC R/T</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 296)">
                </svg>
                <svg width="400" height="372" viewBox="0 0 62 372" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g transform="translate(16 32)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>AUTO</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 76)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>U.BUS</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#4a4a"></rect><circle cx="6" cy="6" r="6" transform="translate(11 6)" fill="#33ff00"></circle></g></g></g><g transform="translate(16 120)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>AUX.BUS</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 164)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>P.E.S.A</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 208)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>(½₀)⊗(₀½)</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#4A4"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="#33FF00"></circle></g></g></g><g transform="translate(16 252)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(55 27)" font-size="24" font-family="Roboto-REGULAR,Roboto" ><tspan x="0" y="0"></tspan>ħ</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 296)">
                <rect width="30" height="44" stroke="none" fill="#494949" opacity="1"></rect><text transform="translate(32 27)" font-size="14" font-family="Roboto-Regular,Roboto" ><tspan x="0" y="0"></tspan>ORTHOG</text><g transform="translate(0 10)"><rect width="24" height="24" opacity="0"></rect><g transform="translate(0 0)"><rect width="24" height="14" rx="7" transform="translate(0 5)" fill="#000"></rect><circle cx="6" cy="6" r="6" transform="translate(1 6)" fill="green"></circle></g></g></g><g transform="translate(16 296)">
                </svg>


</div>        


</game-window>
    <div class="game-container">

        <svg class="asteroid" polygon id="aster21" width="135" height="127"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="19,116 3,47 60,3 129,38 110,121" fill="#636" stroke="#929" stroke-width="6.00" stroke-opacity="1.00"/>     
        </svg>
        <svg class="asteroid" polygon id="aster20" width="85" height="65"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="1,47 60,1 80,45 40,60" fill="#646" stroke="#929" stroke-width="2.00" stroke-opacity="1.00"/>     
        </svg>
        <svg class="asteroid" polygon id="aster19" width="133" height="124"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="19,116 60,4 125,38 110,119" fill="#737" stroke="#929" stroke-width="6.00" stroke-opacity="1.00"/>     
        </svg>   
             <svg class="asteroid" polygon id="aster18" width="95" height="80"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="19,76 5,4 90,60" fill="#838" stroke="#929" stroke-width="3.00" stroke-opacity="1.00"/>     
        </svg>
                <svg class="asteroid" polygon id="aster17" width="113" height="103"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="19,96 4,37 50,4 106,38" fill="#535" stroke="#929" stroke-width="5.00" stroke-opacity="1.00"/>     
        </svg>
                <svg class="asteroid" polygon id="aster16" width="65" height="70"  xmlns="http://www.w3.org/2000/svg">
            <polygon points="19,64 5,27 30,4 59,28 50,61" fill="#404" stroke="#929" stroke-width="7.00" stroke-opacity="1.00"/>     
        </svg>


<svg class="asteroid" polygon id="aster1" width="175" height="190" xmlns="http://www.w3.org/2000/svg">
            <polygon points="20,30 90,10 150,30 165,70 170,137 120,177 30,160 10,90" fill="#333" stroke="#333"
                stroke-width="5" />
            <polygon points="40,40 90,15 135,69 135,90 45,137 120,160 50,160 20,90" fill="#333" stroke="#444"
                stroke-width="15" />
            <polygon points="90,50 90,45 128,45 130,90 145,90 60,110 50,40 90,140" fill="#444" stroke="#444"
                stroke-width="40" />
        </svg>


<svg class="asteroid" polygon id="aster2" width="500" height="200" xmlns="http://www.w3.org/2000/svg"
            visibility="visible">
            <polygon points="30,20 150,10 300,60 410,30 460,45 480,110 445,150 375,180 155,190 25,175 10,80"
                fill="#222" stroke="#222" stroke-width="6" />
            <polygon points="90,30 150,50 310,80 410,65 440,90 405,150 155,165 45,155 30,80 " fill="#333" stroke="#333"
                stroke-width="25" />
            <polygon points="50,50 100,50 110,110 210,95 405,140 355,175 35,175 20,80 " fill="#222" stroke="#222"
                stroke-width="5" />
        </svg>


<svg class="asteroid" polygon id="aster3" width="175" height="190" xmlns="http://www.w3.org/2000/svg"
            visibility="visible">
            <polygon points="20,30 90,10 150,30 165,70 170,137 120,177 30,160 10,90" fill="#222" stroke="#323"
                stroke-width="5" />
            <polygon points="40,40 90,15 135,69 135,90 45,137 120,160 50,160 20,90" fill="#323" stroke="#5235"
                stroke-width="4" />
            <polygon points="90,50 90,45 128,45 130,90 145,90 60,110 50,40 90,140" fill="#323" stroke="#5235"
                stroke-width="40" />
        </svg>


<svg class="asteroid" width="75" height="99" xmlns="http://www.w3.org/2000/svg">
            <polygon points="0,50 25,0 75,25 50,50 25,99" fill="#555" />
        </svg>
        <svg class="asteroid" width="105" height="130" xmlns="http://www.w3.org/2000/svg">
            <polygon points="5,5 75,0 105,60 80,130 0,110" fill="#444" />
        </svg>
        <svg class="asteroid" width="100" height="100" xmlns="http://www.w3.org/2000/svg">
            <polygon points="0,25 50,0 100,50 75,100 25,75" fill="#666" />
        </svg>


<svg id="lander" z-index="3" xmlns="http://www.w3.org/2000/svg" width="70" height="80" viewbox="-15 -5 100 100" overflow="visible" >
            <!-- Flames -->
                <polygon class="Rocketboost" id="leftFlame" points=" 25,60 35,190 45,60 24,90 22,80 21,68 49,68 48,80 46,90" fill="#dce2222c" stroke="#dce222" stroke-width=".1"
                    visibility="hidden" />
                <polygon class="Rocketboost" id="rightFlame" points="35,130 30,90 22,68 35,80 48,68 40,90" fill="#dce2223a" stroke="#dce222bf" stroke-width="0.2"
                    visibility="hidden" />
                <polygon class="RocketFlame" id="rightFlame" points="35,90 22,60 22,108 35,60 48,108 48,50" fill="#dce222" stroke="#dce222" stroke-width="2"
                    visibility="hidden" />
            <!-- engine -->
                <polygon points="22.5,60 21.5,62 20,67 20,70 50,70 50,67 48.5,62 47.5,60 35,36" fill="#404040" />
            <!-- head and anteanna -->
                <line x1="35" y1="23" x2="35" y2="4" stroke="#a9a9a9" stroke-width="1" />
                    <circle class="lights" cx="35" cy="3" r="3.5" fill="#e258223c" stroke="#e258223c" stroke-width="3" />
                    <circle class="lights" cx="35" cy="3" r="1.5" fill="#e258229d" stroke="#e258225c" stroke-width="0.5" />
                <rect x="15" y="23" width="40" height="20" fill="#494949" stroke="#a9a9a9" stroke-width="0.5" />
            <!-- legs -->
                <line x1="15" y1="53" x2="0" y2="73" stroke="#a9a9a9" stroke-width="1.5" />
                <line x1="55" y1="53" x2="70" y2="73" stroke="#a9a9a9" stroke-width="1.5" />
                <line x1="35" y1="53" x2="35" y2="78" stroke="#a9a9a9" stroke-width="1.5" />
            <!-- maneuvering RCS -->
                <polygon id="roll-L" points="2,20 15,23.5 2,27" fill="#ffffff2d" visibility="hidden" />
                <circle id="roll-L" cx="11" cy="23.5" r="3" fill="#ffffff2a" visibility="hidden" />
                <polygon id="roll-BR" points="60,57.5 73,54 73,61" fill="#ffffff2d" visibility="hidden" />
                <circle id="roll-L" cx="64" cy="57.5" r="3" fill="#ffffff2a" visibility="hidden" />
                <polygon id="roll-BL" points="-3,54 10,57.5 -3,61" fill="#ffffff2d" visibility="hidden" />
                <circle id="roll-R" cx="6" cy="57.5" r="3" fill="#ffffff2a" visibility="hidden" />
                <polygon id="roll-TR" points="55,23.5 68,20 68,27" fill="#ffffff2d" visibility="hidden" />
                <circle id="roll-R" cx="59" cy="23.5" r="3" fill="#ffffff2a" visibility="hidden"/>
    
            <!-- body -->
                <rect x="10" y="38" width="50" height="20" fill="#393939" stroke="#a9a9a9" stroke-width="0.5" />
                <rect x="5" y="40" width="10" height="15" fill="#2626" stroke="#a9a9a9" stroke-width="0.5" />
                <rect x="20" y="40" width="10" height="15" fill="#2626" stroke="#a9a9a9" stroke-width="0.5" />
                <rect x="40" y="40" width="10" height="15" fill="#2626" stroke="#a9a9a9" stroke-width="0.5" />
                <rect x="55" y="40" width="10" height="15" fill="#2626" stroke="#a9a9a9" stroke-width="0.5" />
            <!-- eye window -->
                <circle class="eye" cx="34" cy="30.5" r="5.5" fill="black" />
                    <circle  cx="35" cy="30.5" r="7" fill="#49ff397a" />
                        <circle class="eye" cx="35.5" cy="30.5" r="3" fill="#0000003c" />
                        <circle cx="37" cy="28.5" r="1.7" fill="#ffffff4a" />
    
             <!-- maneuvering jets -->
                <circle cx="25" cy="23" r="1.5" fill="#606060" />
                <circle cx="24.4" cy="23" r="1" fill="#0000004d" />
                <circle cx="15" cy="23.5" r="1.5" fill="#606060" />
                <ellipse cx="14.2" cy="23.5" rx="0.6" ry="1" fill="#0000004d" />
                <circle cx="45" cy="23" r="1.5" fill="#606060" />
                <circle cx="45.6" cy="23" r="1" fill="#0000004d" />
                <circle cx="55" cy="23.5" r="1.5" fill="#606060" />
                <ellipse cx="55.8" cy="23.5" rx="0.6" ry="1" fill="#0000004d" />
                <circle cx="20" cy="58" r="1.5" fill="#606060" />
                <circle cx="19.4" cy="58" r="1" fill="#0000004d" />
                <circle cx="10" cy="57.5" r="1.5" fill="#606060" />
                <ellipse cx="9.2" cy="57.5" rx="0.6" ry="1" fill="#0000004d" />
                <circle cx="50" cy="58" r="1.5" fill="#606060" />
                <circle cx="50.6" cy="58" r="1" fill="#0000004d" />
                <circle cx="60" cy="57.5" r="1.5" fill="#606060" />
                <ellipse cx="60.8" cy="57.5" rx="0.6" ry="1" fill="#0000004d" />
            </svg>           </div>


</div>

Anonymous A (OP) double-posted this 2 years ago, 30 seconds later[^] [v] #1,231,335

  <script>
        let lander;
        let thrusting = false;
        let asteroids;
        let rotation = 0;
        let rotationSpeed = 0;
        let posX = 0;
        let posY = 0;
        let velocityX = 0;
        let velocityY = 0;
        const thrustAcceleration = 0.03;
        const rotationAcceleration = 0.3;
        const drag = 0.9;
        const bounceFactor = 0.5;
        const leftFlame = document.getElementById("leftFlame");
        const rightFlame = document.getElementById("rightFlame");


const gravity = 0.1;
        let asteroidData = [];


function updateFlames() {
            if (thrusting > 0) {
                leftFlame.setAttribute("visibility", "visible");
                rightFlame.setAttribute("visibility", "visible");
            } else {
                leftFlame.setAttribute("visibility", "hidden");
                rightFlame.setAttribute("visibility", "hidden");
            }
        }


function positionAsteroids() {
            asteroids = document.querySelectorAll('.asteroid');

            for (const asteroid of asteroids) {
                const x = Math.random() * (window.innerWidth - asteroid.clientWidth);
                const y = Math.random() * (window.innerHeight - asteroid.clientHeight);
                asteroid.style.left = x + 'px';
                asteroid.style.top = y + 'px';
                asteroid.velocityY = Math.random() * 0.5 + 0.1; // Add this line

                asteroidData.push({
                    element: asteroid,
                    posX: x,
                    posY: y,
                    velocityY: 0
                });
            }
        }

        function applyGravity() {
            for (let data of asteroidData) {
                data.velocityY += gravity;
                data.posY += data.velocityY;
                data.element.style.top = data.posY + 'px';
            }
        }


function checkCollision() {
            let landerRect = lander.getBoundingClientRect();
            let landerPolygon = createLanderSATPolygon(landerRect.x, landerRect.y);

            let asteroids = document.querySelectorAll('.asteroid');
            for (let asteroid of asteroids) {
                let asteroidRect = asteroid.getBoundingClientRect();
                let asteroidPolygon = createAsteroidSATPolygon(asteroid, asteroidRect.x, asteroidRect.y);

                if (SAT.testPolygonPolygon(landerPolygon, asteroidPolygon)) {
                    console.log('Collision detected');
                    return true;
                }
            }
            return false;
        }

        function update() {
            // [ ... ] Other updates


applyGravity();

            requestAnimationFrame(update);
        }

        function updateAsteroids() {
            const G = 0.0001; // Gravitational constant

            for (let i = 0; i < asteroids.length; i++) {
                const asteroid1 = asteroids[i];
                let forceX = 0;
                let forceY = 0;

                for (let j = 0; j < asteroids.length; j++) {
                    if (i === j) continue;

                    const asteroid2 = asteroids[j];
                    const x1 = parseFloat(asteroid1.style.left) + asteroid1.clientWidth / 2;
                    const y1 = parseFloat(asteroid1.style.top) + asteroid1.clientHeight / 2;
                    const x2 = parseFloat(asteroid2.style.left) + asteroid2.clientWidth / 2;
                    const y2 = parseFloat(asteroid2.style.top) + asteroid2.clientHeight / 2;

                    const dx = x2 - x1;
                    const dy = y2 - y1;
                    const dist = Math.sqrt(dx * dx + dy * dy);

                    const force = G * (asteroid1.clientWidth * asteroid2.clientWidth) / (dist * dist);
                    const angle = Math.atan2(dy, dx);

                    forceX += force * Math.cos(angle);
                    forceY += force * Math.sin(angle);
                }

                asteroid1.velocityX = (asteroid1.velocityX || 0) + forceX;
                asteroid1.velocityY = (asteroid1.velocityY || 0) + forceY;
                asteroid1.style.left = parseFloat(asteroid1.style.left) + asteroid1.velocityX + 'px';
                asteroid1.style.top = parseFloat(asteroid1.style.top) + asteroid1.velocityY + 'px';
            }
        }


// Function to create an SAT polygon for the lander based on its position
        function createLanderSATPolygon(x, y) {
            let landerPoints = [
                new SAT.Vector(x + 35, y),
                new SAT.Vector(x + 70, y + 80),
                new SAT.Vector(x, y + 80),
            ];
            return new SAT.Polygon(new SAT.Vector(0, 0), landerPoints);
        }


function createAsteroidSATPolygon(asteroid, x, y) {
            let points = asteroid.querySelector('polygon').getAttribute('points');
            let pointArray = points.trim().split(' ');
            let asteroidPoints = pointArray.map((point) => {
                let [pointX, pointY] = point.split(',').map(Number);
                return new SAT.Vector(x + pointX, y + pointY);
            });

            return new SAT.Polygon(new SAT.Vector(0, 0), asteroidPoints);
        }


const asteroidSVG = document.querySelector('.asteroid');

        function handleCollision() {
            velocityX = -velocityX * bounceFactor;
            velocityY = -velocityY * bounceFactor;
        }

        function update() {
            updateFlames();
            if (keys["ArrowLeft"]) {
                rotationSpeed -= rotationAcceleration;
            }
            if (keys["ArrowRight"]) {
                rotationSpeed += rotationAcceleration;
            }
            if (keys[" "]) {
                const angleRad = rotation * Math.PI / 180;
                velocityX += Math.sin(angleRad) * thrustAcceleration;
                velocityY -= Math.cos(angleRad) * thrustAcceleration;
                thrusting = true;
            }

            rotation += rotationSpeed;
            posX += velocityX;
            posY += velocityY;
            lander.style.transform = `translate(${posX}px, ${posY}px) rotate(${rotation}deg)`;
            rotationSpeed *= drag;

            if (checkCollision()) {
                handleCollision();
            }

            const gameContainer = document.querySelector('.game-container');
            const centerX = window.innerWidth / 2.919;
            const centerY = window.innerHeight / 2;
            gameContainer.style.transform = `translate(${centerX - posX - lander.clientWidth / 2}px, ${centerY - posY - lander.clientHeight / 2}px)`;

            updateAsteroids(); // Add this line
            requestAnimationFrame(update);
        }

        let keys = {
            ArrowLeft: false,
            ArrowRight: false,
            " ": false,
        };

        function handleKeyDown(e) {
            keys[e.key] = true;
        }

        function handleKeyUp(e) {
            keys[e.key] = false;
            thrusting = false;
            updateFlames();
        }

        function init() {
            lander = document.getElementById('lander');
            positionAsteroids();
            update();
            window.addEventListener('keydown', handleKeyDown);
            window.addEventListener('keyup', handleKeyUp);
        }

        window.addEventListener('load', init);
    </script>
</body>

</html>[/i]

Anonymous A (OP) triple-posted this 2 years ago, 1 minute later, 1 minute after the original post[^] [v] #1,231,336

(Citing a deleted or non-existent reply.)
try it again, i've updated it. i had added support for mobile devices with tilt controls but it only worked locally because google sites only lets me embed content and java can't listen for handle orientation events through i frames or something. if it still doesn't work then you can just copy this to a file and save it as an html and run it locally. it's all place holder elements and get's all fucky because i'm shit at rudimentary stuff like scaling, and i cut out the half of the code that's throwing errors. the whole thing needs to be rewritten so it has a proper game loop and everything. Chat GPT has a 2048 token context window and i'm well outside of that, so yeah, i've had to stitch it together and actually had to read and figure some stuff out - so while i thought chatGPT knew what it was doing, now that i'm even marginally informed on, and believe me, i'm marginally informed, i can at least understand why this is an example of exactly how not to code anything and i should be embarrassed to show anyone this pile of "functions," i didn't actually write it, all credit goes to Peaches.

which would be so much more functional if i would use the API which has a much, much more robust set of tools to use and isn't exclusively just chat. API gpt-4 is the one that could actually do something like write code in the context of a larger project that can't be one-shot. it doesn't great with anything that it can one-shot. if it takes many, many, many prompts it literally forgets everything it did and it does stuff like change function names and write shole sections of code that are a complete mismatch.

Memory-GPT and Auto-GPT using with automation of agents that are organized and into task handlers - that's what people are using to get results. the chat interface GPT is a toyGPT.

Anonymous B joined in and replied with this 2 years ago, 17 minutes later, 18 minutes after the original post[^] [v] #1,231,340

Fuck off, ban and delete for GPTschtick

Anonymous C joined in and replied with this 2 years ago, 15 minutes later, 33 minutes after the original post[^] [v] #1,231,341

> spaces instead of tabs
fuck chatgpt

Anonymous A (OP) replied with this 2 years ago, 22 minutes later, 56 minutes after the original post[^] [v] #1,231,344

@1,231,340 (B)
cry more faggot. why should your mom clean up your room for you?

Anonymous D joined in and replied with this 2 years ago, 6 minutes later, 1 hour after the original post[^] [v] #1,231,346

@previous (A)
This constant chat gpt stuff is oretty boring

Mattpoot Rospoot Milpoot joined in and replied with this 2 years ago, 14 minutes later, 1 hour after the original post[^] [v] #1,231,349

@previous (D)
Stop shutting every thread yo with your whiny shtick. Thanks.

Anonymous A (OP) replied with this 2 years ago, 2 minutes later, 1 hour after the original post[^] [v] #1,231,350

@1,231,346 (D)
i'm hardly the only one using it. these things are about to be a permanent feature in every aspect of life, and i'd suggest people start getting used to it because it hasn't even blown up yet. people are all still learning how to use them and figuring out how best make it fuck everything. and it will fuck everything. this is essentially facebook, amazon, google, and apple's gangbang baby and if you haven't noticed that youtube has already died from cancer bots then you're clearly not paying attention and you may consider pulling your head out of your ass and stop obsessing over shitposts on your shitpost BBS -i think there's enough room for all of my 17 topics i've posted in total. half of which had nothing to do with chatgpt, btw.

Mattpoot Rospoot Milpoot replied with this 2 years ago, 6 minutes later, 1 hour after the original post[^] [v] #1,231,352

@previous (A)
Why do you insist on bringing this intrusive, newfangled rubbish to what you describe as, and I quote, a "shitpost BBS", praytell? Can't you people leave anything alone?

Anonymous A (OP) replied with this 2 years ago, 5 minutes later, 1 hour after the original post[^] [v] #1,231,354

@previous (Mattpoot Rospoot Milpoot)
> Stop shutting every thread yo with your whiny shtick. Thanks.

i was about think you were cool for a second, but then @previous (Mattpoot Rospoot Milpoot) ten minutes passed and i guess irony isn't lost on you.

Anonymous D replied with this 2 years ago, 8 minutes later, 1 hour after the original post[^] [v] #1,231,356

@1,231,350 (A)
Can't you just write on your own?

Anonymous A (OP) replied with this 2 years ago, 5 minutes later, 1 hour after the original post[^] [v] #1,231,358

@previous (D)
LOLOL, yeah, trust me, i can write on my own.
chatgpt operates on a token based system though and y'all prefer the succinct, rational hallucinations of sociopathic Ai way more than my indulgence stream of consciousness, what with me being squeegee and all

Anonymous C replied with this 2 years ago, 14 minutes later, 2 hours after the original post[^] [v] #1,231,359

@1,231,356 (D)
very dumb take. although history has no shortage of them when it comes to technology.

Anonymous D replied with this 2 years ago, 10 minutes later, 2 hours after the original post[^] [v] #1,231,362

@previous (C)
How is it a dumb take? These chat gpt threads are fucking boring

Anonymous C replied with this 2 years ago, 1 hour later, 3 hours after the original post[^] [v] #1,231,365

@previous (D)
Then start spreading the word.

Anonymous A (OP) replied with this 2 years ago, 3 minutes later, 3 hours after the original post[^] [v] #1,231,366

Externally hosted image@previous (C)
let me know if you need any custom punk rock vampire cover art for any punk rock vampire themed projects!

Mattpoot Rospoot Milpoot replied with this 2 years ago, 8 hours later, 11 hours after the original post[^] [v] #1,231,375

@1,231,354 (A)
There is no irony. You are both shutting yo the board with your respective shticks. Thanks.
:

Please familiarise yourself with the rules and markup syntax before posting.