Update app.py

app.py

@@ -1,4 +1,4 @@
-import os
+Конечно, вот полный код проекта с реализованными улучшениями:Сохранение и загрузка замененных и новых текстур: Теперь пользовательские текстуры кодируются в формат Base64 и сохраняются непосредственно в файле проекта. При загрузке проекта они восстанавливаются.Создание новых слотов для текстур: Добавлена панель для создания новых слотов текстур. Вы можете задать имя, выбрать файл, и он появится в списке текстур для рисования. Система теперь поддерживает до 8 слоев текстур.Новые инструменты для ландшафта: Добавлены два новых режима кисти:Сгладить (Flatten): Усредняет высоту ландшафта под кистью, делая переходы более плавными. Запоминает высоту в точке первого клика.Выровнять (Level): Устанавливает высоту ландшафта под кистью на заданное значение. Появилось поле для ввода целевой высоты.Вот полный код: code Pythondownloadcontent_copyexpand_less    import os
 import json
 import time
 from datetime import datetime
@@ -127,8 +127,10 @@ EDITOR_TEMPLATE = '''
         button.play-button:hover { background: #33cc33; }
         .slider-container { margin-top: 10px; }
         input[type="range"] { width: 100%; }
-        .radio-group label { display: inline-block; margin-right: 10px; cursor: pointer; }
+        .radio-group { display: flex; flex-wrap: wrap; }
+        .radio-group label { display: inline-block; margin-right: 10px; cursor: pointer; width: 45%; margin-bottom: 5px; }
         .radio-group input { margin-right: 5px; }
+        #level-brush-settings { display: none; }
 
         #loading-spinner {
             position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
@@ -202,10 +204,16 @@ EDITOR_TEMPLATE = '''
                 <div class="radio-group">
                     <label><input type="radio" name="brush-mode" value="raise" checked> Поднять</label>
                     <label><input type="radio" name="brush-mode" value="lower"> Опустить</label>
+                    <label><input type="radio" name="brush-mode" value="flatten"> Сгладить</label>
+                    <label><input type="radio" name="brush-mode" value="level"> Выровнять</label>
                     <label><input type="radio" name="brush-mode" value="roughen"> Шум</label>
                     <label><input type="radio" name="brush-mode" value="paint"> Текстура</label>
                     <label><input type="radio" name="brush-mode" value="place"> Объект</label>
                 </div>
+                <div id="level-brush-settings">
+                    <label for="brush-level-height">Высота:</label>
+                    <input type="number" id="brush-level-height" value="10">
+                </div>
                 <div class="slider-container">
                     <label for="brush-size">Размер: <span id="brush-size-value">10</span></label>
                     <input type="range" id="brush-size" min="1" max="50" value="10">
@@ -218,27 +226,25 @@ EDITOR_TEMPLATE = '''
             <div class="ui-group">
                 <h3>Текстуры ландшафта</h3>
                 <div class="radio-group" id="texture-selector">
-                    <label><input type="radio" name="texture-type" value="grass" checked> Трава</label>
-                    <label><input type="radio" name="texture-type" value="rock"> Скалы</label>
-                    <label><input type="radio" name="texture-type" value="dirt"> Грунт</label>
-                    <label><input type="radio" name="texture-type" value="snow"> Снег</label>
-                    <label><input type="radio" name="texture-type" value="sand"> Песок</label>
                 </div>
             </div>
              <div class="ui-group">
                 <h3>Управление текстурами</h3>
-                <label for="texture-to-replace">Заменить текстуру:</label>
+                <label for="texture-to-replace">Слот текстуры:</label>
                 <select id="texture-to-replace">
-                    <option value="grass">Трава</option>
-                    <option value="rock">Скалы</option>
-                    <option value="dirt">Грунт</option>
-                    <option value="snow">Снег</option>
-                    <option value="sand">Песок</option>
                 </select>
-                <label for="custom-texture-file">Выберите ��айл:</label>
+                <label for="custom-texture-file">Заменить файл:</label>
                 <input type="file" id="custom-texture-file" accept="image/*">
                 <button id="update-texture-btn">Обновить текстуру</button>
             </div>
+            <div class="ui-group">
+                <h3>Новая текстура</h3>
+                 <label for="new-texture-name">Имя слота (eng):</label>
+                <input type="text" id="new-texture-name" placeholder="lava">
+                <label for="new-texture-file">Файл текстуры:</label>
+                <input type="file" id="new-texture-file" accept="image/*">
+                <button id="add-new-texture-btn">Добавить новую текстуру</button>
+            </div>
             <div class="ui-group">
                 <h3>Объекты</h3>
                 <div class="radio-group" id="object-selector">
@@ -288,6 +294,7 @@ EDITOR_TEMPLATE = '''
         let raycaster = new THREE.Raycaster();
         let mouse = new THREE.Vector2();
         let isEditing = false;
