Got the level editor mostly working again.

app/lib/surface/RegionChooser.coffee

@@ -59,10 +59,10 @@ module.exports = class RegionChooser extends CocoClass
 
   updateShape: ->
     rect = @options.camera.normalizeBounds([@firstPoint, @secondPoint])
-    @options.surfaceLayer.removeChild @shape if @shape
+    @options.normalStage.removeChild @shape if @shape
     @shape = new createjs.Shape()
     @shape.alpha = 0.5
     @shape.mouseEnabled = false
     @shape.graphics.beginFill('#fedcba').drawRect rect.x, rect.y, rect.width, rect.height
     @shape.graphics.endFill()
-    @options.surfaceLayer.addChild(@shape)
+    @options.normalStage.addChild(@shape)

app/lib/surface/Surface.coffee

@@ -133,7 +133,7 @@ module.exports = Surface = class Surface extends CocoClass
     @coordinateDisplay ?= new CoordinateDisplay camera: @camera, layer: @surfaceTextLayer if showCoordinates
 
   hookUpChooseControls: ->
-    chooserOptions = stage: @normalStage, surfaceLayer: @surfaceLayer, camera: @camera, restrictRatio: @options.choosing is 'ratio-region'
+    chooserOptions = stage: @normalStage, normalStage: @normalStage, camera: @camera, restrictRatio: @options.choosing is 'ratio-region'
     klass = if @options.choosing is 'point' then PointChooser else RegionChooser
     @chooser = new klass chooserOptions
 

app/styles/editor/level/modal/world-select-modal.sass

@@ -1,14 +1,24 @@
 @import "../../../bootstrap/mixins"
 
-#select-point-modal
+#world-select-modal
   @include user-select(none)
   
   .modal-body
     max-height: inherit
     
-  canvas
+  .canvas-wrapper
-    background-color: #ddd
+    position: relative
+    
+  .normal-canvas
+    position: absolute
+    bottom: 0
+    left: 0
+    z-index: 1
+    pointer-events: none
+    
+  .webgl-canvas
     border: 1px solid black
+    background-color: #ddd
     
   .instructions .alert
     float: left

app/styles/editor/level/thangs-tab-view.sass

@@ -111,9 +111,14 @@
   
     // Below snatched from play/level.sass; should refactor?
   
-    canvas#surface
+    canvas
       background-color: #ddd
       width: 100%
       display: block
-      z-index: 1
       border: 1px solid black
+
+    #webgl-surface
+      z-index: 1
+      
+    #normal-surface
+      z-index: 2

app/templates/editor/level/modal/world-select-modal.jade

@@ -32,7 +32,9 @@ block modal-body-content
       div.alert.alert-info
         strong Enter
         |  to confirm
-  canvas(width=924, height=589)
+  .canvas-wrapper
+    canvas(width=924, height=589).webgl-canvas
+    canvas(width=924, height=589).normal-canvas
 
 block modal-footer-content
   a.btn.btn-primary#done-button Done

app/templates/editor/level/thangs-tab-view.jade

@@ -14,7 +14,8 @@ button.btn#thangs-palette-toggle
         a(data-i18n="editor.delete") Delete
       li#duplicate
         a(data-i18n="editor.duplicate") Duplicate
-    canvas(width=924, height=589)#surface
+    canvas(width=924, height=589)#webgl-surface
+    canvas(width=924, height=589)#normal-surface
     #canvas-left-gradient.gradient
     #canvas-top-gradient.gradient
 

app/views/editor/level/modals/WorldSelectModal.coffee

@@ -1,10 +1,10 @@
 ModalView = require 'views/kinds/ModalView'
-template = require 'templates/editor/level/modal/world_select'
+template = require 'templates/editor/level/modal/world-select-modal'
 Surface = require 'lib/surface/Surface'
 ThangType = require 'models/ThangType'
 
 module.exports = class WorldSelectModal extends ModalView
-  id: 'select-point-modal'
+  id: 'world-select-modal'
   template: template
   modalWidthPercent: 80
   cache: false
@@ -41,10 +41,12 @@ module.exports = class WorldSelectModal extends ModalView
   # surface setup
 
   initSurface: ->
