Implement isometric & hexagonal tilemaps (#1213)

* Start working on isometric tiles

* Get isometric cell position

* Fix isometric mask

* Draw the appropriate grid depending on the cell shape

* Fix pixel to isometric cell positions and vice versa

* Formatting

* Placing a tile on another tile replaces it instead of mixing

* Undo works on new cells

* Add a scale_factor variable in tile mode indices

* Better horizontal/vertical cells calculation, still not a proper solution yet

* Slightly improve cell amount

* Add get_tile_size() and get_tile_shape() methods in CelTileMap

* Fix shadowed variables

* Implement basic locking logic

* When the tilemap is locked, ensure that all cel portions are updated

Needed for overlapping isometric tiles

* Remove previous tile to avoid overlapped pixels

* Add a tile_layout variable and some docstrings

* Formatting

* Create isometric tilesets from the UI

* Make a tilemap layer into place only mode from the layer settings

And pass the variables down from the layer to the cel

* Fix crash when cloning tilemap layers

* Re-order tilemap when changing its settings

* Restrict users to place tiles mode only when tilemap layer is in place only mode

* Fix manual mode (I think)

* Fix layer properties nodes not updating when selecting another layer

* Move tool brings tiles from outside of the canvas and makes them visible

* Fix rectangular tiles on place only mode, when the tilemap cell is larger than the tileset cell

* All of the available canvas should have initialized tilemap cells now

* Format

* Fix resizing on non-place only mode

* Change offset when resizing canvas

* Change offset when cropping to content, selection and centering frames

* Resize image resizes the tileset cells

* Fix scaling to non-integer multiples creating duplicate-ish tiles, and don't emit tileset.updated when resizing, as this affects all of the tilemaps in that project

* Fix resizing locked isometric tilemaps

Currently this breaks crop to content/selection and makes the image blank, the offset needs fixing anyway

* Fix crop to content/selection offsets

* Fix loading place only tilemaps

* Don't allow merging layers into a place-only tilemap layer

* Set cel's tile size and shape when setting tileset

* Undo/redo for locking tilemap and changing tile, shape & layout

* Disable selection resizing on isometric tilemaps

It is not working for isometric tilemaps at the moment. If we find a solution, we should re-enable it.

* Do not apply effects to place-only tilemaps

* Scaling project updates brush preview

* Warn users that locking a tilemap layer is permanent

* Copying and linking tilemap cels copies the indices

Needed for place-only tilemaps with overlapping pixels

* Add tile_added, tile_removed and tile_replaced signals in the tileset script

* Improve generate_isometric_rectangle algorithm

Not perfect but should be better

* Add strings for translations

* Scale indices based on cell size

* Fix crash when switching between tilemaps with different tilesets, and the new selected tiles do not exist in the new tileset

* Small improvement in tile indicator preview

* Support hexagonal tiles in place-only mode

Not currently supported in normal mode, as we need a mask for that first.

* Fully support pointy-top hexagonal tiles

* Fix grid type enum name

* Add tile_offset_axis variables

* Support flat top hexagons in the backend

Needs UI now

* Expose tile_offset_axis in the UI and add a duplicate method to TileSetCustom

* Change tileset shape & offset axis when importing image

* Fix unused variables

* Update Translations.pot

* Fix crash when using the bucket tool

* Minor code improvements

* Use the stack mode when drawing with the draw tiles mode enabled

Avoids issues such as replacing tiles, or changing their order

Author: OverloadedOrama

Diff for: Translations/Translations.pot

@@ -3623,6 +3623,7 @@ msgstr ""
 
 #. A tileset is a collection of tiles.
 #: src/UI/Timeline/NewTileMapLayerDialog.tscn
+#: src/UI/Timeline/LayerProperties.tscn
 msgid "Tileset:"
 msgstr ""
 
@@ -3640,9 +3641,73 @@ msgid "Tileset name:"
 msgstr ""
 
 #: src/UI/Timeline/NewTileMapLayerDialog.tscn
+#: src/UI/Timeline/LayerProperties.tscn
 msgid "Tile size:"
 msgstr ""
 
+#. The shape of each tile in a tileset (rectangular, isometric, hexagonal).
+#: src/UI/Timeline/NewTileMapLayerDialog.tscn
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Tile shape:"
+msgstr ""
+
+#. The layout that the tiles appear in, in a non-rectangular grid.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Tile layout:"
+msgstr ""
+
+#. The offset axis (horizontal or vertical) of non-rectangular tiles.
+#: src/UI/Timeline/NewTileMapLayerDialog.tscn
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Tile offset axis:"
+msgstr ""
+
+#. Tooltip of the "tile offset axis" option.
+#: src/UI/Timeline/NewTileMapLayerDialog.tscn
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "For all half-offset shapes (Isometric & Hexagonal), determines the offset axis."
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Stacked"
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Stacked offset"
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Stairs right"
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Stairs down"
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Diamond right"
+msgstr ""
+
+#. A tile layout option.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Diamond down"
+msgstr ""
+
+#. A button that toggles place-only mode on for a tilemap layer. This mode is used to only place tiles in a tilemap, without the ability to modify them.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Place-only mode:"
+msgstr ""
+
+#. A confirmation dialog that appears when attempting to enable place-only mode in a tilemap layer.
+#: src/UI/Timeline/LayerProperties.tscn
+msgid "Enabling place-only mode is a permanent action. Once activated, you will only be able to place tiles, and you won't be able to modify existing tiles anymore on this layer."
+msgstr ""
+
 #: src/UI/TilesPanel.gd
 msgid "Select a tile to place it on the canvas."
 msgstr ""

Diff for: src/Autoload/DrawingAlgos.gd

@@ -560,6 +560,86 @@ func similar_colors(c1: Color, c2: Color, tol := 0.392157) -> bool:
 	)
 
 