+        let flattenInitialHeight = 0;
         const noise2D = createNoise2D();
         
         let grassInstances, grassMaterial;
@@ -305,6 +312,10 @@ EDITOR_TEMPLATE = '''
         const clock = new THREE.Clock();
 
         const textureLoader = new THREE.TextureLoader();
+        let textureSlots = {};
+        let textureDataUrls = {};
+        const MAX_TEXTURES = 8;
+
         const loadTexture = (url) => {
             const tex = textureLoader.load(url);
             tex.wrapS = THREE.RepeatWrapping;
@@ -313,89 +324,60 @@ 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')
+        const defaultTextures = {
+            base: { name: 'Трава (База)', url: 'https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/grasslight-big.jpg' },
+            tex1: { name: 'Скалы', url: 'https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/rock.jpg' },
+            tex2: { name: 'Грунт', url: 'https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg' },
+            tex3: { name: 'Снег', url: 'https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/snow.jpg' },
+            tex4: { name: 'Песок', url: 'https://cdn.jsdelivr.net/gh/mrdoob/three.js/examples/textures/terrain/sand-512.jpg' }
         };
+
+        function generateShaderUniforms() {
+            const uniforms = {
+                lightDirection: { value: new THREE.Vector3(0.5, 0.5, 0.5).normalize() }
+            };
+            for (let i = 0; i < MAX_TEXTURES; i++) {
+                uniforms[`texture${i}`] = { value: null };
+            }
+            return uniforms;
+        }
         
         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 },
-                lightDirection: { value: new THREE.Vector3(0.5, 0.5, 0.5).normalize() }
-            },
+            uniforms: generateShaderUniforms(),
             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;
+                    vColor2 = color2;
                     vNormal = normalize(normalMatrix * normal);
-                    vTangent = normalize(normalMatrix * tangent.xyz);
-                    vBitangent = normalize(cross(vNormal, vTangent) * tangent.w);
-                    gl_Position = projectionMatrix * mvPosition;
+                    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;
+                ${Array.from({ length: MAX_TEXTURES }, (_, i) => `uniform sampler2D texture${i};`).join('\n')}
                 uniform vec3 lightDirection;
-
                 varying vec2 vUv;
                 varying vec4 vColor;
+                varying vec4 vColor2;
                 varying vec3 vNormal;
-                varying vec3 vViewPosition;
-                varying vec3 vTangent;
-                varying vec3 vBitangent;
-
                 void main() {
                     vec2 uv_scaled = vUv * 30.0;
+                    vec3 finalColor = texture2D(texture0, uv_scaled).rgb;
+                    if (vColor.r > 0.0) finalColor = mix(finalColor, texture2D(texture1, uv_scaled).rgb, vColor.r);
+                    if (vColor.g > 0.0) finalColor = mix(finalColor, texture2D(texture2, uv_scaled).rgb, vColor.g);
+                    if (vColor.b > 0.0) finalColor = mix(finalColor, texture2D(texture3, uv_scaled).rgb, vColor.b);
+                    if (vColor.a > 0.0) finalColor = mix(finalColor, texture2D(texture4, uv_scaled).rgb, vColor.a);
+                    if (vColor2.r > 0.0) finalColor = mix(finalColor, texture2D(texture5, uv_scaled).rgb, vColor2.r);
+                    if (vColor2.g > 0.0) finalColor = mix(finalColor, texture2D(texture6, uv_scaled).rgb, vColor2.g);
+                    if (vColor2.b > 0.0) finalColor = mix(finalColor, texture2D(texture7, uv_scaled).rgb, vColor2.b);
                     
-                    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);
                 }
             `
@@ -403,7 +385,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);
 
@@ -411,7 +392,6 @@ EDITOR_TEMPLATE = '''
             renderer.setSize(window.innerWidth, window.innerHeight);
             renderer.setPixelRatio(window.devicePixelRatio);
             renderer.shadowMap.enabled = true;
