Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ // Menu toggle functionality
+ const menuToggle = document.querySelector('.menu-toggle');
+ const navLinks = document.querySelector('.nav-links');
+
+ menuToggle?.addEventListener('click', () => {
+ navLinks.classList.toggle('active');
+ });
+
+ // Calculator functionality
+ const calcInput = document.getElementById('calcInput');
+ const calculateBtn = document.getElementById('calculate');
+ const result = document.getElementById('result');
+
+ calculateBtn?.addEventListener('click', () => {
+ const num = parseInt(calcInput.value);
+ if (isNaN(num)) {
+ result.textContent = 'Please enter a valid number';
+ return;
+ }
+
+ const factors = getFactors(num);
+ result.textContent = `Factors: ${factors.join(', ')}`;
+ });
+
+ // Canvas visualization
+ const canvas = document.getElementById('numberCanvas');
+ const ctx = canvas?.getContext('2d');
+
+ if (ctx) {
+ drawVisualization();
+ }
+ });
+
+ function getFactors(num) {
+ const factors = [];
+ for (let i = 1; i <= num; i++) {
+ if (num % i === 0) {
+ factors.push(i);
+ }
+ }
+ return factors;
+ }
+
+ function drawVisualization() {
+ const canvas = document.getElementById('numberCanvas');
+ const ctx = canvas.getContext('2d');
+
+ // Set canvas dimensions
+ canvas.width = canvas.offsetWidth;
+ canvas.height = canvas.offsetHeight;
+
+ // Clear canvas
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+ // Draw animated visualization
+ let angle = 0;
+
+ function animate() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+ ctx.save();
+ ctx.translate(canvas.width / 2, canvas.height / 2);
+ ctx.rotate(angle);
+
+ // Draw geometric pattern
+ for (let i = 0; i < 420; i += 20) {
+ ctx.beginPath();
+ ctx.arc(0, 0, i, 0, Math.PI * 2);
+ ctx.strokeStyle = `hsla(${i}, 70%, 50%, 0.5)`;
+ ctx.stroke();
+ }
+
+ ctx.restore();
+
+ angle += 0.01;
+ requestAnimationFrame(animate);
+ }
+
+ animate();
+ }
