[Editor] Enable moving and removing layers

editor/src/main/kotlin/com/bartlomiejpluta/base/editor/render/canvas/map/MapCanvas.kt

@@ -5,6 +5,7 @@ import com.bartlomiejpluta.base.editor.model.map.layer.TileLayer
 import com.bartlomiejpluta.base.editor.render.model.Renderable
 import com.bartlomiejpluta.base.editor.viewmodel.map.GameMapVM
 import javafx.scene.canvas.GraphicsContext
+import javafx.scene.paint.Color
 
 
 class MapCanvas(val map: GameMapVM, private val painter: MapPainter) : Renderable {
@@ -21,7 +22,10 @@ class MapCanvas(val map: GameMapVM, private val painter: MapPainter) : Renderabl
     override fun render(gc: GraphicsContext) {
         gc.clearRect(0.0, 0.0, gc.canvas.width, gc.canvas.height);
 
+        renderBackground(gc)
+
         layers.forEach { dispatchLayerRender(gc, it) }
+
         renderGrid(gc)
 
         painter.render(gc)
@@ -33,6 +37,15 @@ class MapCanvas(val map: GameMapVM, private val painter: MapPainter) : Renderabl
         }
     }
 
+    private fun renderBackground(gc: GraphicsContext) {
+        for (row in 0 until rows) {
+            for (column in 0 until columns) {
+                gc.fill = if ((row + column) % 2 == 0) BACKGROUND_COLOR1 else BACKGROUND_COLOR2
+                gc.fillRect(column * tileWidth, row * tileHeight, tileWidth, tileHeight)
+            }
+        }
+    }
+
     private fun renderTileLayer(gc: GraphicsContext, tileLayer: TileLayer) {
         for ((row, columns) in tileLayer.layer.withIndex()) {
             for ((column, tile) in columns.withIndex()) {
@@ -46,6 +59,11 @@ class MapCanvas(val map: GameMapVM, private val painter: MapPainter) : Renderabl
     private fun renderGrid(gc: GraphicsContext) {
         gc.lineWidth = 1.5
 
+        gc.strokeLine(0.0, 0.0, mapWidth, 0.0)
+        gc.strokeLine(0.0, 0.0, 0.0, mapHeight)
+        gc.strokeLine(mapWidth, 0.0, mapWidth, mapHeight)
+        gc.strokeLine(0.0, mapHeight, mapWidth, mapHeight)
+
         for (row in 0 until rows) {
             gc.strokeLine(0.0, row * tileHeight, mapWidth, row * tileHeight)
         }
@@ -54,4 +72,9 @@ class MapCanvas(val map: GameMapVM, private val painter: MapPainter) : Renderabl
             gc.strokeLine(column * tileWidth, 0.0, column * tileWidth, mapHeight)
         }
     }
+
+    companion object {
+        private val BACKGROUND_COLOR1 = Color.color(1.0, 1.0, 1.0, 1.0)
+        private val BACKGROUND_COLOR2 = Color.color(0.95, 0.95, 0.95, 0.95)
+    }
 }

editor/src/main/kotlin/com/bartlomiejpluta/base/editor/render/canvas/map/MapPaintingTrace.kt

@@ -10,7 +10,7 @@ data class MapPaintingTrace(val map: GameMapVM, override val commandName: String
     private val trace = mutableListOf<Element>()
 
     fun paint(layerIndex: Int, row: Int, column: Int, tile: Tile?) {
-        if (row >= map.rows || column >= map.columns || row < 0 || column < 0) {
+        if (row >= map.rows || column >= map.columns || row < 0 || column < 0 || layerIndex < 0) {
             return
         }
 

editor/src/main/kotlin/com/bartlomiejpluta/base/editor/render/canvas/tileset/TileSetCanvas.kt

@@ -66,6 +66,5 @@ class TileSetCanvas(private val tileSet: TileSet, brushVM: BrushVM) : Renderable
     companion object {
         private val BACKGROUND_COLOR1 = Color.color(1.0, 1.0, 1.0, 1.0)
         private val BACKGROUND_COLOR2 = Color.color(0.95, 0.95, 0.95, 0.95)
-        private const val BACKGROUND_TILE_SIZE_FACTOR = 4.0
     }
 }

editor/src/main/kotlin/com/bartlomiejpluta/base/editor/view/fragment/MapFragment.kt

@@ -10,6 +10,7 @@ import com.bartlomiejpluta.base.editor.viewmodel.map.GameMapVM
 import com.bartlomiejpluta.base.editor.viewmodel.map.BrushVM
 import javafx.beans.property.SimpleDoubleProperty
 import javafx.beans.property.SimpleIntegerProperty
+import javafx.scene.control.TableView
 import javafx.scene.input.MouseButton
 import javafx.scene.input.MouseEvent
 import javafx.scene.transform.Scale
@@ -31,6 +32,7 @@ class MapFragment : Fragment() {
 
     private val mapPane = MapPane(mapVM, brushVM, selectedLayer) { undoRedoService.push(it) }
     private val tileSetPane = TileSetPane(map.tileSet, brushVM)
+    private var layersPane: TableView<Layer> by singleAssign()
 
     private val transformation = Scale(1.0, 1.0, 0.0, 0.0).apply {
         xProperty().bind(scaleProperty)
@@ -66,20 +68,55 @@ class MapFragment : Fragment() {
         right = drawer(multiselect = true) {
             item("Layers", expanded = true) {
                 borderpane {
-                    center = tableview(mapVM.layers) {
+                    layersPane = tableview(mapVM.layers) {
                         column("Layer Name", Layer::nameProperty).makeEditable()
 
                         selectedLayer.bind(selectionModel.selectedIndexProperty())
                     }
 
+                    center = layersPane
+
                     bottom = toolbar {
                         button(graphic = FontIcon("fa-plus")) {
-                            action { mapVM.item.createTileLayer("Layer ${mapVM.item.layers.size+1}") }
+                            action {
+                                mapVM.item.createTileLayer("Layer ${mapVM.layers.size+1}")
+                                layersPane.selectionModel.select(mapVM.layers.size - 1)
+                            }
                         }
 
-                        button(graphic = FontIcon("fa-chevron-up"))
+                        button(graphic = FontIcon("fa-chevron-up")) {
-                        button(graphic = FontIcon("fa-chevron-down"))
+                            enableWhen(selectedLayer.greaterThan(0))
-                        button(graphic = FontIcon("fa-trash"))
+                            action {
+                                val newIndex = selectedLayer.value-1
+                                mapVM.layers.swap(selectedLayer.value, newIndex)
+                                layersPane.selectionModel.select(newIndex)
+                                fire(RedrawMapRequestEvent)
+                            }
+                        }
+
+                        button(graphic = FontIcon("fa-chevron-down")) {
+                            enableWhen(selectedLayer.lessThan(mapVM.layers.sizeProperty().minus(1)).and(selectedLayer.greaterThanOrEqualTo(0)))
+                            action {
+                                val newIndex = selectedLayer.value+1
+                                mapVM.layers.swap(selectedLayer.value, newIndex)
+                                layersPane.selectionModel.select(newIndex)
+                                fire(RedrawMapRequestEvent)
+                            }
+                        }
+
+                        button(graphic = FontIcon("fa-trash")) {
+                            enableWhen(selectedLayer.greaterThanOrEqualTo(0))
+                            action {
+                                var index = selectedLayer.value
+                                mapVM.layers.removeAt(index)
+
+                                if(--index >= 0) {
+                                    layersPane.selectionModel.select(index)
+                                }
+
+                                fire(RedrawMapRequestEvent)
+                            }
+                        }
                     }
                 }
             }