var environment = (function(){

  var environment = {}
  var width = 400
  var height = 600
  var grid_side = 50
  var grid_stroke = 2
  var sph
  var left, right, top, bottom
  var done_animating = false
  
  environment.init = function(){
    environment.ready()
    
    app.resize = function () {
      scene.width = window.innerWidth
      scene.height = window.innerHeight
      scene.perspective = Math.min(window.innerWidth, scene.height)
      scene.el.style[MX.perspectiveProp] = 200 + 'px'
      scene.update()
    }
  }

  environment.ready = function(){
    controls = new MX.FollowingOrbitCamera({
      center: { x: 0, y: 0, z: 0 },
      radius: 1250,
      radiusRange: [ 300, 2000 ],
      rotationXRange: [ -0.05, 0.05 ],
      rotationYRange: [ -0.05, 0.05 ],
      wheelEase: 20,
      ease: 10
    })
    controls.init()
    controls.wheel.lock()
    
    top = environment.make_side()
    top.mx.rotationY = Math.PI/2
    top.mx.x = -width/2

    bottom = environment.make_side()
    bottom.mx.rotationY = -Math.PI/2
    bottom.mx.x = width/2

    left = environment.make_side()
    left.mx.rotationX = Math.PI
    left.mx.z = -width/2

    right = environment.make_side()
    right.mx.rotationX = 0 // Math.PI/2
    right.mx.z = width/2

    var sphere = new Image
    sphere.src = "http://dumpfm.s3.amazonaws.com/images/20101115/1289880948498-dumpfm-lolumad-wireframesphere.gif"
    var mx = new MX.Object3D (sphere)
    mx.width = 600
    mx.height = 400

    mx.y = 100
    mx.rotationY = Math.PI
    mx.rotationX = Math.PI/2
    mx.rotationZ = Math.PI/2
    scene.add(mx)
    sph = mx
  }
  
  environment.make_side = function(){
    var g = new Grid ({
      side: grid_side - grid_stroke,
      strokeWidth: grid_stroke,
      bg: "#ffffff",
      stroke: [ "#000000" ],
      duration: 1000,
      delay: [ 0, 500 ],
      width: width,
      height: height,
      draw_sides: true,
    })
    var mx = new MX.Object3D (g.snap.node)
    mx.width = width
    mx.height = height
    scene.add(mx)
    return { g: g, mx: mx }
  }

  environment.update = function(t){
    scene.update()
    controls.update()
    
//     if (! done_animating) return

    t *= 0.05

    top.g.animate({
      h: "right",
      v: "down",
      duration: 0,
      v_offset: -t,
    })
    bottom.g.animate({
      h: "left",
      v: "down",
      duration: 0,
      v_offset: -t,
    })
    left.g.animate({
      h: "left",
      v: "up",
      duration: 0,
      v_offset: t,
    })
    right.g.animate({
      h: "left",
      v: "down",
      duration: 0,
      v_offset: -t,
    })
  }

  return environment

})()