-            renderer.shadowMap.type = THREE.PCFSoftShadowMap;
             renderer.toneMapping = THREE.ACESFilmicToneMapping;
             renderer.outputColorSpace = THREE.SRGBColorSpace;
             document.body.appendChild(renderer.domElement);
@@ -428,11 +408,6 @@ EDITOR_TEMPLATE = '''
             dirLight.castShadow = true;
             dirLight.shadow.mapSize.width = 2048;
             dirLight.shadow.mapSize.height = 2048;
-            dirLight.shadow.camera.top = 100;
-            dirLight.shadow.camera.bottom = -100;
-            dirLight.shadow.camera.left = -100;
-            dirLight.shadow.camera.right = 100;
-            dirLight.shadow.bias = -0.001;
             scene.add(dirLight);
             terrainMaterial.uniforms.lightDirection.value = dirLight.position.clone().normalize();
 
@@ -440,23 +415,16 @@ 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;
-            uniforms[ 'mieCoefficient' ].value = effectController.mieCoefficient;
-            uniforms[ 'mieDirectionalG' ].value = effectController.mieDirectionalG;
-            const phi = THREE.MathUtils.degToRad( 90 - effectController.elevation );
-            const theta = THREE.MathUtils.degToRad( effectController.azimuth );
-            sun.setFromSphericalCoords( 1, phi, theta );
-            uniforms[ 'sunPosition' ].value.copy( sun );
+            uniforms['turbidity'].value = effectController.turbidity;
+            uniforms['rayleigh'].value = effectController.rayleigh;
+            uniforms['mieCoefficient'].value = effectController.mieCoefficient;
+            uniforms['mieDirectionalG'].value = effectController.mieDirectionalG;
+            const phi = THREE.MathUtils.degToRad(90 - effectController.elevation);
+            const theta = THREE.MathUtils.degToRad(effectController.azimuth);
+            sun.setFromSphericalCoords(1, phi, theta);
+            uniforms['sunPosition'].value.copy(sun);
             dirLight.position.copy(sun).multiplyScalar(100);
 
             const brushGeometry = new THREE.CylinderGeometry(1, 1, 100, 32, 1, true);
@@ -468,78 +436,45 @@ EDITOR_TEMPLATE = '''
             initFoliage();
             initPostprocessing();
             initPlayer();
-
-            window.addEventListener('resize', onWindowResize);
-            renderer.domElement.addEventListener('pointermove', onPointerMove);
-            renderer.domElement.addEventListener('pointerdown', onPointerDown);
-            renderer.domElement.addEventListener('pointerup', onPointerUp);
-            renderer.domElement.addEventListener('pointerout', () => { brushHelper.visible = false; });
-            
+            initializeTextureSlots();
             setupUIListeners();
             animate();
         }
 
         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();
