gerbyzation · October 25, 2018 08:14 · Oct 25, 2018
diff --git a/s1-00_basic-structure.markdown b/s1-00_basic-structure.markdown
@@ -0,0 +1,7 @@
+S1-00_Basic-structure
+---------------------
+
+
+A [Pen](https://codepen.io/gerbyzation/pen/BqvBaq) by [Gerben Neven](https://codepen.io/gerbyzation) on [CodePen](https://codepen.io).
+
+[License](https://codepen.io/gerbyzation/pen/BqvBaq/license).
diff --git a/script.js b/script.js
@@ -0,0 +1,51 @@
+//Global variables
+var scene, camera, renderer;
+var geometry, material, mesh;
+
+function init(){
+  // Create an empty scene --------------------------
+  scene = new THREE.Scene();
+
+  // Create a basic perspective camera --------------
+  camera = new THREE.PerspectiveCamera(35, window.innerWidth/window.innerHeight, 300, 10000 );
+
+  // Create a renderer with Antialiasing ------------
+  renderer = new THREE.WebGLRenderer({antialias:true});
+
+  // Configure renderer clear color
+  renderer.setClearColor("#000000");
+
+  // Configure renderer size
+  renderer.setSize( window.innerWidth, window.innerHeight );
+
+  // Append Renderer to DOM
+  document.body.appendChild( renderer.domElement );
+}
+
+function geometry(){
+  // Create a Cube Mesh with basic material ---------
+  geometry = new THREE.BoxGeometry(100, 100, 100);
+  material = new THREE.MeshBasicMaterial( { color: "#433F81" } );
+  mesh = new THREE.Mesh( geometry, material );
+  mesh.position.z = -1000;
+
+  // Add mesh to scene
+  scene.add( mesh );
+}
+
+// Render Loop
+var render = function () {
+  requestAnimationFrame( render );
+
+  //mesh.rotation.x += 0.01; //Continuously rotate the mesh
+  //mesh.rotation.y += 0.01;
+
+  renderer.setClearColor("#000000");
+
+  // Render the scene
+  renderer.render(scene, camera);
+};
+
+init();
+geometry();
+render();
diff --git a/scripts b/scripts
@@ -0,0 +1 @@
+<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/97/three.min.js"></script>
diff --git a/style.css b/style.css
@@ -0,0 +1,2 @@
+body { margin: 0; }
+canvas { width: 100%; height: 100% }
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/97/three.min.js"></script>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		body { margin: 0; }
		canvas { width: 100%; height: 100% }