+func generate_isometric_rectangle(image: Image) -> void:
+	var half_size := image.get_size() / 2
+	var up := Vector2i(half_size.x, 0)
+	var right := Vector2i(image.get_size().x, half_size.y)
+	if image.get_height() < image.get_width():
+		up += Vector2i.LEFT
+	elif image.get_height() > image.get_width():
+		up += Vector2i.DOWN
+		right += Vector2i.DOWN
+	var up_right := Geometry2D.bresenham_line(up, right)
+	up_right.pop_back()
+	up_right.pop_back()
+	for pixel in up_right:
+		image.set_pixelv(pixel, Color.WHITE)
+		var left := Vector2i(image.get_size().x - 1 - pixel.x, pixel.y)
+		for j in range(pixel.x, left.x - 1, -1):
+			image.set_pixel(j, pixel.y, Color.WHITE)
+			var mirror_y := Vector2i(j, image.get_size().y - 1 - pixel.y)
+			for k in range(pixel.y, mirror_y.y + 1):
+				image.set_pixel(j, k, Color.WHITE)
+		var mirror_right := Vector2i(pixel.x, image.get_size().y - 1 - pixel.y)
+		image.set_pixelv(mirror_right, Color.WHITE)
+
+
+func generate_hexagonal_pointy_top(image: Image) -> void:
+	var half_size := image.get_size() / 2
+	var quarter_size := image.get_size() / 4
+	var three_quarters_size := (image.get_size() * 3) / 4
+	var up := Vector2i(half_size.x, 0)
+	var quarter := Vector2i(image.get_size().x - 1, quarter_size.y)
+	var line := Geometry2D.bresenham_line(up, quarter)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(image.get_size().x - 1 - pixel.x, pixel.y)
+		for j in range(pixel.x, mirror.x - 1, -1):
+			image.set_pixel(j, pixel.y, Color.WHITE)
+	var three_quarters := Vector2i(image.get_size().x - 1, three_quarters_size.y - 1)
+	line = Geometry2D.bresenham_line(quarter, three_quarters)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(image.get_size().x - 1 - pixel.x, pixel.y)
+		for j in range(pixel.x, mirror.x - 1, -1):
+			image.set_pixel(j, pixel.y, Color.WHITE)
+	var down := Vector2i(half_size.x, image.get_size().y - 1)
+	line = Geometry2D.bresenham_line(three_quarters, down)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(image.get_size().x - 1 - pixel.x, pixel.y)
+		for j in range(pixel.x, mirror.x - 1, -1):
+			image.set_pixel(j, pixel.y, Color.WHITE)
+
+
+func generate_hexagonal_flat_top(image: Image) -> void:
+	var half_size := image.get_size() / 2
+	var quarter_size := image.get_size() / 4
+	var three_quarters_size := (image.get_size() * 3) / 4
+	var left := Vector2i(0, half_size.y)
+	var quarter := Vector2i(quarter_size.x, image.get_size().y - 1)
+	var line := Geometry2D.bresenham_line(left, quarter)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(pixel.x, image.get_size().y - 1 - pixel.y)
+		for j in range(pixel.y, mirror.y - 1, -1):
+			image.set_pixel(pixel.x, j, Color.WHITE)
+	var three_quarters := Vector2i(three_quarters_size.x - 1, image.get_size().y - 1)
+	line = Geometry2D.bresenham_line(quarter, three_quarters)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(pixel.x, image.get_size().y - 1 - pixel.y)
+		for j in range(pixel.y, mirror.y - 1, -1):
+			image.set_pixel(pixel.x, j, Color.WHITE)
+	var down := Vector2i(image.get_size().x - 1, half_size.y)
+	line = Geometry2D.bresenham_line(three_quarters, down)
+	for pixel in line:
+		image.set_pixelv(pixel, Color.WHITE)
+		var mirror := Vector2i(pixel.x, image.get_size().y - 1 - pixel.y)
+		for j in range(pixel.y, mirror.y - 1, -1):
+			image.set_pixel(pixel.x, j, Color.WHITE)
+
+
 # Image effects
 func center(indices: Array) -> void:
 	var project := Global.current_project