-                grassMaterial.dispose();
-            }
+            if (grassInstances) scene.remove(grassInstances);
             const grassTexture = textureLoader.load('https://threejs.org/examples/textures/sprites/grass.png');
             grassMaterial = new THREE.ShaderMaterial({
-                uniforms: {
-                    time: { value: 0 },
-                    map: { value: grassTexture }
-                },
+                uniforms: { time: { value: 0 }, map: { value: grassTexture } },
                 vertexShader: `
-                    uniform float time;
-                    varying vec2 vUv;
-                    
+                    uniform float time; varying vec2 vUv;
                     void main() {
-                        vUv = uv;
-                        vec3 pos = position;
-                        
-                        mat4 instanceMatrix_ = instanceMatrix;
-                        vec3 instancePosition = vec3(instanceMatrix_[3][0], instanceMatrix_[3][1], instanceMatrix_[3][2]);
-                        
-                        float windStrength = 0.2;
-                        float windSpeed = 2.0;
+                        vUv = uv; vec3 pos = position;
+                        vec3 instancePosition = vec3(instanceMatrix[3][0], instanceMatrix[3][1], instanceMatrix[3][2]);
+                        float windStrength = 0.2, windSpeed = 2.0;
                         float noise = (sin(instancePosition.x * 0.5 + time * windSpeed) + cos(instancePosition.z * 0.5 + time * windSpeed)) * 0.5 + 0.5;
-                        
-                        if (pos.y > 0.1) { // Only affect top vertices
-                            pos.x += noise * windStrength;
-                        }
-
+                        if (pos.y > 0.1) { pos.x += noise * windStrength; }
                         gl_Position = projectionMatrix * modelViewMatrix * instanceMatrix * vec4(pos, 1.0);
                     }
                 `,
                 fragmentShader: `
-                    uniform sampler2D map;
-                    varying vec2 vUv;
-
+                    uniform sampler2D map; varying vec2 vUv;
                     void main() {
                         vec4 texColor = texture2D(map, vUv);
                         if (texColor.a < 0.5) discard;
                         gl_FragColor = texColor;
                     }
                 `,
-                side: THREE.DoubleSide,
-                transparent: true
+                side: THREE.DoubleSide, transparent: true
             });
 
             const grassBlade = new THREE.PlaneGeometry(0.8, 1.8);
@@ -553,108 +488,123 @@ 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('keyup', (event) => { keyStates[event.code] = false; });
-            document.addEventListener('keydown', (event) => {
-                if (isPlayMode && event.code === 'Escape') {
-                    togglePlayMode();
-                }
-            });
+            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('update-texture-btn').addEventListener('click', updateCustomTexture);
+            document.getElementById('add-new-texture-btn').addEventListener('click', addNewTextureSlot);
+            document.querySelectorAll('input[name="brush-mode"]').forEach(radio => radio.addEventListener('change', (e) => { document.getElementById('level-brush-settings').style.display = e.target.value === 'level' ? 'block' : 'none'; }));
         }
         
