Update app.py

app.py

@@ -117,7 +117,7 @@ EDITOR_TEMPLATE = '''
         h3 { margin-top: 0; font-size: 1.1em; color: #00aaff; }
         label { display: block; margin-bottom: 5px; font-size: 0.9em; }
         input[type="number"], input[type="text"], select {
-            width: 100%; padding: 8px; box-sizing: border-box; background: #222; border: 1px solid #555; color: white; border-radius: 4px;
+            width: 100%; padding: 8px; box-sizing: border-box; background: #222; border: 1px solid #555; color: white; border-radius: 4px; margin-bottom: 5px;
         }
         button {
             width: 100%; padding: 10px; background: #0077cc; border: none; color: white; border-radius: 4px; cursor: pointer; font-weight: bold; margin-top: 10px;
@@ -224,6 +224,10 @@ EDITOR_TEMPLATE = '''
                     <label><input type="radio" name="texture-type" value="snow"> Снег</label>
                     <label><input type="radio" name="texture-type" value="sand"> Песок</label>
                 </div>
+                 <hr>
+                <input type="text" id="texture-name-input" placeholder="Имя текстуры (e.g. lava)">
+                <input type="text" id="texture-url-input" placeholder="URL текстуры (.jpg, .png)">
+                <button id="add-texture-btn">Добавить текстуру</button>
             </div>
             <div class="ui-group">
                 <h3>Объекты</h3>
@@ -237,13 +241,13 @@ EDITOR_TEMPLATE = '''
 
     <div id="blocker">
 		<div id="instructions">
-			<p style="font-size:36px">Click to play</p>
+			<p style="font-size:36px">Нажмите, чтобы играть</p>
 			<p>
-				Move: WASD<br/>
-				Jump: SPACE<br/>
-				Look: MOUSE
+				Движение: WASD<br/>
+				Прыжок: ПРОБЕЛ<br/>
+				Осмотр: МЫШЬ
 			</p>
-            <p>Press ESC to exit</p>
+            <p>Нажмите ESC, чтобы выйти</p>
 		</div>
 	</div>
 
@@ -276,16 +280,17 @@ EDITOR_TEMPLATE = '''
         let isEditing = false;
         const noise2D = createNoise2D();
         
-        let grassInstances;
+        let grassInstances, grassMaterial;
         const MAX_GRASS_COUNT = 100000;
         const terrainDimensions = { width: 100, height: 100, segmentsX: 100, segmentsY: 100 };
         
         let isPlayMode = false;
         let player, playerVelocity = new THREE.Vector3(), playerOnGround = false;
         const playerHeight = 1.8;
-        const playerSpeed = 20.0;
+        const playerSpeed = 8.0;
         const playerJumpHeight = 8.0;
         const gravity = -30.0;
+        const maxSlope = Math.cos(THREE.MathUtils.degToRad(50));
         const keyStates = {};
         const clock = new THREE.Clock();
 