@@ -587,11 +667,15 @@ func center(indices: Array) -> void:
 				continue
 			var cel_image := (cel as PixelCel).get_image()
 			var tmp_centered := project.new_empty_image()
-			tmp_centered.blend_rect(cel.image, used_rect, offset)
+			tmp_centered.blend_rect(cel_image, used_rect, offset)
 			var centered := ImageExtended.new()
 			centered.copy_from_custom(tmp_centered, cel_image.is_indexed)
 			if cel is CelTileMap:
-				(cel as CelTileMap).serialize_undo_data_source_image(centered, redo_data, undo_data)
+				var tilemap_cel := cel as CelTileMap
+				var tilemap_offset := (offset - used_rect.position) % tilemap_cel.get_tile_size()
+				tilemap_cel.serialize_undo_data_source_image(
+					centered, redo_data, undo_data, tilemap_offset
+				)
 			centered.add_data_to_dictionary(redo_data, cel_image)
 			cel_image.add_data_to_dictionary(undo_data)
 	project.deserialize_cel_undo_data(redo_data, undo_data)
@@ -603,20 +687,26 @@ func center(indices: Array) -> void:
 func scale_project(width: int, height: int, interpolation: int) -> void:
 	var redo_data := {}
 	var undo_data := {}
+	var tilesets: Array[TileSetCustom] = []
 	for cel in Global.current_project.get_all_pixel_cels():
 		if not cel is PixelCel:
 			continue
 		var cel_image := (cel as PixelCel).get_image()
-		var sprite := _resize_image(cel_image, width, height, interpolation) as ImageExtended
+		var sprite := resize_image(cel_image, width, height, interpolation) as ImageExtended
 		if cel is CelTileMap:
-			(cel as CelTileMap).serialize_undo_data_source_image(sprite, redo_data, undo_data)
+			var tilemap_cel := cel as CelTileMap
+			var skip_tileset_undo := not tilesets.has(tilemap_cel.tileset)
+			tilemap_cel.serialize_undo_data_source_image(
+				sprite, redo_data, undo_data, Vector2i.ZERO, skip_tileset_undo, interpolation
+			)
+			tilesets.append(tilemap_cel.tileset)
 		sprite.add_data_to_dictionary(redo_data, cel_image)
 		cel_image.add_data_to_dictionary(undo_data)
 
 	general_do_and_undo_scale(width, height, redo_data, undo_data)
 
 