-        function updateCustomTexture() {
-            const fileInput = document.getElementById('custom-texture-file');
-            const textureSlot = document.getElementById('texture-to-replace').value;
-            
-            if (fileInput.files.length === 0) {
-                alert('Пожалуйста, выберите файл изображения.');
+        function initializeTextureSlots() {
+            addTextureSlot('base', defaultTextures.base.name, defaultTextures.base.url, false);
+            addTextureSlot('tex1', defaultTextures.tex1.name, defaultTextures.tex1.url);
+            addTextureSlot('tex2', defaultTextures.tex2.name, defaultTextures.tex2.url);
+            addTextureSlot('tex3', defaultTextures.tex3.name, defaultTextures.tex3.url);
+            addTextureSlot('tex4', defaultTextures.tex4.name, defaultTextures.tex4.url);
+        }
+        
+        function addTextureSlot(id, name, urlOrData, isRemovable = true) {
+            if (Object.keys(textureSlots).length >= MAX_TEXTURES) {
+                alert(`Достигнут лимит текстур (${MAX_TEXTURES}).`);
                 return;
             }
+            const index = Object.keys(textureSlots).length;
+            textureSlots[id] = { id, name, index };
             
+            const texture = loadTexture(urlOrData);
+            terrainMaterial.uniforms[`texture${index}`].value = texture;
+
+            if (urlOrData.startsWith('data:image')) {
+                textureDataUrls[id] = urlOrData;
+            }
+
+            const textureSelector = document.getElementById('texture-selector');
+            const label = document.createElement('label');
+            label.innerHTML = `<input type="radio" name="texture-type" value="${id}" data-index="${index}" ${index === 0 ? 'checked' : ''}> ${name}`;
+            textureSelector.appendChild(label);
+
+            const textureReplacer = document.getElementById('texture-to-replace');
+            const option = document.createElement('option');
+            option.value = id;
+            option.textContent = name;
+            textureReplacer.appendChild(option);
+        }
+
+        function fileToDataUrl(file) {
+            return new Promise((resolve, reject) => {
+                const reader = new FileReader();
+                reader.onload = () => resolve(reader.result);
+                reader.onerror = reject;
+                reader.readAsDataURL(file);
+            });
+        }
+        
+        async function updateCustomTexture() {
+            const fileInput = document.getElementById('custom-texture-file');
+            const slotId = document.getElementById('texture-to-replace').value;
+            if (fileInput.files.length === 0) { alert('Пожалуйста, выберите файл.'); return; }
             const file = fileInput.files[0];
-            const url = URL.createObjectURL(file);
+            const dataUrl = await fileToDataUrl(file);
             
-            const newTexture = loadTexture(url);
+            textureDataUrls[slotId] = dataUrl;
+            const newTexture = loadTexture(dataUrl);
+            const index = textureSlots[slotId].index;
+            terrainMaterial.uniforms[`texture${index}`].value.dispose();
+            terrainMaterial.uniforms[`texture${index}`].value = newTexture;
+        }
+
+        async function addNewTextureSlot() {
+            const nameInput = document.getElementById('new-texture-name');
+            const fileInput = document.getElementById('new-texture-file');
+            const slotId = nameInput.value.trim().toLowerCase().replace(/\s+/g, '_');
+            if (!slotId) { alert('Введите имя слота.'); return; }
+            if (textureSlots[slotId]) { alert('Слот с таким именем уже существует.'); return; }
+            if (fileInput.files.length === 0) { alert('Выберите файл текстуры.'); return; }
             
-            const uniformName = textureSlot + 'Texture';
+            const file = fileInput.files[0];
+            const dataUrl = await fileToDataUrl(file);
             
-            if (terrainMaterial.uniforms[uniformName]) {
-                const oldTexture = terrainMaterial.uniforms[uniformName].value;
-                if (oldTexture) {
-                    oldTexture.dispose();
-                }
-                terrainMaterial.uniforms[uniformName].value = newTexture;
-                terrainMaterial.needsUpdate = true;
-                alert(`Текстура для "${textureSlot}" успешно обновлена.`);
-            }
+            addTextureSlot(slotId, nameInput.value.trim(), dataUrl);
+            nameInput.value = '';
+            fileInput.value = '';
         }
 
         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';
                 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);
-                }
+                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';
                 orbitControls.enabled = true;
                 pointerLockControls.unlock();
@@ -666,10 +616,7 @@ EDITOR_TEMPLATE = '''
         }
 
         function createTerrain(width, height, terrainData = null) {
-            if (terrainMesh) {
-                scene.remove(terrainMesh);
-                terrainMesh.geometry.dispose();
-            }
+            if (terrainMesh) scene.remove(terrainMesh);
             initFoliage();
 
             terrainDimensions.width = width;
@@ -677,38 +624,29 @@ EDITOR_TEMPLATE = '''
             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);