@@ -298,89 +303,56 @@ EDITOR_TEMPLATE = '''
             return tex;
         };
         
-        const textures = {
-            grass: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/grasslight-big.jpg'),
-            rock: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/rock.jpg'),
-            dirt: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg'),
-            snow: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/snow.jpg'),
-            sand: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg'),
-            grassNormal: loadTexture('https://raw.githubusercontent.com/mrdoob/three.js/master/examples/textures/terrain/grasslight-big-nm.jpg'),
-            rockNormal: loadTexture('https://raw.githubusercontent.com/mrdoob/three.js/master/examples/textures/terrain/rock-nm.jpg')
+        let terrainTextures = {
+            grass: { tex: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/grasslight-big.jpg') },
+            rock: { tex: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/rock.jpg') },
+            dirt: { tex: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg') },
+            snow: { tex: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/snow.jpg') },
+            sand: { tex: loadTexture('https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg') },
         };
-        
+        let textureMapping = ['grass', 'rock', 'dirt', 'snow', 'sand'];
+
         const terrainMaterial = new THREE.ShaderMaterial({
             uniforms: {
-                grassTexture: { value: textures.grass },
-                rockTexture: { value: textures.rock },
-                dirtTexture: { value: textures.dirt },
-                snowTexture: { value: textures.snow },
-                sandTexture: { value: textures.sand },
-                grassNormalMap: { value: textures.grassNormal },
-                rockNormalMap: { value: textures.rockNormal },
+                textures: { value: Object.values(terrainTextures).map(t => t.tex) },
                 lightDirection: { value: new THREE.Vector3(0.5, 0.5, 0.5).normalize() }
             },
             vertexShader: `
                 varying vec2 vUv;
                 varying vec3 vNormal;
-                varying vec3 vViewPosition;
                 attribute vec4 color;
+                attribute vec4 color2;
                 varying vec4 vColor;
-                attribute vec4 tangent;
-                varying vec3 vTangent;
-                varying vec3 vBitangent;
-
+                varying vec4 vColor2;
                 void main() {
                     vUv = uv;
                     vColor = color;
-                    vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
-                    vViewPosition = -mvPosition.xyz;
-                    vNormal = normalize(normalMatrix * normal);
-                    vTangent = normalize(normalMatrix * tangent.xyz);
-                    vBitangent = normalize(cross(vNormal, vTangent) * tangent.w);
-                    gl_Position = projectionMatrix * mvPosition;
+                    vColor2 = color2;
+                    vNormal = normal;
+                    gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
                 }
             `,
             fragmentShader: `
-                uniform sampler2D grassTexture;
-                uniform sampler2D rockTexture;
-                uniform sampler2D dirtTexture;
-                uniform sampler2D snowTexture;
-                uniform sampler2D sandTexture;
-                uniform sampler2D grassNormalMap;
-                uniform sampler2D rockNormalMap;
+                uniform sampler2D textures[10];
                 uniform vec3 lightDirection;
-
                 varying vec2 vUv;
-                varying vec4 vColor;
                 varying vec3 vNormal;
-                varying vec3 vViewPosition;
-                varying vec3 vTangent;
-                varying vec3 vBitangent;
-
+                varying vec4 vColor;
+                varying vec4 vColor2;
                 void main() {
                     vec2 uv_scaled = vUv * 30.0;
+                    float totalWeight = 1.0 - (vColor.r + vColor.g + vColor.b + vColor.a + vColor2.r + vColor2.g + vColor2.b + vColor2.a);
+                    vec3 finalColor = texture2D(textures[0], uv_scaled).rgb * max(0.0, totalWeight);
+                    finalColor += texture2D(textures[1], uv_scaled).rgb * vColor.r;
+                    finalColor += texture2D(textures[2], uv_scaled).rgb * vColor.g;
+                    finalColor += texture2D(textures[3], uv_scaled).rgb * vColor.b;
+                    finalColor += texture2D(textures[4], uv_scaled).rgb * vColor.a;
+                    finalColor += texture2D(textures[5], uv_scaled).rgb * vColor2.r;
+                    finalColor += texture2D(textures[6], uv_scaled).rgb * vColor2.g;
+                    finalColor += texture2D(textures[7], uv_scaled).rgb * vColor2.b;
+                    finalColor += texture2D(textures[8], uv_scaled).rgb * vColor2.a;
                     
-                    vec4 grass = texture2D(grassTexture, uv_scaled);
-                    vec4 rock = texture2D(rockTexture, uv_scaled);
-                    vec4 dirt = texture2D(dirtTexture, uv_scaled);
-                    vec4 snow = texture2D(snowTexture, uv_scaled);
-                    vec4 sand = texture2D(sandTexture, uv_scaled);
-
-                    vec3 finalColor = grass.rgb;
-                    finalColor = mix(finalColor, rock.rgb, vColor.r);
-                    finalColor = mix(finalColor, dirt.rgb, vColor.g);
-                    finalColor = mix(finalColor, snow.rgb, vColor.b);
-                    finalColor = mix(finalColor, sand.rgb, vColor.a);
-                    
-                    mat3 tbn = mat3(vTangent, vBitangent, vNormal);
-
-                    vec3 grassNormal = texture2D(grassNormalMap, uv_scaled).xyz * 2.0 - 1.0;
-                    vec3 rockNormal = texture2D(rockNormalMap, uv_scaled).xyz * 2.0 - 1.0;
-                    
-                    vec3 blendedNormal = normalize(mix(grassNormal, rockNormal, vColor.r));
-                    vec3 normal = normalize(tbn * blendedNormal);
-
-                    float lighting = dot(normal, lightDirection) * 0.5 + 0.5;
+                    float lighting = dot(vNormal, lightDirection) * 0.5 + 0.5;
                     gl_FragColor = vec4(finalColor * lighting, 1.0);
                 }
             `
@@ -388,7 +360,6 @@ EDITOR_TEMPLATE = '''
 
         function init() {
             scene = new THREE.Scene();
-            
             camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 2000);
             camera.position.set(50, 50, 50);
 
@@ -405,9 +376,6 @@ EDITOR_TEMPLATE = '''
             orbitControls.enableDamping = true;
             orbitControls.maxPolarAngle = Math.PI / 2.1;
 
-            const hemiLight = new THREE.HemisphereLight(0xffffff, 0x444444, 0.5);
-            scene.add(hemiLight);
-
             const dirLight = new THREE.DirectionalLight(0xffffff, 1.5);
             dirLight.position.set(100, 100, 50);
             dirLight.castShadow = true;
@@ -425,14 +393,7 @@ EDITOR_TEMPLATE = '''
             sky.scale.setScalar(450000);
             scene.add(sky);
             sun = new THREE.Vector3();
-            const effectController = {
-                turbidity: 10,
-                rayleigh: 3,
-                mieCoefficient: 0.005,
-                mieDirectionalG: 0.7,
-                elevation: 4,
-                azimuth: 180,
-            };
+            const effectController = { turbidity: 10, rayleigh: 3, mieCoefficient: 0.005, mieDirectionalG: 0.7, elevation: 4, azimuth: 180 };
             const uniforms = sky.material.uniforms;
             uniforms[ 'turbidity' ].value = effectController.turbidity;
             uniforms[ 'rayleigh' ].value = effectController.rayleigh;
