Upload 9 files

src/views/InstructorView.js

@@ -408,64 +408,33 @@ export function setupInstructorEvents() {
                     monster = getNextMonster(s.monster_stage || 0, totalLikes, total, s.monster_id);
                 }
 
-                // Scatter Logic: Radial Distribution with Jitter
-                // Min radius increased to verify clearance around label
-                const minR = 220;
-                const maxR = 350;
-
-                // Angle: Evenly distributed + Jitter
-                let baseAngle = (index / total) * 2 * Math.PI;
-                const angleJitter = (Math.random() - 0.5) * 0.5;
-                let finalAngle = baseAngle + angleJitter;
-
-                // Collision Avoidance for Bottom Label (approx 90 deg / PI/2)
-                // Expanded exclusion zone for better label clearance (60 to 120 degrees)
-                const deg = finalAngle * (180 / Math.PI) % 360;
-                const normalizedDeg = deg < 0 ? deg + 360 : deg;
-
-                // 1. Avoid Instructor Label (Bottom Center: 60-120 deg)
-                if (normalizedDeg > 60 && normalizedDeg < 120) {
-                    // Push angle strictly out of the zone
-                    const distTo60 = Math.abs(normalizedDeg - 60);
-                    const distTo120 = Math.abs(normalizedDeg - 120);
-
-                    if (distTo60 < distTo120) {
-                        finalAngle = (60 - 15) * (Math.PI / 180); // Move to 45 deg
-                    } else {
-                        finalAngle = (120 + 15) * (Math.PI / 180); // Move to 135 deg
-                    }
-                }
+                // --- FIXED: Even Arc Distribution (Safe Zone: 135 deg to 405 deg) ---
+                // Avoids Bottom Right (0-90) and Bottom Center (90-120) entirely
 
-                // 2. Recalculate degree after shift
-                const finalDeg = finalAngle * (180 / Math.PI) % 360;
-                const normFinalDeg = finalDeg < 0 ? finalDeg + 360 : finalDeg;
+                // Safe Arc Range: Starts at 135 deg (Bottom Left) -> Goes CW -> Ends at 405 deg (45 deg, Bottom Right)
+                // Total Span = 270 degrees
+                // If many students, use double ring
 
-                // Radius: Random within range
-                let radius = minR + Math.random() * (maxR - minR);
+                const safeStartAngle = 135 * (Math.PI / 180);
+                const safeSpan = 270 * (Math.PI / 180);
 
-                // 3. Avoid Watermark (Bottom Right: 0-90 deg)
-                // Expanded zone to properly clear the label
-                if (normFinalDeg >= 0 && normFinalDeg < 90) {
-                    // Push angle strictly out of the zone
-                    const distTo0 = Math.abs(normFinalDeg - 0);
-                    const distTo90 = Math.abs(normFinalDeg - 90);
+                // Distribute evenly
+                // If only 1 student, put at top (270 deg / 4.71 rad)
+                let finalAngle;
 
-                    if (distTo0 < distTo90) {
-                        finalAngle = (-15) * (Math.PI / 180); // Move to -15 deg
-                    } else {
-                        finalAngle = (105) * (Math.PI / 180); // Move to 105 deg
-                    }
+                if (total === 1) {
+                    finalAngle = 270 * (Math.PI / 180);
+                } else {
+                    const step = safeSpan / (total - 1);
+                    finalAngle = safeStartAngle + (step * index);
                 }
 
-                // 4. Recalculate degree after shift
-                const shiftFinalDeg = finalAngle * (180 / Math.PI) % 360;
-                const shiftNormFinalDeg = shiftFinalDeg < 0 ? shiftFinalDeg + 360 : shiftFinalDeg;
+                // Radius: Fixed base + slight variation for "natural" look (but not overlap causing)
+                // Double ring logic if crowded
+                let radius = minR + (index % 2) * 40; // Zigzag radius (220, 260, 220...) to minimize overlap
 
-                // 2. Extra space for bottom area (Instructor Name Tag)
-                // If 80-100 deg (Bottom Center), push radius out
-                if (shiftNormFinalDeg > 80 && shiftNormFinalDeg < 100) {
-                    radius += 60;
-                }
+                // Reduce zigzag if few students
+                if (total < 10) radius = minR + (index % 2) * 20;
 
                 const xOff = Math.cos(finalAngle) * radius;
                 const yOff = Math.sin(finalAngle) * radius * 0.8;