-                }
-                if (terrainData.foliage && terrainData.foliage.grass) {
+                geometry.attributes.position.array.filter((_, i) => i % 3 === 1).forEach((_, i) => {
+                    geometry.attributes.position.setY(i, terrainData.heights[i]);
+                });
+                if (terrainData.colors) geometry.attributes.color.array.set(terrainData.colors);
+                if (terrainData.colors2) geometry.attributes.color2.array.set(terrainData.colors2);
+                if (terrainData.foliage?.grass) {
                     const matrices = terrainData.foliage.grass;
                     grassInstances.count = matrices.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(matrices, i * 16));
                     }
                     grassInstances.instanceMatrix.needsUpdate = true;
                 }
             }
             
-            geometry.computeTangents();
             geometry.computeVertexNormals();
-
             terrainMesh = new THREE.Mesh(geometry, terrainMaterial);
             terrainMesh.castShadow = true;
             terrainMesh.receiveShadow = true;
@@ -722,31 +660,21 @@ 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).y = 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;
@@ -759,22 +687,18 @@ EDITOR_TEMPLATE = '''
         }
 
         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;
+            if (isPlayMode || event.button !== 0 || mouse.x < -0.9) return;
+            isEditing = true;
+            orbitControls.enabled = false;
+            if (getBrushMode() === 'flatten') {
+                raycaster.setFromCamera(mouse, camera);
+                const intersects = raycaster.intersectObject(terrainMesh);
+                if (intersects.length > 0) flattenInitialHeight = intersects[0].point.y;
             }
         }
 
         function onPointerUp(event) {
-            if (isPlayMode) return;
-            if (event.button === 0) {
-                isEditing = false;
-                orbitControls.enabled = true;
-            }
+            if (event.button === 0) { isEditing = false; orbitControls.enabled = true; }
         }
         
         function applyBrush(intersection) {
@@ -782,6 +706,8 @@ EDITOR_TEMPLATE = '''
             const brushMode = getBrushMode();
             switch(brushMode) {
                 case 'raise': case 'lower': sculptTerrain(intersection.point, brushMode); break;
+                case 'flatten': flattenTerrain(intersection.point); break;
+                case 'level': levelTerrain(intersection.point); break;
                 case 'roughen': roughenTerrain(intersection.point); break;
                 case 'paint': paintTexture(intersection.point); break;
                 case 'place': placeObject(intersection); break;
@@ -794,20 +720,55 @@ EDITOR_TEMPLATE = '''
             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 dist = vertex.distanceTo(center);
+                if (dist < brushSize) {
+                    const falloff = Math.pow(1 - (dist / brushSize), 2);
+                    positions.setY(i, positions.getY(i) + direction * falloff * brushStrength);
+                }
+            }
+            positions.needsUpdate = true;
+            terrainMesh.geometry.computeVertexNormals();
+        }
+        
+        function flattenTerrain(center) {
+            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 vertex = new THREE.Vector3();
+            for (let i = 0; i < positions.count; i++) {
+                vertex.fromBufferAttribute(positions, i);
+                const dist = vertex.distanceTo(center);
+                if (dist < brushSize) {
+                    const falloff = Math.pow(1 - (dist / brushSize), 2);
+                    const currentY = positions.getY(i);
+                    const newY = THREE.MathUtils.lerp(currentY, flattenInitialHeight, falloff * brushStrength);
+                    positions.setY(i, newY);
+                }
+            }
+            positions.needsUpdate = true;
+            terrainMesh.geometry.computeVertexNormals();
+        }
 
+        function levelTerrain(center) {
+            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 targetHeight = parseFloat(document.getElementById('brush-level-height').value);
+            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;
+                const dist = vertex.distanceTo(center);
+                if (dist < brushSize) {
+                    const falloff = Math.pow(1 - (dist / brushSize), 2);
+                    const currentY = positions.getY(i);
+                    const newY = THREE.MathUtils.lerp(currentY, targetHeight, falloff * brushStrength);
                     positions.setY(i, newY);
                 }
             }
             positions.needsUpdate = true;
             terrainMesh.geometry.computeVertexNormals();
-            terrainMesh.geometry.computeTangents();
         }
 
         function roughenTerrain(center) {
@@ -815,91 +776,66 @@ EDITOR_TEMPLATE = '''
             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);
