(function(){

	var vec2, Rect, sort
	if ('window' in this) {
		vec2 = window.vec2
		Rect = window.Rect
		sort = window.sort
	}
	else {
		vec2 = require('./vec2')
		Rect = require('./rect')
		UidGenerator = require('../util/uid')
	}
	
	var Wall = function(opt){
		this.id = [ opt.side, opt.edge, opt.vec.a ].join("_")
		this.vec = opt.vec
		this.edge = opt.edge
		this.side = opt.side
		this.surface = opt.surface
		this.mx = opt.mx
		this.background = ""
	}
	
	Wall.prototype.toString = function(){
		return this.vec.toString()
	}

	Wall.prototype.reset = function(){
	}
	
	Wall.prototype.destroy = function(){
		this.mx.forEach(function(mx){
			mx.destroy && mx.destroy()
		})
		this.room = this.vec = this.mx = null
	}
	
	Wall.prototype.bind = function(){
		var base = this
		base.$walls = $( this.mx.map(function(mx){ return mx.el }) )
		
		this.mx.forEach(function(mx, index){
			$(mx.el).bind({
				mouseover: function(){
				},
				mouseenter: function(e){
					Scenery.mouse.mouseenter(e, {
						wall: base,
						index: index,
					})
				},
				mousemove: function(e){
				},
				mousedown: function(e){
					if (Scenery.nextMedia) {
            var scenery = Scenery.addNextToWall({
            	wall: base,
            	index: index
            })
            
            // scenery was not placed
            if (! scenery) {	
            	e.stopPropagation()
            	return
            }

            Scenery.resize.show(scenery)
            Scenery.hovering = true

  					UndoStack.push({
  					  type: 'create-scenery',
  					  undo: { id: scenery.id },
              redo: scenery.serialize(),
  					})

            // TODO: watch individual scenery object here
            Minotaur.watch( app.router.editorView.settings )
          }
					else if (Scenery.nextWallpaper) {
					  var oldState = base.serialize()
						base.wallpaper(Scenery.nextWallpaper)
						Scenery.nextWallpaper = null

  					UndoStack.push({
  					  type: 'update-wallpaper',
  					  undo: oldState,
              redo: base.serialize(),
  					})

            // TODO: watch individual scenery object here
            Minotaur.watch( app.router.editorView.settings )
          }
					else {
						app.controller.hideExtras()
					}
				}
			})
		})

    // flip the mx order
		var shouldFlip = this.side & (LEFT | BACK)
		if (! shouldFlip) {
			this.mx.reverse()
		}

		// this.outline(wallColor, outlineColor)
	}
	
	Wall.prototype.serialize = function(){
	  return {
	    id: this.id,
	    background: this.background,
	  }
	}
	
	Wall.prototype.deserialize = function(data){
	  this.wallpaper( data.background )
	}


  // wall
  // side: corresponds to the orientation of this wall
  // vec: equivalent to the bounds of the Surface
  // edge: the coordinate of the normal of this surface
  // 			 var useX = side & LEFT_RIGHT
  //			 var useA = side & (FRONT | LEFT)
  //       edge = mx.rect[useX ? 'x': 'y'][ useA ? 'a': 'b']
  // surface: an ordered set of contiguous wall regions, corresponding to mx objects

	Wall.prototype.positionToMx = function(position, dimension) {
		var x, z
		switch (this.side) {
			case FRONT:
				x = position.a + dimension.a / 2
				z = this.edge + painting_distance_from_wall
				break
			case BACK:
				x = position.a + dimension.a / 2
				z = this.edge - painting_distance_from_wall
				break
			case LEFT:
				x = this.edge + painting_distance_from_wall
				z = position.a + dimension.a / 2
				break
			case RIGHT:
				x = this.edge - painting_distance_from_wall
 				z = position.a + dimension.a / 2
				break
		}
		return {
		  x: x,
		  y: position.b + dimension.b / 2,
		  z: z,
		  rotationY: wall_rotation[ this.side ],
		}
	}
	Wall.prototype.mxToPosition = function(mx, dimension) {
	  var position = new vec2(0,0)
	  switch (this.side) {
	    case FRONT:
	    case BACK:
	      position.a = mx.x
	      position.b = mx.y
	      break
	    case LEFT:
	    case RIGHT:
	      position.a = mx.z
	      position.b = mx.y
	      break
	  }
	  if (dimension) {
	  	position.a -= dimension.a / 2
	  	position.b -= dimension.b / 2
	  }
	  return position
	}
	
	Wall.prototype.color = function(color){
		this.$walls.css("background-color", color)
	}
	
	Wall.prototype.wallpaper = function(background){
		var useX = this.side & FRONT_BACK
		var shouldFlip = this.side & (LEFT | BACK)
		
		this.background = background || "none"
		
		this.mx.forEach(function(mx){
      var partitionOffset = useX ? mx.x : mx.z
      if (shouldFlip) partitionOffset *= -1
      partitionOffset += mx.width/2
      var floorOffset = mx.y + mx.height/2

      mx.el.style.backgroundImage = background
      mx.el.style.backgroundPosition = (~~partitionOffset) + "px " + (~~floorOffset) + "px"
    })
	}
	
	Wall.prototype.outline = function(wallColor, outlineColor){
		var useX = this.side & FRONT_BACK
		var mx = this.mx

		var len = this.mx.length
    var outlineString = app.defaults.outlineWidth + "px solid " + outlineColor
		zz = 0

		mx.forEach(function(mx, i){
			// if (mx.outlined) return
			// mx.outlined = true
      if (wallColor) {
        mx.el.style.backgroundColor = wallColor
      }
      if (outlineColor) {
        // all walls get bottom lines
        mx.el.style.borderBottom = outlineString
        
        // all walls get top lines
        mx.el.style.borderTop = outlineString
        
        // walls on initial sides get left lines
        // if their left edge lines up with the rect edge
        if (i == 0) {
          mx.el.style.borderLeft = outlineString
        }
        
        // walls on terminal sides get right lines....
        // if their right edge lines up with the rect edge
        if (i == len-1) {
          mx.el.style.borderRight = outlineString
        }
      }
		})
	}
	
	if ('window' in this) {
		window.Wall = Wall
	}
	else {
		module.exports = Wall
	}


})()