@@ -466,28 +427,61 @@ EDITOR_TEMPLATE = '''
 
         function initPostprocessing() {
             composer = new EffectComposer(renderer);
-            const renderPass = new RenderPass(scene, camera);
-            composer.addPass(renderPass);
-
+            composer.addPass(new RenderPass(scene, camera));
             const ssaoPass = new SSAOPass(scene, camera, window.innerWidth, window.innerHeight);
             ssaoPass.kernelRadius = 16;
-            ssaoPass.minDistance = 0.005;
-            ssaoPass.maxDistance = 0.1;
             composer.addPass(ssaoPass);
-
-            const bloomPass = new UnrealBloomPass(new THREE.Vector2(window.innerWidth, window.innerHeight), 0.5, 0.4, 0.85);
-            composer.addPass(bloomPass);
+            composer.addPass(new UnrealBloomPass(new THREE.Vector2(window.innerWidth, window.innerHeight), 0.5, 0.4, 0.85));
         }
 
         function initFoliage() {
             if (grassInstances) {
                 scene.remove(grassInstances);
                 grassInstances.geometry.dispose();
-                grassInstances.material.dispose();
+                grassMaterial.dispose();
             }
-            const grassBlade = new THREE.PlaneGeometry(0.3, 1.8);
-            grassBlade.translate(0, 0.9, 0);
-            const grassMaterial = new THREE.MeshLambertMaterial({ color: 0x339933, side: THREE.DoubleSide, alphaTest: 0.5 });
+            const grassBlade = new THREE.PlaneGeometry(0.4, 1.5, 1, 4);
+            grassBlade.translate(0, 0.75, 0);
+            grassMaterial = new THREE.ShaderMaterial({
+                uniforms: {
+                    time: { value: 0 },
+                    map: { value: textureLoader.load('https://raw.githubusercontent.com/mrdoob/three.js/master/examples/textures/sprites/grass.png') },
+                    lightDirection: terrainMaterial.uniforms.lightDirection
+                },
+                vertexShader: `
+                    uniform float time;
+                    varying vec2 vUv;
+                    varying float vWave;
+                    void main() {
+                        vUv = uv;
+                        vec4 modelPosition = modelMatrix * vec4(position, 1.0);
+                        float waveFactor = position.y / 1.5;
+                        float waveX = sin(modelPosition.x * 0.5 + time * 2.0) * 0.1 * waveFactor;
+                        float waveZ = cos(modelPosition.z * 0.5 + time * 2.0) * 0.1 * waveFactor;
+                        vWave = waveX + waveZ;
+                        vec4 finalPosition = vec4(modelPosition.x + waveX, modelPosition.y, modelPosition.z + waveZ, 1.0);
+                        gl_Position = projectionMatrix * viewMatrix * finalPosition;
+                    }
+                `,
+                fragmentShader: `
+                    uniform sampler2D map;
+                    uniform vec3 lightDirection;
+                    varying vec2 vUv;
+                    varying float vWave;
+                    void main() {
+                        vec4 texColor = texture2D(map, vUv);
+                        if (texColor.a < 0.5) discard;
+                        
+                        vec3 light = normalize(lightDirection);
+                        float dotNL = clamp(dot(vec3(0.0, 1.0, 0.0), light), 0.3, 1.0);
+                        
+                        vec3 baseColor = texColor.rgb * (0.5 + vWave * 2.0);
+                        gl_FragColor = vec4(baseColor * dotNL, texColor.a);
+                    }
+                `,
+                side: THREE.DoubleSide,
+                transparent: true
+            });
             grassInstances = new THREE.InstancedMesh(grassBlade, grassMaterial, MAX_GRASS_COUNT);
             grassInstances.castShadow = true;
             grassInstances.count = 0;
@@ -497,134 +491,84 @@ EDITOR_TEMPLATE = '''
         function initPlayer() {
             player = new THREE.Group();
             scene.add(player);
-
             pointerLockControls = new PointerLockControls(camera, document.body);
             const blocker = document.getElementById('blocker');
             const instructions = document.getElementById('instructions');
             instructions.addEventListener('click', () => pointerLockControls.lock());
             pointerLockControls.addEventListener('lock', () => { instructions.style.display = 'none'; blocker.style.display = 'none'; });
             pointerLockControls.addEventListener('unlock', () => { blocker.style.display = 'block'; instructions.style.display = ''; });
-            
-            document.addEventListener('keydown', (event) => { keyStates[event.code] = true; });
+            document.addEventListener('keydown', (event) => { keyStates[event.code] = true; if (isPlayMode && event.code === 'Escape') togglePlayMode(); });
             document.addEventListener('keyup', (event) => { keyStates[event.code] = false; });
-            document.addEventListener('keydown', (event) => {
-                if (isPlayMode && event.code === 'Escape') {
-                    togglePlayMode();
-                }
-            });
         }
         
         function setupUIListeners() {
-            document.getElementById('create-terrain').addEventListener('click', () => {
-                const width = parseInt(document.getElementById('terrain-width').value);
-                const height = parseInt(document.getElementById('terrain-height').value);
-                createTerrain(width, height);
-            });
+            document.getElementById('create-terrain').addEventListener('click', () => createTerrain(parseInt(document.getElementById('terrain-width').value), parseInt(document.getElementById('terrain-height').value)));
             document.getElementById('save-project').addEventListener('click', saveProject);
             document.getElementById('load-project').addEventListener('click', loadProject);
-            document.getElementById('brush-size').addEventListener('input', (e) => {
-                document.getElementById('brush-size-value').textContent = e.target.value;
-                updateBrushHelper();
-            });
-            document.getElementById('brush-strength').addEventListener('input', (e) => {
-                document.getElementById('brush-strength-value').textContent = e.target.value;
-            });
-            document.getElementById('project-list').addEventListener('change', (e) => {
-                document.getElementById('project-name').value = e.target.value;
-            });
-            document.getElementById('burger-menu').addEventListener('click', () => {
-                document.getElementById('ui-panel').classList.toggle('open');
-            });
-            document.getElementById('clear-objects').addEventListener('click', () => {
-                if (confirm('Вы уверены, что хотите удалить все объекты?')) {
-                    grassInstances.count = 0;
-                    grassInstances.instanceMatrix.needsUpdate = true;
-                }
-            });
+            document.getElementById('brush-size').addEventListener('input', (e) => { document.getElementById('brush-size-value').textContent = e.target.value; updateBrushHelper(); });
+            document.getElementById('brush-strength').addEventListener('input', (e) => { document.getElementById('brush-strength-value').textContent = e.target.value; });
+            document.getElementById('project-list').addEventListener('change', (e) => { document.getElementById('project-name').value = e.target.value; });
+            document.getElementById('burger-menu').addEventListener('click', () => { document.getElementById('ui-panel').classList.toggle('open'); });
+            document.getElementById('clear-objects').addEventListener('click', () => { if (confirm('Вы уверены?')) { grassInstances.count = 0; grassInstances.instanceMatrix.needsUpdate = true; }});
             document.getElementById('play-mode-toggle').addEventListener('click', togglePlayMode);
+            document.getElementById('add-texture-btn').addEventListener('click', addCustomTexture);
         }
         
         function togglePlayMode() {
             isPlayMode = !isPlayMode;
             const toggleButton = document.getElementById('play-mode-toggle');
-            const uiPanel = document.getElementById('ui-container');
-
             if (isPlayMode) {
                 toggleButton.textContent = "Редактор";
                 toggleButton.classList.remove('play-button');
-                uiPanel.style.display = 'none';
+                document.getElementById('ui-container').style.display = 'none';
                 brushHelper.visible = false;
                 orbitControls.enabled = false;
-                
-                const spawnRaycaster = new THREE.Raycaster(new THREE.Vector3(0, 100, 0), new THREE.Vector3(0, -1, 0));
-                const intersects = spawnRaycaster.intersectObject(terrainMesh);
-                if (intersects.length > 0) {
-                    player.position.copy(intersects[0].point);
-                } else {
-                    player.position.set(0, 0, 0);
-                }
+                raycaster.set(new THREE.Vector3(0, 100, 0), new THREE.Vector3(0, -1, 0));
+                const intersects = raycaster.intersectObject(terrainMesh);
+                player.position.copy(intersects.length > 0 ? intersects[0].point : new THREE.Vector3(0, 0, 0));
                 player.position.y += playerHeight;
                 playerVelocity.set(0,0,0);
-                
                 pointerLockControls.lock();
-
             } else {
                 toggleButton.textContent = "Играть";
                 toggleButton.classList.add('play-button');
-                uiPanel.style.display = 'block';
+                document.getElementById('ui-container').style.display = 'block';
                 orbitControls.enabled = true;
                 pointerLockControls.unlock();
             }
         }
 