+                const dist = vertex.distanceTo(center);
+                if (dist < brushSize) {
+                    const falloff = Math.pow(1 - (dist / brushSize), 2);
+                    let noiseVal = noise2D(vertex.x * 1.5, vertex.z * 1.5);
+                    positions.setY(i, positions.getY(i) + noiseVal * falloff * brushStrength);
                 }
             }
             positions.needsUpdate = true;
             terrainMesh.geometry.computeVertexNormals();
-            terrainMesh.geometry.computeTangents();
         }
         
         function paintTexture(center) {
             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 selectedTextureRadio = document.querySelector('input[name="texture-type"]:checked');
+            if (!selectedTextureRadio) return;
+            const textureIndex = parseInt(selectedTextureRadio.dataset.index);
 
             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);
-                    
-                    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);
+                    const falloff = Math.pow(1 - (distance / brushSize), 2) * brushStrength;
+                    if (textureIndex === 0) { // Base texture (grass)
+                        colors.setX(i, Math.max(0, colors.getX(i) - falloff));
+                        colors.setY(i, Math.max(0, colors.getY(i) - falloff));
+                        colors.setZ(i, Math.max(0, colors.getZ(i) - falloff));
+                        colors.setW(i, Math.max(0, colors.getW(i) - falloff));
+                        colors2.setX(i, Math.max(0, colors2.getX(i) - falloff));
+                        colors2.setY(i, Math.max(0, colors2.getY(i) - falloff));
+                        colors2.setZ(i, Math.max(0, colors2.getZ(i) - falloff));
                     } else {
-                        currentColor.lerp(targetColor, falloff * brushStrength);
-                    }
-                    
-                    let sum = currentColor.x + currentColor.y + currentColor.z + currentColor.w;
-                    if (sum > 1.0) {
-                        currentColor.divideScalar(sum);
+                        let targetAttr, targetComponent;
+                        if (textureIndex <= 4) { targetAttr = colors; targetComponent = textureIndex - 1; } 
+                        else { targetAttr = colors2; targetComponent = textureIndex - 5; }
+
+                        let currentVal = targetAttr.getComponent(i, targetComponent);
+                        targetAttr.setComponent(i, targetComponent, Math.min(1.0, currentVal + falloff));
                     }
-                    colors.setXYZW(i, currentColor.x, currentColor.y, currentColor.z, currentColor.w);
                 }
             }
             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 randomPoint = new THREE.Vector2((Math.random() - 0.5) * brushSize * 2, (Math.random() - 0.5) * brushSize * 2);
+                const placementRaycaster = new THREE.Raycaster(new THREE.Vector3(intersection.point.x + randomPoint.x, 100, intersection.point.z + randomPoint.y), new THREE.Vector3(0, -1, 0));
                 const placementIntersects = placementRaycaster.intersectObject(terrainMesh);
-                
                 if (placementIntersects.length > 0) {
                     dummy.position.copy(placementIntersects[0].point);
                     dummy.rotation.y = Math.random() * Math.PI * 2;
@@ -913,38 +849,30 @@ EDITOR_TEMPLATE = '''
 
         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,
                 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),
+                textureDataUrls: textureDataUrls,
+                textureSlots: Object.values(textureSlots),
+                foliage: { grass: grassMatrices }
             };
-            
             try {
-                const response = await fetch('/api/project', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify(projectData)
-                });
+                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}' успешно сохранен!`);
-
+                if (!response.ok) throw new Error(result.error || 'Ошибка сохранения.');
+                alert(`Проект '${projectName}' сохранен!`);
                 const projectList = document.getElementById('project-list');
                 if (!Array.from(projectList.options).some(opt => opt.value === projectName)) {
                     const newOption = document.createElement('option');
@@ -952,7 +880,7 @@ EDITOR_TEMPLATE = '''
                     projectList.appendChild(newOption);
                 }
             } catch (error) {
-                alert(`Не удалось сохранить проект: ${error.message}`);
+                alert(`Ошибка: ${error.message}`);
             } finally {
                 showSpinner(false);
             }
