diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..bc005c5 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + Make it rain + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..bc005c5 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + Make it rain + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..67155e1 --- /dev/null +++ b/index.js @@ -0,0 +1,61 @@ +/// + +"use strict"; + +document.addEventListener("DOMContentLoaded", function pageInit(){ + + /** @type {HTMLCanvasElement} */ + const canvas = document.getElementById("playground"); + const canvasWidth = Math.floor(canvas.clientWidth); + const canvasHeight = Math.floor(canvas.clientHeight); + + const scene = new THREE.Scene(); + const camera = new THREE.PerspectiveCamera(50, canvasWidth / canvasHeight, 0.1, 1000); + + const renderer = new THREE.WebGLRenderer({ + canvas: document.getElementById("playground"), + antialias: true + }); + renderer.setSize(canvasWidth, canvasHeight); + renderer.shadowMap.enabled = true; + renderer.shadowMap.type = THREE.PCFSoftShadowMap; + + document.body.appendChild(renderer.domElement); + + const geometry = new THREE.BoxGeometry(1,1,1); + const material = new THREE.MeshPhongMaterial({color: 0x4512ff}) + const cube = new THREE.Mesh(geometry, material); + cube.castShadow = true; + scene.add(cube); + + camera.position.z = 5; + + const light = new THREE.PointLight(0xffffff, 1, 50); + light.position.set(5,5,5); + light.castShadow = true; + scene.add(light); + + const plane = new THREE.Mesh( + new THREE.PlaneBufferGeometry(5, 5, 10, 10), + new THREE.MeshPhongMaterial({color: 0xffffff}) + ); + plane.rotateX(-Math.PI/2); + plane.position.y = -1; + plane.receiveShadow = true; + scene.add(plane); + + // renderer.gammaInput = true; + // renderer.gammaOutput = true; + + // const helper = new THREE.CameraHelper(light.shadow.camera); + // scene.add(helper); + + function animate(){ + requestAnimationFrame(animate); + cube.rotation.x += 0.01; + cube.rotation.y += 0.01; + renderer.render(scene, camera); + } + animate(); + +}); \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..bc005c5 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + Make it rain + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..67155e1 --- /dev/null +++ b/index.js @@ -0,0 +1,61 @@ +/// + +"use strict"; + +document.addEventListener("DOMContentLoaded", function pageInit(){ + + /** @type {HTMLCanvasElement} */ + const canvas = document.getElementById("playground"); + const canvasWidth = Math.floor(canvas.clientWidth); + const canvasHeight = Math.floor(canvas.clientHeight); + + const scene = new THREE.Scene(); + const camera = new THREE.PerspectiveCamera(50, canvasWidth / canvasHeight, 0.1, 1000); + + const renderer = new THREE.WebGLRenderer({ + canvas: document.getElementById("playground"), + antialias: true + }); + renderer.setSize(canvasWidth, canvasHeight); + renderer.shadowMap.enabled = true; + renderer.shadowMap.type = THREE.PCFSoftShadowMap; + + document.body.appendChild(renderer.domElement); + + const geometry = new THREE.BoxGeometry(1,1,1); + const material = new THREE.MeshPhongMaterial({color: 0x4512ff}) + const cube = new THREE.Mesh(geometry, material); + cube.castShadow = true; + scene.add(cube); + + camera.position.z = 5; + + const light = new THREE.PointLight(0xffffff, 1, 50); + light.position.set(5,5,5); + light.castShadow = true; + scene.add(light); + + const plane = new THREE.Mesh( + new THREE.PlaneBufferGeometry(5, 5, 10, 10), + new THREE.MeshPhongMaterial({color: 0xffffff}) + ); + plane.rotateX(-Math.PI/2); + plane.position.y = -1; + plane.receiveShadow = true; + scene.add(plane); + + // renderer.gammaInput = true; + // renderer.gammaOutput = true; + + // const helper = new THREE.CameraHelper(light.shadow.camera); + // scene.add(helper); + + function animate(){ + requestAnimationFrame(animate); + cube.rotation.x += 0.01; + cube.rotation.y += 0.01; + renderer.render(scene, camera); + } + animate(); + +}); \ No newline at end of file diff --git a/infinitePreview.png b/infinitePreview.png new file mode 100644 index 0000000..a39e3ba --- /dev/null +++ b/infinitePreview.png Binary files differ diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..bc005c5 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + Make it rain + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..67155e1 --- /dev/null +++ b/index.js @@ -0,0 +1,61 @@ +/// + +"use strict"; + +document.addEventListener("DOMContentLoaded", function pageInit(){ + + /** @type {HTMLCanvasElement} */ + const canvas = document.getElementById("playground"); + const canvasWidth = Math.floor(canvas.clientWidth); + const canvasHeight = Math.floor(canvas.clientHeight); + + const scene = new THREE.Scene(); + const camera = new THREE.PerspectiveCamera(50, canvasWidth / canvasHeight, 0.1, 1000); + + const renderer = new THREE.WebGLRenderer({ + canvas: document.getElementById("playground"), + antialias: true + }); + renderer.setSize(canvasWidth, canvasHeight); + renderer.shadowMap.enabled = true; + renderer.shadowMap.type = THREE.PCFSoftShadowMap; + + document.body.appendChild(renderer.domElement); + + const geometry = new THREE.BoxGeometry(1,1,1); + const material = new THREE.MeshPhongMaterial({color: 0x4512ff}) + const cube = new THREE.Mesh(geometry, material); + cube.castShadow = true; + scene.add(cube); + + camera.position.z = 5; + + const light = new THREE.PointLight(0xffffff, 1, 50); + light.position.set(5,5,5); + light.castShadow = true; + scene.add(light); + + const plane = new THREE.Mesh( + new THREE.PlaneBufferGeometry(5, 5, 10, 10), + new THREE.MeshPhongMaterial({color: 0xffffff}) + ); + plane.rotateX(-Math.PI/2); + plane.position.y = -1; + plane.receiveShadow = true; + scene.add(plane); + + // renderer.gammaInput = true; + // renderer.gammaOutput = true; + + // const helper = new THREE.CameraHelper(light.shadow.camera); + // scene.add(helper); + + function animate(){ + requestAnimationFrame(animate); + cube.rotation.x += 0.01; + cube.rotation.y += 0.01; + renderer.render(scene, camera); + } + animate(); + +}); \ No newline at end of file diff --git a/infinitePreview.png b/infinitePreview.png new file mode 100644 index 0000000..a39e3ba --- /dev/null +++ b/infinitePreview.png Binary files differ diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..7fba833 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,13 @@ +{ + "name": "infinity-rain", + "version": "0.1.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "three": { + "version": "0.94.0", + "resolved": "https://registry.npmjs.org/three/-/three-0.94.0.tgz", + "integrity": "sha1-TObbfyv795wtc0RKpuPPwIoy12I=" + } + } +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..55371e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +.vscode \ No newline at end of file diff --git a/core.css b/core.css new file mode 100644 index 0000000..f199260 --- /dev/null +++ b/core.css @@ -0,0 +1,28 @@ +html, body { + margin: 0; + background: #202020; + font-family: Arial, Helvetica, sans-serif; + color: #EEEEEE; +} + +input[type=text], input[type=password] { + /* font-family: Arial, Helvetica, sans-serif; */ + background-color: #EEEEEE; + color: #202020; +} + +a, input[type=button], input[type=submit] { + color: #EEEEEE; + background: #4512ff; + border: 0; + border-radius: 3px; + padding: 5px; + font-size: 1em; +} +a:hover, input[type=button]:hover, input[type=submit]:hover { + background: rgb(51, 15, 182); + cursor: pointer; +} +a:active, input[type=button]:active, input[type=submit]:active { + background: rgb(37, 12, 131); +} \ No newline at end of file diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..ed65d0c --- /dev/null +++ b/favicon.svg @@ -0,0 +1,87 @@ + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/favicon144.png b/favicon144.png new file mode 100644 index 0000000..8a8b6f1 --- /dev/null +++ b/favicon144.png Binary files differ diff --git a/favicon32.png b/favicon32.png new file mode 100644 index 0000000..e76c386 --- /dev/null +++ b/favicon32.png Binary files differ diff --git a/favicon96.png b/favicon96.png new file mode 100644 index 0000000..145b51a --- /dev/null +++ b/favicon96.png Binary files differ diff --git a/index.css b/index.css new file mode 100644 index 0000000..0c982b1 --- /dev/null +++ b/index.css @@ -0,0 +1,10 @@ +html, body, canvas { + width: 100%; + height: 100%; + overflow: hidden; +} + +canvas { + width: 100%; + height: 100%; +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..bc005c5 --- /dev/null +++ b/index.html @@ -0,0 +1,24 @@ + + + + + + Make it rain + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..67155e1 --- /dev/null +++ b/index.js @@ -0,0 +1,61 @@ +/// + +"use strict"; + +document.addEventListener("DOMContentLoaded", function pageInit(){ + + /** @type {HTMLCanvasElement} */ + const canvas = document.getElementById("playground"); + const canvasWidth = Math.floor(canvas.clientWidth); + const canvasHeight = Math.floor(canvas.clientHeight); + + const scene = new THREE.Scene(); + const camera = new THREE.PerspectiveCamera(50, canvasWidth / canvasHeight, 0.1, 1000); + + const renderer = new THREE.WebGLRenderer({ + canvas: document.getElementById("playground"), + antialias: true + }); + renderer.setSize(canvasWidth, canvasHeight); + renderer.shadowMap.enabled = true; + renderer.shadowMap.type = THREE.PCFSoftShadowMap; + + document.body.appendChild(renderer.domElement); + + const geometry = new THREE.BoxGeometry(1,1,1); + const material = new THREE.MeshPhongMaterial({color: 0x4512ff}) + const cube = new THREE.Mesh(geometry, material); + cube.castShadow = true; + scene.add(cube); + + camera.position.z = 5; + + const light = new THREE.PointLight(0xffffff, 1, 50); + light.position.set(5,5,5); + light.castShadow = true; + scene.add(light); + + const plane = new THREE.Mesh( + new THREE.PlaneBufferGeometry(5, 5, 10, 10), + new THREE.MeshPhongMaterial({color: 0xffffff}) + ); + plane.rotateX(-Math.PI/2); + plane.position.y = -1; + plane.receiveShadow = true; + scene.add(plane); + + // renderer.gammaInput = true; + // renderer.gammaOutput = true; + + // const helper = new THREE.CameraHelper(light.shadow.camera); + // scene.add(helper); + + function animate(){ + requestAnimationFrame(animate); + cube.rotation.x += 0.01; + cube.rotation.y += 0.01; + renderer.render(scene, camera); + } + animate(); + +}); \ No newline at end of file diff --git a/infinitePreview.png b/infinitePreview.png new file mode 100644 index 0000000..a39e3ba --- /dev/null +++ b/infinitePreview.png Binary files differ diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..7fba833 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,13 @@ +{ + "name": "infinity-rain", + "version": "0.1.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "three": { + "version": "0.94.0", + "resolved": "https://registry.npmjs.org/three/-/three-0.94.0.tgz", + "integrity": "sha1-TObbfyv795wtc0RKpuPPwIoy12I=" + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..1da5c8f --- /dev/null +++ b/package.json @@ -0,0 +1,18 @@ +{ + "name": "infinity-rain", + "version": "0.1.0", + "description": "infinity-rain ===============", + "main": "index.js", + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1" + }, + "repository": { + "type": "git", + "url": "http://git.synoikos.de/git/peter/infinity-rain.git" + }, + "author": "Peter Zilz", + "license": "ISC", + "dependencies": { + "three": "^0.94.0" + } +}