-        function showSpinner(show) {
-            document.getElementById('loading-spinner').style.display = show ? 'block' : 'none';
-        }
+        function showSpinner(show) { document.getElementById('loading-spinner').style.display = show ? 'block' : 'none'; }
 
         function createTerrain(width, height, terrainData = null) {
-            if (terrainMesh) {
-                scene.remove(terrainMesh);
-                terrainMesh.geometry.dispose();
-            }
+            if (terrainMesh) { scene.remove(terrainMesh); terrainMesh.geometry.dispose(); }
             initFoliage();
-
             terrainDimensions.width = width;
             terrainDimensions.height = height;
             terrainDimensions.segmentsX = Math.max(1, Math.round(width));
             terrainDimensions.segmentsY = Math.max(1, Math.round(height));
-
-            const geometry = new THREE.PlaneGeometry(
-                terrainDimensions.width, terrainDimensions.height,
-                terrainDimensions.segmentsX, terrainDimensions.segmentsY
-            );
+            const geometry = new THREE.PlaneGeometry(width, height, terrainDimensions.segmentsX, terrainDimensions.segmentsY);
             geometry.rotateX(-Math.PI / 2);
-
-            const colors = new Float32Array(geometry.attributes.position.count * 4);
-            geometry.setAttribute('color', new THREE.BufferAttribute(colors, 4));
+            geometry.setAttribute('color', new THREE.BufferAttribute(new Float32Array(geometry.attributes.position.count * 4), 4));
+            geometry.setAttribute('color2', new THREE.BufferAttribute(new Float32Array(geometry.attributes.position.count * 4), 4));
             
             if (terrainData) {
-                const positions = geometry.attributes.position;
-                for (let i = 0; i < positions.count; i++) {
-                    positions.setY(i, terrainData.heights[i]);
-                }
-                if (terrainData.colors) {
-                    geometry.attributes.color.array.set(terrainData.colors);
+                geometry.attributes.position.setY(0, 0);
+                for (let i = 0; i < terrainData.heights.length; i++) {
+                    geometry.attributes.position.setY(i, terrainData.heights[i]);
                 }
+                geometry.attributes.position.needsUpdate = true;
+                if(terrainData.colors) geometry.attributes.color.array.set(terrainData.colors);
+                if(terrainData.colors2) geometry.attributes.color2.array.set(terrainData.colors2);
                 if (terrainData.foliage && terrainData.foliage.grass) {
-                    const matrices = terrainData.foliage.grass;
-                    grassInstances.count = matrices.length / 16;
+                    grassInstances.count = terrainData.foliage.grass.length / 16;
                     for (let i = 0; i < grassInstances.count; i++) {
-                        const matrix = new THREE.Matrix4();
-                        matrix.fromArray(matrices, i * 16);
-                        grassInstances.setMatrixAt(i, matrix);
+                        grassInstances.setMatrixAt(i, new THREE.Matrix4().fromArray(terrainData.foliage.grass, i * 16));
                     }
                     grassInstances.instanceMatrix.needsUpdate = true;
                 }
             }
-            
-            geometry.computeTangents();
             geometry.computeVertexNormals();
-
             terrainMesh = new THREE.Mesh(geometry, terrainMaterial);
             terrainMesh.castShadow = true;
             terrainMesh.receiveShadow = true;
@@ -638,60 +582,30 @@ EDITOR_TEMPLATE = '''
             composer.setSize(window.innerWidth, window.innerHeight);
         }
         
-        function getBrushMode() {
-            return document.querySelector('input[name="brush-mode"]:checked').value;
-        }
+        function getBrushMode() { return document.querySelector('input[name="brush-mode"]:checked').value; }
 
         function onPointerMove(event) {
             if (isPlayMode) return;
             mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
             mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
-
             raycaster.setFromCamera(mouse, camera);
             if (!terrainMesh) return;
-
             const intersects = raycaster.intersectObject(terrainMesh);
-
             if (intersects.length > 0) {
-                const intersectionPoint = intersects[0].point;
-                brushHelper.position.copy(intersectionPoint);
-                brushHelper.position.y = 0;
+                brushHelper.position.copy(intersects[0].point).setY(0);
                 brushHelper.visible = true;
                 updateBrushHelper();
                 orbitControls.enabled = !isEditing;
-
-                if (isEditing) {
-                    applyBrush(intersects[0]);
-                }
+                if (isEditing) applyBrush(intersects[0]);
             } else {
                 brushHelper.visible = false;
                 orbitControls.enabled = true;
             }
         }
         
-        function updateBrushHelper() {
-            const brushSize = parseFloat(document.getElementById('brush-size').value);
-            brushHelper.scale.set(brushSize, 1, brushSize);
-        }
-
-        function onPointerDown(event) {
-            if (isPlayMode) return;
-            if (event.button === 0 && mouse.x > -0.9) {
-                 if (window.innerWidth < 800 && !document.getElementById('ui-panel').contains(event.target)) {
-                     document.getElementById('ui-panel').classList.remove('open');
-                 }
-                isEditing = true;
-                orbitControls.enabled = false;
-            }
-        }
-
-        function onPointerUp(event) {
-            if (isPlayMode) return;
-            if (event.button === 0) {
-                isEditing = false;
-                orbitControls.enabled = true;
-            }
-        }
+        function updateBrushHelper() { brushHelper.scale.set(parseFloat(document.getElementById('brush-size').value), 1, parseFloat(document.getElementById('brush-size').value)); }
+        function onPointerDown(event) { if (!isPlayMode && event.button === 0 && mouse.x > -0.9) { isEditing = true; orbitControls.enabled = false; }}
+        function onPointerUp(event) { if (!isPlayMode && event.button === 0) { isEditing = false; orbitControls.enabled = true; }}
         
         function applyBrush(intersection) {
              if (!terrainMesh) return;
@@ -704,248 +618,231 @@ EDITOR_TEMPLATE = '''
             }
         }
 