-    canvas = @$el.find('canvas')
+    webGLCanvas = @$el.find('.webgl-canvas')
-    canvas.attr('width', currentView.$el.width()*.8-70)
+    normalCanvas = @$el.find('.normal-canvas')
-    canvas.attr('height', currentView.$el.height()*.6)
+    canvases = webGLCanvas.add(normalCanvas)
-    @surface = new Surface @world, canvas, {
+    canvases.attr('width', currentView.$el.width()*.8-70)
+    canvases.attr('height', currentView.$el.height()*.6)
+    @surface = new Surface @world, normalCanvas, webGLCanvas, {
       wizards: false
       paths: false
       grid: true

app/views/editor/level/thangs/ThangsTabView.coffee

@@ -184,8 +184,9 @@ module.exports = class ThangsTabView extends CocoView
         @openSmallerFolders(child)
 
   initSurface: ->
-    surfaceCanvas = $('canvas#surface', @$el)
+    webGLCanvas = $('canvas#webgl-surface', @$el)
-    @surface = new Surface @world, surfaceCanvas, {
+    normalCanvas = $('canvas#normal-surface', @$el)
+    @surface = new Surface @world, normalCanvas, webGLCanvas, {
       wizards: false
       paths: false
       coords: true
@@ -219,7 +220,7 @@ module.exports = class ThangsTabView extends CocoView
 
   onViewSwitched: (e) ->
     @selectAddThang null, true
-    @surface?.spriteBoss?.selectSprite null, null
+    @surface?.lankBoss?.selectLank null, null
 
   onSpriteMouseDown: (e) ->
     @dragged = false
@@ -229,7 +230,7 @@ module.exports = class ThangsTabView extends CocoView
     #   @onSpriteContextMenu e
 
   onStageMouseDown: (e) ->
-    return unless @addThangSprite?.thangType.get('kind') is 'Wall'
+    return unless @addThangLank?.thangType.get('kind') is 'Wall'
     @surface.camera.dragDisabled = true
     @paintingWalls = true
 
@@ -238,9 +239,9 @@ module.exports = class ThangsTabView extends CocoView
       # We need to stop painting walls, but we may also stop in onExtantThangSelected.
       _.defer =>
         @paintingWalls = @paintedWalls = @surface.camera.dragDisabled = false
-    else if @addThangSprite
+    else if @addThangLank
       @surface.camera.lock()
-      # If we click on the background, we need to add @addThangSprite, but not if onSpriteMouseUp will fire.
+      # If we click on the background, we need to add @addThangLank, but not if onSpriteMouseUp will fire.
       @backgroundAddClickTimeout = _.defer => @onExtantThangSelected {}
     $('#contextmenu').hide()
 
@@ -252,7 +253,7 @@ module.exports = class ThangsTabView extends CocoView
     cap = @surface.camera.screenToCanvas x: stageX, y: stageY
     wop = @surface.camera.canvasToWorld cap
     wop.z = @selectedExtantThang.depth / 2
-    @adjustThangPos @selectedExtantSprite, @selectedExtantThang, wop
+    @adjustThangPos @selectedExtantLank, @selectedExtantThang, wop
     [w, h] = [@surface.camera.canvasWidth, @surface.camera.canvasHeight]
     sidebarWidths = ((if @$el.find(id).hasClass('hide') then 0 else (@$el.find(id).outerWidth() / @surface.camera.canvasScaleFactorX)) for id in ['#all-thangs', '#add-thangs-view'])
     w -= sidebarWidth for sidebarWidth in sidebarWidths
@@ -304,9 +305,9 @@ module.exports = class ThangsTabView extends CocoView
 
   # TODO: figure out a good way to have all Surface clicks and Treema clicks just proxy in one direction, so we can maintain only one way of handling selection and deletion
   onExtantThangSelected: (e) ->
-    @selectedExtantSprite?.setNameLabel? null unless @selectedExtantSprite is e.sprite
+    @selectedExtantLank?.setNameLabel? null unless @selectedExtantLank is e.sprite
     @selectedExtantThang = e.thang
-    @selectedExtantSprite = e.sprite
+    @selectedExtantLank = e.sprite
     paintedAWall = @paintedWalls
     @paintingWalls = @paintedWalls = @surface.camera.dragDisabled = false
     if paintedAWall
@@ -318,15 +319,15 @@ module.exports = class ThangsTabView extends CocoView
     else if @justAdded()
       # Skip double insert due to extra selection event
       null
-    else if e.thang and not (@addThangSprite and @addThangType.get('name') in overlappableThangTypeNames)
+    else if e.thang and not (@addThangLank and @addThangType.get('name') in overlappableThangTypeNames)
       # We clicked on a Thang (or its Treema), so select the Thang
       @selectAddThang null, true
       @selectedExtantThangClickTime = new Date()
       # Show the label above selected thang, notice that we may get here from thang-edit-view, so it will be selected but no label
-      @selectedExtantSprite.setNameLabel @selectedExtantSprite.thangType.get('name') + ': ' + @selectedExtantThang.id
+      @selectedExtantLank.setNameLabel @selectedExtantLank.thangType.get('name') + ': ' + @selectedExtantThang.id
-    else if @addThangSprite
+    else if @addThangLank
       # We clicked on the background when we had an add Thang selected, so add it
-      @addThang @addThangType, @addThangSprite.thang.pos
+      @addThang @addThangType, @addThangLank.thang.pos
       @lastAddTime = new Date()
 
   justAdded: -> @lastAddTime and (new Date() - @lastAddTime) < 150
@@ -354,19 +355,19 @@ module.exports = class ThangsTabView extends CocoView
   selectAddThangType: (type, @cloneSourceThang) ->
     if _.isString type
       type = _.find @supermodel.getModels(ThangType), (m) -> m.get('name') is type
-    pos = @addThangSprite?.thang.pos  # Maintain old sprite's pos if we have it
+    pos = @addThangLank?.thang.pos  # Maintain old sprite's pos if we have it
-    @surface.spriteBoss.removeSprite @addThangSprite if @addThangSprite
+    @surface.lankBoss.removeLank @addThangLank if @addThangLank
     @addThangType = type
     if @addThangType
       thang = @createAddThang()
-      @addThangSprite = @surface.spriteBoss.addThangToSprites thang, @surface.spriteBoss.layerAdapters['Floating']
+      @addThangLank = @surface.lankBoss.addThangToLanks thang, @surface.lankBoss.layerAdapters['Floating']
-      @addThangSprite.notOfThisWorld = true
+      @addThangLank.notOfThisWorld = true
-      @addThangSprite.sprite.alpha = 0.75
+      @addThangLank.sprite.alpha = 0.75
-      @addThangSprite.playSound? 'selected'
+      @addThangLank.playSound? 'selected'
       pos ?= x: Math.round(@world.width / 2), y: Math.round(@world.height / 2)
-      @adjustThangPos @addThangSprite, thang, pos
+      @adjustThangPos @addThangLank, thang, pos
     else
-      @addThangSprite = null
+      @addThangLank = null
 
   createEssentialComponents: (defaultComponents) ->
     physicalConfig = {pos: {x: 10, y: 10, z: 1}}
@@ -399,32 +400,32 @@ module.exports = class ThangsTabView extends CocoView
     pos.y = Math.round((pos.y - (thang.height ? 1) / 2) / snap.y) * snap.y + (thang.height ? 1) / 2
     pos.z = thang.depth / 2
     thang.pos = pos
-    @surface.spriteBoss.update true  # Make sure Obstacle layer resets cache
+    @surface.lankBoss.update true  # Make sure Obstacle layer resets cache
 
   onSurfaceMouseMoved: (e) ->
-    return unless @addThangSprite
+    return unless @addThangLank
     wop = @surface.camera.screenToWorld x: e.x, y: e.y
     wop.z = 0.5
-    @adjustThangPos @addThangSprite, @addThangSprite.thang, wop
+    @adjustThangPos @addThangLank, @addThangLank.thang, wop
     if @paintingWalls
-      unless _.find @surface.spriteBoss.spriteArray, ((sprite) =>
+      unless _.find @surface.lankBoss.lankArray, ((lank) =>
-        sprite.thangType.get('kind') is 'Wall' and
+        lank.thangType.get('kind') is 'Wall' and
-        Math.abs(sprite.thang.pos.x - @addThangSprite.thang.pos.x) < 2 and
+        Math.abs(lank.thang.pos.x - @addThangLank.thang.pos.x) < 2 and
-        Math.abs(sprite.thang.pos.y - @addThangSprite.thang.pos.y) < 2 and
+        Math.abs(lank.thang.pos.y - @addThangLank.thang.pos.y) < 2 and
-        sprite isnt @addThangSprite
+        lank isnt @addThangLank
       )
-        @addThang @addThangType, @addThangSprite.thang.pos
+        @addThang @addThangType, @addThangLank.thang.pos
         @lastAddTime = new Date()
         @paintedWalls = true
     null
 
   onSurfaceMouseOver: (e) ->
-    return unless @addThangSprite
+    return unless @addThangLank
-    @addThangSprite.sprite.visible = true
+    @addThangLank.sprite.visible = true
 
   onSurfaceMouseOut: (e) ->
-    return unless @addThangSprite
+    return unless @addThangLank
-    @addThangSprite.sprite.visible = false
+    @addThangLank.sprite.visible = false
 
   calculateMovement: (pctX, pctY, widthHeightRatio) ->
     MOVE_TOP_MARGIN = 1.0 - MOVE_MARGIN
@@ -521,14 +522,14 @@ module.exports = class ThangsTabView extends CocoView
 
     # update selection, since the thangs have been remade
     if @selectedExtantThang
-      @selectedExtantSprite = @surface.spriteBoss.sprites[@selectedExtantThang.id]
+      @selectedExtantLank = @surface.lankBoss.lanks[@selectedExtantThang.id]
-      @selectedExtantThang = @selectedExtantSprite?.thang
+      @selectedExtantThang = @selectedExtantLank?.thang
     Backbone.Mediator.publish 'editor:thangs-edited', thangs: @world.thangs
 
   onTreemaThangSelected: (e, selectedTreemas) =>
     selectedThangID = _.last(selectedTreemas)?.data.id
     if selectedThangID isnt @selectedExtantThang?.id
-      @surface.spriteBoss.selectThang selectedThangID, null, true
+      @surface.lankBoss.selectThang selectedThangID, null, true
 
   onTreemaThangDoubleClicked: (e, treema) =>
     id = treema?.data?.id
@@ -566,6 +567,7 @@ module.exports = class ThangsTabView extends CocoView
       thangData = $(e.target).data 'thang-data'
     else  # Mediator event
       thangData = @getThangByID(e.thangID)
+    return unless thangData
     @editThangView = new LevelThangEditView thangData: thangData, level: @level, world: @world, supermodel: @supermodel, oldPath: @pathForThang(thangData)  # supermodel needed for checkForMissingSystems
     @insertSubView @editThangView
     @$el.find('>').hide()