File size: 4,116 Bytes
983e4c2
 
86b2a18
983e4c2
86b2a18
 
983e4c2
86b2a18
 
 
 
 
 
983e4c2
86b2a18
 
 
983e4c2
86b2a18
 
 
 
 
 
 
983e4c2
86b2a18
983e4c2
86b2a18
 
983e4c2
 
86b2a18
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
983e4c2
 
 
86b2a18
 
 
 
 
 
 
 
 
 
 
 
983e4c2
86b2a18
 
 
 
 
 
983e4c2
86b2a18
 
 
 
 
 
 
 
 
 
 
 
 
 
 
983e4c2
 
 
 
86b2a18
 
 
 
983e4c2
 
86b2a18
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import * as THREE from 'three';
import { OrbitControls } from 'https://unpkg.com/three@0.160.0/examples/jsm/controls/OrbitControls.js';
import { GLTFLoader } from 'https://unpkg.com/three@0.160.0/examples/jsm/loaders/GLTFLoader.js';

let scene, camera, renderer, controls, selectedObject, isPlaying = false;
let gameObjects = [];

function init() {
    scene = new THREE.Scene();
    scene.background = new THREE.Color(0x222222);
    
    camera = new THREE.PerspectiveCamera(75, (window.innerWidth - 280) / window.innerHeight, 0.1, 1000);
    camera.position.set(5, 5, 5);

    renderer = new THREE.WebGLRenderer({ antialias: true });
    renderer.setSize(window.innerWidth - 280, window.innerHeight);
    document.getElementById('game-container').appendChild(renderer.domElement);

    controls = new OrbitControls(camera, renderer.domElement);
    
    const light = new THREE.HemisphereLight(0xffffff, 0x444444, 1.5);
    scene.add(light);

    animate();
}

// Criar Cubo
window.addBox = () => {
    const obj = new THREE.Mesh(new THREE.BoxGeometry(1,1,1), new THREE.MeshStandardMaterial({color: 0xcccccc}));
    setupObject(obj);
};

// Configurar objeto na cena
function setupObject(obj) {
    obj.position.y = 0.5;
    scene.add(obj);
    gameObjects.push(obj);
    selectObject(obj);
}

// Selecionar Objeto ao clicar
window.addEventListener('mousedown', (e) => {
    if (isPlaying) return;
    const mouse = new THREE.Vector2((e.clientX - 280) / (window.innerWidth - 280) * 2 - 1, -(e.clientY / window.innerHeight) * 2 + 1);
    const raycaster = new THREE.Raycaster();
    raycaster.setFromCamera(mouse, camera);
    const intersects = raycaster.intersectObjects(gameObjects, true);
    if (intersects.length > 0) selectObject(intersects[0].object);
});

function selectObject(obj) {
    selectedObject = obj;
    document.getElementById('object-settings').style.display = 'block';
    document.getElementById('posX').value = obj.position.x;
    document.getElementById('posY').value = obj.position.y;
    document.getElementById('posZ').value = obj.position.z;
    document.getElementById('scaleX').value = obj.scale.x;
    document.getElementById('scaleY').value = obj.scale.y;
}

// Atualizar Transform
window.updateObject = () => {
    if (!selectedObject) return;
    selectedObject.position.set(
        parseFloat(document.getElementById('posX').value),
        parseFloat(document.getElementById('posY').value),
        parseFloat(document.getElementById('posZ').value)
    );
    selectedObject.scale.set(
        parseFloat(document.getElementById('scaleX').value),
        parseFloat(document.getElementById('scaleY').value),
        selectedObject.scale.z
    );
};

// Aplicar Textura
window.applyTexture = (input) => {
    if (input.files && input.files[0] && selectedObject) {
        const reader = new FileReader();
        reader.onload = (e) => {
            const texture = new THREE.TextureLoader().load(e.target.result);
            selectedObject.material.map = texture;
            selectedObject.material.needsUpdate = true;
        };
        reader.readAsDataURL(input.files[0]);
    }
};

// Importar GLB
document.getElementById('glb-upload').addEventListener('change', (e) => {
    const file = e.target.files[0];
    const url = URL.createObjectURL(file);
    new GLTFLoader().load(url, (gltf) => {
        setupObject(gltf.scene);
    });
});

// Modo Jogo
window.togglePlayMode = () => {
    isPlaying = !isPlaying;
    const btn = document.querySelector('.play-btn');
    if (isPlaying) {
        btn.innerHTML = "⏹ PARAR JOGO";
        btn.style.background = "#e74c3c";
        document.getElementById('editor-sidebar').style.opacity = "0.3";
    } else {
        btn.innerHTML = "▶ INICIAR JOGO";
        btn.style.background = "#2ecc71";
        document.getElementById('editor-sidebar').style.opacity = "1";
    }
};

function animate() {
    requestAnimationFrame(animate);
    if (isPlaying) {
        // Exemplo: no modo jogo, os objetos giram sozinhos
        gameObjects.forEach(o => o.rotation.y += 0.01);
    }
    renderer.render(scene, camera);
}

init();