-        function sculptTerrain(center, mode) {
+        function modifyTerrain(center, modificationFunc) {
             const positions = terrainMesh.geometry.attributes.position;
             const brushSize = parseFloat(document.getElementById('brush-size').value);
-            const brushStrength = parseFloat(document.getElementById('brush-strength').value);
-            const direction = (mode === 'raise') ? 1 : -1;
             const vertex = new THREE.Vector3();
-
             for (let i = 0; i < positions.count; i++) {
                 vertex.fromBufferAttribute(positions, i);
                 const distance = vertex.distanceTo(center);
                 if (distance < brushSize) {
                     const falloff = Math.pow(1 - (distance / brushSize), 2);
-                    let currentY = positions.getY(i);
-                    let newY = currentY + direction * falloff * brushStrength;
-                    positions.setY(i, newY);
+                    modificationFunc(i, falloff);
                 }
             }
             positions.needsUpdate = true;
             terrainMesh.geometry.computeVertexNormals();
-            terrainMesh.geometry.computeTangents();
         }
-
+        function sculptTerrain(center, mode) {
+            const brushStrength = parseFloat(document.getElementById('brush-strength').value);
+            const direction = (mode === 'raise') ? 1 : -1;
+            modifyTerrain(center, (i, falloff) => {
+                const positions = terrainMesh.geometry.attributes.position;
+                positions.setY(i, positions.getY(i) + direction * falloff * brushStrength);
+            });
+        }
         function roughenTerrain(center) {
-            const positions = terrainMesh.geometry.attributes.position;
-            const brushSize = parseFloat(document.getElementById('brush-size').value);
             const brushStrength = parseFloat(document.getElementById('brush-strength').value);
-            const vertex = new THREE.Vector3();
             const noiseFrequency = 1.5;
-
-            for (let i = 0; i < positions.count; i++) {
-                vertex.fromBufferAttribute(positions, i);
-                const distance = vertex.distanceTo(center);
-                if (distance < brushSize) {
-                    const falloff = Math.pow(1 - (distance / brushSize), 2);
-                    let noiseVal = noise2D(vertex.x * noiseFrequency, vertex.z * noiseFrequency);
-                    let currentY = positions.getY(i);
-                    let newY = currentY + noiseVal * falloff * brushStrength;
-                    positions.setY(i, newY);
-                }
-            }
-            positions.needsUpdate = true;
-            terrainMesh.geometry.computeVertexNormals();
-            terrainMesh.geometry.computeTangents();
+            modifyTerrain(center, (i, falloff) => {
+                const positions = terrainMesh.geometry.attributes.position;
+                const vertex = new THREE.Vector3().fromBufferAttribute(positions, i);
+                let noiseVal = noise2D(vertex.x * noiseFrequency, vertex.z * noiseFrequency);
+                positions.setY(i, positions.getY(i) + noiseVal * falloff * brushStrength);
+            });
         }
-        
         function paintTexture(center) {
+            const brushStrength = parseFloat(document.getElementById('brush-strength').value) * 0.1;
+            const textureName = document.querySelector('input[name="texture-type"]:checked').value;
+            const textureIndex = textureMapping.indexOf(textureName);
+            if (textureIndex === -1) return;
+
             const colors = terrainMesh.geometry.attributes.color;
+            const colors2 = terrainMesh.geometry.attributes.color2;
             const positions = terrainMesh.geometry.attributes.position;
             const brushSize = parseFloat(document.getElementById('brush-size').value);
-            const brushStrength = parseFloat(document.getElementById('brush-strength').value) * 0.1;
-            const textureType = document.querySelector('input[name="texture-type"]:checked').value;
-            
-            const targetColor = new THREE.Vector4(0,0,0,0);
-            if(textureType === 'rock')      targetColor.x = 1;
-            else if (textureType === 'dirt')   targetColor.y = 1;
-            else if (textureType === 'snow')   targetColor.z = 1;
-            else if (textureType === 'sand')   targetColor.w = 1;
-
             const vertex = new THREE.Vector3();
-            const currentColor = new THREE.Vector4();
 
             for (let i = 0; i < positions.count; i++) {
                 vertex.fromBufferAttribute(positions, i);
                 const distance = vertex.distanceTo(center);
                 if (distance < brushSize) {
-                    const falloff = Math.pow(1 - (distance / brushSize), 2);
-                    currentColor.fromBufferAttribute(colors, i);
+                    const falloff = Math.pow(1 - (distance / brushSize), 2) * brushStrength;
+                    let weights = [colors.getX(i), colors.getY(i), colors.getZ(i), colors.getW(i), colors2.getX(i), colors2.getY(i), colors2.getZ(i), colors2.getW(i)];
                     
-                    if (textureType === 'grass') {
-                         currentColor.x = Math.max(0, currentColor.x - falloff * brushStrength);
-                         currentColor.y = Math.max(0, currentColor.y - falloff * brushStrength);
-                         currentColor.z = Math.max(0, currentColor.z - falloff * brushStrength);
-                         currentColor.w = Math.max(0, currentColor.w - falloff * brushStrength);
-                    } else {
-                        currentColor.lerp(targetColor, falloff * brushStrength);
+                    let otherWeightsSum = 0;
+                    for(let j=1; j<textureMapping.length; ++j) {
+                        if(j !== textureIndex) otherWeightsSum += weights[j-1];
                     }
-                    
-                    let sum = currentColor.x + currentColor.y + currentColor.z + currentColor.w;
-                    if (sum > 1.0) {
-                        currentColor.divideScalar(sum);
+                    if(textureIndex > 0) {
+                        weights[textureIndex-1] += falloff;
+                    }
+                    let totalSum = 0;
+                    for(let j=1; j<textureMapping.length; ++j) totalSum += weights[j-1];
+                    if (totalSum > 1.0) {
+                        for(let j=1; j<textureMapping.length; ++j) weights[j-1] /= totalSum;
                     }
-                    colors.setXYZW(i, currentColor.x, currentColor.y, currentColor.z, currentColor.w);
+                    
+                    colors.setXYZW(i, weights[0]||0, weights[1]||0, weights[2]||0, weights[3]||0);
+                    colors2.setXYZW(i, weights[4]||0, weights[5]||0, weights[6]||0, weights[7]||0);
                 }
             }
             colors.needsUpdate = true;
+            colors2.needsUpdate = true;
         }
 
         function placeObject(intersection) {
             const brushSize = parseFloat(document.getElementById('brush-size').value);
             const density = parseFloat(document.getElementById('brush-strength').value) * 2;
             const dummy = new THREE.Object3D();
-            
             for (let i = 0; i < density; i++) {
                 if (grassInstances.count >= MAX_GRASS_COUNT) break;
-
-                const randomPoint = new THREE.Vector2(
-                    (Math.random() - 0.5) * brushSize * 2,
-                    (Math.random() - 0.5) * brushSize * 2
-                );
-                
-                dummy.position.set(
-                    intersection.point.x + randomPoint.x,
-                    intersection.point.y,
-                    intersection.point.z + randomPoint.y
-                );
-                
-                const placementRaycaster = new THREE.Raycaster(
-                    new THREE.Vector3(dummy.position.x, 100, dummy.position.z),
-                    new THREE.Vector3(0, -1, 0)
-                );
-                const placementIntersects = placementRaycaster.intersectObject(terrainMesh);
-                
+                const randomPoint = new THREE.Vector2((Math.random() - 0.5) * brushSize * 2, (Math.random() - 0.5) * brushSize * 2);
+                raycaster.set( new THREE.Vector3(intersection.point.x + randomPoint.x, 100, intersection.point.z + randomPoint.y), new THREE.Vector3(0, -1, 0));
+                const placementIntersects = raycaster.intersectObject(terrainMesh);
                 if (placementIntersects.length > 0) {
                     dummy.position.copy(placementIntersects[0].point);
                     dummy.rotation.y = Math.random() * Math.PI * 2;
-                    dummy.scale.set(1, Math.random() * 0.5 + 0.75, 1);
+                    dummy.scale.setScalar(Math.random() * 0.5 + 0.75);
                     dummy.updateMatrix();
                     grassInstances.setMatrixAt(grassInstances.count++, dummy.matrix);
                 }
             }
-             grassInstances.instanceMatrix.needsUpdate = true;
+            grassInstances.instanceMatrix.needsUpdate = true;
         }
 
         async function saveProject() {
             const projectName = document.getElementById('project-name').value.trim();
-            if (!projectName) { alert("Пожалуйста, введите имя проекта."); return; }
-            if (!terrainMesh) { alert("Сначала создайте ландшафт для сохранения."); return; }
+            if (!projectName || !terrainMesh) { alert("Введите имя проекта и создайте ландшафт."); return; }
             showSpinner(true);
-
             const grassMatrices = [];
             for (let i = 0; i < grassInstances.count; i++) {
                 const matrix = new THREE.Matrix4();
                 grassInstances.getMatrixAt(i, matrix);
                 grassMatrices.push(...matrix.elements);
             }
-            
             const projectData = {
                 name: projectName,
-                width: terrainDimensions.width,
-                height: terrainDimensions.height,
+                width: terrainDimensions.width, height: terrainDimensions.height,
                 heights: Array.from(terrainMesh.geometry.attributes.position.array.filter((_, i) => i % 3 === 1)),
                 colors: Array.from(terrainMesh.geometry.attributes.color.array),
-                foliage: {
-                    grass: grassMatrices
-                }
+                colors2: Array.from(terrainMesh.geometry.attributes.color2.array),
+                foliage: { grass: grassMatrices },
+                customTextures: textureMapping.slice(5)
             };
-            
             try {
-                const response = await fetch('/api/project', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify(projectData)
-                });
-                const result = await response.json();
-                if (!response.ok) throw new Error(result.error || 'Ошибка при сохранении проекта.');
-                alert(`Проект '${projectName}' успешно сохранен!`);
-
+                const response = await fetch('/api/project', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(projectData) });
+                if (!response.ok) throw new Error((await response.json()).error || 'Ошибка сохранения.');
+                alert(`Проект '${projectName}' сохранен!`);
                 const projectList = document.getElementById('project-list');
-                if (!Array.from(projectList.options).some(opt => opt.value === projectName)) {
+                if (![...projectList.options].some(opt => opt.value === projectName)) {
                     const newOption = document.createElement('option');
                     newOption.value = newOption.textContent = projectName;
                     projectList.appendChild(newOption);
                 }
-            } catch (error) {
-                alert(`Не удалось сохранить проект: ${error.message}`);
-            } finally {
-                showSpinner(false);
-            }
+            } catch (error) { alert(`Ошибка: ${error.message}`); } finally { showSpinner(false); }
         }
-        
         async function loadProject() {
             const projectName = document.getElementById('project-list').value;
-            if (!projectName) { alert("Пожалуйста, выберите проект для загрузки."); return; }
+            if (!projectName) { alert("Выберите проект."); return; }
             showSpinner(true);
-
             try {
                 const response = await fetch(`/api/project/${projectName}`);
                 const result = await response.json();
-                if (!response.ok) throw new Error(result.error || 'Ошибка при загрузке проекта.');
+                if (!response.ok) throw new Error(result.error || 'Ошибка загрузки.');
                 
+                if (result.customTextures) {
+                    for(const texName of result.customTextures) {
+                        if (!textureMapping.includes(texName.name)) {
+                           addCustomTexture(texName.name, texName.url, false);
+                        }
+                    }
+                }
                 createTerrain(result.width, result.height, result);
                 document.getElementById('project-name').value = projectName;
                 document.getElementById('terrain-width').value = result.width;
                 document.getElementById('terrain-height').value = result.height;
-            } catch (error) {
-                alert(`Не удалось загрузить проект: ${error.message}`);
-            } finally {
-                showSpinner(false);
-            }
+            } catch (error) { alert(`Ошибка: ${error.message}`); } finally { showSpinner(false); }
         }
 
