Changes to particleverse.scroll.pub

root

25 days ago

Initial commit

body.html

Changed around line 1
+ 
+   Welcome to ParticleVerse
+   Explore the future of web design
+ 
+ 
+   
+     About Us
+     We create immersive 3D experiences that captivate and engage.
+   
+   
+     Portfolio
+     Discover our stunning projects and innovative solutions.
+   
+   
+     Contact
+     Get in touch with us to start your next project.
+   
+ 
+ 
+   ParticleVerse
+ 

index.scroll

Changed around line 1
+ buildHtml
+ baseUrl https://particleverse.scroll.pub
+ metaTags
+ editButton /edit.html
+ title ParticleVerse - Immersive 3D Experience
+ style.css
+ body.html
+ script.js

prompt.json

Changed around line 1
+ {
+   "id": "6584c838-20b4-4078-82f0-072d0e9cea7e",
+   "object": "chat.completion",
+   "created": 1735369806,
+   "model": "deepseek-chat",
+   "choices": [
+     {
+       "index": 0,
+       "message": {
+         "role": "assistant",
+         "content": "---domain---\nparticleverse.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://particleverse.scroll.pub\nmetaTags\neditButton /edit.html\ntitle ParticleVerse - Immersive 3D Experience\nstyle.css\nbody.html\nscript.js\n---body.html---\n\n  Welcome to ParticleVerse\n  Explore the future of web design
\n\n\n  \n    About Us\n    We create immersive 3D experiences that captivate and engage.
\n  \n  \n    Portfolio\n    Discover our stunning projects and innovative solutions.
\n  \n  \n    Contact\n    Get in touch with us to start your next project.
\n  \n\n\n  ParticleVerse
\n\n---style.css---\nbody {\n  margin: 0;\n  font-family: 'Arial', sans-serif;\n  color: #fff;\n  background: #1a1a1a;\n  overflow: hidden;\n}\n\nheader {\n  text-align: center;\n  padding: 100px 20px;\n  background: linear-gradient(135deg, #6a11cb, #2575fc);\n}\n\nh1 {\n  font-size: 3rem;\n  margin-bottom: 10px;\n}\n\np {\n  font-size: 1.2rem;\n}\n\nmain {\n  padding: 50px 20px;\n}\n\nsection {\n  margin-bottom: 50px;\n}\n\nh2 {\n  font-size: 2rem;\n  margin-bottom: 20px;\n}\n\nfooter {\n  text-align: center;\n  padding: 20px;\n  background: #333;\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n  const canvas = document.createElement('canvas');\n  document.body.appendChild(canvas);\n  const ctx = canvas.getContext('2d');\n\n  canvas.width = window.innerWidth;\n  canvas.height = window.innerHeight;\n\n  const particles = [];\n  const particleCount = 100;\n\n  class Particle {\n    constructor() {\n      this.x = Math.random() * canvas.width;\n      this.y = Math.random() * canvas.height;\n      this.size = Math.random() * 5 + 1;\n      this.speedX = Math.random() * 3 - 1.5;\n      this.speedY = Math.random() * 3 - 1.5;\n    }\n\n    update() {\n      this.x += this.speedX;\n      this.y += this.speedY;\n\n      if (this.size > 0.2) this.size -= 0.1;\n    }\n\n    draw() {\n      ctx.fillStyle = 'rgba(255, 255, 255, 0.8)';\n      ctx.strokeStyle = 'rgba(255, 255, 255, 0.8)';\n      ctx.lineWidth = 2;\n      ctx.beginPath();\n      ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\n      ctx.closePath();\n      ctx.fill();\n    }\n  }\n\n  function init() {\n    particles.length = 0;\n    for (let i = 0; i < particleCount; i++) {\n      particles.push(new Particle());\n    }\n  }\n\n  function animate() {\n    ctx.clearRect(0, 0, canvas.width, canvas.height);\n    particles.forEach(particle => {\n      particle.update();\n      particle.draw();\n    });\n    requestAnimationFrame(animate);\n  }\n\n  init();\n  animate();\n\n  window.addEventListener('resize', () => {\n    canvas.width = window.innerWidth;\n    canvas.height = window.innerHeight;\n    init();\n  });\n\n  canvas.addEventListener('mousemove', (e) => {\n    const mouseX = e.clientX;\n    const mouseY = e.clientY;\n\n    particles.forEach(particle => {\n      const dx = mouseX - particle.x;\n      const dy = mouseY - particle.y;\n      const dist = Math.sqrt(dx * dx + dy * dy);\n\n      if (dist < 100) {\n        particle.speedX = dx * 0.05;\n        particle.speedY = dy * 0.05;\n      }\n    });\n  });\n});\n---end---"
+       },
+       "logprobs": null,
+       "finish_reason": "stop"
+     }
+   ],
+   "usage": {
+     "prompt_tokens": 393,
+     "completion_tokens": 957,
+     "total_tokens": 1350,
+     "prompt_cache_hit_tokens": 0,
+     "prompt_cache_miss_tokens": 393
+   },
+   "system_fingerprint": "fp_f1afce2943"
+ }

readme.scroll

Changed around line 1

+ # particleverse.scroll.pub

+ Website generated by DeepSeek from prompt: Design and develop an immersive, visually stunning 3D website that integrates a dynamic particle system as a core design element. The website should feature an interactive homepage where particles react to user interactions, such as mouse movements or clicks, creating an engaging and modern experience. Include smooth transitions between sections, such as an about page, a portfolio or services section, and a contact page, all enhanced with subtle 3D effects and animations. Use a cohesive color scheme and typography that aligns with [insert brand or theme], and ensure the website is fully responsive and optimized for performance across devices. Implement the particle system using a library like Three.js or similar, and ensure it enhances the user experience without compromising load times or functionality. Deliver a fully functional, tested, and hosted website with documentation for future updates.

script.js

Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+   const canvas = document.createElement('canvas');
+   document.body.appendChild(canvas);
+   const ctx = canvas.getContext('2d');
+ 
+   canvas.width = window.innerWidth;
+   canvas.height = window.innerHeight;
+ 
+   const particles = [];
+   const particleCount = 100;
+ 
+   class Particle {
+     constructor() {
+       this.x = Math.random() * canvas.width;
+       this.y = Math.random() * canvas.height;
+       this.size = Math.random() * 5 + 1;
+       this.speedX = Math.random() * 3 - 1.5;
+       this.speedY = Math.random() * 3 - 1.5;
+     }
+ 
+     update() {
+       this.x += this.speedX;
+       this.y += this.speedY;
+ 
+       if (this.size > 0.2) this.size -= 0.1;
+     }
+ 
+     draw() {
+       ctx.fillStyle = 'rgba(255, 255, 255, 0.8)';
+       ctx.strokeStyle = 'rgba(255, 255, 255, 0.8)';
+       ctx.lineWidth = 2;
+       ctx.beginPath();
+       ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
+       ctx.closePath();
+       ctx.fill();
+     }
+   }
+ 
+   function init() {
+     particles.length = 0;
+     for (let i = 0; i < particleCount; i++) {
+       particles.push(new Particle());
+     }
+   }
+ 
+   function animate() {
+     ctx.clearRect(0, 0, canvas.width, canvas.height);
+     particles.forEach(particle => {
+       particle.update();
+       particle.draw();
+     });
+     requestAnimationFrame(animate);
+   }
+ 
+   init();
+   animate();
+ 
+   window.addEventListener('resize', () => {
+     canvas.width = window.innerWidth;
+     canvas.height = window.innerHeight;
+     init();
+   });
+ 
+   canvas.addEventListener('mousemove', (e) => {
+     const mouseX = e.clientX;
+     const mouseY = e.clientY;
+ 
+     particles.forEach(particle => {
+       const dx = mouseX - particle.x;
+       const dy = mouseY - particle.y;
+       const dist = Math.sqrt(dx * dx + dy * dy);
+ 
+       if (dist < 100) {
+         particle.speedX = dx * 0.05;
+         particle.speedY = dy * 0.05;
+       }
+     });
+   });
+ });

style.css

Changed around line 1
+ body {
+   margin: 0;
+   font-family: 'Arial', sans-serif;
+   color: #fff;
+   background: #1a1a1a;
+   overflow: hidden;
+ }
+ 
+ header {
+   text-align: center;
+   padding: 100px 20px;
+   background: linear-gradient(135deg, #6a11cb, #2575fc);
+ }
+ 
+ h1 {
+   font-size: 3rem;
+   margin-bottom: 10px;
+ }
+ 
+ p {
+   font-size: 1.2rem;
+ }
+ 
+ main {
+   padding: 50px 20px;
+ }
+ 
+ section {
+   margin-bottom: 50px;
+ }
+ 
+ h2 {
+   font-size: 2rem;
+   margin-bottom: 20px;
+ }
+ 
+ footer {
+   text-align: center;
+   padding: 20px;
+   background: #333;
+ }