-func _resize_image(
+func resize_image(
 	image: Image, width: int, height: int, interpolation: Image.Interpolation
 ) -> Image:
 	var new_image: Image
@@ -664,7 +754,9 @@ func crop_to_selection() -> void:
 		var cropped := ImageExtended.new()
 		cropped.copy_from_custom(tmp_cropped, cel_image.is_indexed)
 		if cel is CelTileMap:
-			(cel as CelTileMap).serialize_undo_data_source_image(cropped, redo_data, undo_data)
+			var tilemap_cel := cel as CelTileMap
+			var offset := rect.position
+			tilemap_cel.serialize_undo_data_source_image(cropped, redo_data, undo_data, -offset)
 		cropped.add_data_to_dictionary(redo_data, cel_image)
 		cel_image.add_data_to_dictionary(undo_data)
 
@@ -703,7 +795,9 @@ func crop_to_content() -> void:
 		var cropped := ImageExtended.new()
 		cropped.copy_from_custom(tmp_cropped, cel_image.is_indexed)
 		if cel is CelTileMap:
-			(cel as CelTileMap).serialize_undo_data_source_image(cropped, redo_data, undo_data)
+			var tilemap_cel := cel as CelTileMap
+			var offset := used_rect.position
+			tilemap_cel.serialize_undo_data_source_image(cropped, redo_data, undo_data, -offset)
 		cropped.add_data_to_dictionary(redo_data, cel_image)
 		cel_image.add_data_to_dictionary(undo_data)
 
@@ -724,13 +818,8 @@ func resize_canvas(width: int, height: int, offset_x: int, offset_y: int) -> voi
 		resized.convert_rgb_to_indexed()
 		if cel is CelTileMap:
 			var tilemap_cel := cel as CelTileMap
-			var skip_tileset := (
-				offset_x % tilemap_cel.tileset.tile_size.x == 0
-				and offset_y % tilemap_cel.tileset.tile_size.y == 0
-			)
-			tilemap_cel.serialize_undo_data_source_image(
-				resized, redo_data, undo_data, skip_tileset
-			)
+			var offset := Vector2i(offset_x, offset_y)
+			tilemap_cel.serialize_undo_data_source_image(resized, redo_data, undo_data, offset)
 		resized.add_data_to_dictionary(redo_data, cel_image)
 		cel_image.add_data_to_dictionary(undo_data)
 

Diff for: src/Autoload/OpenSave.gd

@@ -882,15 +882,22 @@ func import_reference_image_from_image(image: Image) -> void:
 
 
 func open_image_as_tileset(
-	path: String, image: Image, horiz: int, vert: int, project := Global.current_project
+	path: String,
+	image: Image,
+	horiz: int,
+	vert: int,
+	tile_shape: TileSet.TileShape,
+	tile_offset_axis: TileSet.TileOffsetAxis,
+	project := Global.current_project
 ) -> void:
 	image.convert(project.get_image_format())
 	horiz = mini(horiz, image.get_size().x)
 	vert = mini(vert, image.get_size().y)
 	var frame_width := image.get_size().x / horiz
 	var frame_height := image.get_size().y / vert
 	var tile_size := Vector2i(frame_width, frame_height)
-	var tileset := TileSetCustom.new(tile_size, path.get_basename().get_file())
+	var tileset := TileSetCustom.new(tile_size, path.get_basename().get_file(), tile_shape)
+	tileset.tile_offset_axis = tile_offset_axis
 	for yy in range(vert):
 		for xx in range(horiz):
 			var cropped_image := image.get_region(
@@ -906,13 +913,16 @@ func open_image_as_tileset_smart(
 	image: Image,
 	sliced_rects: Array[Rect2i],
 	tile_size: Vector2i,
+	tile_shape: TileSet.TileShape,
+	tile_offset_axis: TileSet.TileOffsetAxis,
 	project := Global.current_project
 ) -> void:
 	image.convert(project.get_image_format())
 	if sliced_rects.size() == 0:  # Image is empty sprite (manually set data to be consistent)
 		tile_size = image.get_size()
 		sliced_rects.append(Rect2i(Vector2i.ZERO, tile_size))
-	var tileset := TileSetCustom.new(tile_size, path.get_basename().get_file())
+	var tileset := TileSetCustom.new(tile_size, path.get_basename().get_file(), tile_shape)
+	tileset.tile_offset_axis = tile_offset_axis
 	for rect in sliced_rects:
 		var offset: Vector2 = (0.5 * (tile_size - rect.size)).floor()
 		var cropped_image := Image.create(

Diff for: src/Classes/AsepriteParser.gd

@@ -210,14 +210,14 @@ static func open_aseprite_file(path: String) -> void:
 						var _diagonal_flip_bitmask := ase_file.get_32()
 						ase_file.get_buffer(10)  # Reserved
 						var tilemap_cel := cel as CelTileMap
-						var tileset := tilemap_cel.tileset
 						@warning_ignore("integer_division")
 						var bytes_per_tile := bits_per_tile / 8
 						var tile_data_compressed := ase_file.get_buffer(
 							chunk_size - TILEMAP_CEL_CHUNK_SIZE
 						)
+						var tile_size := tilemap_cel.get_tile_size()
 						var tile_data_size := (
-							width * height * tileset.tile_size.x * tileset.tile_size.y * pixel_byte
+							width * height * tile_size.x * tile_size.y * pixel_byte
 						)
 						var tile_data := tile_data_compressed.decompress(
 							tile_data_size, FileAccess.COMPRESSION_DEFLATE
@@ -391,7 +391,10 @@ static func open_aseprite_file(path: String) -> void:
 							data_length, FileAccess.COMPRESSION_DEFLATE
 						)
 					var tileset := TileSetCustom.new(
-						Vector2i(tile_width, tile_height), tileset_name, false
+						Vector2i(tile_width, tile_height),
+						tileset_name,
+						TileSet.TILE_SHAPE_SQUARE,
+						false
 					)
 					for k in n_of_tiles:
 						var n_of_pixels := tile_width * tile_height * pixel_byte