+        function addCustomTexture(nameOverride, urlOverride, fromUI = true) {
+            if (textureMapping.length >= 9) { alert("Достигнут лимит текстур."); return; }
+            const name = fromUI ? document.getElementById('texture-name-input').value.trim() : nameOverride;
+            const url = fromUI ? document.getElementById('texture-url-input').value.trim() : urlOverride;
+            if (!name || !url) { alert("Введите имя и URL."); return; }
+            if (textureMapping.includes(name)) { alert("Текстура с таким именем уже есть."); return; }
+
+            const newTexture = loadTexture(url);
+            textureMapping.push({name: name, url: url});
+            terrainMaterial.uniforms.textures.value.push(newTexture);
+
+            const container = document.getElementById('texture-selector');
+            const label = document.createElement('label');
+            const radio = document.createElement('input');
+            radio.type = 'radio';
+            radio.name = 'texture-type';
+            radio.value = name;
+            label.appendChild(radio);
+            label.appendChild(document.createTextNode(" " + name));
+            container.appendChild(label);
+            if(fromUI) {
+                document.getElementById('texture-name-input').value = '';
+                document.getElementById('texture-url-input').value = '';
+            }
+        }
         function updatePlayer(deltaTime) {
-            let speed = playerSpeed;
-            let speedDelta = deltaTime * speed;
+            const speed = playerSpeed * deltaTime;
+            const moveVector = new THREE.Vector3();
+            if (keyStates['KeyW']) moveVector.z -= 1;
+            if (keyStates['KeyS']) moveVector.z += 1;
+            if (keyStates['KeyA']) moveVector.x -= 1;
+            if (keyStates['KeyD']) moveVector.x += 1;
+            moveVector.normalize().multiplyScalar(speed).applyQuaternion(camera.quaternion);
 
-            if (keyStates['KeyW']) playerVelocity.z -= speedDelta;
-            if (keyStates['KeyS']) playerVelocity.z += speedDelta;
-            if (keyStates['KeyA']) playerVelocity.x -= speedDelta;
-            if (keyStates['KeyD']) playerVelocity.x += speedDelta;
+            playerVelocity.y += gravity * deltaTime;
             
-            if (playerOnGround && keyStates['Space']) {
-                playerVelocity.y = playerJumpHeight;
-            }
+            const potentialPosition = player.position.clone().add(moveVector);
+            const down = new THREE.Vector3(0,-1,0);
+            
+            raycaster.set(potentialPosition.clone().setY(potentialPosition.y + 1), down);
+            let intersects = raycaster.intersectObject(terrainMesh);
 
-            playerVelocity.y += gravity * deltaTime;
+            if(intersects.length > 0) {
+                const groundNormal = intersects[0].face.normal;
+                if(groundNormal.y >= maxSlope) {
+                   player.position.add(moveVector);
+                }
+            } else {
+                 player.position.add(moveVector);
+            }
 
-            const moveDirection = new THREE.Vector3(playerVelocity.x, 0, playerVelocity.z);
-            moveDirection.applyQuaternion(camera.quaternion);
-            
-            player.position.x += moveDirection.x;
-            player.position.z += moveDirection.z;
             player.position.y += playerVelocity.y * deltaTime;
             
-            playerVelocity.x *= 0.9;
-            playerVelocity.z *= 0.9;
-
-            raycaster.set(player.position, new THREE.Vector3(0, -1, 0));
-            if (terrainMesh) {
-                const intersects = raycaster.intersectObject(terrainMesh);
-                if (intersects.length > 0) {
-                    const groundHeight = intersects[0].point.y;
-                    if (player.position.y < groundHeight + playerHeight) {
-                        player.position.y = groundHeight + playerHeight;
-                        playerVelocity.y = 0;
-                        playerOnGround = true;
-                    } else {
-                        playerOnGround = false;
-                    }
+            raycaster.set(player.position, down);
+            intersects = raycaster.intersectObject(terrainMesh);
+            if (intersects.length > 0) {
+                const groundHeight = intersects[0].point.y;
+                if (player.position.y < groundHeight + playerHeight) {
+                    player.position.y = groundHeight + playerHeight;
+                    playerVelocity.y = 0;
+                    playerOnGround = true;
+                } else {
+                    playerOnGround = false;
                 }
             }
+             if (playerOnGround && keyStates['Space']) playerVelocity.y = playerJumpHeight;
+
             camera.position.copy(player.position);
         }
 
         function animate() {
             requestAnimationFrame(animate);
             const deltaTime = clock.getDelta();
+            grassMaterial.uniforms.time.value += deltaTime;
+            
+            if (isPlayMode && pointerLockControls.isLocked) updatePlayer(deltaTime);
+            else orbitControls.update();
             
-            if (isPlayMode && pointerLockControls.isLocked) {
-                updatePlayer(deltaTime);
-            } else {
-                orbitControls.update();
-            }
             composer.render();
         }