@@ -960,56 +888,54 @@ EDITOR_TEMPLATE = '''
         
         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 || 'Ошибка загрузки.');
+                
+                document.getElementById('texture-selector').innerHTML = '';
+                document.getElementById('texture-to-replace').innerHTML = '';
+                textureSlots = {};
+                textureDataUrls = result.textureDataUrls || {};
                 
+                if (result.textureSlots && result.textureSlots.length > 0) {
+                     result.textureSlots.forEach(slot => {
+                        const url = textureDataUrls[slot.id] || defaultTextures[slot.id]?.url;
+                        if(url) addTextureSlot(slot.id, slot.name, url);
+                    });
+                } else {
+                    initializeTextureSlots();
+                }
+
                 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}`);
+                alert(`Ошибка: ${error.message}`);
             } finally {
                 showSpinner(false);
             }
         }
 
         function updatePlayer(deltaTime) {
-            if (!terrainMesh) return;
-        
-            let speedDelta = deltaTime * playerSpeed;
+            if (!terrainMesh || !pointerLockControls.isLocked) return;
+            const speedDelta = deltaTime * playerSpeed;
             const moveVector = new THREE.Vector3(0, 0, 0);
-
             if (keyStates['KeyW']) moveVector.z -= 1;
             if (keyStates['KeyS']) moveVector.z += 1;
             if (keyStates['KeyA']) moveVector.x -= 1;
             if (keyStates['KeyD']) moveVector.x += 1;
-            
-            if (playerOnGround && keyStates['Space']) {
-                playerVelocity.y = playerJumpHeight;
-            }
-            
+            if (playerOnGround && keyStates['Space']) playerVelocity.y = playerJumpHeight;
             playerVelocity.y += gravity * deltaTime;
-
-            if (moveVector.length() > 0) {
+            if (moveVector.lengthSq() > 0) {
                 moveVector.normalize().applyQuaternion(camera.quaternion).multiplyScalar(speedDelta);
-                
-                const collisionRay = new THREE.Raycaster(player.position, moveVector.clone().normalize());
-                const collisionResults = collisionRay.intersectObject(terrainMesh);
-
-                if (collisionResults.length === 0 || collisionResults[0].distance > playerColliderRadius) {
-                    player.position.x += moveVector.x;
-                    player.position.z += moveVector.z;
-                }
+                player.position.x += moveVector.x;
+                player.position.z += moveVector.z;
             }
-            
             player.position.y += playerVelocity.y * deltaTime;
-            
             raycaster.set(player.position, new THREE.Vector3(0, -1, 0));
             const intersects = raycaster.intersectObject(terrainMesh);
             if (intersects.length > 0) {
@@ -1022,25 +948,15 @@ EDITOR_TEMPLATE = '''
                     playerOnGround = false;
                 }
             }
-
             camera.position.copy(player.position);
         }
 
-
         function animate() {
             requestAnimationFrame(animate);
             const deltaTime = clock.getDelta();
-            const elapsedTime = clock.getElapsedTime();
-            
-            if(grassMaterial) {
-                grassMaterial.uniforms.time.value = elapsedTime;
-            }
-            
-            if (isPlayMode && pointerLockControls.isLocked) {
-                updatePlayer(deltaTime);
-            } else {
-                orbitControls.update();
-            }
+            if(grassMaterial) grassMaterial.uniforms.time.value = clock.getElapsedTime();
+            if (isPlayMode) updatePlayer(deltaTime);
+            else orbitControls.update();
             composer.render();
         }