Splashy Waves

{"name":"Splashy Waves","description":"Create a dynamic 2D side view water simulation with realistic wave physics and interactive splashing effects.","photo":null,"view_count":2,"fork_count":0,"expires_at":null,"created_at":"2024-05-13T19:36:02.385198Z","updated_at":"2024-05-13T19:36:02.385200Z","user_id":59,"status":"PUBLIC","parent_id":1411,"id":1412,"user":{"photo":null,"email":null,"recess_id":"0c343b5d-70ad-030a-89d2-b1f54b6318ff","created_at":"2024-02-23T23:46:05.409490Z","reset_token":null,"stripe_customer_id":null,"seats":null,"username":"nebwinters2","id":59,"password_hash":null,"updated_at":"2024-02-23T23:46:05.409493Z","reset_token_expiry":null,"subscription_status":null},"code":{"script.js":"// Initialize Paper.js\npaper.install(window);\npaper.setup('myCanvas');\n\n// Draw background\nfunction drawBackground() {\n // Code for drawing the background\n}\n// Initialize Paper.js on the canvas\npaper.setup('myCanvas');\n\n// Variables for wave simulation\nvar waveHeight = 20;\nvar waveLength = 200;\nvar numberOfPoints = 60;\nvar waveSpeed = 0.02;\nvar amplitude = 15;\nvar waves = [];\n\n// Function to create wave segments\nfunction createWave(path, points, height, length) {\n for (var i = 0; i <= points; i++) {\n var point = new Point(i / points * length, height);\n path.add(point);\n }\n}\n\n// Initialize wave\nfunction initWave() {\n var path = new Path({\n strokeColor: 'blue',\n fillColor: 'blue'\n });\n createWave(path, numberOfPoints, waveHeight, waveLength);\n path.smooth();\n waves.push(path);\n}\n\n// Function to animate waves\nfunction onFrame(event) {\n for (var i = 0; i < waves.length; i++) {\n var wave = waves[i];\n for (var j = 0; j < wave.segments.length; j++) {\n var segment = wave.segments[j];\n var sinus = Math.sin(event.time * waveSpeed + j);\n segment.point.y = waveHeight + sinus * amplitude;\n }\n wave.smooth();\n }\n}\n\ninitWave();\n\ndrawBackground();","style.css":"","index.html":"\n\n\n \n \n Splashy Waves\n \n\n\n \n \n

\n\n"},"chat_history":[],"assets":[],"messages_sent":0,"comments":[],"steps":[{"step_number":0,"complete":false,"updated_at":"2024-05-13T19:36:02.388949","id":7646,"title":"Simulated Waves","instruction":"Implement realistic 2D side view wave simulation using Paper.js.","created_at":"2024-05-13T19:32:39.067320","project_id":1412},{"step_number":1,"complete":false,"updated_at":"2024-05-13T19:36:02.389040","id":7647,"title":"Splashing Effects","instruction":"Create interactive splashing effects when objects collide with the water surface.","created_at":"2024-05-13T19:32:39.067374","project_id":1412},{"step_number":2,"complete":false,"updated_at":"2024-05-13T19:36:02.389088","id":7648,"title":"User Interaction","instruction":"Allow users to interact with the water surface, controlling wave simulation and splashing effects.","created_at":"2024-05-13T19:32:39.067412","project_id":1412},{"step_number":3,"complete":false,"updated_at":"2024-05-13T19:36:02.389128","id":7649,"title":"Dynamic Visuals","instruction":"Enhance the overall experience with visually appealing and dynamic water simulation effects.","created_at":"2024-05-13T19:32:39.067449","project_id":1412},{"step_number":4,"complete":false,"updated_at":"2024-05-13T19:36:02.389164","id":7650,"title":"Interactive Elements","instruction":"Incorporate interactive elements that respond to user interactions with the water simulation.","created_at":"2024-05-13T19:32:39.067482","project_id":1412},{"step_number":5,"complete":false,"updated_at":"2024-05-13T19:36:02.389201","id":7651,"title":"","instruction":"","created_at":"2024-05-13T19:32:39.067515","project_id":1412}]}