Skip to content

Instantly share code, notes, and snippets.

@alecperkins

alecperkins/gonconda-1953.jpg

Last active August 29, 2015 14:07
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save alecperkins/54e63051921ab501404d to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save alecperkins/54e63051921ab501404d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
script.coffee
DEBUG = false
{ Shape, DirectionalLight, AmbientLight, MeshLambertMaterial, Mesh, BoxGeometry, mergeGeometry, WebGLRenderer, Scene, PerspectiveCamera } = THREE
scene = new Scene()
camera = new PerspectiveCamera(
75
window.innerWidth / window.innerHeight
0.1
1000
)
if DEBUG
camera.position.set(400,200,400)
camera.lookAt(x:0,y:0,z:0)
else
camera.position.z = 400
scene.add(camera)
renderer = new WebGLRenderer()
renderer.setSize(window.innerWidth, window.innerHeight)
renderer.setClearColor(0xffffff,1)
document.body.appendChild(renderer.domElement)
origin =
x: window.innerWidth / 2
y: window.innerHeight / 2
unless DEBUG
renderer.domElement.addEventListener 'mousemove', (e) ->
# Convert the screen coordinates to world
rel_x = origin.x - e.pageX
rel_y = e.pageY - origin.y
# Adjust camera position
SCALE_FACTOR = 0.05
camera.position.x = rel_x * SCALE_FACTOR
camera.position.y = rel_y * SCALE_FACTOR
requestAnimationFrame(render)
generateBuilding = ->
height = 300
width = 1300
depth = 200
roof_height = 120
base = new BoxGeometry(width, height, depth)
roof_section = new Shape()
roof_section.moveTo(depth / -2, height / 2)
roof_section.lineTo(0, height / 2 + roof_height)
roof_section.lineTo(depth / 2, height / 2)
roof_section.lineTo(depth / -2, height / 2)
roof = roof_section.extrude
curveSegments: 1
steps: 1
amount: width
building = []
base_materal = new MeshLambertMaterial(color: 0xFFFFFF)
roof_material = new MeshLambertMaterial(color: 0xFF0000)
base_mesh = new Mesh(base, base_materal)
roof_mesh = new Mesh(roof, roof_material)
base_mesh.receiveShadow = true
roof_mesh.receiveShadow = true
roof_mesh.rotation.y = 0.5 * Math.PI
roof_mesh.position.x = width / -2
return [base_mesh, roof_mesh]
generateBuilding().forEach (geom) ->
geom.position.y -= 200
scene.add(geom)
person_geometry = new BoxGeometry(15, 40, 1)
person_material = new MeshLambertMaterial(color: 0x00FF00)
PERSON_X_SPACING = 100
PERSON_Y_SPACING = 100
PERSON_Z_SPACING = 100
[-10..10].forEach (x) ->
[-10..10].forEach (y) ->
[0...3].forEach (z) ->
person = new Mesh(
person_geometry
person_material
)
offset = if y % 2 then 0.5 else 0
person.position.set(
(x + offset) * PERSON_X_SPACING
y * PERSON_Y_SPACING
z * PERSON_Z_SPACING
)
person.castShadow = z is 1
scene.add(person)
sun = new DirectionalLight(0xffffff, 1)
sun.position.set(-400, 300, 200)
sun.castShadow = true
scene.add(sun)
scene.add( new THREE.AmbientLight( 0x222222) )
renderer.shadowMapEnabled = true
renderer.shadowMapSoft = false
renderer.shadowCameraNear = 3
renderer.shadowCameraFar = camera.far
renderer.shadowCameraFov = 50
renderer.shadowMapBias = 0.0039
renderer.shadowMapDarkness = 0.5
renderer.shadowMapWidth = 1024
renderer.shadowMapHeight = 1024
render = ->
renderer.render(scene, camera)
render()
Raw
settings.json
{
"name": "magritte-golconda",
"proto_version": "1.5.1",
"script_libraries": [
"https://cdnjs.cloudflare.com/ajax/libs/three.js/r68/three.min.js"
],
"style_libraries": [
],
"extra_head_markup": "<meta name='viewport' content='width=device-width'>"
}
Raw
style.styl
html,
body
margin: 0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment