Spinning Square Adventure

{"name":"Spinning Square Adventure","description":null,"photo":null,"view_count":15,"fork_count":0,"expires_at":null,"created_at":"2024-11-04T20:18:34.295515Z","updated_at":"2024-11-04T20:18:34.295519Z","user_id":233,"status":"PRIVATE","parent_id":4187,"id":4381,"user":{"photo":null,"email":"cj.wright@alpha.school","recess_id":null,"created_at":"2024-10-15T14:38:29.024454Z","reset_token":null,"stripe_customer_id":"","seats":null,"username":"cjw","id":233,"password_hash":"$2b$12$Df507mvCGj0BBlLQ54gE4upckbOvTWZM4Js0PtU0BLrXhy06uePL6","updated_at":"2024-10-15T14:38:29.024459Z","reset_token_expiry":null,"subscription_status":""},"code":{"script.js":"let angle = 0;\n\nlet verticalSpeed = 0;\n\nlet squareX, squareY;\n\nlet isDragging = false;\n\nlet previousMouseX, previousMouseY;\n\nlet horizontalSpeed = 0;\n\nlet trail = [];\n\nfunction setup() {\n createCanvas(windowWidth, windowHeight);\n colorMode(HSB, 360, 100, 100); // Use HSB for rainbow colors\n squareX = width / 2; // Start the square in the middle of the canvas\n squareY = height / 2;\n}\n\nfunction draw() {\n // Comment out or remove the background clearing\n // background(220);\n\n // Apply gravity only when not dragging\n if (!isDragging) {\n verticalSpeed += 0.2; // Double the increment for vertical speed\n squareX += horizontalSpeed * 2; // Double the horizontal speed\n squareY += verticalSpeed * 2; // Double the vertical speed\n } else {\n // Smoothly move square towards the mouse position when dragging\n squareX += (mouseX - squareX) * 0.2; // Double the smoothing factor\n squareY += (mouseY - squareY) * 0.2; // Double the smoothing factor\n }\n\n // Add the current position to the trail\n trail.push({ x: squareX, y: squareY });\n\n // Limit the trail length if desired (optional)\n // if (trail.length > 100) {\n // trail.shift(); // Remove the oldest position to keep the trail size constant\n // }\n\n // Draw the trail with a rainbow effect\n noFill();\n strokeWeight(2); // Set a thinner stroke weight for the trail\n beginShape();\n for (let i = 0; i < trail.length; i++) {\n let pos = trail[i];\n stroke((i * 10) % 360, 100, 100); // Cycle through colors for rainbow effect\n vertex(pos.x, pos.y);\n }\n endShape();\n\n // Check for collision with the bottom wall\n if (squareY > height - 25) {\n squareY = height - 25;\n verticalSpeed *= -0.9;\n }\n\n // Check for collision with the top wall\n if (squareY < 25) {\n squareY = 25;\n verticalSpeed *= -0.9;\n }\n\n // Check for collision with the side walls\n if (squareX > width - 25 || squareX < 25) {\n horizontalSpeed *= -0.9;\n }\n\n // Set the rectangle's origin to the square's position\n translate(squareX, squareY);\n rotate(angle);\n\n // Draw the square\n rectMode(CENTER);\n fill(255);\n rect(0, 0, 50, 50);\n\n // Double the angle increment to spin the square faster\n angle += 0.2;\n}\n\nfunction mousePressed() {\n // Check if the mouse is over the square when pressed\n if (dist(mouseX, mouseY, squareX, squareY) < 25) {\n isDragging = true; // Start dragging\n previousMouseX = mouseX;\n previousMouseY = mouseY;\n }\n}\n\nfunction mouseReleased() {\n isDragging = false; // Stop dragging\n}\n\nfunction mouseDragged() {\n if (isDragging) {\n // Update the square's position to follow the mouse\n horizontalSpeed = mouseX - previousMouseX;\n verticalSpeed = mouseY - previousMouseY;\n squareX += horizontalSpeed;\n squareY += verticalSpeed;\n\n // Update previous mouse positions\n previousMouseX = mouseX;\n previousMouseY = mouseY;\n }\n}\n\n","style.css":"body { margin: 0; }\ncanvas { display: block; }","index.html":"\n\n\n \n \n Spinning Square Adventure\n \n \n\n\n \n\n"},"chat_history":[],"assets":[],"messages_sent":0,"comments":[],"steps":[]}