ok

2026-01-20 01:05:17 +01:00
parent e4d01bc480
commit cbb2b64f92
5846 changed files with 1687 additions and 4494 deletions
--- a/tools/visualizers/visual_test_render.html
+++ b/tools/visualizers/visual_test_render.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8">
+    <title>Style 32 Visual Check</title>
+    <style>
+        body {
+            margin: 0;
+            background: #111;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            color: #fff;
+            font-family: sans-serif;
+        }
+
+        canvas {
+            box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
+            border: 1px solid #333;
+        }
+    </style>
+    <script src="node_modules/phaser/dist/phaser.min.js"></script>
+</head>
+
+<body>
+    <script>
+        const config = {
+            type: Phaser.AUTO,
+            width: 1280,
+            height: 720,
+            backgroundColor: '#222',
+            // CRITICAL STYLE 32 SETTINGS
+            pixelArt: false,
+            antialias: true,
+            roundPixels: false,
+            scene: {
+                preload: function () {
+                    // Load Style 32 Assets
+                    this.load.image('bg_farm', 'assets/sprites/smooth/kai_style32.png');
+                    this.load.image('kai_main', 'assets/sprites/smooth/kai_main.png');
+                    this.load.image('town_preview', 'assets/sprites/smooth/town_style32.png');
+                    this.load.image('mine_preview', 'assets/sprites/smooth/mine_style32.png');
+                },
+                create: function () {
+                    // 1. Background (The Farm Mockup) - Represents "Trava" & Atmosphere
+                    const bg = this.add.image(640, 360, 'bg_farm');
+                    bg.setDisplaySize(1280, 720);
+                    bg.setAlpha(0.6); // Dimmed to show foreground better
+
+                    // 2. Title
+                    const title = this.add.text(640, 50, 'STYLE 32: SMOOTH VECTOR RENDER', {
+                        fontSize: '40px',
+                        fontFamily: 'Arial',
+                        color: '#00ff00',
+                        stroke: '#000000',
+                        strokeThickness: 6
+                    }).setOrigin(0.5);
+
+                    const subtitle = this.add.text(640, 100, 'Antialias: ON | PixelArt: OFF | 512px Assets', {
+                        fontSize: '20px',
+                        color: '#ffffff',
+                        stroke: '#000000',
+                        strokeThickness: 4
+                    }).setOrigin(0.5);
+
+                    // 3. KAI (Style 32 Character)
+                    const kaiContainer = this.add.container(350, 450);
+                    const kai = this.add.image(0, 0, 'kai_main');
+                    kai.setScale(0.8); // Adjusted for view
+                    // Add Drop Shadow using simple black copy
+                    const shadow = this.add.image(10, 10, 'kai_main').setTint(0x000000).setAlpha(0.5).setScale(0.8);
+                    kaiContainer.add([shadow, kai]);
+
+                    // Label
+                    this.add.text(350, 680, 'KAI (High-Res Vector)', { fontSize: '24px', fontStyle: 'bold' }).setOrigin(0.5).setStroke('#000', 4);
+
+                    // 4. TOWN & ZOMBIE PREVIEWS (Right Side)
+                    // Use "Vignette" style frame
+                    const createPreview = (x, y, key, label) => {
+                        const img = this.add.image(x, y, key);
+                        img.setDisplaySize(400, 225); // 16:9 ratio small
+
+                        const border = this.add.graphics();
+                        border.lineStyle(4, 0xffffff, 1);
+                        border.strokeRect(x - 200, y - 112.5, 400, 225);
+
+                        this.add.text(x, y + 130, label, { fontSize: '18px', color: '#ccc' }).setOrigin(0.5).setStroke('#000', 3);
+
+                        return img;
+                    };
+
+                    createPreview(950, 250, 'town_preview', 'NOIR TOWN (Detail Check)');
+                    createPreview(950, 550, 'mine_preview', 'ZOMBIE MINERS (Smooth Line Check)');
+
+                    // 5. ANIMATIONS (Tweening to prove smoothness)
+                    this.tweens.add({
+                        targets: kai,
+                        y: '-=10',
+                        duration: 2000,
+                        yoyo: true,
+                        repeat: -1,
+                        ease: 'Sine.easeInOut'
+                    });
+                }
+            }
+        };
+        new Phaser.Game(config);
+    </script>
+</body>
+
+</html>