diff options
| -rw-r--r-- | assets/images/faces/1.png | bin | 0 -> 36719 bytes | |||
| -rw-r--r-- | assets/images/faces/2.png | bin | 0 -> 40380 bytes | |||
| -rw-r--r-- | assets/images/faces/3.png | bin | 0 -> 8303 bytes | |||
| -rw-r--r-- | assets/images/faces/4.png | bin | 0 -> 60837 bytes | |||
| -rw-r--r-- | assets/images/faces/5.png | bin | 0 -> 67187 bytes | |||
| -rw-r--r-- | assets/images/faces/6.png | bin | 0 -> 18222 bytes | |||
| -rw-r--r-- | assets/js/global.js | 27 |
7 files changed, 22 insertions, 5 deletions
diff --git a/assets/images/faces/1.png b/assets/images/faces/1.png Binary files differnew file mode 100644 index 0000000..91caabf --- /dev/null +++ b/assets/images/faces/1.png diff --git a/assets/images/faces/2.png b/assets/images/faces/2.png Binary files differnew file mode 100644 index 0000000..b63eafc --- /dev/null +++ b/assets/images/faces/2.png diff --git a/assets/images/faces/3.png b/assets/images/faces/3.png Binary files differnew file mode 100644 index 0000000..5c72954 --- /dev/null +++ b/assets/images/faces/3.png diff --git a/assets/images/faces/4.png b/assets/images/faces/4.png Binary files differnew file mode 100644 index 0000000..e782326 --- /dev/null +++ b/assets/images/faces/4.png diff --git a/assets/images/faces/5.png b/assets/images/faces/5.png Binary files differnew file mode 100644 index 0000000..4e27e15 --- /dev/null +++ b/assets/images/faces/5.png diff --git a/assets/images/faces/6.png b/assets/images/faces/6.png Binary files differnew file mode 100644 index 0000000..0f41928 --- /dev/null +++ b/assets/images/faces/6.png diff --git a/assets/js/global.js b/assets/js/global.js index 0a735df..cbf6ba3 100644 --- a/assets/js/global.js +++ b/assets/js/global.js @@ -67,8 +67,7 @@ function drawBoard() { } } -function drawCube() { - +function drawCube() { //renderer var canvas = document.getElementById("cube-canvas"); var renderer = new THREE.WebGLRenderer({ canvas: canvas, alpha: true, antialias: true }); @@ -77,9 +76,27 @@ function drawCube() { var scene = new THREE.Scene(); //scene - var geometry = new THREE.BoxGeometry(100, 100, 100); - var material = new THREE.MeshBasicMaterial({color: 0xfffff, wireframe: true}); - var cube = new THREE.Mesh(geometry, material); + // var geometry = new THREE.BoxGeometry(100, 100, 100); + // var material = new THREE.MeshBasicMaterial({color: 0xfffff, wireframe: true}); + + var materials = []; + for (var i = 1; i <= 6; i++) { + var img = new Image(); + // img.crossOrigin = "anonymous"; + img.src = 'assets/images/faces/' + i + '.png'; + var tex = new THREE.Texture(img); + img.tex = tex; + img.onload = function() { + this.tex.needsUpdate = true; + }; + var mat = new THREE.MeshBasicMaterial({color: 0xffffff, map: tex}); + materials.push(mat); + } + + var cubeGeo = new THREE.BoxGeometry(100,100,100,1,1,1); + var cube = new THREE.Mesh(cubeGeo, new THREE.MeshFaceMaterial( materials )); + + // var cube = new THREE.Mesh(geometry, material); cube.rotation.y = Math.PI * 45 / 180; scene.add(cube); |
