From 1e2e873351a4b7c75defef24f9035ee10074426c Mon Sep 17 00:00:00 2001 From: xhayper Date: Sun, 30 Jul 2023 15:24:45 +0700 Subject: [PATCH] feat: initial support for 1.13+ --- .gitmodules | 3 + README.md | 2 +- app/index.html | 901 ++- app/index.js | 539 +- app/modal.html | 104 +- app/models/canvas.js | 3671 +++++----- app/models/convert.js | 76 +- app/models/counter.js | 148 +- app/models/schematics.js | 50 +- app/models/svgCroppy.js | 1104 +-- app/screens/convert.js | 327 +- app/screens/editor.js | 1065 +-- app/screens/settings.js | 867 ++- app/screens/start.js | 503 +- app/style.css | 883 +-- build/webpack.base.conf.js | 54 +- build/webpack.dev.conf.js | 40 +- build/webpack.prod.conf.js | 21 +- external/minecraft-data | 1 + package.json | 28 +- pnpm-lock.yaml | 6201 +++++++++++++++++ prepare-block.js | 186 + prepare.js | 150 +- static/baked_blocks.json | 2922 ++++++++ static/blocks_20.json | 1900 +++++ static/textures/acacia_door_bottom.png | Bin 0 -> 252 bytes static/textures/acacia_door_top.png | Bin 0 -> 264 bytes static/textures/acacia_leaves.png | Bin 0 -> 249 bytes static/textures/acacia_log.png | Bin 0 -> 259 bytes static/textures/acacia_log_top.png | Bin 0 -> 301 bytes static/textures/acacia_planks.png | Bin 0 -> 269 bytes static/textures/acacia_sapling.png | Bin 0 -> 232 bytes static/textures/acacia_trapdoor.png | Bin 0 -> 172 bytes static/textures/activator_rail.png | Bin 0 -> 294 bytes static/textures/activator_rail_on.png | Bin 0 -> 295 bytes static/textures/allium.png | Bin 0 -> 250 bytes static/textures/amethyst_block.png | Bin 0 -> 284 bytes static/textures/amethyst_cluster.png | Bin 0 -> 249 bytes static/textures/ancient_debris_side.png | Bin 0 -> 276 bytes static/textures/ancient_debris_top.png | Bin 0 -> 298 bytes static/textures/andesite.png | Bin 0 -> 260 bytes static/textures/anvil.png | Bin 0 -> 236 bytes static/textures/anvil_top.png | Bin 0 -> 201 bytes static/textures/attached_melon_stem.png | Bin 0 -> 146 bytes static/textures/attached_pumpkin_stem.png | Bin 0 -> 165 bytes static/textures/azalea_leaves.png | Bin 0 -> 265 bytes static/textures/azalea_plant.png | Bin 0 -> 287 bytes static/textures/azalea_side.png | Bin 0 -> 235 bytes static/textures/azalea_top.png | Bin 0 -> 251 bytes static/textures/azure_bluet.png | Bin 0 -> 247 bytes static/textures/bamboo_block.png | Bin 0 -> 299 bytes static/textures/bamboo_block_top.png | Bin 0 -> 198 bytes static/textures/bamboo_door_bottom.png | Bin 0 -> 327 bytes static/textures/bamboo_door_top.png | Bin 0 -> 304 bytes static/textures/bamboo_fence.png | Bin 0 -> 295 bytes static/textures/bamboo_fence_gate.png | Bin 0 -> 289 bytes .../textures/bamboo_fence_gate_particle.png | Bin 0 -> 213 bytes static/textures/bamboo_fence_particle.png | Bin 0 -> 213 bytes static/textures/bamboo_large_leaves.png | Bin 0 -> 290 bytes static/textures/bamboo_mosaic.png | Bin 0 -> 303 bytes static/textures/bamboo_planks.png | Bin 0 -> 274 bytes static/textures/bamboo_singleleaf.png | Bin 0 -> 138 bytes static/textures/bamboo_small_leaves.png | Bin 0 -> 255 bytes static/textures/bamboo_stage0.png | Bin 0 -> 246 bytes static/textures/bamboo_stalk.png | Bin 0 -> 279 bytes static/textures/bamboo_trapdoor.png | Bin 0 -> 323 bytes static/textures/barrel_bottom.png | Bin 0 -> 270 bytes static/textures/barrel_side.png | Bin 0 -> 258 bytes static/textures/barrel_top.png | Bin 0 -> 243 bytes static/textures/barrel_top_open.png | Bin 0 -> 223 bytes static/textures/basalt_side.png | Bin 0 -> 256 bytes static/textures/basalt_top.png | Bin 0 -> 279 bytes static/textures/beacon.png | Bin 0 -> 211 bytes static/textures/bedrock.png | Bin 225 -> 247 bytes static/textures/bee_nest_bottom.png | Bin 0 -> 220 bytes static/textures/bee_nest_front.png | Bin 0 -> 286 bytes static/textures/bee_nest_front_honey.png | Bin 0 -> 315 bytes static/textures/bee_nest_side.png | Bin 0 -> 243 bytes static/textures/bee_nest_top.png | Bin 0 -> 220 bytes static/textures/beehive_end.png | Bin 0 -> 216 bytes static/textures/beehive_front.png | Bin 0 -> 250 bytes static/textures/beehive_front_honey.png | Bin 0 -> 291 bytes static/textures/beehive_side.png | Bin 0 -> 247 bytes static/textures/beetroots_stage0.png | Bin 0 -> 118 bytes static/textures/beetroots_stage1.png | Bin 0 -> 135 bytes static/textures/beetroots_stage2.png | Bin 0 -> 198 bytes static/textures/beetroots_stage3.png | Bin 0 -> 219 bytes static/textures/bell_bottom.png | Bin 0 -> 145 bytes static/textures/bell_side.png | Bin 0 -> 140 bytes static/textures/bell_top.png | Bin 0 -> 148 bytes static/textures/big_dripleaf_side.png | Bin 0 -> 84 bytes static/textures/big_dripleaf_stem.png | Bin 0 -> 195 bytes static/textures/big_dripleaf_tip.png | Bin 0 -> 133 bytes static/textures/big_dripleaf_top.png | Bin 0 -> 245 bytes static/textures/birch_door_bottom.png | Bin 0 -> 297 bytes static/textures/birch_door_top.png | Bin 0 -> 274 bytes static/textures/birch_leaves.png | Bin 0 -> 231 bytes static/textures/birch_log.png | Bin 0 -> 266 bytes static/textures/birch_log_top.png | Bin 0 -> 298 bytes static/textures/birch_planks.png | Bin 0 -> 268 bytes static/textures/birch_sapling.png | Bin 0 -> 223 bytes static/textures/birch_trapdoor.png | Bin 0 -> 310 bytes static/textures/black_candle.png | Bin 0 -> 127 bytes static/textures/black_candle_lit.png | Bin 0 -> 136 bytes ...{concrete_black.png => black_concrete.png} | Bin ...er_black.png => black_concrete_powder.png} | Bin ..._black.png => black_glazed_terracotta.png} | Bin static/textures/black_shulker_box.png | Bin 0 -> 266 bytes static/textures/black_stained_glass.png | Bin 0 -> 105 bytes .../textures/black_stained_glass_pane_top.png | Bin 0 -> 114 bytes ...stained_black.png => black_terracotta.png} | Bin ...{wool_colored_black.png => black_wool.png} | Bin static/textures/blackstone.png | Bin 0 -> 290 bytes static/textures/blackstone_top.png | Bin 0 -> 288 bytes static/textures/blast_furnace_front.png | Bin 0 -> 314 bytes static/textures/blast_furnace_front_on.png | Bin 0 -> 612 bytes static/textures/blast_furnace_side.png | Bin 0 -> 294 bytes static/textures/blast_furnace_top.png | Bin 0 -> 247 bytes static/textures/blue_candle.png | Bin 0 -> 128 bytes static/textures/blue_candle_lit.png | Bin 0 -> 136 bytes .../{concrete_blue.png => blue_concrete.png} | Bin ...wder_blue.png => blue_concrete_powder.png} | Bin ...ta_blue.png => blue_glazed_terracotta.png} | Bin static/textures/blue_orchid.png | Bin 0 -> 186 bytes static/textures/blue_shulker_box.png | Bin 0 -> 317 bytes static/textures/blue_stained_glass.png | Bin 0 -> 134 bytes .../textures/blue_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...y_stained_blue.png => blue_terracotta.png} | Bin .../{wool_colored_blue.png => blue_wool.png} | Bin static/textures/bone_block_side.png | Bin 289 -> 167 bytes static/textures/bone_block_top.png | Bin 0 -> 242 bytes static/textures/bookshelf.png | Bin 374 -> 413 bytes static/textures/brain_coral.png | Bin 0 -> 255 bytes static/textures/brain_coral_fan.png | Bin 0 -> 213 bytes static/textures/brewing_stand.png | Bin 0 -> 329 bytes static/textures/brewing_stand_base.png | Bin 0 -> 256 bytes static/textures/brick.png | Bin 506 -> 0 bytes static/textures/bricks.png | Bin 0 -> 266 bytes static/textures/brown_candle.png | Bin 0 -> 127 bytes static/textures/brown_candle_lit.png | Bin 0 -> 136 bytes ...{concrete_brown.png => brown_concrete.png} | Bin ...er_brown.png => brown_concrete_powder.png} | Bin ..._brown.png => brown_glazed_terracotta.png} | Bin static/textures/brown_mushroom.png | Bin 0 -> 139 bytes static/textures/brown_mushroom_block.png | Bin 0 -> 221 bytes static/textures/brown_shulker_box.png | Bin 0 -> 333 bytes static/textures/brown_stained_glass.png | Bin 0 -> 105 bytes .../textures/brown_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...stained_brown.png => brown_terracotta.png} | Bin ...{wool_colored_brown.png => brown_wool.png} | Bin static/textures/bubble_coral.png | Bin 0 -> 221 bytes static/textures/bubble_coral_fan.png | Bin 0 -> 201 bytes static/textures/budding_amethyst.png | Bin 0 -> 325 bytes static/textures/cactus_bottom.png | Bin 0 -> 225 bytes static/textures/cactus_side.png | Bin 0 -> 276 bytes static/textures/cactus_top.png | Bin 0 -> 242 bytes static/textures/cake_bottom.png | Bin 0 -> 203 bytes static/textures/cake_inner.png | Bin 0 -> 200 bytes static/textures/cake_side.png | Bin 0 -> 189 bytes static/textures/cake_top.png | Bin 0 -> 237 bytes static/textures/calcite.png | Bin 0 -> 257 bytes .../calibrated_sculk_sensor_amethyst.png | Bin 0 -> 194 bytes .../calibrated_sculk_sensor_input_side.png | Bin 0 -> 284 bytes .../textures/calibrated_sculk_sensor_top.png | Bin 0 -> 256 bytes static/textures/campfire_fire.png | Bin 0 -> 506 bytes static/textures/campfire_log.png | Bin 0 -> 271 bytes static/textures/campfire_log_lit.png | Bin 0 -> 898 bytes static/textures/candle.png | Bin 0 -> 130 bytes static/textures/candle_lit.png | Bin 0 -> 135 bytes static/textures/carrots_stage0.png | Bin 0 -> 102 bytes static/textures/carrots_stage1.png | Bin 0 -> 143 bytes static/textures/carrots_stage2.png | Bin 0 -> 191 bytes static/textures/carrots_stage3.png | Bin 0 -> 244 bytes static/textures/cartography_table_side1.png | Bin 0 -> 358 bytes static/textures/cartography_table_side2.png | Bin 0 -> 378 bytes static/textures/cartography_table_side3.png | Bin 0 -> 281 bytes static/textures/cartography_table_top.png | Bin 0 -> 397 bytes static/textures/carved_pumpkin.png | Bin 0 -> 277 bytes static/textures/cauldron_bottom.png | Bin 0 -> 136 bytes static/textures/cauldron_inner.png | Bin 0 -> 195 bytes static/textures/cauldron_side.png | Bin 0 -> 247 bytes static/textures/cauldron_top.png | Bin 0 -> 215 bytes static/textures/cave_vines.png | Bin 0 -> 288 bytes static/textures/cave_vines_lit.png | Bin 0 -> 304 bytes static/textures/cave_vines_plant.png | Bin 0 -> 278 bytes static/textures/cave_vines_plant_lit.png | Bin 0 -> 302 bytes static/textures/chain.png | Bin 0 -> 122 bytes static/textures/chain_command_block_back.png | Bin 0 -> 675 bytes .../chain_command_block_conditional.png | Bin 0 -> 734 bytes static/textures/chain_command_block_front.png | Bin 0 -> 733 bytes static/textures/chain_command_block_side.png | Bin 0 -> 713 bytes static/textures/cherry_door_bottom.png | Bin 0 -> 328 bytes static/textures/cherry_door_top.png | Bin 0 -> 320 bytes static/textures/cherry_leaves.png | Bin 0 -> 339 bytes static/textures/cherry_log.png | Bin 0 -> 232 bytes static/textures/cherry_log_top.png | Bin 0 -> 293 bytes static/textures/cherry_planks.png | Bin 0 -> 270 bytes static/textures/cherry_sapling.png | Bin 0 -> 279 bytes static/textures/cherry_trapdoor.png | Bin 0 -> 301 bytes static/textures/chipped_anvil_top.png | Bin 0 -> 240 bytes static/textures/chiseled_bookshelf_empty.png | Bin 0 -> 232 bytes .../textures/chiseled_bookshelf_occupied.png | Bin 0 -> 393 bytes static/textures/chiseled_bookshelf_side.png | Bin 0 -> 230 bytes static/textures/chiseled_bookshelf_top.png | Bin 0 -> 233 bytes static/textures/chiseled_deepslate.png | Bin 0 -> 223 bytes static/textures/chiseled_nether_bricks.png | Bin 0 -> 285 bytes .../textures/chiseled_polished_blackstone.png | Bin 0 -> 254 bytes static/textures/chiseled_quartz_block.png | Bin 0 -> 251 bytes static/textures/chiseled_quartz_block_top.png | Bin 0 -> 259 bytes static/textures/chiseled_red_sandstone.png | Bin 0 -> 272 bytes static/textures/chiseled_sandstone.png | Bin 0 -> 250 bytes static/textures/chiseled_stone_bricks.png | Bin 0 -> 258 bytes static/textures/chorus_flower.png | Bin 695 -> 325 bytes static/textures/chorus_flower_dead.png | Bin 0 -> 328 bytes static/textures/chorus_plant.png | Bin 621 -> 300 bytes static/textures/clay.png | Bin 584 -> 278 bytes static/textures/coal_block.png | Bin 239 -> 222 bytes static/textures/coal_ore.png | Bin 257 -> 301 bytes static/textures/coarse_dirt.png | Bin 0 -> 596 bytes static/textures/cobbled_deepslate.png | Bin 0 -> 273 bytes static/textures/cobblestone.png | Bin 568 -> 265 bytes static/textures/cobblestone_mossy.png | Bin 630 -> 0 bytes static/textures/cobweb.png | Bin 0 -> 212 bytes static/textures/cocoa_stage0.png | Bin 0 -> 178 bytes static/textures/cocoa_stage1.png | Bin 0 -> 183 bytes static/textures/cocoa_stage2.png | Bin 0 -> 249 bytes static/textures/command_block_back.png | Bin 0 -> 670 bytes static/textures/command_block_conditional.png | Bin 0 -> 742 bytes static/textures/command_block_front.png | Bin 0 -> 756 bytes static/textures/command_block_side.png | Bin 0 -> 732 bytes static/textures/comparator.png | Bin 0 -> 279 bytes static/textures/comparator_on.png | Bin 0 -> 282 bytes static/textures/composter_bottom.png | Bin 0 -> 230 bytes static/textures/composter_compost.png | Bin 0 -> 236 bytes static/textures/composter_ready.png | Bin 0 -> 274 bytes static/textures/composter_side.png | Bin 0 -> 258 bytes static/textures/composter_top.png | Bin 0 -> 169 bytes static/textures/concrete_powder_green.png | Bin 615 -> 0 bytes static/textures/conduit.png | Bin 0 -> 261 bytes static/textures/copper_block.png | Bin 0 -> 268 bytes static/textures/copper_ore.png | Bin 0 -> 321 bytes static/textures/cornflower.png | Bin 0 -> 178 bytes static/textures/cracked_deepslate_bricks.png | Bin 0 -> 277 bytes static/textures/cracked_deepslate_tiles.png | Bin 0 -> 251 bytes static/textures/cracked_nether_bricks.png | Bin 0 -> 299 bytes .../cracked_polished_blackstone_bricks.png | Bin 0 -> 279 bytes static/textures/cracked_stone_bricks.png | Bin 0 -> 283 bytes static/textures/crafting_table_front.png | Bin 0 -> 351 bytes static/textures/crafting_table_side.png | Bin 384 -> 337 bytes static/textures/crafting_table_top.png | Bin 0 -> 262 bytes static/textures/crimson_door_bottom.png | Bin 0 -> 279 bytes static/textures/crimson_door_top.png | Bin 0 -> 274 bytes static/textures/crimson_fungus.png | Bin 0 -> 210 bytes static/textures/crimson_nylium.png | Bin 0 -> 291 bytes static/textures/crimson_nylium_side.png | Bin 0 -> 319 bytes static/textures/crimson_planks.png | Bin 0 -> 281 bytes static/textures/crimson_roots.png | Bin 0 -> 205 bytes static/textures/crimson_roots_pot.png | Bin 0 -> 212 bytes static/textures/crimson_stem.png | Bin 0 -> 676 bytes static/textures/crimson_stem_top.png | Bin 0 -> 301 bytes static/textures/crimson_trapdoor.png | Bin 0 -> 251 bytes static/textures/crying_obsidian.png | Bin 0 -> 315 bytes static/textures/cut_copper.png | Bin 0 -> 269 bytes static/textures/cut_red_sandstone.png | Bin 0 -> 252 bytes static/textures/cut_sandstone.png | Bin 0 -> 249 bytes static/textures/cyan_candle.png | Bin 0 -> 128 bytes static/textures/cyan_candle_lit.png | Bin 0 -> 137 bytes .../{concrete_cyan.png => cyan_concrete.png} | Bin ...wder_cyan.png => cyan_concrete_powder.png} | Bin ...ta_cyan.png => cyan_glazed_terracotta.png} | Bin static/textures/cyan_shulker_box.png | Bin 0 -> 320 bytes static/textures/cyan_stained_glass.png | Bin 0 -> 106 bytes .../textures/cyan_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...y_stained_cyan.png => cyan_terracotta.png} | Bin .../{wool_colored_cyan.png => cyan_wool.png} | Bin static/textures/damaged_anvil_top.png | Bin 0 -> 252 bytes static/textures/dandelion.png | Bin 0 -> 139 bytes static/textures/dark_oak_door_bottom.png | Bin 0 -> 257 bytes static/textures/dark_oak_door_top.png | Bin 0 -> 271 bytes static/textures/dark_oak_leaves.png | Bin 0 -> 243 bytes static/textures/dark_oak_log.png | Bin 0 -> 260 bytes static/textures/dark_oak_log_top.png | Bin 0 -> 286 bytes static/textures/dark_oak_planks.png | Bin 0 -> 263 bytes static/textures/dark_oak_sapling.png | Bin 0 -> 243 bytes static/textures/dark_oak_trapdoor.png | Bin 0 -> 225 bytes static/textures/dark_prismarine.png | Bin 0 -> 238 bytes .../daylight_detector_inverted_top.png | Bin 0 -> 148 bytes static/textures/daylight_detector_side.png | Bin 0 -> 138 bytes static/textures/daylight_detector_top.png | Bin 0 -> 185 bytes static/textures/dead_brain_coral.png | Bin 0 -> 248 bytes static/textures/dead_brain_coral_fan.png | Bin 0 -> 246 bytes static/textures/dead_bubble_coral.png | Bin 0 -> 219 bytes static/textures/dead_bubble_coral_fan.png | Bin 0 -> 215 bytes static/textures/dead_bush.png | Bin 0 -> 197 bytes static/textures/dead_fire_coral.png | Bin 0 -> 221 bytes static/textures/dead_fire_coral_fan.png | Bin 0 -> 249 bytes static/textures/dead_horn_coral.png | Bin 0 -> 209 bytes static/textures/dead_horn_coral_fan.png | Bin 0 -> 222 bytes static/textures/dead_tube_coral.png | Bin 0 -> 248 bytes static/textures/dead_tube_coral_fan.png | Bin 0 -> 230 bytes static/textures/debug.png | Bin 0 -> 560 bytes static/textures/debug2.png | Bin 0 -> 269 bytes static/textures/deepslate.png | Bin 0 -> 240 bytes static/textures/deepslate_bricks.png | Bin 0 -> 245 bytes static/textures/deepslate_coal_ore.png | Bin 0 -> 289 bytes static/textures/deepslate_copper_ore.png | Bin 0 -> 319 bytes static/textures/deepslate_diamond_ore.png | Bin 0 -> 329 bytes static/textures/deepslate_emerald_ore.png | Bin 0 -> 313 bytes static/textures/deepslate_gold_ore.png | Bin 0 -> 298 bytes static/textures/deepslate_iron_ore.png | Bin 0 -> 307 bytes static/textures/deepslate_lapis_ore.png | Bin 0 -> 332 bytes static/textures/deepslate_redstone_ore.png | Bin 0 -> 327 bytes static/textures/deepslate_tiles.png | Bin 0 -> 233 bytes static/textures/deepslate_top.png | Bin 0 -> 254 bytes static/textures/destroy_stage_0.png | Bin 0 -> 102 bytes static/textures/destroy_stage_1.png | Bin 0 -> 115 bytes static/textures/destroy_stage_2.png | Bin 0 -> 123 bytes static/textures/destroy_stage_3.png | Bin 0 -> 145 bytes static/textures/destroy_stage_4.png | Bin 0 -> 155 bytes static/textures/destroy_stage_5.png | Bin 0 -> 169 bytes static/textures/destroy_stage_6.png | Bin 0 -> 177 bytes static/textures/destroy_stage_7.png | Bin 0 -> 190 bytes static/textures/destroy_stage_8.png | Bin 0 -> 211 bytes static/textures/destroy_stage_9.png | Bin 0 -> 218 bytes static/textures/detector_rail.png | Bin 0 -> 283 bytes static/textures/detector_rail_on.png | Bin 0 -> 297 bytes static/textures/diamond_block.png | Bin 468 -> 263 bytes static/textures/diamond_ore.png | Bin 262 -> 301 bytes static/textures/diorite.png | Bin 0 -> 271 bytes static/textures/dirt_path_side.png | Bin 0 -> 289 bytes static/textures/dirt_path_top.png | Bin 0 -> 258 bytes static/textures/dispenser_front.png | Bin 0 -> 256 bytes static/textures/dispenser_front_vertical.png | Bin 0 -> 282 bytes static/textures/dragon_egg.png | Bin 0 -> 192 bytes static/textures/dried_kelp_bottom.png | Bin 0 -> 290 bytes static/textures/dried_kelp_top.png | Bin 0 -> 306 bytes static/textures/dripstone_block.png | Bin 0 -> 258 bytes static/textures/dropper_front.png | Bin 0 -> 313 bytes static/textures/dropper_front_vertical.png | Bin 0 -> 278 bytes static/textures/emerald_block.png | Bin 658 -> 250 bytes static/textures/emerald_ore.png | Bin 363 -> 310 bytes static/textures/enchanting_table_bottom.png | Bin 0 -> 263 bytes static/textures/enchanting_table_side.png | Bin 0 -> 273 bytes static/textures/enchanting_table_top.png | Bin 0 -> 199 bytes static/textures/end_bricks.png | Bin 579 -> 0 bytes static/textures/end_portal_frame_eye.png | Bin 0 -> 183 bytes static/textures/end_portal_frame_side.png | Bin 0 -> 278 bytes static/textures/end_portal_frame_top.png | Bin 0 -> 269 bytes static/textures/end_rod.png | Bin 0 -> 159 bytes static/textures/end_stone.png | Bin 404 -> 270 bytes static/textures/end_stone_bricks.png | Bin 0 -> 273 bytes static/textures/exposed_copper.png | Bin 0 -> 281 bytes static/textures/exposed_cut_copper.png | Bin 0 -> 296 bytes static/textures/farmland.png | Bin 0 -> 243 bytes static/textures/farmland_moist.png | Bin 0 -> 244 bytes static/textures/fern.png | Bin 0 -> 244 bytes static/textures/fire_0.png | Bin 0 -> 720 bytes static/textures/fire_1.png | Bin 0 -> 693 bytes static/textures/fire_coral.png | Bin 0 -> 223 bytes static/textures/fire_coral_fan.png | Bin 0 -> 228 bytes static/textures/fletching_table_front.png | Bin 0 -> 378 bytes static/textures/fletching_table_side.png | Bin 0 -> 444 bytes static/textures/fletching_table_top.png | Bin 0 -> 312 bytes static/textures/flower_pot.png | Bin 0 -> 149 bytes static/textures/flowering_azalea_leaves.png | Bin 0 -> 297 bytes static/textures/flowering_azalea_side.png | Bin 0 -> 268 bytes static/textures/flowering_azalea_top.png | Bin 0 -> 286 bytes static/textures/frogspawn.png | Bin 0 -> 157 bytes static/textures/frosted_ice_0.png | Bin 0 -> 229 bytes static/textures/frosted_ice_1.png | Bin 0 -> 279 bytes static/textures/frosted_ice_2.png | Bin 0 -> 333 bytes static/textures/frosted_ice_3.png | Bin 0 -> 388 bytes static/textures/furnace_front.png | Bin 0 -> 294 bytes static/textures/furnace_front_on.png | Bin 0 -> 322 bytes static/textures/furnace_side.png | Bin 0 -> 280 bytes static/textures/furnace_top.png | Bin 0 -> 273 bytes static/textures/gilded_blackstone.png | Bin 0 -> 320 bytes static/textures/glass.png | Bin 0 -> 147 bytes static/textures/glass_black.png | Bin 202 -> 0 bytes static/textures/glass_blue.png | Bin 205 -> 0 bytes static/textures/glass_brown.png | Bin 204 -> 0 bytes static/textures/glass_cyan.png | Bin 204 -> 0 bytes static/textures/glass_gray.png | Bin 202 -> 0 bytes static/textures/glass_green.png | Bin 203 -> 0 bytes static/textures/glass_light_blue.png | Bin 203 -> 0 bytes static/textures/glass_lime.png | Bin 205 -> 0 bytes static/textures/glass_magenta.png | Bin 205 -> 0 bytes static/textures/glass_orange.png | Bin 205 -> 0 bytes static/textures/glass_pane_top.png | Bin 0 -> 116 bytes static/textures/glass_pink.png | Bin 204 -> 0 bytes static/textures/glass_purple.png | Bin 204 -> 0 bytes static/textures/glass_red.png | Bin 203 -> 0 bytes static/textures/glass_silver.png | Bin 201 -> 0 bytes static/textures/glass_white.png | Bin 201 -> 0 bytes static/textures/glass_yellow.png | Bin 204 -> 0 bytes static/textures/glazed_terracotta_purple.png | Bin 298 -> 0 bytes static/textures/glow_item_frame.png | Bin 0 -> 299 bytes static/textures/glow_lichen.png | Bin 0 -> 241 bytes static/textures/glowstone.png | Bin 283 -> 307 bytes static/textures/gold_block.png | Bin 528 -> 266 bytes static/textures/gold_ore.png | Bin 263 -> 305 bytes static/textures/granite.png | Bin 0 -> 335 bytes static/textures/grass.png | Bin 0 -> 231 bytes .../{grass_side.png => grass_block_side.png} | Bin 408 -> 408 bytes static/textures/grass_block_side_overlay.png | Bin 0 -> 177 bytes static/textures/grass_block_snow.png | Bin 0 -> 307 bytes static/textures/grass_block_top.png | Bin 0 -> 560 bytes static/textures/gravel.png | Bin 470 -> 282 bytes static/textures/gray_candle.png | Bin 0 -> 127 bytes static/textures/gray_candle_lit.png | Bin 0 -> 136 bytes .../{concrete_gray.png => gray_concrete.png} | Bin ...wder_gray.png => gray_concrete_powder.png} | Bin ...ta_gray.png => gray_glazed_terracotta.png} | Bin static/textures/gray_shulker_box.png | Bin 0 -> 306 bytes static/textures/gray_stained_glass.png | Bin 0 -> 105 bytes .../textures/gray_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...y_stained_gray.png => gray_terracotta.png} | Bin .../{wool_colored_gray.png => gray_wool.png} | Bin static/textures/green_candle.png | Bin 0 -> 127 bytes static/textures/green_candle_lit.png | Bin 0 -> 135 bytes ...{concrete_green.png => green_concrete.png} | Bin static/textures/green_concrete_powder.png | Bin 0 -> 613 bytes ..._green.png => green_glazed_terracotta.png} | Bin static/textures/green_shulker_box.png | Bin 0 -> 325 bytes static/textures/green_stained_glass.png | Bin 0 -> 105 bytes .../textures/green_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...stained_green.png => green_terracotta.png} | Bin ...{wool_colored_green.png => green_wool.png} | Bin static/textures/grindstone_pivot.png | Bin 0 -> 141 bytes static/textures/grindstone_round.png | Bin 0 -> 186 bytes static/textures/grindstone_side.png | Bin 0 -> 206 bytes static/textures/hanging_roots.png | Bin 0 -> 213 bytes static/textures/hardened_clay.png | Bin 551 -> 0 bytes static/textures/hay_block_side.png | Bin 717 -> 274 bytes static/textures/hay_block_top.png | Bin 0 -> 267 bytes static/textures/honey_block_bottom.png | Bin 0 -> 268 bytes static/textures/honey_block_side.png | Bin 0 -> 271 bytes static/textures/honey_block_top.png | Bin 0 -> 273 bytes static/textures/honeycomb_block.png | Bin 0 -> 264 bytes static/textures/hopper_inside.png | Bin 0 -> 195 bytes static/textures/hopper_outside.png | Bin 0 -> 220 bytes static/textures/hopper_top.png | Bin 0 -> 155 bytes static/textures/horn_coral.png | Bin 0 -> 232 bytes static/textures/horn_coral_fan.png | Bin 0 -> 207 bytes static/textures/ice.png | Bin 150 -> 249 bytes static/textures/iron_bars.png | Bin 0 -> 204 bytes static/textures/iron_block.png | Bin 333 -> 193 bytes static/textures/iron_door_bottom.png | Bin 0 -> 224 bytes static/textures/iron_door_top.png | Bin 0 -> 210 bytes static/textures/iron_ore.png | Bin 265 -> 292 bytes static/textures/iron_trapdoor.png | Bin 0 -> 207 bytes static/textures/item_frame.png | Bin 0 -> 285 bytes static/textures/jack_o_lantern.png | Bin 0 -> 301 bytes static/textures/jigsaw_bottom.png | Bin 0 -> 116 bytes static/textures/jigsaw_lock.png | Bin 0 -> 157 bytes static/textures/jigsaw_side.png | Bin 0 -> 237 bytes static/textures/jigsaw_top.png | Bin 0 -> 264 bytes static/textures/jukebox_side.png | Bin 0 -> 201 bytes static/textures/jukebox_top.png | Bin 0 -> 202 bytes static/textures/jungle_door_bottom.png | Bin 0 -> 293 bytes static/textures/jungle_door_top.png | Bin 0 -> 314 bytes static/textures/jungle_leaves.png | Bin 0 -> 298 bytes static/textures/jungle_log.png | Bin 0 -> 280 bytes static/textures/jungle_log_top.png | Bin 0 -> 297 bytes static/textures/jungle_planks.png | Bin 0 -> 267 bytes static/textures/jungle_sapling.png | Bin 0 -> 223 bytes static/textures/jungle_trapdoor.png | Bin 0 -> 273 bytes static/textures/kelp.png | Bin 0 -> 261 bytes static/textures/kelp_plant.png | Bin 0 -> 434 bytes static/textures/ladder.png | Bin 0 -> 159 bytes static/textures/lantern.png | Bin 0 -> 422 bytes static/textures/lapis_block.png | Bin 668 -> 316 bytes static/textures/lapis_ore.png | Bin 446 -> 339 bytes static/textures/large_amethyst_bud.png | Bin 0 -> 204 bytes static/textures/large_fern_bottom.png | Bin 0 -> 254 bytes static/textures/large_fern_top.png | Bin 0 -> 179 bytes static/textures/lava_flow.png | Bin 0 -> 761 bytes static/textures/lava_still.png | Bin 0 -> 792 bytes static/textures/leaves.png | Bin 1119 -> 0 bytes static/textures/lectern_base.png | Bin 0 -> 273 bytes static/textures/lectern_front.png | Bin 0 -> 312 bytes static/textures/lectern_sides.png | Bin 0 -> 202 bytes static/textures/lectern_top.png | Bin 0 -> 254 bytes static/textures/lever.png | Bin 0 -> 138 bytes static/textures/light_blue_candle.png | Bin 0 -> 128 bytes static/textures/light_blue_candle_lit.png | Bin 0 -> 137 bytes ...light_blue.png => light_blue_concrete.png} | Bin ...lue.png => light_blue_concrete_powder.png} | Bin ...e.png => light_blue_glazed_terracotta.png} | Bin static/textures/light_blue_shulker_box.png | Bin 0 -> 332 bytes static/textures/light_blue_stained_glass.png | Bin 0 -> 106 bytes .../light_blue_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...ght_blue.png => light_blue_terracotta.png} | Bin ...red_light_blue.png => light_blue_wool.png} | Bin static/textures/light_gray_candle.png | Bin 0 -> 128 bytes static/textures/light_gray_candle_lit.png | Bin 0 -> 137 bytes ...ete_silver.png => light_gray_concrete.png} | Bin ...ver.png => light_gray_concrete_powder.png} | Bin ...r.png => light_gray_glazed_terracotta.png} | Bin static/textures/light_gray_shulker_box.png | Bin 0 -> 307 bytes static/textures/light_gray_stained_glass.png | Bin 0 -> 106 bytes .../light_gray_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...d_silver.png => light_gray_terracotta.png} | Bin ...colored_silver.png => light_gray_wool.png} | Bin static/textures/lightning_rod.png | Bin 0 -> 146 bytes static/textures/lightning_rod_on.png | Bin 0 -> 79 bytes static/textures/lilac_bottom.png | Bin 0 -> 257 bytes static/textures/lilac_top.png | Bin 0 -> 224 bytes static/textures/lily_of_the_valley.png | Bin 0 -> 201 bytes static/textures/lily_pad.png | Bin 0 -> 203 bytes static/textures/lime_candle.png | Bin 0 -> 128 bytes static/textures/lime_candle_lit.png | Bin 0 -> 137 bytes .../{concrete_lime.png => lime_concrete.png} | Bin ...wder_lime.png => lime_concrete_powder.png} | Bin ...ta_lime.png => lime_glazed_terracotta.png} | Bin static/textures/lime_shulker_box.png | Bin 0 -> 344 bytes static/textures/lime_stained_glass.png | Bin 0 -> 106 bytes .../textures/lime_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...y_stained_lime.png => lime_terracotta.png} | Bin .../{wool_colored_lime.png => lime_wool.png} | Bin static/textures/lodestone_side.png | Bin 0 -> 283 bytes static/textures/lodestone_top.png | Bin 0 -> 238 bytes static/textures/log_acacia.png | Bin 513 -> 0 bytes static/textures/log_acacia_top.png | Bin 449 -> 0 bytes static/textures/log_big_oak.png | Bin 464 -> 0 bytes static/textures/log_big_oak_top.png | Bin 435 -> 0 bytes static/textures/log_birch.png | Bin 742 -> 0 bytes static/textures/log_birch_top.png | Bin 619 -> 0 bytes static/textures/log_jungle.png | Bin 3429 -> 0 bytes static/textures/log_jungle_top.png | Bin 556 -> 0 bytes static/textures/log_oak.png | Bin 528 -> 0 bytes static/textures/log_oak_top.png | Bin 476 -> 0 bytes static/textures/log_spruce.png | Bin 450 -> 0 bytes static/textures/log_spruce_top.png | Bin 448 -> 0 bytes static/textures/loom_bottom.png | Bin 0 -> 126 bytes static/textures/loom_front.png | Bin 0 -> 251 bytes static/textures/loom_side.png | Bin 0 -> 236 bytes static/textures/loom_top.png | Bin 0 -> 261 bytes static/textures/magenta_candle.png | Bin 0 -> 128 bytes static/textures/magenta_candle_lit.png | Bin 0 -> 137 bytes ...crete_magenta.png => magenta_concrete.png} | Bin ...agenta.png => magenta_concrete_powder.png} | Bin ...enta.png => magenta_glazed_terracotta.png} | Bin static/textures/magenta_shulker_box.png | Bin 0 -> 336 bytes static/textures/magenta_stained_glass.png | Bin 0 -> 106 bytes .../magenta_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...ned_magenta.png => magenta_terracotta.png} | Bin ...l_colored_magenta.png => magenta_wool.png} | Bin static/textures/magma.png | Bin 3113 -> 822 bytes static/textures/mangrove_door_bottom.png | Bin 0 -> 278 bytes static/textures/mangrove_door_top.png | Bin 0 -> 273 bytes static/textures/mangrove_leaves.png | Bin 0 -> 279 bytes static/textures/mangrove_log.png | Bin 0 -> 242 bytes static/textures/mangrove_log_top.png | Bin 0 -> 285 bytes static/textures/mangrove_planks.png | Bin 0 -> 266 bytes static/textures/mangrove_propagule.png | Bin 0 -> 160 bytes .../textures/mangrove_propagule_hanging.png | Bin 0 -> 258 bytes static/textures/mangrove_roots_side.png | Bin 0 -> 250 bytes static/textures/mangrove_roots_top.png | Bin 0 -> 266 bytes static/textures/mangrove_trapdoor.png | Bin 0 -> 261 bytes static/textures/medium_amethyst_bud.png | Bin 0 -> 146 bytes static/textures/melon_side.png | Bin 448 -> 210 bytes static/textures/melon_stem.png | Bin 0 -> 189 bytes static/textures/melon_top.png | Bin 0 -> 259 bytes static/textures/moss_block.png | Bin 0 -> 268 bytes static/textures/mossy_cobblestone.png | Bin 0 -> 324 bytes static/textures/mossy_stone_bricks.png | Bin 0 -> 333 bytes static/textures/mud.png | Bin 0 -> 283 bytes static/textures/mud_bricks.png | Bin 0 -> 209 bytes static/textures/muddy_mangrove_roots_side.png | Bin 0 -> 330 bytes static/textures/muddy_mangrove_roots_top.png | Bin 0 -> 336 bytes static/textures/mushroom_block_inside.png | Bin 0 -> 250 bytes static/textures/mushroom_block_skin_brown.png | Bin 546 -> 0 bytes static/textures/mushroom_block_skin_red.png | Bin 427 -> 0 bytes static/textures/mushroom_stem.png | Bin 0 -> 219 bytes static/textures/mycelium_side.png | Bin 441 -> 367 bytes static/textures/mycelium_top.png | Bin 0 -> 234 bytes static/textures/nether_brick.png | Bin 326 -> 0 bytes static/textures/nether_bricks.png | Bin 0 -> 211 bytes static/textures/nether_gold_ore.png | Bin 0 -> 335 bytes static/textures/nether_portal.png | Bin 0 -> 953 bytes static/textures/nether_quartz_ore.png | Bin 0 -> 343 bytes static/textures/nether_sprouts.png | Bin 0 -> 127 bytes static/textures/nether_wart_block.png | Bin 410 -> 242 bytes static/textures/nether_wart_stage0.png | Bin 0 -> 150 bytes static/textures/nether_wart_stage1.png | Bin 0 -> 184 bytes static/textures/nether_wart_stage2.png | Bin 0 -> 191 bytes static/textures/netherite_block.png | Bin 0 -> 276 bytes static/textures/netherrack.png | Bin 727 -> 286 bytes static/textures/note_block.png | Bin 0 -> 212 bytes static/textures/noteblock.png | Bin 395 -> 0 bytes static/textures/oak_door_bottom.png | Bin 0 -> 240 bytes static/textures/oak_door_top.png | Bin 0 -> 234 bytes static/textures/oak_leaves.png | Bin 0 -> 256 bytes static/textures/oak_log.png | Bin 0 -> 263 bytes static/textures/oak_log_top.png | Bin 0 -> 273 bytes static/textures/oak_planks.png | Bin 0 -> 268 bytes static/textures/oak_sapling.png | Bin 0 -> 252 bytes static/textures/oak_trapdoor.png | Bin 0 -> 225 bytes static/textures/observer_back.png | Bin 0 -> 265 bytes static/textures/observer_back_on.png | Bin 0 -> 317 bytes static/textures/observer_front.png | Bin 0 -> 270 bytes static/textures/observer_side.png | Bin 0 -> 230 bytes static/textures/observer_top.png | Bin 0 -> 458 bytes static/textures/obsidian.png | Bin 489 -> 263 bytes static/textures/ochre_froglight_side.png | Bin 0 -> 260 bytes static/textures/ochre_froglight_top.png | Bin 0 -> 205 bytes static/textures/orange_candle.png | Bin 0 -> 127 bytes static/textures/orange_candle_lit.png | Bin 0 -> 136 bytes ...oncrete_orange.png => orange_concrete.png} | Bin ..._orange.png => orange_concrete_powder.png} | Bin ...range.png => orange_glazed_terracotta.png} | Bin static/textures/orange_shulker_box.png | Bin 0 -> 339 bytes static/textures/orange_stained_glass.png | Bin 0 -> 106 bytes .../orange_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...ained_orange.png => orange_terracotta.png} | Bin static/textures/orange_tulip.png | Bin 0 -> 224 bytes ...ool_colored_orange.png => orange_wool.png} | Bin static/textures/oxeye_daisy.png | Bin 0 -> 286 bytes static/textures/oxidized_copper.png | Bin 0 -> 281 bytes static/textures/oxidized_cut_copper.png | Bin 0 -> 290 bytes static/textures/packed_ice.png | Bin 465 -> 242 bytes static/textures/packed_mud.png | Bin 0 -> 265 bytes .../textures/pearlescent_froglight_side.png | Bin 0 -> 257 bytes static/textures/pearlescent_froglight_top.png | Bin 0 -> 204 bytes static/textures/peony_bottom.png | Bin 0 -> 282 bytes static/textures/peony_top.png | Bin 0 -> 243 bytes static/textures/pink_candle.png | Bin 0 -> 128 bytes static/textures/pink_candle_lit.png | Bin 0 -> 138 bytes .../{concrete_pink.png => pink_concrete.png} | Bin ...wder_pink.png => pink_concrete_powder.png} | Bin ...ta_pink.png => pink_glazed_terracotta.png} | Bin static/textures/pink_petals.png | Bin 0 -> 245 bytes static/textures/pink_petals_stem.png | Bin 0 -> 80 bytes static/textures/pink_shulker_box.png | Bin 0 -> 349 bytes static/textures/pink_stained_glass.png | Bin 0 -> 106 bytes .../textures/pink_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...y_stained_pink.png => pink_terracotta.png} | Bin static/textures/pink_tulip.png | Bin 0 -> 202 bytes .../{wool_colored_pink.png => pink_wool.png} | Bin static/textures/piston_bottom.png | Bin 0 -> 265 bytes static/textures/piston_inner.png | Bin 0 -> 295 bytes static/textures/piston_side.png | Bin 0 -> 322 bytes static/textures/piston_top.png | Bin 0 -> 260 bytes static/textures/piston_top_sticky.png | Bin 0 -> 342 bytes static/textures/pitcher_crop_bottom.png | Bin 0 -> 159 bytes .../textures/pitcher_crop_bottom_stage_1.png | Bin 0 -> 160 bytes .../textures/pitcher_crop_bottom_stage_2.png | Bin 0 -> 206 bytes .../textures/pitcher_crop_bottom_stage_3.png | Bin 0 -> 190 bytes .../textures/pitcher_crop_bottom_stage_4.png | Bin 0 -> 201 bytes static/textures/pitcher_crop_side.png | Bin 0 -> 168 bytes static/textures/pitcher_crop_top.png | Bin 0 -> 185 bytes static/textures/pitcher_crop_top_stage_3.png | Bin 0 -> 203 bytes static/textures/pitcher_crop_top_stage_4.png | Bin 0 -> 235 bytes static/textures/planks_acacia.png | Bin 267 -> 0 bytes static/textures/planks_big_oak.png | Bin 240 -> 0 bytes static/textures/planks_birch.png | Bin 265 -> 0 bytes static/textures/planks_jungle.png | Bin 262 -> 0 bytes static/textures/planks_oak.png | Bin 247 -> 0 bytes static/textures/planks_spruce.png | Bin 254 -> 0 bytes static/textures/podzol_side.png | Bin 0 -> 429 bytes static/textures/podzol_top.png | Bin 0 -> 273 bytes .../textures/pointed_dripstone_down_base.png | Bin 0 -> 222 bytes .../pointed_dripstone_down_frustum.png | Bin 0 -> 214 bytes .../pointed_dripstone_down_middle.png | Bin 0 -> 220 bytes .../textures/pointed_dripstone_down_tip.png | Bin 0 -> 150 bytes .../pointed_dripstone_down_tip_merge.png | Bin 0 -> 175 bytes static/textures/pointed_dripstone_up_base.png | Bin 0 -> 226 bytes .../textures/pointed_dripstone_up_frustum.png | Bin 0 -> 217 bytes .../textures/pointed_dripstone_up_middle.png | Bin 0 -> 210 bytes static/textures/pointed_dripstone_up_tip.png | Bin 0 -> 149 bytes .../pointed_dripstone_up_tip_merge.png | Bin 0 -> 179 bytes static/textures/polished_andesite.png | Bin 0 -> 274 bytes static/textures/polished_basalt_side.png | Bin 0 -> 234 bytes static/textures/polished_basalt_top.png | Bin 0 -> 266 bytes static/textures/polished_blackstone.png | Bin 0 -> 254 bytes .../textures/polished_blackstone_bricks.png | Bin 0 -> 255 bytes static/textures/polished_deepslate.png | Bin 0 -> 250 bytes static/textures/polished_diorite.png | Bin 0 -> 282 bytes static/textures/polished_granite.png | Bin 0 -> 292 bytes static/textures/poppy.png | Bin 0 -> 170 bytes static/textures/potatoes_stage0.png | Bin 0 -> 115 bytes static/textures/potatoes_stage1.png | Bin 0 -> 137 bytes static/textures/potatoes_stage2.png | Bin 0 -> 163 bytes static/textures/potatoes_stage3.png | Bin 0 -> 222 bytes static/textures/potted_azalea_bush_plant.png | Bin 0 -> 204 bytes static/textures/potted_azalea_bush_side.png | Bin 0 -> 171 bytes static/textures/potted_azalea_bush_top.png | Bin 0 -> 154 bytes .../potted_flowering_azalea_bush_plant.png | Bin 0 -> 227 bytes .../potted_flowering_azalea_bush_side.png | Bin 0 -> 195 bytes .../potted_flowering_azalea_bush_top.png | Bin 0 -> 179 bytes static/textures/powder_snow.png | Bin 0 -> 205 bytes static/textures/powered_rail.png | Bin 0 -> 324 bytes static/textures/powered_rail_on.png | Bin 0 -> 324 bytes static/textures/prismarine.png | Bin 3617 -> 685 bytes static/textures/prismarine_bricks.png | Bin 865 -> 286 bytes static/textures/prismarine_dark.png | Bin 792 -> 0 bytes static/textures/pumpkin_side.png | Bin 0 -> 230 bytes static/textures/pumpkin_stem.png | Bin 0 -> 148 bytes static/textures/pumpkin_top.png | Bin 0 -> 283 bytes static/textures/purple_candle.png | Bin 0 -> 128 bytes static/textures/purple_candle_lit.png | Bin 0 -> 136 bytes ...oncrete_purple.png => purple_concrete.png} | Bin ..._purple.png => purple_concrete_powder.png} | Bin static/textures/purple_glazed_terracotta.png | Bin 0 -> 293 bytes static/textures/purple_shulker_box.png | Bin 0 -> 342 bytes static/textures/purple_stained_glass.png | Bin 0 -> 106 bytes .../purple_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...ained_purple.png => purple_terracotta.png} | Bin ...ool_colored_purple.png => purple_wool.png} | Bin static/textures/purpur_block.png | Bin 567 -> 249 bytes static/textures/purpur_pillar.png | Bin 575 -> 228 bytes static/textures/purpur_pillar_top.png | Bin 0 -> 198 bytes static/textures/quartz_block_bottom.png | Bin 0 -> 189 bytes static/textures/quartz_block_chiseled.png | Bin 359 -> 0 bytes static/textures/quartz_block_lines.png | Bin 265 -> 0 bytes static/textures/quartz_block_side.png | Bin 364 -> 212 bytes static/textures/quartz_block_top.png | Bin 0 -> 212 bytes static/textures/quartz_bricks.png | Bin 0 -> 256 bytes static/textures/quartz_ore.png | Bin 897 -> 0 bytes static/textures/quartz_pillar.png | Bin 0 -> 199 bytes static/textures/quartz_pillar_top.png | Bin 0 -> 246 bytes static/textures/rail.png | Bin 0 -> 249 bytes static/textures/rail_corner.png | Bin 0 -> 254 bytes static/textures/raw_copper_block.png | Bin 0 -> 368 bytes static/textures/raw_gold_block.png | Bin 0 -> 279 bytes static/textures/raw_iron_block.png | Bin 0 -> 283 bytes static/textures/red_candle.png | Bin 0 -> 128 bytes static/textures/red_candle_lit.png | Bin 0 -> 136 bytes .../{concrete_red.png => red_concrete.png} | Bin ...powder_red.png => red_concrete_powder.png} | Bin ...otta_red.png => red_glazed_terracotta.png} | Bin static/textures/red_mushroom.png | Bin 0 -> 148 bytes static/textures/red_mushroom_block.png | Bin 0 -> 229 bytes static/textures/red_nether_brick.png | Bin 397 -> 0 bytes static/textures/red_nether_bricks.png | Bin 0 -> 251 bytes static/textures/red_sand.png | Bin 738 -> 266 bytes static/textures/red_sandstone.png | Bin 0 -> 287 bytes static/textures/red_sandstone_bottom.png | Bin 0 -> 292 bytes static/textures/red_sandstone_carved.png | Bin 540 -> 0 bytes static/textures/red_sandstone_normal.png | Bin 629 -> 0 bytes static/textures/red_sandstone_smooth.png | Bin 469 -> 0 bytes static/textures/red_sandstone_top.png | Bin 0 -> 247 bytes static/textures/red_shulker_box.png | Bin 0 -> 329 bytes static/textures/red_stained_glass.png | Bin 0 -> 134 bytes .../textures/red_stained_glass_pane_top.png | Bin 0 -> 119 bytes ...lay_stained_red.png => red_terracotta.png} | Bin static/textures/red_tulip.png | Bin 0 -> 192 bytes .../{wool_colored_red.png => red_wool.png} | Bin static/textures/redstone_block.png | Bin 515 -> 195 bytes static/textures/redstone_dust_dot.png | Bin 0 -> 126 bytes static/textures/redstone_dust_line0.png | Bin 0 -> 125 bytes static/textures/redstone_dust_line1.png | Bin 0 -> 130 bytes static/textures/redstone_dust_overlay.png | Bin 0 -> 90 bytes static/textures/redstone_lamp.png | Bin 0 -> 283 bytes static/textures/redstone_lamp_off.png | Bin 616 -> 0 bytes static/textures/redstone_lamp_on.png | Bin 682 -> 250 bytes static/textures/redstone_ore.png | Bin 264 -> 305 bytes static/textures/redstone_torch.png | Bin 0 -> 146 bytes static/textures/redstone_torch_off.png | Bin 0 -> 135 bytes .../textures/reinforced_deepslate_bottom.png | Bin 0 -> 273 bytes static/textures/reinforced_deepslate_side.png | Bin 0 -> 321 bytes static/textures/reinforced_deepslate_top.png | Bin 0 -> 299 bytes static/textures/repeater.png | Bin 0 -> 269 bytes static/textures/repeater_on.png | Bin 0 -> 264 bytes .../textures/repeating_command_block_back.png | Bin 0 -> 682 bytes .../repeating_command_block_conditional.png | Bin 0 -> 738 bytes .../repeating_command_block_front.png | Bin 0 -> 758 bytes .../textures/repeating_command_block_side.png | Bin 0 -> 732 bytes static/textures/respawn_anchor_bottom.png | Bin 0 -> 315 bytes static/textures/respawn_anchor_side0.png | Bin 0 -> 328 bytes static/textures/respawn_anchor_side1.png | Bin 0 -> 340 bytes static/textures/respawn_anchor_side2.png | Bin 0 -> 348 bytes static/textures/respawn_anchor_side3.png | Bin 0 -> 350 bytes static/textures/respawn_anchor_side4.png | Bin 0 -> 352 bytes static/textures/respawn_anchor_top.png | Bin 0 -> 876 bytes static/textures/respawn_anchor_top_off.png | Bin 0 -> 203 bytes static/textures/rooted_dirt.png | Bin 0 -> 307 bytes static/textures/rose_bush_bottom.png | Bin 0 -> 302 bytes static/textures/rose_bush_top.png | Bin 0 -> 251 bytes static/textures/sand.png | Bin 720 -> 262 bytes static/textures/sandstone.png | Bin 0 -> 283 bytes static/textures/sandstone_bottom.png | Bin 0 -> 288 bytes static/textures/sandstone_carved.png | Bin 596 -> 0 bytes static/textures/sandstone_normal.png | Bin 777 -> 0 bytes static/textures/sandstone_smooth.png | Bin 544 -> 0 bytes static/textures/sandstone_top.png | Bin 0 -> 245 bytes static/textures/scaffolding_bottom.png | Bin 0 -> 268 bytes static/textures/scaffolding_side.png | Bin 0 -> 254 bytes static/textures/scaffolding_top.png | Bin 0 -> 311 bytes static/textures/sculk.png | Bin 0 -> 562 bytes static/textures/sculk_catalyst_bottom.png | Bin 0 -> 274 bytes static/textures/sculk_catalyst_side.png | Bin 0 -> 314 bytes static/textures/sculk_catalyst_side_bloom.png | Bin 0 -> 700 bytes static/textures/sculk_catalyst_top.png | Bin 0 -> 245 bytes static/textures/sculk_catalyst_top_bloom.png | Bin 0 -> 643 bytes static/textures/sculk_sensor_bottom.png | Bin 0 -> 240 bytes static/textures/sculk_sensor_side.png | Bin 0 -> 194 bytes .../textures/sculk_sensor_tendril_active.png | Bin 0 -> 218 bytes .../sculk_sensor_tendril_inactive.png | Bin 0 -> 167 bytes static/textures/sculk_sensor_top.png | Bin 0 -> 222 bytes static/textures/sculk_shrieker_bottom.png | Bin 0 -> 240 bytes .../sculk_shrieker_can_summon_inner_top.png | Bin 0 -> 614 bytes static/textures/sculk_shrieker_inner_top.png | Bin 0 -> 622 bytes static/textures/sculk_shrieker_side.png | Bin 0 -> 309 bytes static/textures/sculk_shrieker_top.png | Bin 0 -> 125 bytes static/textures/sculk_vein.png | Bin 0 -> 731 bytes static/textures/sea_lantern.png | Bin 3402 -> 690 bytes static/textures/sea_pickle.png | Bin 0 -> 313 bytes static/textures/seagrass.png | Bin 0 -> 439 bytes static/textures/shroomlight.png | Bin 0 -> 309 bytes static/textures/shulker_box.png | Bin 0 -> 1008 bytes static/textures/slime.png | Bin 716 -> 0 bytes static/textures/slime_block.png | Bin 0 -> 202 bytes static/textures/small_amethyst_bud.png | Bin 0 -> 125 bytes static/textures/small_dripleaf_side.png | Bin 0 -> 81 bytes .../textures/small_dripleaf_stem_bottom.png | Bin 0 -> 159 bytes static/textures/small_dripleaf_stem_top.png | Bin 0 -> 140 bytes static/textures/small_dripleaf_top.png | Bin 0 -> 146 bytes static/textures/smithing_table_bottom.png | Bin 0 -> 206 bytes static/textures/smithing_table_front.png | Bin 0 -> 312 bytes static/textures/smithing_table_side.png | Bin 0 -> 315 bytes static/textures/smithing_table_top.png | Bin 0 -> 260 bytes static/textures/smoker_bottom.png | Bin 0 -> 274 bytes static/textures/smoker_front.png | Bin 0 -> 321 bytes static/textures/smoker_front_on.png | Bin 0 -> 683 bytes static/textures/smoker_side.png | Bin 0 -> 302 bytes static/textures/smoker_top.png | Bin 0 -> 276 bytes static/textures/smooth_basalt.png | Bin 0 -> 256 bytes static/textures/smooth_stone.png | Bin 0 -> 255 bytes static/textures/smooth_stone_slab_side.png | Bin 0 -> 258 bytes .../sniffer_egg_not_cracked_bottom.png | Bin 0 -> 207 bytes .../textures/sniffer_egg_not_cracked_east.png | Bin 0 -> 263 bytes .../sniffer_egg_not_cracked_north.png | Bin 0 -> 305 bytes .../sniffer_egg_not_cracked_south.png | Bin 0 -> 295 bytes .../textures/sniffer_egg_not_cracked_top.png | Bin 0 -> 229 bytes .../textures/sniffer_egg_not_cracked_west.png | Bin 0 -> 269 bytes .../sniffer_egg_slightly_cracked_bottom.png | Bin 0 -> 222 bytes .../sniffer_egg_slightly_cracked_east.png | Bin 0 -> 301 bytes .../sniffer_egg_slightly_cracked_north.png | Bin 0 -> 350 bytes .../sniffer_egg_slightly_cracked_south.png | Bin 0 -> 331 bytes .../sniffer_egg_slightly_cracked_top.png | Bin 0 -> 275 bytes .../sniffer_egg_slightly_cracked_west.png | Bin 0 -> 312 bytes .../sniffer_egg_very_cracked_bottom.png | Bin 0 -> 232 bytes .../sniffer_egg_very_cracked_east.png | Bin 0 -> 323 bytes .../sniffer_egg_very_cracked_north.png | Bin 0 -> 365 bytes .../sniffer_egg_very_cracked_south.png | Bin 0 -> 353 bytes .../textures/sniffer_egg_very_cracked_top.png | Bin 0 -> 289 bytes .../sniffer_egg_very_cracked_west.png | Bin 0 -> 332 bytes static/textures/snow.png | Bin 206 -> 202 bytes static/textures/soul_campfire_fire.png | Bin 0 -> 535 bytes static/textures/soul_campfire_log_lit.png | Bin 0 -> 917 bytes static/textures/soul_fire_0.png | Bin 0 -> 534 bytes static/textures/soul_fire_1.png | Bin 0 -> 605 bytes static/textures/soul_lantern.png | Bin 0 -> 404 bytes static/textures/soul_sand.png | Bin 633 -> 286 bytes static/textures/soul_soil.png | Bin 0 -> 247 bytes static/textures/soul_torch.png | Bin 0 -> 140 bytes static/textures/spawner.png | Bin 0 -> 251 bytes static/textures/sponge.png | Bin 837 -> 270 bytes static/textures/spore_blossom.png | Bin 0 -> 234 bytes static/textures/spore_blossom_base.png | Bin 0 -> 232 bytes static/textures/spruce_door_bottom.png | Bin 0 -> 291 bytes static/textures/spruce_door_top.png | Bin 0 -> 272 bytes static/textures/spruce_leaves.png | Bin 0 -> 228 bytes static/textures/spruce_log.png | Bin 0 -> 262 bytes static/textures/spruce_log_top.png | Bin 0 -> 264 bytes static/textures/spruce_planks.png | Bin 0 -> 263 bytes static/textures/spruce_sapling.png | Bin 0 -> 211 bytes static/textures/spruce_trapdoor.png | Bin 0 -> 258 bytes static/textures/stone.png | Bin 223 -> 215 bytes static/textures/stone_andesite.png | Bin 792 -> 0 bytes static/textures/stone_andesite_smooth.png | Bin 730 -> 0 bytes static/textures/stone_bricks.png | Bin 0 -> 242 bytes static/textures/stone_diorite.png | Bin 613 -> 0 bytes static/textures/stone_diorite_smooth.png | Bin 560 -> 0 bytes static/textures/stone_granite.png | Bin 484 -> 0 bytes static/textures/stone_granite_smooth.png | Bin 435 -> 0 bytes static/textures/stonebrick.png | Bin 402 -> 0 bytes static/textures/stonebrick_carved.png | Bin 413 -> 0 bytes static/textures/stonebrick_cracked.png | Bin 469 -> 0 bytes static/textures/stonebrick_mossy.png | Bin 544 -> 0 bytes static/textures/stonecutter_bottom.png | Bin 0 -> 201 bytes static/textures/stonecutter_saw.png | Bin 0 -> 288 bytes static/textures/stonecutter_side.png | Bin 0 -> 208 bytes static/textures/stonecutter_top.png | Bin 0 -> 264 bytes static/textures/stripped_acacia_log_top.png | Bin 365 -> 277 bytes static/textures/stripped_bamboo_block.png | Bin 0 -> 289 bytes static/textures/stripped_bamboo_block_top.png | Bin 0 -> 221 bytes static/textures/stripped_birch_log_top.png | Bin 439 -> 269 bytes static/textures/stripped_cherry_log.png | Bin 0 -> 258 bytes static/textures/stripped_cherry_log_top.png | Bin 0 -> 279 bytes static/textures/stripped_crimson_stem.png | Bin 0 -> 284 bytes static/textures/stripped_crimson_stem_top.png | Bin 0 -> 201 bytes static/textures/stripped_dark_oak_log.png | Bin 291 -> 282 bytes static/textures/stripped_dark_oak_log_top.png | Bin 364 -> 275 bytes static/textures/stripped_jungle_log_top.png | Bin 401 -> 280 bytes static/textures/stripped_mangrove_log.png | Bin 0 -> 253 bytes static/textures/stripped_mangrove_log_top.png | Bin 0 -> 261 bytes static/textures/stripped_oak_log_top.png | Bin 395 -> 278 bytes static/textures/stripped_spruce_log_top.png | Bin 368 -> 283 bytes static/textures/stripped_warped_stem.png | Bin 0 -> 286 bytes static/textures/stripped_warped_stem_top.png | Bin 0 -> 205 bytes static/textures/structure_block.png | Bin 0 -> 254 bytes static/textures/structure_block_corner.png | Bin 0 -> 281 bytes static/textures/structure_block_data.png | Bin 0 -> 235 bytes static/textures/structure_block_load.png | Bin 0 -> 231 bytes static/textures/structure_block_save.png | Bin 0 -> 228 bytes static/textures/sugar_cane.png | Bin 0 -> 186 bytes static/textures/sunflower_back.png | Bin 0 -> 139 bytes static/textures/sunflower_bottom.png | Bin 0 -> 183 bytes static/textures/sunflower_front.png | Bin 0 -> 153 bytes static/textures/sunflower_top.png | Bin 0 -> 140 bytes static/textures/suspicious_gravel_0.png | Bin 0 -> 293 bytes static/textures/suspicious_gravel_1.png | Bin 0 -> 302 bytes static/textures/suspicious_gravel_2.png | Bin 0 -> 302 bytes static/textures/suspicious_gravel_3.png | Bin 0 -> 295 bytes static/textures/suspicious_sand_0.png | Bin 0 -> 276 bytes static/textures/suspicious_sand_1.png | Bin 0 -> 281 bytes static/textures/suspicious_sand_2.png | Bin 0 -> 289 bytes static/textures/suspicious_sand_3.png | Bin 0 -> 290 bytes static/textures/sweet_berry_bush_stage0.png | Bin 0 -> 162 bytes static/textures/sweet_berry_bush_stage1.png | Bin 0 -> 255 bytes static/textures/sweet_berry_bush_stage2.png | Bin 0 -> 280 bytes static/textures/sweet_berry_bush_stage3.png | Bin 0 -> 294 bytes static/textures/tall_grass_bottom.png | Bin 0 -> 255 bytes static/textures/tall_grass_top.png | Bin 0 -> 204 bytes static/textures/tall_seagrass_bottom.png | Bin 0 -> 401 bytes static/textures/tall_seagrass_top.png | Bin 0 -> 279 bytes static/textures/target_side.png | Bin 0 -> 306 bytes static/textures/target_top.png | Bin 0 -> 314 bytes static/textures/terracotta.png | Bin 0 -> 244 bytes static/textures/tinted_glass.png | Bin 0 -> 190 bytes static/textures/tnt_bottom.png | Bin 0 -> 108 bytes static/textures/tnt_side.png | Bin 212 -> 208 bytes static/textures/tnt_top.png | Bin 0 -> 248 bytes static/textures/torch.png | Bin 0 -> 138 bytes static/textures/torchflower.png | Bin 0 -> 268 bytes static/textures/torchflower_crop_stage0.png | Bin 0 -> 134 bytes static/textures/torchflower_crop_stage1.png | Bin 0 -> 201 bytes static/textures/transparent.png | Bin 2792 -> 126 bytes static/textures/tripwire.png | Bin 0 -> 214 bytes static/textures/tripwire_hook.png | Bin 0 -> 176 bytes static/textures/tube_coral.png | Bin 0 -> 253 bytes static/textures/tube_coral_fan.png | Bin 0 -> 196 bytes static/textures/tuff.png | Bin 0 -> 253 bytes static/textures/turtle_egg.png | Bin 0 -> 370 bytes .../textures/turtle_egg_slightly_cracked.png | Bin 0 -> 374 bytes static/textures/turtle_egg_very_cracked.png | Bin 0 -> 362 bytes static/textures/twisting_vines.png | Bin 0 -> 161 bytes static/textures/twisting_vines_plant.png | Bin 0 -> 183 bytes static/textures/unknown.png | Bin 0 -> 126 bytes static/textures/verdant_froglight_side.png | Bin 0 -> 258 bytes static/textures/verdant_froglight_top.png | Bin 0 -> 205 bytes static/textures/vine.png | Bin 0 -> 227 bytes static/textures/warped_door_bottom.png | Bin 0 -> 321 bytes static/textures/warped_door_top.png | Bin 0 -> 324 bytes static/textures/warped_fungus.png | Bin 0 -> 171 bytes static/textures/warped_nylium.png | Bin 0 -> 306 bytes static/textures/warped_nylium_side.png | Bin 0 -> 326 bytes static/textures/warped_planks.png | Bin 0 -> 281 bytes static/textures/warped_roots.png | Bin 0 -> 211 bytes static/textures/warped_roots_pot.png | Bin 0 -> 211 bytes static/textures/warped_stem.png | Bin 0 -> 688 bytes static/textures/warped_stem_top.png | Bin 0 -> 309 bytes static/textures/warped_trapdoor.png | Bin 0 -> 280 bytes static/textures/warped_wart_block.png | Bin 0 -> 251 bytes static/textures/water_flow.png | Bin 0 -> 390 bytes static/textures/water_overlay.png | Bin 0 -> 76 bytes static/textures/water_still.png | Bin 0 -> 396 bytes static/textures/weathered_copper.png | Bin 0 -> 281 bytes static/textures/weathered_cut_copper.png | Bin 0 -> 284 bytes static/textures/weeping_vines.png | Bin 0 -> 122 bytes static/textures/weeping_vines_plant.png | Bin 0 -> 236 bytes static/textures/wet_sponge.png | Bin 0 -> 252 bytes static/textures/wheat_stage0.png | Bin 0 -> 150 bytes static/textures/wheat_stage1.png | Bin 0 -> 160 bytes static/textures/wheat_stage2.png | Bin 0 -> 176 bytes static/textures/wheat_stage3.png | Bin 0 -> 189 bytes static/textures/wheat_stage4.png | Bin 0 -> 210 bytes static/textures/wheat_stage5.png | Bin 0 -> 221 bytes static/textures/wheat_stage6.png | Bin 0 -> 219 bytes static/textures/wheat_stage7.png | Bin 0 -> 265 bytes static/textures/white_candle.png | Bin 0 -> 126 bytes static/textures/white_candle_lit.png | Bin 0 -> 139 bytes ...{concrete_white.png => white_concrete.png} | Bin ...er_white.png => white_concrete_powder.png} | Bin ..._white.png => white_glazed_terracotta.png} | Bin static/textures/white_shulker_box.png | Bin 0 -> 313 bytes static/textures/white_stained_glass.png | Bin 0 -> 106 bytes .../textures/white_stained_glass_pane_top.png | Bin 0 -> 121 bytes ...stained_white.png => white_terracotta.png} | Bin static/textures/white_tulip.png | Bin 0 -> 188 bytes ...{wool_colored_white.png => white_wool.png} | Bin static/textures/wither_rose.png | Bin 0 -> 182 bytes static/textures/yellow_candle.png | Bin 0 -> 127 bytes static/textures/yellow_candle_lit.png | Bin 0 -> 138 bytes ...oncrete_yellow.png => yellow_concrete.png} | Bin ..._yellow.png => yellow_concrete_powder.png} | Bin ...ellow.png => yellow_glazed_terracotta.png} | Bin static/textures/yellow_shulker_box.png | Bin 0 -> 342 bytes static/textures/yellow_stained_glass.png | Bin 0 -> 106 bytes .../yellow_stained_glass_pane_top.png | Bin 0 -> 120 bytes ...ained_yellow.png => yellow_terracotta.png} | Bin ...ool_colored_yellow.png => yellow_wool.png} | Bin 1005 files changed, 17082 insertions(+), 4664 deletions(-) create mode 100644 .gitmodules create mode 160000 external/minecraft-data create mode 100644 pnpm-lock.yaml create mode 100644 prepare-block.js create mode 100644 static/baked_blocks.json create mode 100644 static/blocks_20.json create mode 100644 static/textures/acacia_door_bottom.png create mode 100644 static/textures/acacia_door_top.png create mode 100644 static/textures/acacia_leaves.png create mode 100644 static/textures/acacia_log.png create mode 100644 static/textures/acacia_log_top.png create mode 100644 static/textures/acacia_planks.png create mode 100644 static/textures/acacia_sapling.png create mode 100644 static/textures/acacia_trapdoor.png create mode 100644 static/textures/activator_rail.png create mode 100644 static/textures/activator_rail_on.png create mode 100644 static/textures/allium.png create mode 100644 static/textures/amethyst_block.png create mode 100644 static/textures/amethyst_cluster.png create mode 100644 static/textures/ancient_debris_side.png create mode 100644 static/textures/ancient_debris_top.png create mode 100644 static/textures/andesite.png create mode 100644 static/textures/anvil.png create mode 100644 static/textures/anvil_top.png create mode 100644 static/textures/attached_melon_stem.png create mode 100644 static/textures/attached_pumpkin_stem.png create mode 100644 static/textures/azalea_leaves.png create mode 100644 static/textures/azalea_plant.png create mode 100644 static/textures/azalea_side.png create mode 100644 static/textures/azalea_top.png create mode 100644 static/textures/azure_bluet.png create mode 100644 static/textures/bamboo_block.png create mode 100644 static/textures/bamboo_block_top.png create mode 100644 static/textures/bamboo_door_bottom.png create mode 100644 static/textures/bamboo_door_top.png create mode 100644 static/textures/bamboo_fence.png create mode 100644 static/textures/bamboo_fence_gate.png create mode 100644 static/textures/bamboo_fence_gate_particle.png create mode 100644 static/textures/bamboo_fence_particle.png create mode 100644 static/textures/bamboo_large_leaves.png create mode 100644 static/textures/bamboo_mosaic.png create mode 100644 static/textures/bamboo_planks.png create mode 100644 static/textures/bamboo_singleleaf.png create mode 100644 static/textures/bamboo_small_leaves.png create mode 100644 static/textures/bamboo_stage0.png create mode 100644 static/textures/bamboo_stalk.png create mode 100644 static/textures/bamboo_trapdoor.png create mode 100644 static/textures/barrel_bottom.png create mode 100644 static/textures/barrel_side.png create mode 100644 static/textures/barrel_top.png create mode 100644 static/textures/barrel_top_open.png create mode 100644 static/textures/basalt_side.png create mode 100644 static/textures/basalt_top.png create mode 100644 static/textures/beacon.png create mode 100644 static/textures/bee_nest_bottom.png create mode 100644 static/textures/bee_nest_front.png create mode 100644 static/textures/bee_nest_front_honey.png create mode 100644 static/textures/bee_nest_side.png create mode 100644 static/textures/bee_nest_top.png create mode 100644 static/textures/beehive_end.png create mode 100644 static/textures/beehive_front.png create mode 100644 static/textures/beehive_front_honey.png create mode 100644 static/textures/beehive_side.png create mode 100644 static/textures/beetroots_stage0.png create mode 100644 static/textures/beetroots_stage1.png create mode 100644 static/textures/beetroots_stage2.png create mode 100644 static/textures/beetroots_stage3.png create mode 100644 static/textures/bell_bottom.png create mode 100644 static/textures/bell_side.png create mode 100644 static/textures/bell_top.png create mode 100644 static/textures/big_dripleaf_side.png create mode 100644 static/textures/big_dripleaf_stem.png create mode 100644 static/textures/big_dripleaf_tip.png create mode 100644 static/textures/big_dripleaf_top.png create mode 100644 static/textures/birch_door_bottom.png create mode 100644 static/textures/birch_door_top.png create mode 100644 static/textures/birch_leaves.png create mode 100644 static/textures/birch_log.png create mode 100644 static/textures/birch_log_top.png create mode 100644 static/textures/birch_planks.png create mode 100644 static/textures/birch_sapling.png create mode 100644 static/textures/birch_trapdoor.png create mode 100644 static/textures/black_candle.png create mode 100644 static/textures/black_candle_lit.png rename static/textures/{concrete_black.png => black_concrete.png} (100%) rename static/textures/{concrete_powder_black.png => black_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_black.png => black_glazed_terracotta.png} (100%) create mode 100644 static/textures/black_shulker_box.png create mode 100644 static/textures/black_stained_glass.png create mode 100644 static/textures/black_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_black.png => black_terracotta.png} (100%) rename static/textures/{wool_colored_black.png => black_wool.png} (100%) create mode 100644 static/textures/blackstone.png create mode 100644 static/textures/blackstone_top.png create mode 100644 static/textures/blast_furnace_front.png create mode 100644 static/textures/blast_furnace_front_on.png create mode 100644 static/textures/blast_furnace_side.png create mode 100644 static/textures/blast_furnace_top.png create mode 100644 static/textures/blue_candle.png create mode 100644 static/textures/blue_candle_lit.png rename static/textures/{concrete_blue.png => blue_concrete.png} (100%) rename static/textures/{concrete_powder_blue.png => blue_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_blue.png => blue_glazed_terracotta.png} (100%) create mode 100644 static/textures/blue_orchid.png create mode 100644 static/textures/blue_shulker_box.png create mode 100644 static/textures/blue_stained_glass.png create mode 100644 static/textures/blue_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_blue.png => blue_terracotta.png} (100%) rename static/textures/{wool_colored_blue.png => blue_wool.png} (100%) create mode 100644 static/textures/bone_block_top.png create mode 100644 static/textures/brain_coral.png create mode 100644 static/textures/brain_coral_fan.png create mode 100644 static/textures/brewing_stand.png create mode 100644 static/textures/brewing_stand_base.png delete mode 100644 static/textures/brick.png create mode 100644 static/textures/bricks.png create mode 100644 static/textures/brown_candle.png create mode 100644 static/textures/brown_candle_lit.png rename static/textures/{concrete_brown.png => brown_concrete.png} (100%) rename static/textures/{concrete_powder_brown.png => brown_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_brown.png => brown_glazed_terracotta.png} (100%) create mode 100644 static/textures/brown_mushroom.png create mode 100644 static/textures/brown_mushroom_block.png create mode 100644 static/textures/brown_shulker_box.png create mode 100644 static/textures/brown_stained_glass.png create mode 100644 static/textures/brown_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_brown.png => brown_terracotta.png} (100%) rename static/textures/{wool_colored_brown.png => brown_wool.png} (100%) create mode 100644 static/textures/bubble_coral.png create mode 100644 static/textures/bubble_coral_fan.png create mode 100644 static/textures/budding_amethyst.png create mode 100644 static/textures/cactus_bottom.png create mode 100644 static/textures/cactus_side.png create mode 100644 static/textures/cactus_top.png create mode 100644 static/textures/cake_bottom.png create mode 100644 static/textures/cake_inner.png create mode 100644 static/textures/cake_side.png create mode 100644 static/textures/cake_top.png create mode 100644 static/textures/calcite.png create mode 100644 static/textures/calibrated_sculk_sensor_amethyst.png create mode 100644 static/textures/calibrated_sculk_sensor_input_side.png create mode 100644 static/textures/calibrated_sculk_sensor_top.png create mode 100644 static/textures/campfire_fire.png create mode 100644 static/textures/campfire_log.png create mode 100644 static/textures/campfire_log_lit.png create mode 100644 static/textures/candle.png create mode 100644 static/textures/candle_lit.png create mode 100644 static/textures/carrots_stage0.png create mode 100644 static/textures/carrots_stage1.png create mode 100644 static/textures/carrots_stage2.png create mode 100644 static/textures/carrots_stage3.png create mode 100644 static/textures/cartography_table_side1.png create mode 100644 static/textures/cartography_table_side2.png create mode 100644 static/textures/cartography_table_side3.png create mode 100644 static/textures/cartography_table_top.png create mode 100644 static/textures/carved_pumpkin.png create mode 100644 static/textures/cauldron_bottom.png create mode 100644 static/textures/cauldron_inner.png create mode 100644 static/textures/cauldron_side.png create mode 100644 static/textures/cauldron_top.png create mode 100644 static/textures/cave_vines.png create mode 100644 static/textures/cave_vines_lit.png create mode 100644 static/textures/cave_vines_plant.png create mode 100644 static/textures/cave_vines_plant_lit.png create mode 100644 static/textures/chain.png create mode 100644 static/textures/chain_command_block_back.png create mode 100644 static/textures/chain_command_block_conditional.png create mode 100644 static/textures/chain_command_block_front.png create mode 100644 static/textures/chain_command_block_side.png create mode 100644 static/textures/cherry_door_bottom.png create mode 100644 static/textures/cherry_door_top.png create mode 100644 static/textures/cherry_leaves.png create mode 100644 static/textures/cherry_log.png create mode 100644 static/textures/cherry_log_top.png create mode 100644 static/textures/cherry_planks.png create mode 100644 static/textures/cherry_sapling.png create mode 100644 static/textures/cherry_trapdoor.png create mode 100644 static/textures/chipped_anvil_top.png create mode 100644 static/textures/chiseled_bookshelf_empty.png create mode 100644 static/textures/chiseled_bookshelf_occupied.png create mode 100644 static/textures/chiseled_bookshelf_side.png create mode 100644 static/textures/chiseled_bookshelf_top.png create mode 100644 static/textures/chiseled_deepslate.png create mode 100644 static/textures/chiseled_nether_bricks.png create mode 100644 static/textures/chiseled_polished_blackstone.png create mode 100644 static/textures/chiseled_quartz_block.png create mode 100644 static/textures/chiseled_quartz_block_top.png create mode 100644 static/textures/chiseled_red_sandstone.png create mode 100644 static/textures/chiseled_sandstone.png create mode 100644 static/textures/chiseled_stone_bricks.png create mode 100644 static/textures/chorus_flower_dead.png create mode 100644 static/textures/coarse_dirt.png create mode 100644 static/textures/cobbled_deepslate.png delete mode 100644 static/textures/cobblestone_mossy.png create mode 100644 static/textures/cobweb.png create mode 100644 static/textures/cocoa_stage0.png create mode 100644 static/textures/cocoa_stage1.png create mode 100644 static/textures/cocoa_stage2.png create mode 100644 static/textures/command_block_back.png create mode 100644 static/textures/command_block_conditional.png create mode 100644 static/textures/command_block_front.png create mode 100644 static/textures/command_block_side.png create mode 100644 static/textures/comparator.png create mode 100644 static/textures/comparator_on.png create mode 100644 static/textures/composter_bottom.png create mode 100644 static/textures/composter_compost.png create mode 100644 static/textures/composter_ready.png create mode 100644 static/textures/composter_side.png create mode 100644 static/textures/composter_top.png delete mode 100644 static/textures/concrete_powder_green.png create mode 100644 static/textures/conduit.png create mode 100644 static/textures/copper_block.png create mode 100644 static/textures/copper_ore.png create mode 100644 static/textures/cornflower.png create mode 100644 static/textures/cracked_deepslate_bricks.png create mode 100644 static/textures/cracked_deepslate_tiles.png create mode 100644 static/textures/cracked_nether_bricks.png create mode 100644 static/textures/cracked_polished_blackstone_bricks.png create mode 100644 static/textures/cracked_stone_bricks.png create mode 100644 static/textures/crafting_table_front.png create mode 100644 static/textures/crafting_table_top.png create mode 100644 static/textures/crimson_door_bottom.png create mode 100644 static/textures/crimson_door_top.png create mode 100644 static/textures/crimson_fungus.png create mode 100644 static/textures/crimson_nylium.png create mode 100644 static/textures/crimson_nylium_side.png create mode 100644 static/textures/crimson_planks.png create mode 100644 static/textures/crimson_roots.png create mode 100644 static/textures/crimson_roots_pot.png create mode 100644 static/textures/crimson_stem.png create mode 100644 static/textures/crimson_stem_top.png create mode 100644 static/textures/crimson_trapdoor.png create mode 100644 static/textures/crying_obsidian.png create mode 100644 static/textures/cut_copper.png create mode 100644 static/textures/cut_red_sandstone.png create mode 100644 static/textures/cut_sandstone.png create mode 100644 static/textures/cyan_candle.png create mode 100644 static/textures/cyan_candle_lit.png rename static/textures/{concrete_cyan.png => cyan_concrete.png} (100%) rename static/textures/{concrete_powder_cyan.png => cyan_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_cyan.png => cyan_glazed_terracotta.png} (100%) create mode 100644 static/textures/cyan_shulker_box.png create mode 100644 static/textures/cyan_stained_glass.png create mode 100644 static/textures/cyan_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_cyan.png => cyan_terracotta.png} (100%) rename static/textures/{wool_colored_cyan.png => cyan_wool.png} (100%) create mode 100644 static/textures/damaged_anvil_top.png create mode 100644 static/textures/dandelion.png create mode 100644 static/textures/dark_oak_door_bottom.png create mode 100644 static/textures/dark_oak_door_top.png create mode 100644 static/textures/dark_oak_leaves.png create mode 100644 static/textures/dark_oak_log.png create mode 100644 static/textures/dark_oak_log_top.png create mode 100644 static/textures/dark_oak_planks.png create mode 100644 static/textures/dark_oak_sapling.png create mode 100644 static/textures/dark_oak_trapdoor.png create mode 100644 static/textures/dark_prismarine.png create mode 100644 static/textures/daylight_detector_inverted_top.png create mode 100644 static/textures/daylight_detector_side.png create mode 100644 static/textures/daylight_detector_top.png create mode 100644 static/textures/dead_brain_coral.png create mode 100644 static/textures/dead_brain_coral_fan.png create mode 100644 static/textures/dead_bubble_coral.png create mode 100644 static/textures/dead_bubble_coral_fan.png create mode 100644 static/textures/dead_bush.png create mode 100644 static/textures/dead_fire_coral.png create mode 100644 static/textures/dead_fire_coral_fan.png create mode 100644 static/textures/dead_horn_coral.png create mode 100644 static/textures/dead_horn_coral_fan.png create mode 100644 static/textures/dead_tube_coral.png create mode 100644 static/textures/dead_tube_coral_fan.png create mode 100644 static/textures/debug.png create mode 100644 static/textures/debug2.png create mode 100644 static/textures/deepslate.png create mode 100644 static/textures/deepslate_bricks.png create mode 100644 static/textures/deepslate_coal_ore.png create mode 100644 static/textures/deepslate_copper_ore.png create mode 100644 static/textures/deepslate_diamond_ore.png create mode 100644 static/textures/deepslate_emerald_ore.png create mode 100644 static/textures/deepslate_gold_ore.png create mode 100644 static/textures/deepslate_iron_ore.png create mode 100644 static/textures/deepslate_lapis_ore.png create mode 100644 static/textures/deepslate_redstone_ore.png create mode 100644 static/textures/deepslate_tiles.png create mode 100644 static/textures/deepslate_top.png create mode 100644 static/textures/destroy_stage_0.png create mode 100644 static/textures/destroy_stage_1.png create mode 100644 static/textures/destroy_stage_2.png create mode 100644 static/textures/destroy_stage_3.png create mode 100644 static/textures/destroy_stage_4.png create mode 100644 static/textures/destroy_stage_5.png create mode 100644 static/textures/destroy_stage_6.png create mode 100644 static/textures/destroy_stage_7.png create mode 100644 static/textures/destroy_stage_8.png create mode 100644 static/textures/destroy_stage_9.png create mode 100644 static/textures/detector_rail.png create mode 100644 static/textures/detector_rail_on.png create mode 100644 static/textures/diorite.png create mode 100644 static/textures/dirt_path_side.png create mode 100644 static/textures/dirt_path_top.png create mode 100644 static/textures/dispenser_front.png create mode 100644 static/textures/dispenser_front_vertical.png create mode 100644 static/textures/dragon_egg.png create mode 100644 static/textures/dried_kelp_bottom.png create mode 100644 static/textures/dried_kelp_top.png create mode 100644 static/textures/dripstone_block.png create mode 100644 static/textures/dropper_front.png create mode 100644 static/textures/dropper_front_vertical.png create mode 100644 static/textures/enchanting_table_bottom.png create mode 100644 static/textures/enchanting_table_side.png create mode 100644 static/textures/enchanting_table_top.png delete mode 100644 static/textures/end_bricks.png create mode 100644 static/textures/end_portal_frame_eye.png create mode 100644 static/textures/end_portal_frame_side.png create mode 100644 static/textures/end_portal_frame_top.png create mode 100644 static/textures/end_rod.png create mode 100644 static/textures/end_stone_bricks.png create mode 100644 static/textures/exposed_copper.png create mode 100644 static/textures/exposed_cut_copper.png create mode 100644 static/textures/farmland.png create mode 100644 static/textures/farmland_moist.png create mode 100644 static/textures/fern.png create mode 100644 static/textures/fire_0.png create mode 100644 static/textures/fire_1.png create mode 100644 static/textures/fire_coral.png create mode 100644 static/textures/fire_coral_fan.png create mode 100644 static/textures/fletching_table_front.png create mode 100644 static/textures/fletching_table_side.png create mode 100644 static/textures/fletching_table_top.png create mode 100644 static/textures/flower_pot.png create mode 100644 static/textures/flowering_azalea_leaves.png create mode 100644 static/textures/flowering_azalea_side.png create mode 100644 static/textures/flowering_azalea_top.png create mode 100644 static/textures/frogspawn.png create mode 100644 static/textures/frosted_ice_0.png create mode 100644 static/textures/frosted_ice_1.png create mode 100644 static/textures/frosted_ice_2.png create mode 100644 static/textures/frosted_ice_3.png create mode 100644 static/textures/furnace_front.png create mode 100644 static/textures/furnace_front_on.png create mode 100644 static/textures/furnace_side.png create mode 100644 static/textures/furnace_top.png create mode 100644 static/textures/gilded_blackstone.png create mode 100644 static/textures/glass.png delete mode 100644 static/textures/glass_black.png delete mode 100644 static/textures/glass_blue.png delete mode 100644 static/textures/glass_brown.png delete mode 100644 static/textures/glass_cyan.png delete mode 100644 static/textures/glass_gray.png delete mode 100644 static/textures/glass_green.png delete mode 100644 static/textures/glass_light_blue.png delete mode 100644 static/textures/glass_lime.png delete mode 100644 static/textures/glass_magenta.png delete mode 100644 static/textures/glass_orange.png create mode 100644 static/textures/glass_pane_top.png delete mode 100644 static/textures/glass_pink.png delete mode 100644 static/textures/glass_purple.png delete mode 100644 static/textures/glass_red.png delete mode 100644 static/textures/glass_silver.png delete mode 100644 static/textures/glass_white.png delete mode 100644 static/textures/glass_yellow.png delete mode 100644 static/textures/glazed_terracotta_purple.png create mode 100644 static/textures/glow_item_frame.png create mode 100644 static/textures/glow_lichen.png create mode 100644 static/textures/granite.png create mode 100644 static/textures/grass.png rename static/textures/{grass_side.png => grass_block_side.png} (80%) create mode 100644 static/textures/grass_block_side_overlay.png create mode 100644 static/textures/grass_block_snow.png create mode 100644 static/textures/grass_block_top.png create mode 100644 static/textures/gray_candle.png create mode 100644 static/textures/gray_candle_lit.png rename static/textures/{concrete_gray.png => gray_concrete.png} (100%) rename static/textures/{concrete_powder_gray.png => gray_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_gray.png => gray_glazed_terracotta.png} (100%) create mode 100644 static/textures/gray_shulker_box.png create mode 100644 static/textures/gray_stained_glass.png create mode 100644 static/textures/gray_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_gray.png => gray_terracotta.png} (100%) rename static/textures/{wool_colored_gray.png => gray_wool.png} (100%) create mode 100644 static/textures/green_candle.png create mode 100644 static/textures/green_candle_lit.png rename static/textures/{concrete_green.png => green_concrete.png} (100%) create mode 100644 static/textures/green_concrete_powder.png rename static/textures/{glazed_terracotta_green.png => green_glazed_terracotta.png} (100%) create mode 100644 static/textures/green_shulker_box.png create mode 100644 static/textures/green_stained_glass.png create mode 100644 static/textures/green_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_green.png => green_terracotta.png} (100%) rename static/textures/{wool_colored_green.png => green_wool.png} (100%) create mode 100644 static/textures/grindstone_pivot.png create mode 100644 static/textures/grindstone_round.png create mode 100644 static/textures/grindstone_side.png create mode 100644 static/textures/hanging_roots.png delete mode 100644 static/textures/hardened_clay.png create mode 100644 static/textures/hay_block_top.png create mode 100644 static/textures/honey_block_bottom.png create mode 100644 static/textures/honey_block_side.png create mode 100644 static/textures/honey_block_top.png create mode 100644 static/textures/honeycomb_block.png create mode 100644 static/textures/hopper_inside.png create mode 100644 static/textures/hopper_outside.png create mode 100644 static/textures/hopper_top.png create mode 100644 static/textures/horn_coral.png create mode 100644 static/textures/horn_coral_fan.png create mode 100644 static/textures/iron_bars.png create mode 100644 static/textures/iron_door_bottom.png create mode 100644 static/textures/iron_door_top.png create mode 100644 static/textures/iron_trapdoor.png create mode 100644 static/textures/item_frame.png create mode 100644 static/textures/jack_o_lantern.png create mode 100644 static/textures/jigsaw_bottom.png create mode 100644 static/textures/jigsaw_lock.png create mode 100644 static/textures/jigsaw_side.png create mode 100644 static/textures/jigsaw_top.png create mode 100644 static/textures/jukebox_side.png create mode 100644 static/textures/jukebox_top.png create mode 100644 static/textures/jungle_door_bottom.png create mode 100644 static/textures/jungle_door_top.png create mode 100644 static/textures/jungle_leaves.png create mode 100644 static/textures/jungle_log.png create mode 100644 static/textures/jungle_log_top.png create mode 100644 static/textures/jungle_planks.png create mode 100644 static/textures/jungle_sapling.png create mode 100644 static/textures/jungle_trapdoor.png create mode 100644 static/textures/kelp.png create mode 100644 static/textures/kelp_plant.png create mode 100644 static/textures/ladder.png create mode 100644 static/textures/lantern.png create mode 100644 static/textures/large_amethyst_bud.png create mode 100644 static/textures/large_fern_bottom.png create mode 100644 static/textures/large_fern_top.png create mode 100644 static/textures/lava_flow.png create mode 100644 static/textures/lava_still.png delete mode 100644 static/textures/leaves.png create mode 100644 static/textures/lectern_base.png create mode 100644 static/textures/lectern_front.png create mode 100644 static/textures/lectern_sides.png create mode 100644 static/textures/lectern_top.png create mode 100644 static/textures/lever.png create mode 100644 static/textures/light_blue_candle.png create mode 100644 static/textures/light_blue_candle_lit.png rename static/textures/{concrete_light_blue.png => light_blue_concrete.png} (100%) rename static/textures/{concrete_powder_light_blue.png => light_blue_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_light_blue.png => light_blue_glazed_terracotta.png} (100%) create mode 100644 static/textures/light_blue_shulker_box.png create mode 100644 static/textures/light_blue_stained_glass.png create mode 100644 static/textures/light_blue_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_light_blue.png => light_blue_terracotta.png} (100%) rename static/textures/{wool_colored_light_blue.png => light_blue_wool.png} (100%) create mode 100644 static/textures/light_gray_candle.png create mode 100644 static/textures/light_gray_candle_lit.png rename static/textures/{concrete_silver.png => light_gray_concrete.png} (100%) rename static/textures/{concrete_powder_silver.png => light_gray_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_silver.png => light_gray_glazed_terracotta.png} (100%) create mode 100644 static/textures/light_gray_shulker_box.png create mode 100644 static/textures/light_gray_stained_glass.png create mode 100644 static/textures/light_gray_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_silver.png => light_gray_terracotta.png} (100%) rename static/textures/{wool_colored_silver.png => light_gray_wool.png} (100%) create mode 100644 static/textures/lightning_rod.png create mode 100644 static/textures/lightning_rod_on.png create mode 100644 static/textures/lilac_bottom.png create mode 100644 static/textures/lilac_top.png create mode 100644 static/textures/lily_of_the_valley.png create mode 100644 static/textures/lily_pad.png create mode 100644 static/textures/lime_candle.png create mode 100644 static/textures/lime_candle_lit.png rename static/textures/{concrete_lime.png => lime_concrete.png} (100%) rename static/textures/{concrete_powder_lime.png => lime_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_lime.png => lime_glazed_terracotta.png} (100%) create mode 100644 static/textures/lime_shulker_box.png create mode 100644 static/textures/lime_stained_glass.png create mode 100644 static/textures/lime_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_lime.png => lime_terracotta.png} (100%) rename static/textures/{wool_colored_lime.png => lime_wool.png} (100%) create mode 100644 static/textures/lodestone_side.png create mode 100644 static/textures/lodestone_top.png delete mode 100644 static/textures/log_acacia.png delete mode 100644 static/textures/log_acacia_top.png delete mode 100644 static/textures/log_big_oak.png delete mode 100644 static/textures/log_big_oak_top.png delete mode 100644 static/textures/log_birch.png delete mode 100644 static/textures/log_birch_top.png delete mode 100644 static/textures/log_jungle.png delete mode 100644 static/textures/log_jungle_top.png delete mode 100644 static/textures/log_oak.png delete mode 100644 static/textures/log_oak_top.png delete mode 100644 static/textures/log_spruce.png delete mode 100644 static/textures/log_spruce_top.png create mode 100644 static/textures/loom_bottom.png create mode 100644 static/textures/loom_front.png create mode 100644 static/textures/loom_side.png create mode 100644 static/textures/loom_top.png create mode 100644 static/textures/magenta_candle.png create mode 100644 static/textures/magenta_candle_lit.png rename static/textures/{concrete_magenta.png => magenta_concrete.png} (100%) rename static/textures/{concrete_powder_magenta.png => magenta_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_magenta.png => magenta_glazed_terracotta.png} (100%) create mode 100644 static/textures/magenta_shulker_box.png create mode 100644 static/textures/magenta_stained_glass.png create mode 100644 static/textures/magenta_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_magenta.png => magenta_terracotta.png} (100%) rename static/textures/{wool_colored_magenta.png => magenta_wool.png} (100%) create mode 100644 static/textures/mangrove_door_bottom.png create mode 100644 static/textures/mangrove_door_top.png create mode 100644 static/textures/mangrove_leaves.png create mode 100644 static/textures/mangrove_log.png create mode 100644 static/textures/mangrove_log_top.png create mode 100644 static/textures/mangrove_planks.png create mode 100644 static/textures/mangrove_propagule.png create mode 100644 static/textures/mangrove_propagule_hanging.png create mode 100644 static/textures/mangrove_roots_side.png create mode 100644 static/textures/mangrove_roots_top.png create mode 100644 static/textures/mangrove_trapdoor.png create mode 100644 static/textures/medium_amethyst_bud.png create mode 100644 static/textures/melon_stem.png create mode 100644 static/textures/melon_top.png create mode 100644 static/textures/moss_block.png create mode 100644 static/textures/mossy_cobblestone.png create mode 100644 static/textures/mossy_stone_bricks.png create mode 100644 static/textures/mud.png create mode 100644 static/textures/mud_bricks.png create mode 100644 static/textures/muddy_mangrove_roots_side.png create mode 100644 static/textures/muddy_mangrove_roots_top.png create mode 100644 static/textures/mushroom_block_inside.png delete mode 100644 static/textures/mushroom_block_skin_brown.png delete mode 100644 static/textures/mushroom_block_skin_red.png create mode 100644 static/textures/mushroom_stem.png create mode 100644 static/textures/mycelium_top.png delete mode 100644 static/textures/nether_brick.png create mode 100644 static/textures/nether_bricks.png create mode 100644 static/textures/nether_gold_ore.png create mode 100644 static/textures/nether_portal.png create mode 100644 static/textures/nether_quartz_ore.png create mode 100644 static/textures/nether_sprouts.png create mode 100644 static/textures/nether_wart_stage0.png create mode 100644 static/textures/nether_wart_stage1.png create mode 100644 static/textures/nether_wart_stage2.png create mode 100644 static/textures/netherite_block.png create mode 100644 static/textures/note_block.png delete mode 100644 static/textures/noteblock.png create mode 100644 static/textures/oak_door_bottom.png create mode 100644 static/textures/oak_door_top.png create mode 100644 static/textures/oak_leaves.png create mode 100644 static/textures/oak_log.png create mode 100644 static/textures/oak_log_top.png create mode 100644 static/textures/oak_planks.png create mode 100644 static/textures/oak_sapling.png create mode 100644 static/textures/oak_trapdoor.png create mode 100644 static/textures/observer_back.png create mode 100644 static/textures/observer_back_on.png create mode 100644 static/textures/observer_front.png create mode 100644 static/textures/observer_side.png create mode 100644 static/textures/observer_top.png create mode 100644 static/textures/ochre_froglight_side.png create mode 100644 static/textures/ochre_froglight_top.png create mode 100644 static/textures/orange_candle.png create mode 100644 static/textures/orange_candle_lit.png rename static/textures/{concrete_orange.png => orange_concrete.png} (100%) rename static/textures/{concrete_powder_orange.png => orange_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_orange.png => orange_glazed_terracotta.png} (100%) create mode 100644 static/textures/orange_shulker_box.png create mode 100644 static/textures/orange_stained_glass.png create mode 100644 static/textures/orange_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_orange.png => orange_terracotta.png} (100%) create mode 100644 static/textures/orange_tulip.png rename static/textures/{wool_colored_orange.png => orange_wool.png} (100%) create mode 100644 static/textures/oxeye_daisy.png create mode 100644 static/textures/oxidized_copper.png create mode 100644 static/textures/oxidized_cut_copper.png create mode 100644 static/textures/packed_mud.png create mode 100644 static/textures/pearlescent_froglight_side.png create mode 100644 static/textures/pearlescent_froglight_top.png create mode 100644 static/textures/peony_bottom.png create mode 100644 static/textures/peony_top.png create mode 100644 static/textures/pink_candle.png create mode 100644 static/textures/pink_candle_lit.png rename static/textures/{concrete_pink.png => pink_concrete.png} (100%) rename static/textures/{concrete_powder_pink.png => pink_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_pink.png => pink_glazed_terracotta.png} (100%) create mode 100644 static/textures/pink_petals.png create mode 100644 static/textures/pink_petals_stem.png create mode 100644 static/textures/pink_shulker_box.png create mode 100644 static/textures/pink_stained_glass.png create mode 100644 static/textures/pink_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_pink.png => pink_terracotta.png} (100%) create mode 100644 static/textures/pink_tulip.png rename static/textures/{wool_colored_pink.png => pink_wool.png} (100%) create mode 100644 static/textures/piston_bottom.png create mode 100644 static/textures/piston_inner.png create mode 100644 static/textures/piston_side.png create mode 100644 static/textures/piston_top.png create mode 100644 static/textures/piston_top_sticky.png create mode 100644 static/textures/pitcher_crop_bottom.png create mode 100644 static/textures/pitcher_crop_bottom_stage_1.png create mode 100644 static/textures/pitcher_crop_bottom_stage_2.png create mode 100644 static/textures/pitcher_crop_bottom_stage_3.png create mode 100644 static/textures/pitcher_crop_bottom_stage_4.png create mode 100644 static/textures/pitcher_crop_side.png create mode 100644 static/textures/pitcher_crop_top.png create mode 100644 static/textures/pitcher_crop_top_stage_3.png create mode 100644 static/textures/pitcher_crop_top_stage_4.png delete mode 100644 static/textures/planks_acacia.png delete mode 100644 static/textures/planks_big_oak.png delete mode 100644 static/textures/planks_birch.png delete mode 100644 static/textures/planks_jungle.png delete mode 100644 static/textures/planks_oak.png delete mode 100644 static/textures/planks_spruce.png create mode 100644 static/textures/podzol_side.png create mode 100644 static/textures/podzol_top.png create mode 100644 static/textures/pointed_dripstone_down_base.png create mode 100644 static/textures/pointed_dripstone_down_frustum.png create mode 100644 static/textures/pointed_dripstone_down_middle.png create mode 100644 static/textures/pointed_dripstone_down_tip.png create mode 100644 static/textures/pointed_dripstone_down_tip_merge.png create mode 100644 static/textures/pointed_dripstone_up_base.png create mode 100644 static/textures/pointed_dripstone_up_frustum.png create mode 100644 static/textures/pointed_dripstone_up_middle.png create mode 100644 static/textures/pointed_dripstone_up_tip.png create mode 100644 static/textures/pointed_dripstone_up_tip_merge.png create mode 100644 static/textures/polished_andesite.png create mode 100644 static/textures/polished_basalt_side.png create mode 100644 static/textures/polished_basalt_top.png create mode 100644 static/textures/polished_blackstone.png create mode 100644 static/textures/polished_blackstone_bricks.png create mode 100644 static/textures/polished_deepslate.png create mode 100644 static/textures/polished_diorite.png create mode 100644 static/textures/polished_granite.png create mode 100644 static/textures/poppy.png create mode 100644 static/textures/potatoes_stage0.png create mode 100644 static/textures/potatoes_stage1.png create mode 100644 static/textures/potatoes_stage2.png create mode 100644 static/textures/potatoes_stage3.png create mode 100644 static/textures/potted_azalea_bush_plant.png create mode 100644 static/textures/potted_azalea_bush_side.png create mode 100644 static/textures/potted_azalea_bush_top.png create mode 100644 static/textures/potted_flowering_azalea_bush_plant.png create mode 100644 static/textures/potted_flowering_azalea_bush_side.png create mode 100644 static/textures/potted_flowering_azalea_bush_top.png create mode 100644 static/textures/powder_snow.png create mode 100644 static/textures/powered_rail.png create mode 100644 static/textures/powered_rail_on.png delete mode 100644 static/textures/prismarine_dark.png create mode 100644 static/textures/pumpkin_side.png create mode 100644 static/textures/pumpkin_stem.png create mode 100644 static/textures/pumpkin_top.png create mode 100644 static/textures/purple_candle.png create mode 100644 static/textures/purple_candle_lit.png rename static/textures/{concrete_purple.png => purple_concrete.png} (100%) rename static/textures/{concrete_powder_purple.png => purple_concrete_powder.png} (100%) create mode 100644 static/textures/purple_glazed_terracotta.png create mode 100644 static/textures/purple_shulker_box.png create mode 100644 static/textures/purple_stained_glass.png create mode 100644 static/textures/purple_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_purple.png => purple_terracotta.png} (100%) rename static/textures/{wool_colored_purple.png => purple_wool.png} (100%) create mode 100644 static/textures/purpur_pillar_top.png create mode 100644 static/textures/quartz_block_bottom.png delete mode 100644 static/textures/quartz_block_chiseled.png delete mode 100644 static/textures/quartz_block_lines.png create mode 100644 static/textures/quartz_block_top.png create mode 100644 static/textures/quartz_bricks.png delete mode 100644 static/textures/quartz_ore.png create mode 100644 static/textures/quartz_pillar.png create mode 100644 static/textures/quartz_pillar_top.png create mode 100644 static/textures/rail.png create mode 100644 static/textures/rail_corner.png create mode 100644 static/textures/raw_copper_block.png create mode 100644 static/textures/raw_gold_block.png create mode 100644 static/textures/raw_iron_block.png create mode 100644 static/textures/red_candle.png create mode 100644 static/textures/red_candle_lit.png rename static/textures/{concrete_red.png => red_concrete.png} (100%) rename static/textures/{concrete_powder_red.png => red_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_red.png => red_glazed_terracotta.png} (100%) create mode 100644 static/textures/red_mushroom.png create mode 100644 static/textures/red_mushroom_block.png delete mode 100644 static/textures/red_nether_brick.png create mode 100644 static/textures/red_nether_bricks.png create mode 100644 static/textures/red_sandstone.png create mode 100644 static/textures/red_sandstone_bottom.png delete mode 100644 static/textures/red_sandstone_carved.png delete mode 100644 static/textures/red_sandstone_normal.png delete mode 100644 static/textures/red_sandstone_smooth.png create mode 100644 static/textures/red_sandstone_top.png create mode 100644 static/textures/red_shulker_box.png create mode 100644 static/textures/red_stained_glass.png create mode 100644 static/textures/red_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_red.png => red_terracotta.png} (100%) create mode 100644 static/textures/red_tulip.png rename static/textures/{wool_colored_red.png => red_wool.png} (100%) create mode 100644 static/textures/redstone_dust_dot.png create mode 100644 static/textures/redstone_dust_line0.png create mode 100644 static/textures/redstone_dust_line1.png create mode 100644 static/textures/redstone_dust_overlay.png create mode 100644 static/textures/redstone_lamp.png delete mode 100644 static/textures/redstone_lamp_off.png create mode 100644 static/textures/redstone_torch.png create mode 100644 static/textures/redstone_torch_off.png create mode 100644 static/textures/reinforced_deepslate_bottom.png create mode 100644 static/textures/reinforced_deepslate_side.png create mode 100644 static/textures/reinforced_deepslate_top.png create mode 100644 static/textures/repeater.png create mode 100644 static/textures/repeater_on.png create mode 100644 static/textures/repeating_command_block_back.png create mode 100644 static/textures/repeating_command_block_conditional.png create mode 100644 static/textures/repeating_command_block_front.png create mode 100644 static/textures/repeating_command_block_side.png create mode 100644 static/textures/respawn_anchor_bottom.png create mode 100644 static/textures/respawn_anchor_side0.png create mode 100644 static/textures/respawn_anchor_side1.png create mode 100644 static/textures/respawn_anchor_side2.png create mode 100644 static/textures/respawn_anchor_side3.png create mode 100644 static/textures/respawn_anchor_side4.png create mode 100644 static/textures/respawn_anchor_top.png create mode 100644 static/textures/respawn_anchor_top_off.png create mode 100644 static/textures/rooted_dirt.png create mode 100644 static/textures/rose_bush_bottom.png create mode 100644 static/textures/rose_bush_top.png create mode 100644 static/textures/sandstone.png create mode 100644 static/textures/sandstone_bottom.png delete mode 100644 static/textures/sandstone_carved.png delete mode 100644 static/textures/sandstone_normal.png delete mode 100644 static/textures/sandstone_smooth.png create mode 100644 static/textures/sandstone_top.png create mode 100644 static/textures/scaffolding_bottom.png create mode 100644 static/textures/scaffolding_side.png create mode 100644 static/textures/scaffolding_top.png create mode 100644 static/textures/sculk.png create mode 100644 static/textures/sculk_catalyst_bottom.png create mode 100644 static/textures/sculk_catalyst_side.png create mode 100644 static/textures/sculk_catalyst_side_bloom.png create mode 100644 static/textures/sculk_catalyst_top.png create mode 100644 static/textures/sculk_catalyst_top_bloom.png create mode 100644 static/textures/sculk_sensor_bottom.png create mode 100644 static/textures/sculk_sensor_side.png create mode 100644 static/textures/sculk_sensor_tendril_active.png create mode 100644 static/textures/sculk_sensor_tendril_inactive.png create mode 100644 static/textures/sculk_sensor_top.png create mode 100644 static/textures/sculk_shrieker_bottom.png create mode 100644 static/textures/sculk_shrieker_can_summon_inner_top.png create mode 100644 static/textures/sculk_shrieker_inner_top.png create mode 100644 static/textures/sculk_shrieker_side.png create mode 100644 static/textures/sculk_shrieker_top.png create mode 100644 static/textures/sculk_vein.png create mode 100644 static/textures/sea_pickle.png create mode 100644 static/textures/seagrass.png create mode 100644 static/textures/shroomlight.png create mode 100644 static/textures/shulker_box.png delete mode 100644 static/textures/slime.png create mode 100644 static/textures/slime_block.png create mode 100644 static/textures/small_amethyst_bud.png create mode 100644 static/textures/small_dripleaf_side.png create mode 100644 static/textures/small_dripleaf_stem_bottom.png create mode 100644 static/textures/small_dripleaf_stem_top.png create mode 100644 static/textures/small_dripleaf_top.png create mode 100644 static/textures/smithing_table_bottom.png create mode 100644 static/textures/smithing_table_front.png create mode 100644 static/textures/smithing_table_side.png create mode 100644 static/textures/smithing_table_top.png create mode 100644 static/textures/smoker_bottom.png create mode 100644 static/textures/smoker_front.png create mode 100644 static/textures/smoker_front_on.png create mode 100644 static/textures/smoker_side.png create mode 100644 static/textures/smoker_top.png create mode 100644 static/textures/smooth_basalt.png create mode 100644 static/textures/smooth_stone.png create mode 100644 static/textures/smooth_stone_slab_side.png create mode 100644 static/textures/sniffer_egg_not_cracked_bottom.png create mode 100644 static/textures/sniffer_egg_not_cracked_east.png create mode 100644 static/textures/sniffer_egg_not_cracked_north.png create mode 100644 static/textures/sniffer_egg_not_cracked_south.png create mode 100644 static/textures/sniffer_egg_not_cracked_top.png create mode 100644 static/textures/sniffer_egg_not_cracked_west.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_bottom.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_east.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_north.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_south.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_top.png create mode 100644 static/textures/sniffer_egg_slightly_cracked_west.png create mode 100644 static/textures/sniffer_egg_very_cracked_bottom.png create mode 100644 static/textures/sniffer_egg_very_cracked_east.png create mode 100644 static/textures/sniffer_egg_very_cracked_north.png create mode 100644 static/textures/sniffer_egg_very_cracked_south.png create mode 100644 static/textures/sniffer_egg_very_cracked_top.png create mode 100644 static/textures/sniffer_egg_very_cracked_west.png create mode 100644 static/textures/soul_campfire_fire.png create mode 100644 static/textures/soul_campfire_log_lit.png create mode 100644 static/textures/soul_fire_0.png create mode 100644 static/textures/soul_fire_1.png create mode 100644 static/textures/soul_lantern.png create mode 100644 static/textures/soul_soil.png create mode 100644 static/textures/soul_torch.png create mode 100644 static/textures/spawner.png create mode 100644 static/textures/spore_blossom.png create mode 100644 static/textures/spore_blossom_base.png create mode 100644 static/textures/spruce_door_bottom.png create mode 100644 static/textures/spruce_door_top.png create mode 100644 static/textures/spruce_leaves.png create mode 100644 static/textures/spruce_log.png create mode 100644 static/textures/spruce_log_top.png create mode 100644 static/textures/spruce_planks.png create mode 100644 static/textures/spruce_sapling.png create mode 100644 static/textures/spruce_trapdoor.png delete mode 100644 static/textures/stone_andesite.png delete mode 100644 static/textures/stone_andesite_smooth.png create mode 100644 static/textures/stone_bricks.png delete mode 100644 static/textures/stone_diorite.png delete mode 100644 static/textures/stone_diorite_smooth.png delete mode 100644 static/textures/stone_granite.png delete mode 100644 static/textures/stone_granite_smooth.png delete mode 100644 static/textures/stonebrick.png delete mode 100644 static/textures/stonebrick_carved.png delete mode 100644 static/textures/stonebrick_cracked.png delete mode 100644 static/textures/stonebrick_mossy.png create mode 100644 static/textures/stonecutter_bottom.png create mode 100644 static/textures/stonecutter_saw.png create mode 100644 static/textures/stonecutter_side.png create mode 100644 static/textures/stonecutter_top.png create mode 100644 static/textures/stripped_bamboo_block.png create mode 100644 static/textures/stripped_bamboo_block_top.png create mode 100644 static/textures/stripped_cherry_log.png create mode 100644 static/textures/stripped_cherry_log_top.png create mode 100644 static/textures/stripped_crimson_stem.png create mode 100644 static/textures/stripped_crimson_stem_top.png create mode 100644 static/textures/stripped_mangrove_log.png create mode 100644 static/textures/stripped_mangrove_log_top.png create mode 100644 static/textures/stripped_warped_stem.png create mode 100644 static/textures/stripped_warped_stem_top.png create mode 100644 static/textures/structure_block.png create mode 100644 static/textures/structure_block_corner.png create mode 100644 static/textures/structure_block_data.png create mode 100644 static/textures/structure_block_load.png create mode 100644 static/textures/structure_block_save.png create mode 100644 static/textures/sugar_cane.png create mode 100644 static/textures/sunflower_back.png create mode 100644 static/textures/sunflower_bottom.png create mode 100644 static/textures/sunflower_front.png create mode 100644 static/textures/sunflower_top.png create mode 100644 static/textures/suspicious_gravel_0.png create mode 100644 static/textures/suspicious_gravel_1.png create mode 100644 static/textures/suspicious_gravel_2.png create mode 100644 static/textures/suspicious_gravel_3.png create mode 100644 static/textures/suspicious_sand_0.png create mode 100644 static/textures/suspicious_sand_1.png create mode 100644 static/textures/suspicious_sand_2.png create mode 100644 static/textures/suspicious_sand_3.png create mode 100644 static/textures/sweet_berry_bush_stage0.png create mode 100644 static/textures/sweet_berry_bush_stage1.png create mode 100644 static/textures/sweet_berry_bush_stage2.png create mode 100644 static/textures/sweet_berry_bush_stage3.png create mode 100644 static/textures/tall_grass_bottom.png create mode 100644 static/textures/tall_grass_top.png create mode 100644 static/textures/tall_seagrass_bottom.png create mode 100644 static/textures/tall_seagrass_top.png create mode 100644 static/textures/target_side.png create mode 100644 static/textures/target_top.png create mode 100644 static/textures/terracotta.png create mode 100644 static/textures/tinted_glass.png create mode 100644 static/textures/tnt_bottom.png create mode 100644 static/textures/tnt_top.png create mode 100644 static/textures/torch.png create mode 100644 static/textures/torchflower.png create mode 100644 static/textures/torchflower_crop_stage0.png create mode 100644 static/textures/torchflower_crop_stage1.png create mode 100644 static/textures/tripwire.png create mode 100644 static/textures/tripwire_hook.png create mode 100644 static/textures/tube_coral.png create mode 100644 static/textures/tube_coral_fan.png create mode 100644 static/textures/tuff.png create mode 100644 static/textures/turtle_egg.png create mode 100644 static/textures/turtle_egg_slightly_cracked.png create mode 100644 static/textures/turtle_egg_very_cracked.png create mode 100644 static/textures/twisting_vines.png create mode 100644 static/textures/twisting_vines_plant.png create mode 100644 static/textures/unknown.png create mode 100644 static/textures/verdant_froglight_side.png create mode 100644 static/textures/verdant_froglight_top.png create mode 100644 static/textures/vine.png create mode 100644 static/textures/warped_door_bottom.png create mode 100644 static/textures/warped_door_top.png create mode 100644 static/textures/warped_fungus.png create mode 100644 static/textures/warped_nylium.png create mode 100644 static/textures/warped_nylium_side.png create mode 100644 static/textures/warped_planks.png create mode 100644 static/textures/warped_roots.png create mode 100644 static/textures/warped_roots_pot.png create mode 100644 static/textures/warped_stem.png create mode 100644 static/textures/warped_stem_top.png create mode 100644 static/textures/warped_trapdoor.png create mode 100644 static/textures/warped_wart_block.png create mode 100644 static/textures/water_flow.png create mode 100644 static/textures/water_overlay.png create mode 100644 static/textures/water_still.png create mode 100644 static/textures/weathered_copper.png create mode 100644 static/textures/weathered_cut_copper.png create mode 100644 static/textures/weeping_vines.png create mode 100644 static/textures/weeping_vines_plant.png create mode 100644 static/textures/wet_sponge.png create mode 100644 static/textures/wheat_stage0.png create mode 100644 static/textures/wheat_stage1.png create mode 100644 static/textures/wheat_stage2.png create mode 100644 static/textures/wheat_stage3.png create mode 100644 static/textures/wheat_stage4.png create mode 100644 static/textures/wheat_stage5.png create mode 100644 static/textures/wheat_stage6.png create mode 100644 static/textures/wheat_stage7.png create mode 100644 static/textures/white_candle.png create mode 100644 static/textures/white_candle_lit.png rename static/textures/{concrete_white.png => white_concrete.png} (100%) rename static/textures/{concrete_powder_white.png => white_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_white.png => white_glazed_terracotta.png} (100%) create mode 100644 static/textures/white_shulker_box.png create mode 100644 static/textures/white_stained_glass.png create mode 100644 static/textures/white_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_white.png => white_terracotta.png} (100%) create mode 100644 static/textures/white_tulip.png rename static/textures/{wool_colored_white.png => white_wool.png} (100%) create mode 100644 static/textures/wither_rose.png create mode 100644 static/textures/yellow_candle.png create mode 100644 static/textures/yellow_candle_lit.png rename static/textures/{concrete_yellow.png => yellow_concrete.png} (100%) rename static/textures/{concrete_powder_yellow.png => yellow_concrete_powder.png} (100%) rename static/textures/{glazed_terracotta_yellow.png => yellow_glazed_terracotta.png} (100%) create mode 100644 static/textures/yellow_shulker_box.png create mode 100644 static/textures/yellow_stained_glass.png create mode 100644 static/textures/yellow_stained_glass_pane_top.png rename static/textures/{hardened_clay_stained_yellow.png => yellow_terracotta.png} (100%) rename static/textures/{wool_colored_yellow.png => yellow_wool.png} (100%) diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 0000000..8c9cc19 --- /dev/null +++ b/.gitmodules @@ -0,0 +1,3 @@ +[submodule "external/minecraft-data"] + path = external/minecraft-data + url = https://github.com/PrismarineJS/minecraft-data.git diff --git a/README.md b/README.md index b8326c9..32a8a94 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ # minecraft-artifier-js JavaScript/Node.js Web Converter from image to Minecraft blocks.
-Can open and save 1.12 and lower .schematics of Minecraft. +Can open and save 1.20 and lower .schematics of Minecraft. Public part of minecraftart.netlify.com diff --git a/app/index.html b/app/index.html index 094564c..3ede317 100644 --- a/app/index.html +++ b/app/index.html @@ -1,399 +1,534 @@ - - Minecraft Art To Block - - - - + + Minecraft Art To Block + + + + + <%=require('./modal.html')%> - <%=require('./modal.html')%> +
+
+
+
Loading...
+
+
-
-
-
-
- Loading... -
-
+
+
+
Drag and drop your image/.schematic file here
+
+ or + +
+
+
+ +
+
+
+
-
-
-
Drag and drop your image/.schematic file here
-
- or - -
-
-
-
-
+ - - - -
+
+
+
+
All
+
All blocks
+
-
-
Open - -
-
Save - -
-
Replace - -
-
Settings - +
+
-
- - -
Convert to commands..
-
Help -
-
- FAQ -
-
- Keyboard/mouse controls -
-
-
+ + +
+ +
+
+ +
+
+
+ History: +
+
+ Open +
+
+
+
+ +
+
...
+
+
+ - + + diff --git a/app/index.js b/app/index.js index ed95128..f624bcb 100644 --- a/app/index.js +++ b/app/index.js @@ -1,273 +1,314 @@ -'use strict' +"use strict"; -import './style.css' -import 'bulma/css/bulma.css' +import "./style.css"; +import "bulma/css/bulma.css"; -import ConvertWorker from 'worker-loader!./models/convert.js' -import MineartCanvas from './models/canvas.js' +import ConvertWorker from "worker-loader!./models/convert.js"; +import MineartCanvas from "./models/canvas.js"; -const blocks = require('../static/baked_blocks.json') +const blocks = require("../static/baked_blocks.json"); blocks.forEach((item) => { - item.src = require('../static/textures/' + item.texture_image) - delete item.texture_image -}) + item.src = require("../static/textures/" + item.texture_image); + delete item.texture_image; +}); const store = { - blocksDefault: blocks, - convertWorker: new ConvertWorker(), - mineartCanvas: new MineartCanvas(), - canvasTemp: document.createElement('canvas'), - localStorage: window.localStorage, - uploadedType: null, - uploadedImage: new Image(), - uploadedImageName: null, - minecraftVersion: 12, - waitForLoaded: { - arr: null, - width: null, - height: null - }, - isSaved: true, - leftClick: false, - findBlockById(id) { - return this.blocksDefault.find((item) => { - if (item.id === id) { - return true - } - }) + blocksDefault: blocks, + convertWorker: new ConvertWorker(), + mineartCanvas: new MineartCanvas(), + canvasTemp: document.createElement("canvas"), + localStorage: window.localStorage, + uploadedType: null, + uploadedImage: new Image(), + uploadedImageName: null, + minecraftVersion: 20, + waitForLoaded: { + arr: null, + width: null, + height: null, + }, + isSaved: true, + leftClick: false, + findBlockById(id) { + return this.blocksDefault.find((item) => { + if (item.id === id) { + return true; + } + }); + }, + findBlockByGameId(blockId, dataId) { + const dataIrrelevant = [ + 18, 99, 100, 202, 216, 235, 236, 237, 238, 239, 240, 241, 242, 243, 244, + 245, 246, 247, 248, 249, 250, + ]; + const dataAxis = [17, 162]; + return this.blocksDefault.find((item) => { + if (dataAxis.indexOf(blockId) >= 0 && dataId >= 4) { + let tempDataId = dataId % 4; + if ( + item.block_id === blockId && + item.data_id === tempDataId && + item.axis + ) { + return true; + } + } else if (dataIrrelevant.indexOf(blockId) >= 0) { + if (item.block_id === blockId) { + return true; + } + } else if ( + item.block_id === blockId && + item.data_id === dataId && + !item.axis + ) { + return true; + } + }); + }, + showLoading() { + document.querySelector(".loading-overlay").classList.add("is-active"); + }, + hideLoading() { + document.querySelector(".loading-overlay").classList.remove("is-active"); + }, + startScreen: require("./screens/start.js").output, + settingsScreen: require("./screens/settings.js").output, + editorScreen: require("./screens/editor.js").output, + convertScreen: require("./screens/convert.js").output, + modals: { + items: {}, + $root: document.querySelector(".modal"), + $closeBtn: document.querySelector(".modal-close"), + init() { + const modalList = document.querySelectorAll('div[id^="modal-"]'); + modalList.forEach((item) => { + const id = item.id.match(/(modal\-)(.*)/)[2]; + this.items[id] = item; + }); }, - findBlockByGameId(blockId, dataId) { - const dataIrrelevant = [18, 99, 100, 202, 216, 235, 236, 237, 238, 239, 240, 241, 242, 243, 244, 245, 246, 247, 248, 249, 250] - const dataAxis = [17, 162] - return this.blocksDefault.find((item) => { - if (dataAxis.indexOf(blockId) >= 0 && dataId >= 4) { - let tempDataId = dataId % 4 - if (item.block_id === blockId && item.data_id === tempDataId && item.axis) { - return true - } - } else if (dataIrrelevant.indexOf(blockId) >= 0) { - if (item.block_id === blockId) { - return true - } - } else if (item.block_id === blockId && item.data_id === dataId && !item.axis) { - return true - } - }) + openModal(name) { + this.$root.classList.add("is-active"); + for (let key in this.items) { + this.items[key].classList.add("hidden"); + } + this.items[name].classList.remove("hidden"); + store.editorScreen.closeTopbarMenus(); }, - showLoading() { - document.querySelector('.loading-overlay').classList.add('is-active') + closeModal() { + this.$root.classList.remove("is-active"); + for (let key in this.items) { + const video = this.items[key].querySelector("iframe"); + if (video) { + video.src = video.src; + } + this.items[key].classList.add("hidden"); + } }, - hideLoading() { - document.querySelector('.loading-overlay').classList.remove('is-active') + }, + errors: { + items: {}, + init() { + const errorList = document.querySelectorAll('div[id^="error-"]'); + errorList.forEach((item) => { + const id = item.id.match(/(error\-)(.*)/)[2]; + this.items[id] = item; + item.classList.add("hidden"); + }); }, - startScreen: require('./screens/start.js').output, - settingsScreen: require('./screens/settings.js').output, - editorScreen: require('./screens/editor.js').output, - convertScreen: require('./screens/convert.js').output, - modals: { - items: {}, - $root: document.querySelector('.modal'), - $closeBtn: document.querySelector('.modal-close'), - init() { - const modalList = document.querySelectorAll('div[id^="modal-"]') - modalList.forEach((item) => { - const id = item.id.match(/(modal\-)(.*)/)[2] - this.items[id] = item - }) - }, - openModal(name) { - this.$root.classList.add('is-active') - for (let key in this.items) { - this.items[key].classList.add('hidden') - } - this.items[name].classList.remove('hidden') - store.editorScreen.closeTopbarMenus() - }, - closeModal() { - this.$root.classList.remove('is-active') - for (let key in this.items) { - const video = this.items[key].querySelector('iframe') - if (video) { - video.src = video.src - } - this.items[key].classList.add('hidden') - } + triggerError(id, text, timeout) { + if (this.items[id]) { + if (!this.items[id].classList.contains("hidden")) { + clearTimeout(this.items[id].timeout); + this.items[id].timeout = null; } + this.items[id].querySelector(".warning-body").innerHTML = text; + this.items[id].classList.remove("hidden"); + this.items[id].timeout = setTimeout(() => { + this.items[id].classList.add("hidden"); + this.items[id].timeout = null; + }, timeout); + } else { + console.error("No error id!"); + } }, - errors: { - items: {}, - init() { - const errorList = document.querySelectorAll('div[id^="error-"]') - errorList.forEach((item) => { - const id = item.id.match(/(error\-)(.*)/)[2] - this.items[id] = item - item.classList.add('hidden') - }) - }, - triggerError(id, text, timeout) { - if (this.items[id]) { - if (!this.items[id].classList.contains('hidden')) { - clearTimeout(this.items[id].timeout) - this.items[id].timeout = null - } - this.items[id].querySelector('.warning-body').innerHTML = text - this.items[id].classList.remove('hidden') - this.items[id].timeout = setTimeout(() => { - this.items[id].classList.add('hidden') - this.items[id].timeout = null - }, timeout) - } else { - console.error('No error id!') - } - }, - closeError(id) { - if (this.items[id]) { - if (this.items[id].classList.contains('hidden')) { return } - this.items[id].classList.add('hidden') - if (this.items[id].timeout) { - clearTimeout(this.items[id].timeout) - this.items[id].timeout = null - } - } else { - console.error('No error id!') - } + closeError(id) { + if (this.items[id]) { + if (this.items[id].classList.contains("hidden")) { + return; } - }, - setEventListeners() { - this.convertWorker.onmessage = (e) => { - if (document.readyState !== 'complete') { - store.waitForLoaded.arr = e.data - store.waitForLoaded.width = store.canvasTemp.width - store.waitForLoaded.height = store.canvasTemp.height - return - } - store.hideLoading() - this.settingsScreen.changeToEditorScreen() - this.mineartCanvas.init(store.editorScreen.$canvas) - this.mineartCanvas.setImageSizes(store.canvasTemp.width, store.canvasTemp.height) - this.mineartCanvas.open(e.data) - store.editorScreen.setEyedrop(1) - store.editorScreen.setBrushSize(3) - store.editorScreen.resetScreen() + this.items[id].classList.add("hidden"); + if (this.items[id].timeout) { + clearTimeout(this.items[id].timeout); + this.items[id].timeout = null; } + } else { + console.error("No error id!"); + } + }, + }, + setEventListeners() { + this.convertWorker.onmessage = (e) => { + if (document.readyState !== "complete") { + store.waitForLoaded.arr = e.data; + store.waitForLoaded.width = store.canvasTemp.width; + store.waitForLoaded.height = store.canvasTemp.height; + return; + } + store.hideLoading(); + this.settingsScreen.changeToEditorScreen(); + this.mineartCanvas.init(store.editorScreen.$canvas); + this.mineartCanvas.setImageSizes( + store.canvasTemp.width, + store.canvasTemp.height + ); + this.mineartCanvas.open(e.data); + store.editorScreen.setEyedrop(1); + store.editorScreen.setBrushSize(3); + store.editorScreen.resetScreen(); + }; - this.modals.$closeBtn.onclick = () => { - this.modals.closeModal() - } + this.modals.$closeBtn.onclick = () => { + this.modals.closeModal(); + }; - window.addEventListener("load", function(event) { - if (store.waitForLoaded.arr !== null) { - store.settingsScreen.changeToEditorScreen() - store.mineartCanvas.init(store.editorScreen.$canvas) - store.mineartCanvas.setImageSizes(store.waitForLoaded.width, store.waitForLoaded.height) - store.mineartCanvas.open(store.waitForLoaded.arr) - store.waitForLoaded = null - store.hideLoading() - } - }); + window.addEventListener("load", function (event) { + if (store.waitForLoaded.arr !== null) { + store.settingsScreen.changeToEditorScreen(); + store.mineartCanvas.init(store.editorScreen.$canvas); + store.mineartCanvas.setImageSizes( + store.waitForLoaded.width, + store.waitForLoaded.height + ); + store.mineartCanvas.open(store.waitForLoaded.arr); + store.waitForLoaded = null; + store.hideLoading(); + } + }); - document.addEventListener("DOMContentLoaded", function(event) { - document.body.style.display = 'block' - }); + document.addEventListener("DOMContentLoaded", function (event) { + document.body.style.display = "block"; + }); - document.addEventListener('keydown', (e) => { - if (document.activeElement.tagName === 'INPUT' || document.querySelector('section.editor-screen').classList.contains('hidden')) { - return - } - if (store.leftClick) { return } - store.editorScreen.closeTopbarMenus() - switch (e.which) { - case 17: - store.mineartCanvas.setTool('clicker') - store.mineartCanvas.render() - break - case 80: - document.querySelector('.editor-tools input[value="pencil"]').click() - break - case 66: - document.querySelector('.editor-tools input[value="brush"]').click() - break - case 85: - document.querySelector('.editor-tools input[value="bucket"]').click() - break - case 69: - document.querySelector('.editor-tools input[value="eyedropper"]').click() - break - case 90: - if (e.ctrlKey) { - store.editorScreen.undoOnce() - } else { - document.querySelector('.editor-tools input[value="zoom"]').click() - } - break - case 89: - if (e.ctrlKey) { - store.editorScreen.redoOnce() - } - break - case 71: - document.querySelector('.editor-tools input[value="grab"]').click() - break - case 79: - store.editorScreen.$settingsOriginal.click() - break - case 37: - store.mineartCanvas.moveOffset(1, 0) - break - case 38: - store.mineartCanvas.moveOffset(0, 1) - break - case 39: - store.mineartCanvas.moveOffset(-1, 0) - break - case 40: - store.mineartCanvas.moveOffset(0, -1) - break - case 219: - if (store.editorScreen.currentTool === 'pencil' || store.editorScreen.currentTool === 'brush') { - store.editorScreen.$brushMinus.click() - } - break - case 221: - if (store.editorScreen.currentTool === 'pencil' || store.editorScreen.currentTool === 'brush') { - store.editorScreen.$brushPlus.click() - } - break - } - }) + document.addEventListener("keydown", (e) => { + if ( + document.activeElement.tagName === "INPUT" || + document + .querySelector("section.editor-screen") + .classList.contains("hidden") + ) { + return; + } + if (store.leftClick) { + return; + } + store.editorScreen.closeTopbarMenus(); + switch (e.which) { + case 17: + store.mineartCanvas.setTool("clicker"); + store.mineartCanvas.render(); + break; + case 80: + document.querySelector('.editor-tools input[value="pencil"]').click(); + break; + case 66: + document.querySelector('.editor-tools input[value="brush"]').click(); + break; + case 85: + document.querySelector('.editor-tools input[value="bucket"]').click(); + break; + case 69: + document + .querySelector('.editor-tools input[value="eyedropper"]') + .click(); + break; + case 90: + if (e.ctrlKey) { + store.editorScreen.undoOnce(); + } else { + document.querySelector('.editor-tools input[value="zoom"]').click(); + } + break; + case 89: + if (e.ctrlKey) { + store.editorScreen.redoOnce(); + } + break; + case 71: + document.querySelector('.editor-tools input[value="grab"]').click(); + break; + case 79: + store.editorScreen.$settingsOriginal.click(); + break; + case 37: + store.mineartCanvas.moveOffset(1, 0); + break; + case 38: + store.mineartCanvas.moveOffset(0, 1); + break; + case 39: + store.mineartCanvas.moveOffset(-1, 0); + break; + case 40: + store.mineartCanvas.moveOffset(0, -1); + break; + case 219: + if ( + store.editorScreen.currentTool === "pencil" || + store.editorScreen.currentTool === "brush" + ) { + store.editorScreen.$brushMinus.click(); + } + break; + case 221: + if ( + store.editorScreen.currentTool === "pencil" || + store.editorScreen.currentTool === "brush" + ) { + store.editorScreen.$brushPlus.click(); + } + break; + } + }); - document.addEventListener('keyup', (e) => { - if (document.activeElement.tagName === 'INPUT' || document.querySelector('section.editor-screen').classList.contains('hidden')) { - return - } - if (store.leftClick) { return } - switch (e.which) { - case 17: - store.mineartCanvas.setTool(store.editorScreen.currentTool) - break - } - }) + document.addEventListener("keyup", (e) => { + if ( + document.activeElement.tagName === "INPUT" || + document + .querySelector("section.editor-screen") + .classList.contains("hidden") + ) { + return; + } + if (store.leftClick) { + return; + } + switch (e.which) { + case 17: + store.mineartCanvas.setTool(store.editorScreen.currentTool); + break; + } + }); - document.addEventListener('mousedown', (e) => { - store.leftClick = true - }) + document.addEventListener("mousedown", (e) => { + store.leftClick = true; + }); - document.addEventListener('mouseup', (e) => { - store.leftClick = false - }) - } -} + document.addEventListener("mouseup", (e) => { + store.leftClick = false; + }); + }, +}; -store.mineartCanvas.setBlocks(blocks) +store.mineartCanvas.setBlocks(blocks); blocks.sort((a, b) => { - return a.h - b.h + a.s - b.s + b.l - a.l; -}) + return a.h - b.h + a.s - b.s + b.l - a.l; +}); -store.startScreen.init(store) -store.settingsScreen.init(store) -store.editorScreen.init(store) -store.convertScreen.init(store) -store.errors.init() -store.modals.init() -store.setEventListeners() -store.editorScreen.fillBlockList() +store.startScreen.init(store); +store.settingsScreen.init(store); +store.editorScreen.init(store); +store.convertScreen.init(store); +store.errors.init(); +store.modals.init(); +store.setEventListeners(); +store.editorScreen.fillBlockList(); diff --git a/app/modal.html b/app/modal.html index c71c19f..a98a18b 100644 --- a/app/modal.html +++ b/app/modal.html @@ -1,50 +1,62 @@
-
-
- - - diff --git a/app/models/canvas.js b/app/models/canvas.js index 6277a0c..8fc44ae 100644 --- a/app/models/canvas.js +++ b/app/models/canvas.js @@ -1,1730 +1,2159 @@ -import SchematicsHelper from './schematics.js' +import SchematicsHelper from "./schematics.js"; function MineartCanvas() { - var $root - - const canvasMain = document.createElement('canvas') - const ctxMain = canvasMain.getContext('2d') - - const canvasOverlay = document.createElement('canvas') - const ctxOverlay = canvasOverlay.getContext('2d') - - const canvasTemp = document.createElement('canvas') - const ctxTemp = canvasTemp.getContext('2d') - - const canvasInit = document.createElement('canvas') - const ctxInit = canvasInit.getContext('2d') - - const _URL = window.URL || window.webkitURL - - const thisRoot = this - - const store = { - blocksDb: [], - getBlockById(id) { - if (id == 0) { - return null - } - return this.blocksDb[id - 1] - }, - initFlag: false, - imageConvertedHex: null, - imageConvertedHexBackup: null, - imageWidth: null, - imageHeight: null, - canvasWidth: null, - canvasHeight: null, - baseCellSize: 16, - boundingRect: null, - originalImage: { - img: new Image(), - x: null, - y: null, - width: null, - height: null - }, - groups: null, - offset: { - bounds: { - x: null, - y: null - }, - x: 0, - y: 0, - translate(x, y) { - let imageSizeX = store.imageWidth * store.baseCellSize * store.scale.current - let imageSizeY = store.imageHeight * store.baseCellSize * store.scale.current - if (x > this.bounds.x) { x = this.bounds.x } - if (y > this.bounds.y) { y = this.bounds.y } - if (x + imageSizeX - store.canvasWidth < -this.bounds.x) { - x = -imageSizeX + store.canvasWidth - this.bounds.x - } - if (y + imageSizeY - store.canvasHeight < -this.bounds.y) { - y = -imageSizeY + store.canvasHeight - this.bounds.y - } - this.x = Math.round(x) - this.y = Math.round(y) - } - }, - scale: { - current: 0.0625, - options: [0.0625, 0.125, 0.25, 0.5, 1, 2, 4], - cacheFrom: 1, - scaleUp() { - let indexOfCurrent = this.options.indexOf(this.current) - if ( indexOfCurrent < this.options.length - 1 ) { - this.current = this.options[indexOfCurrent + 1] - return true - } - return false - }, - scaleDown() { - let indexOfCurrent = this.options.indexOf(this.current) - if ( indexOfCurrent > 0 ) { - this.current = this.options[indexOfCurrent - 1] - return true - } - return false - } - }, - history: { - log: [], - currentPos: -1, - lastMaxPos: -1, - maxStates: 100, - offset: 0 - }, - interface: { - eyedropCurrent: 1, - toolCurrent: 'pencil', - brushSize: 9, - selection: { - start: null, - end: null - }, - rulerSize: 25, - cursor: '' - }, - events: { - cached: new CustomEvent('cached'), - history: new CustomEvent('history') - }, - controls: { - mouse: { - localX: null, - localY: null, - grabbed: false, - leftClick: false, - startX: 0, - startY: 0, - oldOffsetX: null, - oldOffsetY: null, - lastMouseX: null, - lastMouseY: null - } - }, - settings: { - maxBrushSize: 25, - showGrid: false, - showRulers: true, - showOriginal: false, - showDebugDrawGroups: false, - minecraftVersion: 12, - drawGroupsCurrent: 0, - gridColor: '#ff4778' - }, - debug: { //delete in prod!!! - showTempCanvas: false, - renderAllPainted: false, - renderTime: { - '0.0625': 0, - '0.125': 0, - '0.25': 0, - '0.5': 0, - '1': 0, - '2': 0, - '4': 0 - }, - savedStartHistory: null, - drawGroups: [] - } + var $root; + + const canvasMain = document.createElement("canvas"); + const ctxMain = canvasMain.getContext("2d"); + + const canvasOverlay = document.createElement("canvas"); + const ctxOverlay = canvasOverlay.getContext("2d"); + + const canvasTemp = document.createElement("canvas"); + const ctxTemp = canvasTemp.getContext("2d"); + + const canvasInit = document.createElement("canvas"); + const ctxInit = canvasInit.getContext("2d"); + + const _URL = window.URL || window.webkitURL; + + const thisRoot = this; + + const store = { + blocksDb: [], + getBlockById(id) { + if (id == 0) { + return null; + } + return this.blocksDb[id - 1]; + }, + initFlag: false, + imageConvertedHex: null, + imageConvertedHexBackup: null, + imageWidth: null, + imageHeight: null, + canvasWidth: null, + canvasHeight: null, + baseCellSize: 16, + boundingRect: null, + originalImage: { + img: new Image(), + x: null, + y: null, + width: null, + height: null, + }, + groups: null, + offset: { + bounds: { + x: null, + y: null, + }, + x: 0, + y: 0, + translate(x, y) { + let imageSizeX = + store.imageWidth * store.baseCellSize * store.scale.current; + let imageSizeY = + store.imageHeight * store.baseCellSize * store.scale.current; + if (x > this.bounds.x) { + x = this.bounds.x; + } + if (y > this.bounds.y) { + y = this.bounds.y; + } + if (x + imageSizeX - store.canvasWidth < -this.bounds.x) { + x = -imageSizeX + store.canvasWidth - this.bounds.x; + } + if (y + imageSizeY - store.canvasHeight < -this.bounds.y) { + y = -imageSizeY + store.canvasHeight - this.bounds.y; + } + this.x = Math.round(x); + this.y = Math.round(y); + }, + }, + scale: { + current: 0.0625, + options: [0.0625, 0.125, 0.25, 0.5, 1, 2, 4], + cacheFrom: 1, + scaleUp() { + let indexOfCurrent = this.options.indexOf(this.current); + if (indexOfCurrent < this.options.length - 1) { + this.current = this.options[indexOfCurrent + 1]; + return true; + } + return false; + }, + scaleDown() { + let indexOfCurrent = this.options.indexOf(this.current); + if (indexOfCurrent > 0) { + this.current = this.options[indexOfCurrent - 1]; + return true; + } + return false; + }, + }, + history: { + log: [], + currentPos: -1, + lastMaxPos: -1, + maxStates: 100, + offset: 0, + }, + interface: { + eyedropCurrent: 1, + toolCurrent: "pencil", + brushSize: 9, + selection: { + start: null, + end: null, + }, + rulerSize: 25, + cursor: "", + }, + events: { + cached: new CustomEvent("cached"), + history: new CustomEvent("history"), + }, + controls: { + mouse: { + localX: null, + localY: null, + grabbed: false, + leftClick: false, + startX: 0, + startY: 0, + oldOffsetX: null, + oldOffsetY: null, + lastMouseX: null, + lastMouseY: null, + }, + }, + settings: { + maxBrushSize: 25, + showGrid: false, + showRulers: true, + showOriginal: false, + showDebugDrawGroups: false, + minecraftVersion: 20, + drawGroupsCurrent: 0, + gridColor: "#ff4778", + }, + debug: { + //delete in prod!!! + showTempCanvas: false, + renderAllPainted: false, + renderTime: { + 0.0625: 0, + 0.125: 0, + 0.25: 0, + 0.5: 0, + 1: 0, + 2: 0, + 4: 0, + }, + savedStartHistory: null, + drawGroups: [], + }, + }; + + /* PRIVATE METHODS */ + ////////////////////////////////////// + + this._isEmptyObject = (obj) => { + for (let key in obj) { + return false; } + return true; + }; - /* PRIVATE METHODS */ - ////////////////////////////////////// + this._setCursor = (str) => { + canvasOverlay.setAttribute("data-cursor", str); + }; - this._isEmptyObject = (obj) => { - for (let key in obj) { - return false; - } - return true; + this._checkIfReady = () => { + if (store.blocksDb.length === 0) { + return false; } - - this._setCursor = (str) => { - canvasOverlay.setAttribute('data-cursor', str) + return true; + }; + + this._getPosFromInt = (int) => { + return { + x: int % store.imageWidth, + y: Math.floor(int / store.imageWidth), + }; + }; + + this._getIntFromPos = (x, y) => { + return y * store.imageWidth + x; + }; + + this._getCornersOfVisible = () => { + let topLeftX = Math.floor( + -store.offset.x / store.baseCellSize / store.scale.current + ); + let topLeftY = Math.floor( + -store.offset.y / store.baseCellSize / store.scale.current + ); + let bottomRightX = + Math.floor( + (store.canvasWidth - store.offset.x) / + store.baseCellSize / + store.scale.current + ) + 1; + let bottomRightY = + Math.floor( + (store.canvasHeight - store.offset.y) / + store.baseCellSize / + store.scale.current + ) + 1; + + if (topLeftX < 0) { + topLeftX = 0; } - - this._checkIfReady = () => { - if (store.blocksDb.length === 0) { return false } - return true + if (topLeftY < 0) { + topLeftY = 0; } - - this._getPosFromInt = (int) => { - return { - x: int % store.imageWidth, - y: Math.floor(int / store.imageWidth) - } + if (bottomRightX < 0) { + bottomRightX = 0; } - - this._getIntFromPos = (x, y) => { - return y * store.imageWidth + x + if (bottomRightY < 0) { + bottomRightY = 0; } - this._getCornersOfVisible = () => { - let topLeftX = Math.floor((-store.offset.x) / store.baseCellSize / store.scale.current) - let topLeftY = Math.floor((-store.offset.y) / store.baseCellSize / store.scale.current) - let bottomRightX = Math.floor((store.canvasWidth - store.offset.x) / store.baseCellSize / store.scale.current) + 1 - let bottomRightY = Math.floor((store.canvasHeight - store.offset.y) / store.baseCellSize / store.scale.current) + 1 - - if (topLeftX < 0) { - topLeftX = 0 - } - if (topLeftY < 0) { - topLeftY = 0 - } - if (bottomRightX < 0) { - bottomRightX = 0 - } - if (bottomRightY < 0) { - bottomRightY = 0 - } - - return { - topLeftX: topLeftX, - topLeftY: topLeftY, - bottomRightX: bottomRightX, - bottomRightY: bottomRightY - } + return { + topLeftX: topLeftX, + topLeftY: topLeftY, + bottomRightX: bottomRightX, + bottomRightY: bottomRightY, + }; + }; + + this._getBlockIdByPosition = (x, y) => { + if (!store.imageConvertedHex) { + return null; } - - this._getBlockIdByPosition = (x, y) => { - if (!store.imageConvertedHex) { - return null - } - if (x < 0 || x >= store.imageWidth || y < 0 || y >= store.imageHeight) { - return null - } - - if (store.history.currentPos !== -1) { - return store.imageConvertedHex[y * store.imageWidth + x] - } else { - return store.imageConvertedHexBackup[y * store.imageWidth + x] - } + if (x < 0 || x >= store.imageWidth || y < 0 || y >= store.imageHeight) { + return null; } - this._checkIfInSelection = (int) => { - if (store.interface.selection.start === null || store.interface.selection.start === null) { return true } - let tempStart, tempEnd - if (store.interface.selection.start < store.interface.selection.end) { - tempStart = store.interface.selection.start - tempEnd = store.interface.selection.end - } else { - tempStart = store.interface.selection.end - tempEnd = store.interface.selection.start - } - if (int < tempStart || int > tempEnd) { return false } - let startModulo = tempStart % store.imageWidth - let endModulo = tempEnd % store.imageWidth - let intModulo = int % store.imageWidth - if (intModulo < startModulo || intModulo > endModulo) { return false } - return true - } - - this._createMainBlobImage = (str) => { - for (let i = 0; i < store.imageConvertedHex.length; i++) { - let x = i % store.imageWidth - let y = Math.floor(i / store.imageWidth) - if (store.imageConvertedHex[i] > 0) { - let imageForCanvas = store.getBlockById(store.imageConvertedHex[i]).image - ctxTemp.drawImage(imageForCanvas, - x * store.baseCellSize, - y * store.baseCellSize, - store.baseCellSize, - store.baseCellSize) - ctxInit.drawImage(imageForCanvas, - x * store.baseCellSize, - y * store.baseCellSize, - store.baseCellSize, - store.baseCellSize) - } - } + if (store.history.currentPos !== -1) { + return store.imageConvertedHex[y * store.imageWidth + x]; + } else { + return store.imageConvertedHexBackup[y * store.imageWidth + x]; } - - this._fakePaint = (x, y, id) => { - if (x < 0 || x >= store.imageWidth ) { return } - if (y < 0 || y >= store.imageHeight ) { return } - - if (id !== 0) { - let imageForCanvas = store.getBlockById(id).image - - ctxMain.clearRect(x * store.baseCellSize * store.scale.current + store.offset.x, - y * store.baseCellSize * store.scale.current + store.offset.y, - store.scale.current * store.baseCellSize, - store.scale.current * store.baseCellSize) - - ctxMain.drawImage(imageForCanvas, - x * store.baseCellSize * store.scale.current + store.offset.x, - y * store.baseCellSize * store.scale.current + store.offset.y, - store.scale.current * store.baseCellSize, - store.scale.current * store.baseCellSize) - - ctxTemp.clearRect(x * store.baseCellSize, - y * store.baseCellSize, - store.baseCellSize, - store.baseCellSize) - - ctxTemp.drawImage(imageForCanvas, - x * store.baseCellSize, - y * store.baseCellSize, - store.baseCellSize, - store.baseCellSize) - } else { - ctxMain.clearRect(x * store.baseCellSize * store.scale.current + store.offset.x, - y * store.baseCellSize * store.scale.current + store.offset.y, - store.scale.current * store.baseCellSize, - store.scale.current * store.baseCellSize) - - ctxTemp.clearRect(x * store.baseCellSize, - y * store.baseCellSize, - store.baseCellSize, - store.baseCellSize) - } + }; + + this._checkIfInSelection = (int) => { + if ( + store.interface.selection.start === null || + store.interface.selection.start === null + ) { + return true; } - - this._bucket = (x, y, id) => { - if (x < 0 || y < 0) { return } - if (x >= store.imageWidth || y >= store.imageHeight) { return } - const startPos = this._getIntFromPos(x, y) - if (!thisRoot._checkIfInSelection(startPos)) { return } - - const startId = store.imageConvertedHex[startPos] - const tempArr = [startPos] - const history = { - current: {}, - before: {} - } - - for (let i = 0; i < tempArr.length; i++) { - let offsets = [ - {x: 0, y: 0}, - {x: 0, y: store.imageWidth}, - {x: 0, y: -store.imageWidth} - ] - if (tempArr[i] % store.imageWidth !== 0) { - offsets.push({x: -1, y: 0}) - } - if ((tempArr[i] + 1) % store.imageWidth !== 0) { - offsets.push({x: 1, y: 0}) - } - - offsets.forEach((item) => { - let posOffset = tempArr[i] + item.x + item.y - if (store.imageConvertedHex[posOffset] === startId && history.current[posOffset] === undefined && thisRoot._checkIfInSelection(posOffset)) { - history.current[posOffset] = id - history.before[posOffset] = store.imageConvertedHex[posOffset] - store.imageConvertedHex[posOffset] = id - const pos = thisRoot._getPosFromInt(posOffset) - thisRoot._fakePaint(pos.x, pos.y, id) - tempArr.push(posOffset) - } - }) - } - thisRoot._addToHistory('bucket', history) + let tempStart, tempEnd; + if (store.interface.selection.start < store.interface.selection.end) { + tempStart = store.interface.selection.start; + tempEnd = store.interface.selection.end; + } else { + tempStart = store.interface.selection.end; + tempEnd = store.interface.selection.start; } - - this._addToHistory = (type, data) => { - for (let i = store.history.currentPos; i < store.history.lastMaxPos; i++) { - store.history.log.pop() - } - - if (store.history.currentPos === -1) { - store.history.offset = 0 - } - - if (store.history.log.length === store.history.maxStates) { - store.history.log.shift() - store.history.offset++ - } - - store.history.currentPos++ - store.history.lastMaxPos = store.history.currentPos - store.history.log.push({ - type: type, - data: data - }) - - const event = store.events.history - event.details = { - pos: store.history.currentPos, - type: type - } - $root.dispatchEvent(event) + if (int < tempStart || int > tempEnd) { + return false; } - - this._undoBack = (pos) => { - pos += -store.history.offset - const tempSum = {} - for (let i = store.history.currentPos - store.history.offset; i > pos; i--) { - const logStep = store.history.log[i] - for (let key in logStep.data.before) { - tempSum[key] = logStep.data.before[key] - } - } - for (let key in tempSum) { - let xBlock = key % store.imageWidth - let yBlock = Math.floor(key / store.imageWidth) - this._fakePaint(xBlock, yBlock, tempSum[key]) - store.imageConvertedHex[key] = tempSum[key] - } + let startModulo = tempStart % store.imageWidth; + let endModulo = tempEnd % store.imageWidth; + let intModulo = int % store.imageWidth; + if (intModulo < startModulo || intModulo > endModulo) { + return false; } - - this._undoForward = (pos) => { - pos += -store.history.offset - const tempSum = {} - for (let i = store.history.currentPos - store.history.offset; i <= pos; i++) { - if (i === -1) { continue } - const logStep = store.history.log[i] - for (let key in logStep.data.current) { - tempSum[key] = logStep.data.current[key] - } - } - for (let key in tempSum) { - let xBlock = key % store.imageWidth - let yBlock = Math.floor(key / store.imageWidth) - this._fakePaint(xBlock, yBlock, tempSum[key]) - store.imageConvertedHex[key] = tempSum[key] - } + return true; + }; + + this._createMainBlobImage = (str) => { + for (let i = 0; i < store.imageConvertedHex.length; i++) { + let x = i % store.imageWidth; + let y = Math.floor(i / store.imageWidth); + if (store.imageConvertedHex[i] > 0) { + let imageForCanvas = store.getBlockById( + store.imageConvertedHex[i] + ).image; + ctxTemp.drawImage( + imageForCanvas, + x * store.baseCellSize, + y * store.baseCellSize, + store.baseCellSize, + store.baseCellSize + ); + ctxInit.drawImage( + imageForCanvas, + x * store.baseCellSize, + y * store.baseCellSize, + store.baseCellSize, + store.baseCellSize + ); + } } + }; - this._undoTo = (pos) => { - pos = parseInt(pos) - if (pos === store.history.currentPos) { return } - - if (pos === -1) { - this._undoBack(store.history.offset) - store.history.currentPos = pos - this.render() - return - } else if (store.history.currentPos === -1) { - store.history.currentPos = store.history.offset - this.render() - } - - if (store.history.currentPos - pos > 0) { - this._undoBack(pos) - } else { - this._undoForward(pos) - } - - store.history.currentPos = pos + this._fakePaint = (x, y, id) => { + if (x < 0 || x >= store.imageWidth) { + return; } - - this._convertToGroups = () => { - const catchedBlocks = {} - const groups = [] - let hex - if (store.history.currentPos === -1) { - hex = store.imageConvertedHexBackup - } else { - hex = store.imageConvertedHex - } - - for (let i = 0; i < hex.length; i++) { - let targetPos = Math.floor((hex.length - i - 1) / store.imageWidth) * store.imageWidth + (i % store.imageWidth) - - if (catchedBlocks[targetPos]) { continue } - catchedBlocks[targetPos] = true - - let targetBlock = hex[targetPos] - if (targetBlock === 0) { - catchedBlocks[targetPos] = true - continue - } - - let targetWidth = 1 - let targetHeight = 1 - - while (true) { - let tempPos = targetPos + targetWidth - if (hex[tempPos] === targetBlock && !catchedBlocks[tempPos]) { - catchedBlocks[tempPos] = true - targetWidth++ - } else { - break - } - if ((targetPos + targetWidth) % store.imageWidth === 0) { break } - } - - while (true) { - let tempPos = targetPos - targetHeight * store.imageWidth - if (hex[tempPos] === targetBlock && !catchedBlocks[tempPos]) { - catchedBlocks[tempPos] = true - targetHeight++ - } else { - break - } - } - - if (targetWidth === 1 && targetHeight === 1) { - groups.push([targetPos]) - continue - } - - let tempHeight = targetHeight - let startBlockGroup = targetPos - for (let w = 0; w < targetWidth; w++) { - for (let h = 0; h < tempHeight; h++) { - let shiftPos = targetPos - h * store.imageWidth + w + 1 - if (hex[shiftPos] === targetBlock) { - catchedBlocks[shiftPos] = true - if (w + 1 === targetWidth && h + 1 === tempHeight) { - if (startBlockGroup === targetPos + targetWidth - 1 + (tempHeight - 1) * store.imageWidth) { - groups.push([startBlockGroup]) - } else { - groups.push([startBlockGroup, targetPos + targetWidth - 1 - (tempHeight - 1) * store.imageWidth]) - } - } - } else { - if (startBlockGroup === targetPos + w + (tempHeight - 1) * store.imageWidth) { - groups.push([startBlockGroup]) - } else { - groups.push([startBlockGroup, targetPos + w - (tempHeight - 1) * store.imageWidth]) - } - startBlockGroup = targetPos + w + 1 - tempHeight = h - break - } - } - } - } - - store.groups = groups - return + if (y < 0 || y >= store.imageHeight) { + return; } - this._convertPosToRelCoords = (pos, facing, offset) => { - let output, offsetX = 0, offsetY = 0, offsetZ = 0 - const x = pos.x + 1, - y = store.imageHeight - pos.y - 1 - if (offset) { - offsetX = offset.x || 0, - offsetY = offset.y || 0, - offsetZ = offset.z || 0 - } - - switch (facing) { - case 'east': - output = `~${x + offsetX} ~${y + offsetY} ~${offsetZ}` - break - case 'south': - output = `~${offsetX} ~${y + offsetY} ~${x + offsetZ}` - break - case 'west': - output = `~${offsetX - x} ~${y + offsetY} ~${offsetZ}` - break - case 'north': - output = `~${offsetX} ~${y + offsetY} ~${offsetZ - x}` - break - } - return output.replace(new RegExp('~0', 'g'), '~') + if (id !== 0) { + let imageForCanvas = store.getBlockById(id).image; + + ctxMain.clearRect( + x * store.baseCellSize * store.scale.current + store.offset.x, + y * store.baseCellSize * store.scale.current + store.offset.y, + store.scale.current * store.baseCellSize, + store.scale.current * store.baseCellSize + ); + + ctxMain.drawImage( + imageForCanvas, + x * store.baseCellSize * store.scale.current + store.offset.x, + y * store.baseCellSize * store.scale.current + store.offset.y, + store.scale.current * store.baseCellSize, + store.scale.current * store.baseCellSize + ); + + ctxTemp.clearRect( + x * store.baseCellSize, + y * store.baseCellSize, + store.baseCellSize, + store.baseCellSize + ); + + ctxTemp.drawImage( + imageForCanvas, + x * store.baseCellSize, + y * store.baseCellSize, + store.baseCellSize, + store.baseCellSize + ); + } else { + ctxMain.clearRect( + x * store.baseCellSize * store.scale.current + store.offset.x, + y * store.baseCellSize * store.scale.current + store.offset.y, + store.scale.current * store.baseCellSize, + store.scale.current * store.baseCellSize + ); + + ctxTemp.clearRect( + x * store.baseCellSize, + y * store.baseCellSize, + store.baseCellSize, + store.baseCellSize + ); } + }; - this._convertGroupToCommand = (group, facing, offset) => { - let block = store.getBlockById(store.imageConvertedHex[group[0]]) - let gameId - if (block === null) { - block = { - game_id: 'minecraft:air' - } - } - if (store.settings.minecraftVersion === 13) { - gameId = block['game_id_13'] - } else { - gameId = block.game_id - } - if (block.axis) { - if (store.settings.minecraftVersion < 13 && block.version < 13) { - const dataAxis = parseInt(gameId.match(/\d$/)[0]) - if (facing === 'west' || facing === 'east') { - gameId = gameId.replace(/\d$/, dataAxis + 8) - } else if (facing === 'north' || facing === 'south') { - gameId = gameId.replace(/\d$/, dataAxis + 4) - } - } else { - if (facing === 'west' || facing === 'east') { - gameId = gameId + '[axis=z]' - } else if (facing === 'north' || facing === 'south') { - gameId = gameId + '[axis=x]' - } - } - } - const output = [] - group.forEach((item) => { - const pos = this._getPosFromInt(item) - output.push(this._convertPosToRelCoords(pos, facing, offset)) - }) - if (output.length === 1) { - return `setblock ${output[0]} ${gameId}` - } else { - return `fill ${output[0]} ${output[1]} ${gameId}` - } + this._bucket = (x, y, id) => { + if (x < 0 || y < 0) { + return; + } + if (x >= store.imageWidth || y >= store.imageHeight) { + return; + } + const startPos = this._getIntFromPos(x, y); + if (!thisRoot._checkIfInSelection(startPos)) { + return; } - this._setPosOnOpen = () => { - const canvasWidth = store.canvasWidth + store.interface.rulerSize - const canvasHeight = store.canvasHeight - store.interface.rulerSize - for (let i = store.scale.options.length - 1; i >= 0; i--) { - if (store.imageWidth * store.scale.options[i] * store.baseCellSize < canvasWidth && store.imageHeight * store.scale.options[i] * store.baseCellSize < canvasHeight) { - store.scale.current = store.scale.options[i] - break - } - } - store.offset.x = canvasWidth / 2 - store.imageWidth / 2 * store.scale.current * store.baseCellSize - store.offset.y = canvasHeight / 2 - store.imageHeight / 2 * store.scale.current * store.baseCellSize - } - - this._setEventListeners = function() { - let tempFakePaintedPoints = {} - - function bresenhamLine(x0, y0, x1, y1, skipEveryN, callback) { - var dx = Math.abs(x1-x0); - var dy = Math.abs(y1-y0); - var sx = (x0 < x1) ? 1 : -1; - var sy = (y0 < y1) ? 1 : -1; - var err = dx-dy; - let i = 0 - - while(true) { - if ((x0==x1) && (y0==y1)) { - callback(x0, y0) - break - } - var e2 = 2*err; - if (e2 >-dy){ err -= dy; x0 += sx; } - if (e2 < dx){ err += dx; y0 += sy; } - if (i % skipEveryN === 0) { - callback(x0, y0) - } - i++ - } - } - - function draw(x, y) { - let size = store.interface.brushSize % 2 === 0 ? store.interface.brushSize + 1 : store.interface.brushSize - let radius = Math.floor(size / 2) - let totalBlocks = Math.pow(size, 2) - let startPointX = x - radius - let startPointY = y - radius - - for (let i = 0; i < totalBlocks; i++) { - let xBlock = startPointX + (i % size) - let yBlock = startPointY + Math.floor(i / size) - if (xBlock < 0 || xBlock >= store.imageWidth || yBlock < 0 || yBlock >= store.imageHeight) { continue } - - if (store.interface.selection.start !== null) { - if (!thisRoot._checkIfInSelection(thisRoot._getIntFromPos(xBlock,yBlock))) { continue } - } - - if (thisRoot.getTool() === 'brush') { - const row = Math.ceil((i + 1) / size) - const col = i % size + 1 - const offsetX = Math.abs(col - radius - 1) - const offsetY = Math.abs(row - radius - 1) - if (Math.sqrt(Math.pow(offsetX, 2) + Math.pow(offsetY, 2)) > radius + 0.5) { - continue - } - } - - thisRoot._fakePaint(xBlock, yBlock, thisRoot.getEyedrop()) - tempFakePaintedPoints[yBlock * store.imageWidth + xBlock] = thisRoot.getEyedrop() - } - } - - canvasOverlay.addEventListener('mousemove', function(e) { - if (!thisRoot._checkIfReady()) { return } - store.controls.mouse.localX = Math.round(e.clientX - store.boundingRect.x - store.controls.mouse.startX) - store.controls.mouse.localY = Math.round(e.clientY - store.boundingRect.y - store.controls.mouse.startY) - let xBlock = (Math.floor((store.controls.mouse.localX - store.offset.x) / (store.baseCellSize * store.scale.current))) - let yBlock = (Math.floor((store.controls.mouse.localY - store.offset.y) / (store.baseCellSize * store.scale.current))) - - if (store.controls.mouse.grabbed) { - store.offset.translate(store.controls.mouse.localX + store.controls.mouse.oldOffsetX, store.controls.mouse.localY + store.controls.mouse.oldOffsetY) - thisRoot._renderMainCanvas() - thisRoot._renderOverlayCanvas() - } - if (store.controls.mouse.leftClick && (thisRoot.getTool() === 'pencil' || thisRoot.getTool() === 'brush')) { - //start the bresenham algorithm with the callback - const skipEveryN = Math.ceil(store.interface.brushSize / 2) - bresenhamLine(store.controls.mouse.lastMouseX, store.controls.mouse.lastMouseY, xBlock, yBlock, skipEveryN, draw) - - store.controls.mouse.lastMouseX = xBlock - store.controls.mouse.lastMouseY = yBlock - } - - if (store.controls.mouse.leftClick && thisRoot.getTool() === 'selection') { - let tempX = xBlock - let tempY = yBlock - - if (xBlock < 0) { tempX = 0 } - if (yBlock < 0) { tempY = 0 } - if (xBlock >= store.imageWidth ) { tempX = store.imageWidth - 1 } - if (yBlock >= store.imageHeight ) { tempY = store.imageHeight - 1 } - - store.interface.selection.end = thisRoot._getIntFromPos(tempX, tempY) - } - thisRoot._renderOverlayCanvas() - }) - - canvasOverlay.addEventListener('mousedown', function(e) { - if (!thisRoot._checkIfReady()) { return } - if (e.which === 1) { - const tool = thisRoot.getTool() - let xBlock = (Math.floor((store.controls.mouse.localX - store.offset.x) / (store.baseCellSize * store.scale.current))) - let yBlock = (Math.floor((store.controls.mouse.localY - store.offset.y) / (store.baseCellSize * store.scale.current))) - store.controls.mouse.leftClick = true - - if (tool === 'brush' || tool === 'pencil' || tool === 'bucket') { - if (store.history.currentPos === -1) { - ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height) - ctxTemp.drawImage(canvasInit, 0, 0) - store.imageConvertedHex.set(store.imageConvertedHexBackup, 0) - } - } - - if (tool === 'brush' || tool === 'pencil') { - if (e.shiftKey) { - bresenhamLine(store.controls.mouse.lastMouseX, store.controls.mouse.lastMouseY, xBlock, yBlock, 1, draw) - } else { - draw(xBlock, yBlock) - } - } - - store.controls.mouse.lastMouseX = xBlock - store.controls.mouse.lastMouseY = yBlock - - if (tool === 'eyedropper') { - let id = thisRoot._getBlockIdByPosition(xBlock, yBlock) - thisRoot.setEyedrop(id) - } - - if (tool === 'selection') { - let tempX = xBlock - let tempY = yBlock - - if (xBlock < 0) { tempX = 0 } - if (yBlock < 0) { tempY = 0 } - if (xBlock >= store.imageWidth ) { tempX = store.imageWidth - 1 } - if (yBlock >= store.imageHeight ) { tempY = store.imageHeight - 1 } - store.interface.selection.start = thisRoot._getIntFromPos(tempX, tempY) - store.interface.selection.end = thisRoot._getIntFromPos(tempX, tempY) - } - - if (tool === 'zoom') { - if (store.scale.scaleUp()) { - let x = Math.floor(store.controls.mouse.localX - store.offset.x) - let y = Math.floor(store.controls.mouse.localY - store.offset.y) - store.offset.translate(store.offset.x - x, store.offset.y - y) - thisRoot.render() - } - } - - if (tool === 'grab') { - store.controls.mouse.grabbed = true - store.controls.mouse.startX = e.clientX - store.boundingRect.x - store.controls.mouse.startY = e.clientY - store.boundingRect.y - store.controls.mouse.oldOffsetX = store.offset.x - store.controls.mouse.oldOffsetY = store.offset.y - thisRoot._setCursor('grabbing') - } - - if (tool === 'bucket') { - thisRoot._bucket(xBlock, yBlock, thisRoot.getEyedrop()) - } - } - if (e.which === 2) { - e.preventDefault() - store.controls.mouse.grabbed = true - store.controls.mouse.startX = e.clientX - store.boundingRect.x - store.controls.mouse.startY = e.clientY - store.boundingRect.y - store.controls.mouse.oldOffsetX = store.offset.x - store.controls.mouse.oldOffsetY = store.offset.y - thisRoot._setCursor('grabbing') - } - if (e.which === 3) { - if (thisRoot.getTool() === 'zoom') { - e.preventDefault() - if (store.scale.scaleDown()) { - let x = Math.floor(store.controls.mouse.localX - store.offset.x) - let y = Math.floor(store.controls.mouse.localY - store.offset.y) - store.offset.translate(store.offset.x + x / 2, store.offset.y + y / 2) - thisRoot.render() - } - } - } - }) - - document.addEventListener('mouseup', function(e) { - if (!thisRoot._checkIfReady()) { return } - store.controls.mouse.grabbed = false - store.controls.mouse.leftClick = false - store.controls.mouse.startX = 0 - store.controls.mouse.startY = 0 - - if (!thisRoot._isEmptyObject(tempFakePaintedPoints)) { - const history = { - current: {}, - before: {} - } - for (let i in tempFakePaintedPoints) { - history.current[i] = tempFakePaintedPoints[i] - history.before[i] = store.imageConvertedHex[i] - store.imageConvertedHex[i] = tempFakePaintedPoints[i] - } - thisRoot._addToHistory(thisRoot.getTool(), history) - tempFakePaintedPoints = {} - } - - if (store.interface.selection.start === store.interface.selection.end) { - store.interface.selection.start = null - store.interface.selection.end = null - thisRoot._renderOverlayCanvas() - } - - thisRoot._setCursor(store.interface.cursor) - }) - - canvasOverlay.addEventListener("wheel", (e) => { - if (!thisRoot._checkIfReady()) { return } - if (store.controls.mouse.leftClick) { return } - if (store.controls.mouse.grabbed) { return } - e.preventDefault() - if (e.deltaY < 0) { - if (store.scale.scaleUp()) { - let x = Math.floor(store.controls.mouse.localX - store.offset.x) - let y = Math.floor(store.controls.mouse.localY - store.offset.y) - store.offset.translate(store.offset.x - x, store.offset.y - y) - } - } - - if (e.deltaY > 0) { - if (store.scale.scaleDown()) { - let x = Math.floor(store.controls.mouse.localX - store.offset.x) - let y = Math.floor(store.controls.mouse.localY - store.offset.y) - store.offset.translate(store.offset.x + x / 2, store.offset.y + y / 2) - } - } - thisRoot._renderMainCanvas() - thisRoot._renderOverlayCanvas() - }) - - canvasOverlay.addEventListener('contextmenu', (e) => { - e.preventDefault() - }) - - window.addEventListener('resize', (e) => { - thisRoot.setBoundingRect() - }) - - window.addEventListener('scroll', (e) => { - thisRoot.setBoundingRect() - }) - } - - this._renderOverlayCanvas = () => { - - function renderRulers() { - let rulerFillStyle = 'white', - fontStyle = '12px Helvetica' - - let drawRulerEveryNBlocks - switch (store.scale.current) { - case 4: - drawRulerEveryNBlocks = 10 - break - case 2: - drawRulerEveryNBlocks = 10 - break - case 1: - drawRulerEveryNBlocks = 10 - break - case 0.5: - drawRulerEveryNBlocks = 10 - break - case 0.25: - drawRulerEveryNBlocks = 50 - break - case 0.125: - drawRulerEveryNBlocks = 50 - break - case 0.0625: - drawRulerEveryNBlocks = 100 - break - } - - if (store.imageHeight >= 1000) { - store.interface.rulerSize = 36 - } - - ctxOverlay.beginPath() - ctxOverlay.globalAlpha = 1 - ctxOverlay.fillStyle = rulerFillStyle - ctxOverlay.rect(0, store.canvasHeight - store.interface.rulerSize, store.canvasWidth, store.interface.rulerSize) - ctxOverlay.fill() - ctxOverlay.rect(0, 0, store.interface.rulerSize, store.canvasHeight) - ctxOverlay.fill() - - ctxOverlay.font = fontStyle; - ctxOverlay.fillStyle = 'black' - ctxOverlay.strokeStyle = 'black' - ctxOverlay.lineWidth = 1 - // gets lastleft/lastright visible n/coordsX and draws everything between them - - for (let i = Math.ceil(-store.offset.x / store.scale.current / 16 / drawRulerEveryNBlocks) * drawRulerEveryNBlocks; - i <= Math.floor((-store.offset.x + store.canvasWidth) / store.scale.current / 16 / drawRulerEveryNBlocks) * drawRulerEveryNBlocks; - i += drawRulerEveryNBlocks) { - ctxOverlay.beginPath() - ctxOverlay.moveTo(i * store.scale.current * 16 + store.offset.x + 0.5, store.canvasHeight) - ctxOverlay.lineTo(i * store.scale.current * 16 + store.offset.x + 0.5, store.canvasHeight - store.interface.rulerSize) - ctxOverlay.stroke() - ctxOverlay.fillText(i, i * store.scale.current * 16 + store.offset.x + 2, store.boundingRect.height - 10) - } - - for (let i = Math.floor((store.offset.y / 16 / store.scale.current + store.imageHeight) / drawRulerEveryNBlocks) * drawRulerEveryNBlocks; - i >= Math.floor(((store.offset.y - store.canvasHeight) / 16 / store.scale.current + store.imageHeight) / drawRulerEveryNBlocks) * drawRulerEveryNBlocks; - i -= drawRulerEveryNBlocks) { - ctxOverlay.beginPath() - ctxOverlay.moveTo(0, (store.imageHeight - i) * 16 * store.scale.current + store.offset.y + 0.5) // + 0.5 for just the right thickness - ctxOverlay.lineTo(store.interface.rulerSize, (store.imageHeight - i) * 16 * store.scale.current + store.offset.y + 0.5) - ctxOverlay.stroke() - ctxOverlay.fillText(i, 1, (store.imageHeight - i) * 16 * store.scale.current + store.offset.y - 3) - } - - ctxOverlay.rect(0, store.canvasHeight - store.interface.rulerSize, store.interface.rulerSize, store.interface.rulerSize) - ctxOverlay.fill() - } - - function renderGrid() { - let lineWidthBig = 2, - lineWidthSmallOpacity = 0, - strokeStyle = store.settings.gridColor - - let mainGridLineEveryN - switch (store.scale.current) { - case 4: - lineWidthBig = 3 - lineWidthSmallOpacity = 1 - mainGridLineEveryN = 10 - break - case 2: - lineWidthBig = 3 - lineWidthSmallOpacity = 0.75 - mainGridLineEveryN = 10 - break - case 1: - lineWidthSmallOpacity = 0.25 - mainGridLineEveryN = 10 - break - case 0.5: - mainGridLineEveryN = 10 - break - case 0.25: - mainGridLineEveryN = 50 - break - case 0.125: - mainGridLineEveryN = 50 - break - case 0.0625: - mainGridLineEveryN = 50 - break - } + const startId = store.imageConvertedHex[startPos]; + const tempArr = [startPos]; + const history = { + current: {}, + before: {}, + }; + + for (let i = 0; i < tempArr.length; i++) { + let offsets = [ + { x: 0, y: 0 }, + { x: 0, y: store.imageWidth }, + { x: 0, y: -store.imageWidth }, + ]; + if (tempArr[i] % store.imageWidth !== 0) { + offsets.push({ x: -1, y: 0 }); + } + if ((tempArr[i] + 1) % store.imageWidth !== 0) { + offsets.push({ x: 1, y: 0 }); + } + + offsets.forEach((item) => { + let posOffset = tempArr[i] + item.x + item.y; + if ( + store.imageConvertedHex[posOffset] === startId && + history.current[posOffset] === undefined && + thisRoot._checkIfInSelection(posOffset) + ) { + history.current[posOffset] = id; + history.before[posOffset] = store.imageConvertedHex[posOffset]; + store.imageConvertedHex[posOffset] = id; + const pos = thisRoot._getPosFromInt(posOffset); + thisRoot._fakePaint(pos.x, pos.y, id); + tempArr.push(posOffset); + } + }); + } + thisRoot._addToHistory("bucket", history); + }; - ctxOverlay.lineWidth = lineWidthBig - ctxOverlay.strokeStyle = strokeStyle + this._addToHistory = (type, data) => { + for (let i = store.history.currentPos; i < store.history.lastMaxPos; i++) { + store.history.log.pop(); + } - let topOfGridVertical = -store.offset.y >= 0 ? 0 : store.offset.y - let bottomOfGridVertical = store.offset.y + store.imageHeight * 16 * store.scale.current - let topOfGridHorizontal = store.offset.x < 0 ? 0 : store.offset.x - let bottomOfGridHorizontal = store.offset.x + store.imageWidth * 16 * store.scale.current + if (store.history.currentPos === -1) { + store.history.offset = 0; + } - if (bottomOfGridVertical > store.canvasHeight) { - bottomOfGridVertical = store.canvasHeight - } - if (bottomOfGridHorizontal > store.canvasWidth) { - bottomOfGridHorizontal = store.canvasWidth - } + if (store.history.log.length === store.history.maxStates) { + store.history.log.shift(); + store.history.offset++; + } - let startOfRenderGridHorizontal = Math.ceil((store.offset.y - store.canvasHeight) / 16 / store.scale.current + store.imageHeight) - let endOfRenderGridHorizontal = Math.floor(store.offset.y / 16 / store.scale.current + store.imageHeight) + store.history.currentPos++; + store.history.lastMaxPos = store.history.currentPos; + store.history.log.push({ + type: type, + data: data, + }); + + const event = store.events.history; + event.details = { + pos: store.history.currentPos, + type: type, + }; + $root.dispatchEvent(event); + }; + + this._undoBack = (pos) => { + pos += -store.history.offset; + const tempSum = {}; + for ( + let i = store.history.currentPos - store.history.offset; + i > pos; + i-- + ) { + const logStep = store.history.log[i]; + for (let key in logStep.data.before) { + tempSum[key] = logStep.data.before[key]; + } + } + for (let key in tempSum) { + let xBlock = key % store.imageWidth; + let yBlock = Math.floor(key / store.imageWidth); + this._fakePaint(xBlock, yBlock, tempSum[key]); + store.imageConvertedHex[key] = tempSum[key]; + } + }; + + this._undoForward = (pos) => { + pos += -store.history.offset; + const tempSum = {}; + for ( + let i = store.history.currentPos - store.history.offset; + i <= pos; + i++ + ) { + if (i === -1) { + continue; + } + const logStep = store.history.log[i]; + for (let key in logStep.data.current) { + tempSum[key] = logStep.data.current[key]; + } + } + for (let key in tempSum) { + let xBlock = key % store.imageWidth; + let yBlock = Math.floor(key / store.imageWidth); + this._fakePaint(xBlock, yBlock, tempSum[key]); + store.imageConvertedHex[key] = tempSum[key]; + } + }; - let startOfRenderGridVertical = Math.ceil(-store.offset.x / 16 / store.scale.current) - let endOfRenderGridVertical = Math.floor((-store.offset.x + store.canvasWidth) / store.scale.current / 16) + this._undoTo = (pos) => { + pos = parseInt(pos); + if (pos === store.history.currentPos) { + return; + } - if (startOfRenderGridHorizontal <= 0) { - startOfRenderGridHorizontal = 0 - } - if (endOfRenderGridHorizontal >= store.imageHeight) { - endOfRenderGridHorizontal = store.imageHeight - } + if (pos === -1) { + this._undoBack(store.history.offset); + store.history.currentPos = pos; + this.render(); + return; + } else if (store.history.currentPos === -1) { + store.history.currentPos = store.history.offset; + this.render(); + } - if (startOfRenderGridVertical <= 0) { - startOfRenderGridVertical = 0 - } - if (endOfRenderGridVertical >= store.imageWidth) { - endOfRenderGridVertical = store.imageWidth - } + if (store.history.currentPos - pos > 0) { + this._undoBack(pos); + } else { + this._undoForward(pos); + } - for (let i = startOfRenderGridHorizontal + 1; i <= endOfRenderGridHorizontal; i += 1) { - ctxOverlay.beginPath() - ctxOverlay.globalAlpha = 1 - if (i % mainGridLineEveryN === 0 && i !== store.imageHeight) { - ctxOverlay.lineWidth = lineWidthBig - ctxOverlay.moveTo(topOfGridHorizontal, (store.imageHeight - i) * store.scale.current * 16 + store.offset.y) - ctxOverlay.lineTo(bottomOfGridHorizontal, (store.imageHeight - i) * store.scale.current * 16 + store.offset.y) - } else if (lineWidthSmallOpacity > 0) { - ctxOverlay.globalAlpha = lineWidthSmallOpacity - ctxOverlay.lineWidth = 1 - ctxOverlay.moveTo(topOfGridHorizontal, (store.imageHeight - i) * store.scale.current * 16 + store.offset.y + 0.5) - ctxOverlay.lineTo(bottomOfGridHorizontal, (store.imageHeight - i) * store.scale.current * 16 + store.offset.y + 0.5) - } - ctxOverlay.stroke() - } + store.history.currentPos = pos; + }; + + this._convertToGroups = () => { + const catchedBlocks = {}; + const groups = []; + let hex; + if (store.history.currentPos === -1) { + hex = store.imageConvertedHexBackup; + } else { + hex = store.imageConvertedHex; + } - for (let i = startOfRenderGridVertical + 1; i <= endOfRenderGridVertical; i += 1) { - ctxOverlay.beginPath() - ctxOverlay.globalAlpha = 1 - if (i % mainGridLineEveryN === 0 && i !== store.imageWidth) { - ctxOverlay.lineWidth = lineWidthBig - ctxOverlay.moveTo(i * store.scale.current * 16 + store.offset.x, topOfGridVertical) - ctxOverlay.lineTo(i * store.scale.current * 16 + store.offset.x, bottomOfGridVertical) - } else if (lineWidthSmallOpacity > 0) { - ctxOverlay.globalAlpha = lineWidthSmallOpacity - ctxOverlay.lineWidth = 1 - ctxOverlay.moveTo(i * store.scale.current * 16 + store.offset.x, topOfGridVertical + 0.5) - ctxOverlay.lineTo(i * store.scale.current * 16 + store.offset.x, bottomOfGridVertical + 0.5) - } - ctxOverlay.stroke() - } + for (let i = 0; i < hex.length; i++) { + let targetPos = + Math.floor((hex.length - i - 1) / store.imageWidth) * store.imageWidth + + (i % store.imageWidth); + + if (catchedBlocks[targetPos]) { + continue; + } + catchedBlocks[targetPos] = true; + + let targetBlock = hex[targetPos]; + if (targetBlock === 0) { + catchedBlocks[targetPos] = true; + continue; + } + + let targetWidth = 1; + let targetHeight = 1; + + while (true) { + let tempPos = targetPos + targetWidth; + if (hex[tempPos] === targetBlock && !catchedBlocks[tempPos]) { + catchedBlocks[tempPos] = true; + targetWidth++; + } else { + break; } - - function renderBrush() { - let size = store.interface.brushSize % 2 === 0 ? store.interface.brushSize + 1 : store.interface.brushSize - let brushSize = size * store.baseCellSize * store.scale.current - ctxOverlay.beginPath() - - if (thisRoot.getTool() === 'pencil') { - let xBlock = (Math.floor((store.controls.mouse.localX - store.offset.x) / (store.baseCellSize * store.scale.current))) - let yBlock = (Math.floor((store.controls.mouse.localY - store.offset.y) / (store.baseCellSize * store.scale.current))) - ctxOverlay.rect((xBlock - Math.floor(store.interface.brushSize / 2)) * store.baseCellSize * store.scale.current + store.offset.x, - (yBlock - Math.floor(store.interface.brushSize / 2)) * store.baseCellSize * store.scale.current + store.offset.y, - brushSize, - brushSize) - } - - if (thisRoot.getTool() === 'brush') { - ctxOverlay.arc(store.controls.mouse.localX, - store.controls.mouse.localY, - brushSize / 2, - 0,2*Math.PI); - } - - ctxOverlay.globalAlpha = 1 - ctxOverlay.strokeStyle = "white" - ctxOverlay.lineWidth = 3 - ctxOverlay.stroke() - ctxOverlay.stroke() - ctxOverlay.strokeStyle = "black" - ctxOverlay.lineWidth = 1 - ctxOverlay.stroke() - ctxOverlay.stroke() + if ((targetPos + targetWidth) % store.imageWidth === 0) { + break; } + } - function renderSelection() { - if (store.interface.selection.start === null || store.interface.selection.end === null) { return } - if (store.interface.selection.start === store.interface.selection.end) { return } - - var startPos = thisRoot._getPosFromInt(store.interface.selection.start) - var endPos = thisRoot._getPosFromInt(store.interface.selection.end) - - const tempStart = { - x: startPos.x <= endPos.x ? startPos.x : endPos.x, - y: startPos.y <= endPos.y ? startPos.y : endPos.y - } - - const tempEnd = { - x: startPos.x > endPos.x ? startPos.x : endPos.x, - y: startPos.y > endPos.y ? startPos.y : endPos.y + while (true) { + let tempPos = targetPos - targetHeight * store.imageWidth; + if (hex[tempPos] === targetBlock && !catchedBlocks[tempPos]) { + catchedBlocks[tempPos] = true; + targetHeight++; + } else { + break; + } + } + + if (targetWidth === 1 && targetHeight === 1) { + groups.push([targetPos]); + continue; + } + + let tempHeight = targetHeight; + let startBlockGroup = targetPos; + for (let w = 0; w < targetWidth; w++) { + for (let h = 0; h < tempHeight; h++) { + let shiftPos = targetPos - h * store.imageWidth + w + 1; + if (hex[shiftPos] === targetBlock) { + catchedBlocks[shiftPos] = true; + if (w + 1 === targetWidth && h + 1 === tempHeight) { + if ( + startBlockGroup === + targetPos + + targetWidth - + 1 + + (tempHeight - 1) * store.imageWidth + ) { + groups.push([startBlockGroup]); + } else { + groups.push([ + startBlockGroup, + targetPos + + targetWidth - + 1 - + (tempHeight - 1) * store.imageWidth, + ]); + } } - - ctxOverlay.beginPath(); - ctxOverlay.rect(tempStart.x * store.baseCellSize * store.scale.current + store.offset.x, - tempStart.y * store.baseCellSize * store.scale.current + store.offset.y, - (tempEnd.x - tempStart.x + 1) * store.baseCellSize * store.scale.current, - (tempEnd.y - tempStart.y + 1) * store.baseCellSize * store.scale.current) - if (store.scale.current > 0.125) { - ctxOverlay.lineWidth = 3 + } else { + if ( + startBlockGroup === + targetPos + w + (tempHeight - 1) * store.imageWidth + ) { + groups.push([startBlockGroup]); } else { - ctxOverlay.lineWidth = 2 + groups.push([ + startBlockGroup, + targetPos + w - (tempHeight - 1) * store.imageWidth, + ]); } - ctxOverlay.strokeStyle = "white" - ctxOverlay.stroke() - ctxOverlay.stroke() - ctxOverlay.setLineDash([7, 7]) - ctxOverlay.strokeStyle = "black" - ctxOverlay.stroke() - ctxOverlay.stroke() - } - - const renderList = { - 'RENDER_BRUSH': renderBrush, - 'RENDER_RULERS': renderRulers, - 'RENDER_SELECTION': renderSelection, - 'RENDER_GRID': renderGrid - } - - function renderHelper(list) { - ctxOverlay.globalAlpha = 1 - ctxOverlay.save() - ctxOverlay.clearRect(0, 0, store.canvasWidth, store.canvasHeight) - list.forEach((item) => { - if (renderList[item]) { - renderList[item]() - ctxOverlay.restore() - } - }) - } - - const renderArray = ['RENDER_SELECTION'] - - if (store.settings.showGrid) { - renderArray.push('RENDER_GRID') - } - - if ((this.getTool() === 'pencil' || this.getTool() === 'brush') && !store.controls.mouse.grabbed) { - renderArray.push('RENDER_BRUSH') - } - - if (store.settings.showRulers) { - renderArray.push('RENDER_RULERS') + startBlockGroup = targetPos + w + 1; + tempHeight = h; + break; + } } + } + } - renderHelper(renderArray) - } - - this._renderMainCanvas = () => { - - function renderMain() { - function renderByLoop() { - const visibleCorners = thisRoot._getCornersOfVisible() - const topLeftX = visibleCorners.topLeftX - const topLeftY = visibleCorners.topLeftY - const bottomRightX = visibleCorners.bottomRightX - const bottomRightY = visibleCorners.bottomRightY - let hexBlock, source - if (store.history.currentPos === -1) { - source = store.imageConvertedHexBackup - } else { - source = store.imageConvertedHex - } - - for (let y = topLeftY; y <= bottomRightY; y++) { - for (let x = topLeftX; x <= bottomRightX; x++) { - if (x < store.imageWidth && y < store.imageHeight) { - hexBlock = source[y * store.imageWidth + x] - if (hexBlock > 0) { - let imageForCanvas = store.getBlockById(hexBlock).image - ctxMain.drawImage(imageForCanvas, - x * store.baseCellSize * store.scale.current + store.offset.x, - y * store.baseCellSize * store.scale.current + store.offset.y, - store.scale.current * store.baseCellSize, - store.scale.current * store.baseCellSize) - } - } - } - } - } - - function renderByCache() { - let visible = thisRoot._getCornersOfVisible() - let offsetX = store.offset.x > 0 ? store.offset.x : store.offset.x % (16 * store.scale.current) - let offsetY = store.offset.y > 0 ? store.offset.y : store.offset.y % (16 * store.scale.current) - let source - if (store.history.currentPos === -1) { - source = canvasInit - } else { - source = canvasTemp - } - ctxMain.drawImage(source, - visible.topLeftX * 16, - visible.topLeftY * 16, - (visible.bottomRightX - visible.topLeftX) * 16, - (visible.bottomRightY - visible.topLeftY) * 16, - offsetX, - offsetY, - (visible.bottomRightX - visible.topLeftX) * 16 * store.scale.current, - (visible.bottomRightY - visible.topLeftY) * 16 * store.scale.current) - } + store.groups = groups; + return; + }; + + this._convertPosToRelCoords = (pos, facing, offset) => { + let output, + offsetX = 0, + offsetY = 0, + offsetZ = 0; + const x = pos.x + 1, + y = store.imageHeight - pos.y - 1; + if (offset) { + (offsetX = offset.x || 0), + (offsetY = offset.y || 0), + (offsetZ = offset.z || 0); + } - if (store.scale.current > store.scale.cacheFrom) { - renderByLoop() - } else { - renderByCache() - } - } + switch (facing) { + case "east": + output = `~${x + offsetX} ~${y + offsetY} ~${offsetZ}`; + break; + case "south": + output = `~${offsetX} ~${y + offsetY} ~${x + offsetZ}`; + break; + case "west": + output = `~${offsetX - x} ~${y + offsetY} ~${offsetZ}`; + break; + case "north": + output = `~${offsetX} ~${y + offsetY} ~${offsetZ - x}`; + break; + } + return output.replace(new RegExp("~0", "g"), "~"); + }; + + this._convertGroupToCommand = (group, facing, offset) => { + let block = store.getBlockById(store.imageConvertedHex[group[0]]); + let gameId; + if (block === null) { + block = { + game_id: "minecraft:air", + }; + } + if (store.settings.minecraftVersion >= 13) { + gameId = block["game_id_13"]; + } else { + gameId = block.game_id; + } + if (block.axis) { + if (store.settings.minecraftVersion < 13 && block.version < 13) { + const dataAxis = parseInt(gameId.match(/\d$/)[0]); + if (facing === "west" || facing === "east") { + gameId = gameId.replace(/\d$/, dataAxis + 8); + } else if (facing === "north" || facing === "south") { + gameId = gameId.replace(/\d$/, dataAxis + 4); + } + } else { + if (facing === "west" || facing === "east") { + gameId = gameId + "[axis=z]"; + } else if (facing === "north" || facing === "south") { + gameId = gameId + "[axis=x]"; + } + } + } + const output = []; + group.forEach((item) => { + const pos = this._getPosFromInt(item); + output.push(this._convertPosToRelCoords(pos, facing, offset)); + }); + if (output.length === 1) { + return `setblock ${output[0]} ${gameId}`; + } else { + return `fill ${output[0]} ${output[1]} ${gameId}`; + } + }; + + this._setPosOnOpen = () => { + const canvasWidth = store.canvasWidth + store.interface.rulerSize; + const canvasHeight = store.canvasHeight - store.interface.rulerSize; + for (let i = store.scale.options.length - 1; i >= 0; i--) { + if ( + store.imageWidth * store.scale.options[i] * store.baseCellSize < + canvasWidth && + store.imageHeight * store.scale.options[i] * store.baseCellSize < + canvasHeight + ) { + store.scale.current = store.scale.options[i]; + break; + } + } + store.offset.x = + canvasWidth / 2 - + (store.imageWidth / 2) * store.scale.current * store.baseCellSize; + store.offset.y = + canvasHeight / 2 - + (store.imageHeight / 2) * store.scale.current * store.baseCellSize; + }; + + this._setEventListeners = function () { + let tempFakePaintedPoints = {}; + + function bresenhamLine(x0, y0, x1, y1, skipEveryN, callback) { + var dx = Math.abs(x1 - x0); + var dy = Math.abs(y1 - y0); + var sx = x0 < x1 ? 1 : -1; + var sy = y0 < y1 ? 1 : -1; + var err = dx - dy; + let i = 0; + + while (true) { + if (x0 == x1 && y0 == y1) { + callback(x0, y0); + break; + } + var e2 = 2 * err; + if (e2 > -dy) { + err -= dy; + x0 += sx; + } + if (e2 < dx) { + err += dx; + y0 += sy; + } + if (i % skipEveryN === 0) { + callback(x0, y0); + } + i++; + } + } - function renderOriginal() { - ctxMain.drawImage(store.originalImage.img, - store.originalImage.x, - store.originalImage.y, - store.originalImage.width, - store.originalImage.height, - store.offset.x, - store.offset.y, - store.imageWidth * store.baseCellSize * store.scale.current, - store.imageHeight * store.baseCellSize * store.scale.current) - } + function draw(x, y) { + let size = + store.interface.brushSize % 2 === 0 + ? store.interface.brushSize + 1 + : store.interface.brushSize; + let radius = Math.floor(size / 2); + let totalBlocks = Math.pow(size, 2); + let startPointX = x - radius; + let startPointY = y - radius; + + for (let i = 0; i < totalBlocks; i++) { + let xBlock = startPointX + (i % size); + let yBlock = startPointY + Math.floor(i / size); + if ( + xBlock < 0 || + xBlock >= store.imageWidth || + yBlock < 0 || + yBlock >= store.imageHeight + ) { + continue; + } + + if (store.interface.selection.start !== null) { + if ( + !thisRoot._checkIfInSelection( + thisRoot._getIntFromPos(xBlock, yBlock) + ) + ) { + continue; + } + } + + if (thisRoot.getTool() === "brush") { + const row = Math.ceil((i + 1) / size); + const col = (i % size) + 1; + const offsetX = Math.abs(col - radius - 1); + const offsetY = Math.abs(row - radius - 1); + if ( + Math.sqrt(Math.pow(offsetX, 2) + Math.pow(offsetY, 2)) > + radius + 0.5 + ) { + continue; + } + } + + thisRoot._fakePaint(xBlock, yBlock, thisRoot.getEyedrop()); + tempFakePaintedPoints[yBlock * store.imageWidth + xBlock] = + thisRoot.getEyedrop(); + } + } - function renderBackground() { - ctxMain.fillStyle = 'rgba(100, 100, 100, 0.45)' - ctxMain.fillRect(0, 0, store.canvasWidth, store.canvasHeight) - ctxMain.clearRect(store.offset.x, - store.offset.y, - store.imageWidth * store.baseCellSize * store.scale.current, - store.imageHeight * store.baseCellSize * store.scale.current) - } + canvasOverlay.addEventListener("mousemove", function (e) { + if (!thisRoot._checkIfReady()) { + return; + } + store.controls.mouse.localX = Math.round( + e.clientX - store.boundingRect.x - store.controls.mouse.startX + ); + store.controls.mouse.localY = Math.round( + e.clientY - store.boundingRect.y - store.controls.mouse.startY + ); + let xBlock = Math.floor( + (store.controls.mouse.localX - store.offset.x) / + (store.baseCellSize * store.scale.current) + ); + let yBlock = Math.floor( + (store.controls.mouse.localY - store.offset.y) / + (store.baseCellSize * store.scale.current) + ); + + if (store.controls.mouse.grabbed) { + store.offset.translate( + store.controls.mouse.localX + store.controls.mouse.oldOffsetX, + store.controls.mouse.localY + store.controls.mouse.oldOffsetY + ); + thisRoot._renderMainCanvas(); + thisRoot._renderOverlayCanvas(); + } + if ( + store.controls.mouse.leftClick && + (thisRoot.getTool() === "pencil" || thisRoot.getTool() === "brush") + ) { + //start the bresenham algorithm with the callback + const skipEveryN = Math.ceil(store.interface.brushSize / 2); + bresenhamLine( + store.controls.mouse.lastMouseX, + store.controls.mouse.lastMouseY, + xBlock, + yBlock, + skipEveryN, + draw + ); + + store.controls.mouse.lastMouseX = xBlock; + store.controls.mouse.lastMouseY = yBlock; + } + + if ( + store.controls.mouse.leftClick && + thisRoot.getTool() === "selection" + ) { + let tempX = xBlock; + let tempY = yBlock; + + if (xBlock < 0) { + tempX = 0; + } + if (yBlock < 0) { + tempY = 0; + } + if (xBlock >= store.imageWidth) { + tempX = store.imageWidth - 1; + } + if (yBlock >= store.imageHeight) { + tempY = store.imageHeight - 1; + } + + store.interface.selection.end = thisRoot._getIntFromPos(tempX, tempY); + } + thisRoot._renderOverlayCanvas(); + }); + + canvasOverlay.addEventListener("mousedown", function (e) { + if (!thisRoot._checkIfReady()) { + return; + } + if (e.which === 1) { + const tool = thisRoot.getTool(); + let xBlock = Math.floor( + (store.controls.mouse.localX - store.offset.x) / + (store.baseCellSize * store.scale.current) + ); + let yBlock = Math.floor( + (store.controls.mouse.localY - store.offset.y) / + (store.baseCellSize * store.scale.current) + ); + store.controls.mouse.leftClick = true; + + if (tool === "brush" || tool === "pencil" || tool === "bucket") { + if (store.history.currentPos === -1) { + ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height); + ctxTemp.drawImage(canvasInit, 0, 0); + store.imageConvertedHex.set(store.imageConvertedHexBackup, 0); + } + } + + if (tool === "brush" || tool === "pencil") { + if (e.shiftKey) { + bresenhamLine( + store.controls.mouse.lastMouseX, + store.controls.mouse.lastMouseY, + xBlock, + yBlock, + 1, + draw + ); + } else { + draw(xBlock, yBlock); + } + } + + store.controls.mouse.lastMouseX = xBlock; + store.controls.mouse.lastMouseY = yBlock; + + if (tool === "eyedropper") { + let id = thisRoot._getBlockIdByPosition(xBlock, yBlock); + thisRoot.setEyedrop(id); + } + + if (tool === "selection") { + let tempX = xBlock; + let tempY = yBlock; + + if (xBlock < 0) { + tempX = 0; + } + if (yBlock < 0) { + tempY = 0; + } + if (xBlock >= store.imageWidth) { + tempX = store.imageWidth - 1; + } + if (yBlock >= store.imageHeight) { + tempY = store.imageHeight - 1; + } + store.interface.selection.start = thisRoot._getIntFromPos( + tempX, + tempY + ); + store.interface.selection.end = thisRoot._getIntFromPos(tempX, tempY); + } + + if (tool === "zoom") { + if (store.scale.scaleUp()) { + let x = Math.floor(store.controls.mouse.localX - store.offset.x); + let y = Math.floor(store.controls.mouse.localY - store.offset.y); + store.offset.translate(store.offset.x - x, store.offset.y - y); + thisRoot.render(); + } + } + + if (tool === "grab") { + store.controls.mouse.grabbed = true; + store.controls.mouse.startX = e.clientX - store.boundingRect.x; + store.controls.mouse.startY = e.clientY - store.boundingRect.y; + store.controls.mouse.oldOffsetX = store.offset.x; + store.controls.mouse.oldOffsetY = store.offset.y; + thisRoot._setCursor("grabbing"); + } + + if (tool === "bucket") { + thisRoot._bucket(xBlock, yBlock, thisRoot.getEyedrop()); + } + } + if (e.which === 2) { + e.preventDefault(); + store.controls.mouse.grabbed = true; + store.controls.mouse.startX = e.clientX - store.boundingRect.x; + store.controls.mouse.startY = e.clientY - store.boundingRect.y; + store.controls.mouse.oldOffsetX = store.offset.x; + store.controls.mouse.oldOffsetY = store.offset.y; + thisRoot._setCursor("grabbing"); + } + if (e.which === 3) { + if (thisRoot.getTool() === "zoom") { + e.preventDefault(); + if (store.scale.scaleDown()) { + let x = Math.floor(store.controls.mouse.localX - store.offset.x); + let y = Math.floor(store.controls.mouse.localY - store.offset.y); + store.offset.translate( + store.offset.x + x / 2, + store.offset.y + y / 2 + ); + thisRoot.render(); + } + } + } + }); + + document.addEventListener("mouseup", function (e) { + if (!thisRoot._checkIfReady()) { + return; + } + store.controls.mouse.grabbed = false; + store.controls.mouse.leftClick = false; + store.controls.mouse.startX = 0; + store.controls.mouse.startY = 0; + + if (!thisRoot._isEmptyObject(tempFakePaintedPoints)) { + const history = { + current: {}, + before: {}, + }; + for (let i in tempFakePaintedPoints) { + history.current[i] = tempFakePaintedPoints[i]; + history.before[i] = store.imageConvertedHex[i]; + store.imageConvertedHex[i] = tempFakePaintedPoints[i]; + } + thisRoot._addToHistory(thisRoot.getTool(), history); + tempFakePaintedPoints = {}; + } + + if (store.interface.selection.start === store.interface.selection.end) { + store.interface.selection.start = null; + store.interface.selection.end = null; + thisRoot._renderOverlayCanvas(); + } + + thisRoot._setCursor(store.interface.cursor); + }); + + canvasOverlay.addEventListener("wheel", (e) => { + if (!thisRoot._checkIfReady()) { + return; + } + if (store.controls.mouse.leftClick) { + return; + } + if (store.controls.mouse.grabbed) { + return; + } + e.preventDefault(); + if (e.deltaY < 0) { + if (store.scale.scaleUp()) { + let x = Math.floor(store.controls.mouse.localX - store.offset.x); + let y = Math.floor(store.controls.mouse.localY - store.offset.y); + store.offset.translate(store.offset.x - x, store.offset.y - y); + } + } + + if (e.deltaY > 0) { + if (store.scale.scaleDown()) { + let x = Math.floor(store.controls.mouse.localX - store.offset.x); + let y = Math.floor(store.controls.mouse.localY - store.offset.y); + store.offset.translate( + store.offset.x + x / 2, + store.offset.y + y / 2 + ); + } + } + thisRoot._renderMainCanvas(); + thisRoot._renderOverlayCanvas(); + }); + + canvasOverlay.addEventListener("contextmenu", (e) => { + e.preventDefault(); + }); + + window.addEventListener("resize", (e) => { + thisRoot.setBoundingRect(); + }); + + window.addEventListener("scroll", (e) => { + thisRoot.setBoundingRect(); + }); + }; + + this._renderOverlayCanvas = () => { + function renderRulers() { + let rulerFillStyle = "white", + fontStyle = "12px Helvetica"; + + let drawRulerEveryNBlocks; + switch (store.scale.current) { + case 4: + drawRulerEveryNBlocks = 10; + break; + case 2: + drawRulerEveryNBlocks = 10; + break; + case 1: + drawRulerEveryNBlocks = 10; + break; + case 0.5: + drawRulerEveryNBlocks = 10; + break; + case 0.25: + drawRulerEveryNBlocks = 50; + break; + case 0.125: + drawRulerEveryNBlocks = 50; + break; + case 0.0625: + drawRulerEveryNBlocks = 100; + break; + } + + if (store.imageHeight >= 1000) { + store.interface.rulerSize = 36; + } + + ctxOverlay.beginPath(); + ctxOverlay.globalAlpha = 1; + ctxOverlay.fillStyle = rulerFillStyle; + ctxOverlay.rect( + 0, + store.canvasHeight - store.interface.rulerSize, + store.canvasWidth, + store.interface.rulerSize + ); + ctxOverlay.fill(); + ctxOverlay.rect(0, 0, store.interface.rulerSize, store.canvasHeight); + ctxOverlay.fill(); + + ctxOverlay.font = fontStyle; + ctxOverlay.fillStyle = "black"; + ctxOverlay.strokeStyle = "black"; + ctxOverlay.lineWidth = 1; + // gets lastleft/lastright visible n/coordsX and draws everything between them + + for ( + let i = + Math.ceil( + -store.offset.x / store.scale.current / 16 / drawRulerEveryNBlocks + ) * drawRulerEveryNBlocks; + i <= + Math.floor( + (-store.offset.x + store.canvasWidth) / + store.scale.current / + 16 / + drawRulerEveryNBlocks + ) * + drawRulerEveryNBlocks; + i += drawRulerEveryNBlocks + ) { + ctxOverlay.beginPath(); + ctxOverlay.moveTo( + i * store.scale.current * 16 + store.offset.x + 0.5, + store.canvasHeight + ); + ctxOverlay.lineTo( + i * store.scale.current * 16 + store.offset.x + 0.5, + store.canvasHeight - store.interface.rulerSize + ); + ctxOverlay.stroke(); + ctxOverlay.fillText( + i, + i * store.scale.current * 16 + store.offset.x + 2, + store.boundingRect.height - 10 + ); + } + + for ( + let i = + Math.floor( + (store.offset.y / 16 / store.scale.current + store.imageHeight) / + drawRulerEveryNBlocks + ) * drawRulerEveryNBlocks; + i >= + Math.floor( + ((store.offset.y - store.canvasHeight) / 16 / store.scale.current + + store.imageHeight) / + drawRulerEveryNBlocks + ) * + drawRulerEveryNBlocks; + i -= drawRulerEveryNBlocks + ) { + ctxOverlay.beginPath(); + ctxOverlay.moveTo( + 0, + (store.imageHeight - i) * 16 * store.scale.current + + store.offset.y + + 0.5 + ); // + 0.5 for just the right thickness + ctxOverlay.lineTo( + store.interface.rulerSize, + (store.imageHeight - i) * 16 * store.scale.current + + store.offset.y + + 0.5 + ); + ctxOverlay.stroke(); + ctxOverlay.fillText( + i, + 1, + (store.imageHeight - i) * 16 * store.scale.current + + store.offset.y - + 3 + ); + } + + ctxOverlay.rect( + 0, + store.canvasHeight - store.interface.rulerSize, + store.interface.rulerSize, + store.interface.rulerSize + ); + ctxOverlay.fill(); + } - function renderGroups() { - if (store.debug.drawGroups[0] === undefined) { return } - const groups = store.debug.drawGroups[store.settings.drawGroupsCurrent] - groups.forEach((item) => { - if (item.length === 1) { - const pos = thisRoot._getPosFromInt(item[0]) - ctxMain.fillStyle = "red" - ctxMain.fillRect( - pos.x * store.baseCellSize * store.scale.current + store.offset.x, - pos.y * store.baseCellSize * store.scale.current + store.offset.y, - store.scale.current * store.baseCellSize, - store.scale.current * store.baseCellSize) - } else { - const startPos = thisRoot._getPosFromInt(item[0]) - const endPos = thisRoot._getPosFromInt(item[1]) - ctxMain.strokeRect( - startPos.x * store.baseCellSize * store.scale.current + store.offset.x, - endPos.y * store.baseCellSize * store.scale.current + store.offset.y, - (endPos.x - startPos.x + 1) * store.scale.current * store.baseCellSize, - (startPos.y - endPos.y + 1) * store.scale.current * store.baseCellSize) - } - }) - } - - const renderList = { - 'RENDER_MAIN': renderMain, - 'RENDER_ORIGINAL': renderOriginal, - 'RENDER_BACKGROUND': renderBackground, - 'RENDER_GROUPS': renderGroups - } + function renderGrid() { + let lineWidthBig = 2, + lineWidthSmallOpacity = 0, + strokeStyle = store.settings.gridColor; + + let mainGridLineEveryN; + switch (store.scale.current) { + case 4: + lineWidthBig = 3; + lineWidthSmallOpacity = 1; + mainGridLineEveryN = 10; + break; + case 2: + lineWidthBig = 3; + lineWidthSmallOpacity = 0.75; + mainGridLineEveryN = 10; + break; + case 1: + lineWidthSmallOpacity = 0.25; + mainGridLineEveryN = 10; + break; + case 0.5: + mainGridLineEveryN = 10; + break; + case 0.25: + mainGridLineEveryN = 50; + break; + case 0.125: + mainGridLineEveryN = 50; + break; + case 0.0625: + mainGridLineEveryN = 50; + break; + } + + ctxOverlay.lineWidth = lineWidthBig; + ctxOverlay.strokeStyle = strokeStyle; + + let topOfGridVertical = -store.offset.y >= 0 ? 0 : store.offset.y; + let bottomOfGridVertical = + store.offset.y + store.imageHeight * 16 * store.scale.current; + let topOfGridHorizontal = store.offset.x < 0 ? 0 : store.offset.x; + let bottomOfGridHorizontal = + store.offset.x + store.imageWidth * 16 * store.scale.current; + + if (bottomOfGridVertical > store.canvasHeight) { + bottomOfGridVertical = store.canvasHeight; + } + if (bottomOfGridHorizontal > store.canvasWidth) { + bottomOfGridHorizontal = store.canvasWidth; + } + + let startOfRenderGridHorizontal = Math.ceil( + (store.offset.y - store.canvasHeight) / 16 / store.scale.current + + store.imageHeight + ); + let endOfRenderGridHorizontal = Math.floor( + store.offset.y / 16 / store.scale.current + store.imageHeight + ); + + let startOfRenderGridVertical = Math.ceil( + -store.offset.x / 16 / store.scale.current + ); + let endOfRenderGridVertical = Math.floor( + (-store.offset.x + store.canvasWidth) / store.scale.current / 16 + ); + + if (startOfRenderGridHorizontal <= 0) { + startOfRenderGridHorizontal = 0; + } + if (endOfRenderGridHorizontal >= store.imageHeight) { + endOfRenderGridHorizontal = store.imageHeight; + } + + if (startOfRenderGridVertical <= 0) { + startOfRenderGridVertical = 0; + } + if (endOfRenderGridVertical >= store.imageWidth) { + endOfRenderGridVertical = store.imageWidth; + } + + for ( + let i = startOfRenderGridHorizontal + 1; + i <= endOfRenderGridHorizontal; + i += 1 + ) { + ctxOverlay.beginPath(); + ctxOverlay.globalAlpha = 1; + if (i % mainGridLineEveryN === 0 && i !== store.imageHeight) { + ctxOverlay.lineWidth = lineWidthBig; + ctxOverlay.moveTo( + topOfGridHorizontal, + (store.imageHeight - i) * store.scale.current * 16 + store.offset.y + ); + ctxOverlay.lineTo( + bottomOfGridHorizontal, + (store.imageHeight - i) * store.scale.current * 16 + store.offset.y + ); + } else if (lineWidthSmallOpacity > 0) { + ctxOverlay.globalAlpha = lineWidthSmallOpacity; + ctxOverlay.lineWidth = 1; + ctxOverlay.moveTo( + topOfGridHorizontal, + (store.imageHeight - i) * store.scale.current * 16 + + store.offset.y + + 0.5 + ); + ctxOverlay.lineTo( + bottomOfGridHorizontal, + (store.imageHeight - i) * store.scale.current * 16 + + store.offset.y + + 0.5 + ); + } + ctxOverlay.stroke(); + } + + for ( + let i = startOfRenderGridVertical + 1; + i <= endOfRenderGridVertical; + i += 1 + ) { + ctxOverlay.beginPath(); + ctxOverlay.globalAlpha = 1; + if (i % mainGridLineEveryN === 0 && i !== store.imageWidth) { + ctxOverlay.lineWidth = lineWidthBig; + ctxOverlay.moveTo( + i * store.scale.current * 16 + store.offset.x, + topOfGridVertical + ); + ctxOverlay.lineTo( + i * store.scale.current * 16 + store.offset.x, + bottomOfGridVertical + ); + } else if (lineWidthSmallOpacity > 0) { + ctxOverlay.globalAlpha = lineWidthSmallOpacity; + ctxOverlay.lineWidth = 1; + ctxOverlay.moveTo( + i * store.scale.current * 16 + store.offset.x, + topOfGridVertical + 0.5 + ); + ctxOverlay.lineTo( + i * store.scale.current * 16 + store.offset.x, + bottomOfGridVertical + 0.5 + ); + } + ctxOverlay.stroke(); + } + } - function renderHelper(list) { - ctxMain.clearRect(0, 0, store.canvasWidth, store.canvasHeight) - ctxMain.save() - for (let key in list) { - if (renderList[list[key]]) { renderList[list[key]]() } - ctxMain.restore() - } - ctxMain.globalAlpha = 1 - } + function renderBrush() { + let size = + store.interface.brushSize % 2 === 0 + ? store.interface.brushSize + 1 + : store.interface.brushSize; + let brushSize = size * store.baseCellSize * store.scale.current; + ctxOverlay.beginPath(); + + if (thisRoot.getTool() === "pencil") { + let xBlock = Math.floor( + (store.controls.mouse.localX - store.offset.x) / + (store.baseCellSize * store.scale.current) + ); + let yBlock = Math.floor( + (store.controls.mouse.localY - store.offset.y) / + (store.baseCellSize * store.scale.current) + ); + ctxOverlay.rect( + (xBlock - Math.floor(store.interface.brushSize / 2)) * + store.baseCellSize * + store.scale.current + + store.offset.x, + (yBlock - Math.floor(store.interface.brushSize / 2)) * + store.baseCellSize * + store.scale.current + + store.offset.y, + brushSize, + brushSize + ); + } + + if (thisRoot.getTool() === "brush") { + ctxOverlay.arc( + store.controls.mouse.localX, + store.controls.mouse.localY, + brushSize / 2, + 0, + 2 * Math.PI + ); + } + + ctxOverlay.globalAlpha = 1; + ctxOverlay.strokeStyle = "white"; + ctxOverlay.lineWidth = 3; + ctxOverlay.stroke(); + ctxOverlay.stroke(); + ctxOverlay.strokeStyle = "black"; + ctxOverlay.lineWidth = 1; + ctxOverlay.stroke(); + ctxOverlay.stroke(); + } - var t0 = performance.now() + function renderSelection() { + if ( + store.interface.selection.start === null || + store.interface.selection.end === null + ) { + return; + } + if (store.interface.selection.start === store.interface.selection.end) { + return; + } + + var startPos = thisRoot._getPosFromInt(store.interface.selection.start); + var endPos = thisRoot._getPosFromInt(store.interface.selection.end); + + const tempStart = { + x: startPos.x <= endPos.x ? startPos.x : endPos.x, + y: startPos.y <= endPos.y ? startPos.y : endPos.y, + }; + + const tempEnd = { + x: startPos.x > endPos.x ? startPos.x : endPos.x, + y: startPos.y > endPos.y ? startPos.y : endPos.y, + }; + + ctxOverlay.beginPath(); + ctxOverlay.rect( + tempStart.x * store.baseCellSize * store.scale.current + store.offset.x, + tempStart.y * store.baseCellSize * store.scale.current + store.offset.y, + (tempEnd.x - tempStart.x + 1) * + store.baseCellSize * + store.scale.current, + (tempEnd.y - tempStart.y + 1) * store.baseCellSize * store.scale.current + ); + if (store.scale.current > 0.125) { + ctxOverlay.lineWidth = 3; + } else { + ctxOverlay.lineWidth = 2; + } + ctxOverlay.strokeStyle = "white"; + ctxOverlay.stroke(); + ctxOverlay.stroke(); + ctxOverlay.setLineDash([7, 7]); + ctxOverlay.strokeStyle = "black"; + ctxOverlay.stroke(); + ctxOverlay.stroke(); + } - renderHelper([ - 'RENDER_BACKGROUND', - store.settings.showOriginal ? 'RENDER_ORIGINAL' : 'RENDER_MAIN', - store.settings.showDebugDrawGroups ? 'RENDER_GROUPS' : false, - ]) + const renderList = { + RENDER_BRUSH: renderBrush, + RENDER_RULERS: renderRulers, + RENDER_SELECTION: renderSelection, + RENDER_GRID: renderGrid, + }; + + function renderHelper(list) { + ctxOverlay.globalAlpha = 1; + ctxOverlay.save(); + ctxOverlay.clearRect(0, 0, store.canvasWidth, store.canvasHeight); + list.forEach((item) => { + if (renderList[item]) { + renderList[item](); + ctxOverlay.restore(); + } + }); } - /* PUBLIC METHODS */ - ////////////////////////////////////// + const renderArray = ["RENDER_SELECTION"]; - this.debugRenderAllPainted = () => { - store.debug.renderAllPainted = !store.debug.renderAllPainted - return store.debug.renderAllPainted + if (store.settings.showGrid) { + renderArray.push("RENDER_GRID"); } - this.getBlockInfoByMouseXY = (pageX, pageY) => { - let xBlock = (Math.floor((pageX - store.boundingRect.x - store.offset.x) / (store.baseCellSize * store.scale.current))) - let yBlock = (Math.floor((pageY - store.boundingRect.y - store.offset.y) / (store.baseCellSize * store.scale.current))) - if (store.interface.rulerSize > Math.floor(pageX - store.boundingRect.x) || - store.canvasHeight - store.interface.rulerSize < Math.floor(pageY - store.boundingRect.y)) { - return { - x: xBlock + 1, - y: store.imageHeight - yBlock, - info: null, - blockPos: null - } - } - return { - x: xBlock + 1, - y: store.imageHeight - yBlock, - info: store.getBlockById(this._getBlockIdByPosition(xBlock, yBlock)), - blockPos: xBlock + yBlock * store.imageWidth - } - } - - this.setImageSizes = (w, h) => { - store.imageWidth = parseInt(w) - store.imageHeight = parseInt(h) - canvasTemp.width = store.imageWidth * 16 - canvasTemp.height = store.imageHeight * 16 - ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height) - canvasInit.width = store.imageWidth * 16 - canvasInit.height = store.imageHeight * 16 - ctxInit.clearRect(0, 0, canvasInit.width, canvasInit.height) - } - - this.setBoundingRect = () => { - store.boundingRect = $root.getBoundingClientRect() - store.canvasWidth = store.boundingRect.width - store.canvasHeight = store.boundingRect.height - canvasMain.width = store.canvasWidth - canvasMain.height = store.canvasHeight - canvasOverlay.width = store.canvasWidth - canvasOverlay.height = store.canvasHeight - ctxMain.imageSmoothingEnabled = false - this.render() - } - - this.setBounds = () => { - store.offset.bounds.x = store.canvasWidth - store.imageWidth / 1.75 - store.offset.bounds.y = store.canvasHeight - store.imageHeight / 1.75 - } - - this.setTool = (str) => { - store.interface.toolCurrent = str - switch (str) { - case 'selection': - store.interface.cursor = 'crosshair' - this._setCursor(store.interface.cursor) - break - case 'zoom': - store.interface.cursor = 'zoom' - this._setCursor(store.interface.cursor) - break - case 'grab': - store.interface.cursor = 'grab' - this._setCursor(store.interface.cursor) - break - case 'bucket': - store.interface.cursor = 'bucket' - this._setCursor(store.interface.cursor) - break - case 'eyedropper': - case 'clicker': - store.interface.cursor = 'eyedropper' - this._setCursor(store.interface.cursor) - break - case 'brush': - case 'pencil': - store.interface.cursor = '' - this._setCursor(store.interface.cursor) - break - } - this.render() + if ( + (this.getTool() === "pencil" || this.getTool() === "brush") && + !store.controls.mouse.grabbed + ) { + renderArray.push("RENDER_BRUSH"); } - this.getTool = () => { - return store.interface.toolCurrent + if (store.settings.showRulers) { + renderArray.push("RENDER_RULERS"); } - this.loadImageHex = (arr) => { - store.imageConvertedHex = arr - store.imageConvertedHexBackup = new Uint8Array(arr.length) - store.imageConvertedHexBackup.set(arr, 0) - this._createMainBlobImage(arr) + renderHelper(renderArray); + }; + + this._renderMainCanvas = () => { + function renderMain() { + function renderByLoop() { + const visibleCorners = thisRoot._getCornersOfVisible(); + const topLeftX = visibleCorners.topLeftX; + const topLeftY = visibleCorners.topLeftY; + const bottomRightX = visibleCorners.bottomRightX; + const bottomRightY = visibleCorners.bottomRightY; + let hexBlock, source; + if (store.history.currentPos === -1) { + source = store.imageConvertedHexBackup; + } else { + source = store.imageConvertedHex; + } + + for (let y = topLeftY; y <= bottomRightY; y++) { + for (let x = topLeftX; x <= bottomRightX; x++) { + if (x < store.imageWidth && y < store.imageHeight) { + hexBlock = source[y * store.imageWidth + x]; + if (hexBlock > 0) { + let imageForCanvas = store.getBlockById(hexBlock).image; + ctxMain.drawImage( + imageForCanvas, + x * store.baseCellSize * store.scale.current + store.offset.x, + y * store.baseCellSize * store.scale.current + store.offset.y, + store.scale.current * store.baseCellSize, + store.scale.current * store.baseCellSize + ); + } + } + } + } + } + + function renderByCache() { + let visible = thisRoot._getCornersOfVisible(); + let offsetX = + store.offset.x > 0 + ? store.offset.x + : store.offset.x % (16 * store.scale.current); + let offsetY = + store.offset.y > 0 + ? store.offset.y + : store.offset.y % (16 * store.scale.current); + let source; + if (store.history.currentPos === -1) { + source = canvasInit; + } else { + source = canvasTemp; + } + ctxMain.drawImage( + source, + visible.topLeftX * 16, + visible.topLeftY * 16, + (visible.bottomRightX - visible.topLeftX) * 16, + (visible.bottomRightY - visible.topLeftY) * 16, + offsetX, + offsetY, + (visible.bottomRightX - visible.topLeftX) * 16 * store.scale.current, + (visible.bottomRightY - visible.topLeftY) * 16 * store.scale.current + ); + } + + if (store.scale.current > store.scale.cacheFrom) { + renderByLoop(); + } else { + renderByCache(); + } } - this.setEyedrop = (id) => { - store.interface.eyedropCurrent = id + function renderOriginal() { + ctxMain.drawImage( + store.originalImage.img, + store.originalImage.x, + store.originalImage.y, + store.originalImage.width, + store.originalImage.height, + store.offset.x, + store.offset.y, + store.imageWidth * store.baseCellSize * store.scale.current, + store.imageHeight * store.baseCellSize * store.scale.current + ); } - this.getEyedrop = () => { - return store.interface.eyedropCurrent + function renderBackground() { + ctxMain.fillStyle = "rgba(100, 100, 100, 0.45)"; + ctxMain.fillRect(0, 0, store.canvasWidth, store.canvasHeight); + ctxMain.clearRect( + store.offset.x, + store.offset.y, + store.imageWidth * store.baseCellSize * store.scale.current, + store.imageHeight * store.baseCellSize * store.scale.current + ); } - this.setBrushSize = (int) => { - if (int < 1) { - store.interface.brushSize = 1 - } else if(int > store.settings.maxBrushSize) { - store.interface.brushSize = store.settings.maxBrushSize + function renderGroups() { + if (store.debug.drawGroups[0] === undefined) { + return; + } + const groups = store.debug.drawGroups[store.settings.drawGroupsCurrent]; + groups.forEach((item) => { + if (item.length === 1) { + const pos = thisRoot._getPosFromInt(item[0]); + ctxMain.fillStyle = "red"; + ctxMain.fillRect( + pos.x * store.baseCellSize * store.scale.current + store.offset.x, + pos.y * store.baseCellSize * store.scale.current + store.offset.y, + store.scale.current * store.baseCellSize, + store.scale.current * store.baseCellSize + ); } else { - store.interface.brushSize = int - } - this._renderOverlayCanvas() + const startPos = thisRoot._getPosFromInt(item[0]); + const endPos = thisRoot._getPosFromInt(item[1]); + ctxMain.strokeRect( + startPos.x * store.baseCellSize * store.scale.current + + store.offset.x, + endPos.y * store.baseCellSize * store.scale.current + + store.offset.y, + (endPos.x - startPos.x + 1) * + store.scale.current * + store.baseCellSize, + (startPos.y - endPos.y + 1) * + store.scale.current * + store.baseCellSize + ); + } + }); } - this.undoOnce = () => { - this._undoTo(store.history.currentPos - 1) + const renderList = { + RENDER_MAIN: renderMain, + RENDER_ORIGINAL: renderOriginal, + RENDER_BACKGROUND: renderBackground, + RENDER_GROUPS: renderGroups, + }; + + function renderHelper(list) { + ctxMain.clearRect(0, 0, store.canvasWidth, store.canvasHeight); + ctxMain.save(); + for (let key in list) { + if (renderList[list[key]]) { + renderList[list[key]](); + } + ctxMain.restore(); + } + ctxMain.globalAlpha = 1; } - this.undoTo = (pos) => { - this._undoTo(pos) + var t0 = performance.now(); + + renderHelper([ + "RENDER_BACKGROUND", + store.settings.showOriginal ? "RENDER_ORIGINAL" : "RENDER_MAIN", + store.settings.showDebugDrawGroups ? "RENDER_GROUPS" : false, + ]); + }; + + /* PUBLIC METHODS */ + ////////////////////////////////////// + + this.debugRenderAllPainted = () => { + store.debug.renderAllPainted = !store.debug.renderAllPainted; + return store.debug.renderAllPainted; + }; + + this.getBlockInfoByMouseXY = (pageX, pageY) => { + let xBlock = Math.floor( + (pageX - store.boundingRect.x - store.offset.x) / + (store.baseCellSize * store.scale.current) + ); + let yBlock = Math.floor( + (pageY - store.boundingRect.y - store.offset.y) / + (store.baseCellSize * store.scale.current) + ); + if ( + store.interface.rulerSize > Math.floor(pageX - store.boundingRect.x) || + store.canvasHeight - store.interface.rulerSize < + Math.floor(pageY - store.boundingRect.y) + ) { + return { + x: xBlock + 1, + y: store.imageHeight - yBlock, + info: null, + blockPos: null, + }; } - - this.getCurrentHistoryPos = () => { - return store.history.currentPos + return { + x: xBlock + 1, + y: store.imageHeight - yBlock, + info: store.getBlockById(this._getBlockIdByPosition(xBlock, yBlock)), + blockPos: xBlock + yBlock * store.imageWidth, + }; + }; + + this.setImageSizes = (w, h) => { + store.imageWidth = parseInt(w); + store.imageHeight = parseInt(h); + canvasTemp.width = store.imageWidth * 16; + canvasTemp.height = store.imageHeight * 16; + ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height); + canvasInit.width = store.imageWidth * 16; + canvasInit.height = store.imageHeight * 16; + ctxInit.clearRect(0, 0, canvasInit.width, canvasInit.height); + }; + + this.setBoundingRect = () => { + store.boundingRect = $root.getBoundingClientRect(); + store.canvasWidth = store.boundingRect.width; + store.canvasHeight = store.boundingRect.height; + canvasMain.width = store.canvasWidth; + canvasMain.height = store.canvasHeight; + canvasOverlay.width = store.canvasWidth; + canvasOverlay.height = store.canvasHeight; + ctxMain.imageSmoothingEnabled = false; + this.render(); + }; + + this.setBounds = () => { + store.offset.bounds.x = store.canvasWidth - store.imageWidth / 1.75; + store.offset.bounds.y = store.canvasHeight - store.imageHeight / 1.75; + }; + + this.setTool = (str) => { + store.interface.toolCurrent = str; + switch (str) { + case "selection": + store.interface.cursor = "crosshair"; + this._setCursor(store.interface.cursor); + break; + case "zoom": + store.interface.cursor = "zoom"; + this._setCursor(store.interface.cursor); + break; + case "grab": + store.interface.cursor = "grab"; + this._setCursor(store.interface.cursor); + break; + case "bucket": + store.interface.cursor = "bucket"; + this._setCursor(store.interface.cursor); + break; + case "eyedropper": + case "clicker": + store.interface.cursor = "eyedropper"; + this._setCursor(store.interface.cursor); + break; + case "brush": + case "pencil": + store.interface.cursor = ""; + this._setCursor(store.interface.cursor); + break; } - - this.getCanvasLink = () => { - return canvasOverlay + this.render(); + }; + + this.getTool = () => { + return store.interface.toolCurrent; + }; + + this.loadImageHex = (arr) => { + store.imageConvertedHex = arr; + store.imageConvertedHexBackup = new Uint8Array(arr.length); + store.imageConvertedHexBackup.set(arr, 0); + this._createMainBlobImage(arr); + }; + + this.setEyedrop = (id) => { + store.interface.eyedropCurrent = id; + }; + + this.getEyedrop = () => { + return store.interface.eyedropCurrent; + }; + + this.setBrushSize = (int) => { + if (int < 1) { + store.interface.brushSize = 1; + } else if (int > store.settings.maxBrushSize) { + store.interface.brushSize = store.settings.maxBrushSize; + } else { + store.interface.brushSize = int; } - - this.setBlocks = (blocks) => { - blocks.forEach((item) => { - let temp = Object.assign({}, item) - temp.image = new Image() - temp.image.src = temp.src - delete temp.src - store.blocksDb.push(temp) - }) + this._renderOverlayCanvas(); + }; + + this.undoOnce = () => { + this._undoTo(store.history.currentPos - 1); + }; + + this.undoTo = (pos) => { + this._undoTo(pos); + }; + + this.getCurrentHistoryPos = () => { + return store.history.currentPos; + }; + + this.getCanvasLink = () => { + return canvasOverlay; + }; + + this.setBlocks = (blocks) => { + blocks.forEach((item) => { + let temp = Object.assign({}, item); + temp.image = new Image(); + temp.image.src = temp.src; + delete temp.src; + store.blocksDb.push(temp); + }); + }; + + this.replace = (target, replace) => { + let startBlock = + store.interface.selection.start === null + ? 0 + : store.interface.selection.start; + let endBlock = + store.interface.selection.end === null + ? store.imageConvertedHex.length - 1 + : store.interface.selection.end; + + if (store.history.currentPos === -1) { + ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height); + ctxTemp.drawImage(canvasInit, 0, 0); + store.imageConvertedHex.set(store.imageConvertedHexBackup, 0); } - this.replace = (target, replace) => { - let startBlock = store.interface.selection.start === null ? 0 : store.interface.selection.start - let endBlock = store.interface.selection.end === null ? store.imageConvertedHex.length - 1 : store.interface.selection.end - - if (store.history.currentPos === -1) { - ctxTemp.clearRect(0, 0, canvasTemp.width, canvasTemp.height) - ctxTemp.drawImage(canvasInit, 0, 0) - store.imageConvertedHex.set(store.imageConvertedHexBackup, 0) - } - - const history = { - current: {}, - before: {} - } - for (let i = startBlock; i <= endBlock; i++) { - if (store.interface.selection.start !== null && store.interface.selection.end !== null) { - if (!this._checkIfInSelection(i)) { continue } - } - - if (store.imageConvertedHex[i] === target) { - let xBlock = i % store.imageWidth - let yBlock = Math.floor(i / store.imageWidth) - history.before[i] = store.imageConvertedHex[i] - history.current[i] = replace - store.imageConvertedHex[i] = replace - thisRoot._fakePaint(xBlock, yBlock, replace) - } - } - - this._addToHistory('replace', history) - return Object.keys(history.current).length - } - - this.setSettingsValue = (key, value) => { - store.settings[key] = value - } - - this.reset = () => { - store.imageConvertedHex = null - store.offset.x = 0 - store.offset.y = 0 - store.scale.current = 0.0625 - store.history.log = [] - store.history.currentPos = -1 - store.history.lastMaxPos = -1 - store.interface.eyedropCurrent = 1 - store.interface.toolCurrent = 'pencil' - store.interface.brushSize = 9 - store.interface.selection.start = null - store.interface.selection.end = null - store.settings.showRulers = true - store.settings.showGrid = false - store.settings.showOriginal = false - store.settings.showDebugDrawGroups = false - store.settings.gridColor = '#ff4778' - this.resetGroups() - } - - this.open = (uint8Arr) => { - this.reset() - this._setPosOnOpen() - this.loadImageHex(uint8Arr) - this.render() - } - - this.save = (facing) => { - const schem = new SchematicsHelper() - const blockIds = [] - const dataIds = [] - let width, length, offsetZ, offsetX - - for (let i = 0; i < store.imageConvertedHex.length; i++) { - let int - if (facing === 'south' || facing === 'east') { - int = (store.imageHeight - Math.ceil((i + 1) / store.imageWidth)) * store.imageWidth + (i % store.imageWidth) - } else if (facing === 'north' || facing === 'west') { - int = store.imageConvertedHex.length - i - 1 - } - const pos = this._getPosFromInt(int) - const block = store.getBlockById(this._getBlockIdByPosition(pos.x, pos.y)) - if (block) { - let dataId = block.data_id - - if (block.axis) { - if (facing === 'west' || facing === 'east') { - dataId += 8 - } else if (facing === 'north' || facing === 'south') { - dataId += 4 - } - } - - blockIds.push(block.block_id) - dataIds.push(dataId) - } else { - blockIds.push(0) - dataIds.push(0) - } - - } - - switch (facing) { - case 'south': - width = 1 - length = store.imageWidth - offsetX = 0 - offsetZ = 1 - break - case 'east': - width = store.imageWidth - length = 1 - offsetX = 1 - offsetZ = 0 - break - case 'north': - width = 1 - length = store.imageWidth - offsetX = 0 - offsetZ = -store.imageWidth - break - case 'west': - width = store.imageWidth - length = 1 - offsetX = -store.imageWidth - offsetZ = 0 - break - } + const history = { + current: {}, + before: {}, + }; + for (let i = startBlock; i <= endBlock; i++) { + if ( + store.interface.selection.start !== null && + store.interface.selection.end !== null + ) { + if (!this._checkIfInSelection(i)) { + continue; + } + } + + if (store.imageConvertedHex[i] === target) { + let xBlock = i % store.imageWidth; + let yBlock = Math.floor(i / store.imageWidth); + history.before[i] = store.imageConvertedHex[i]; + history.current[i] = replace; + store.imageConvertedHex[i] = replace; + thisRoot._fakePaint(xBlock, yBlock, replace); + } + } - var tag = { - Blocks: { type: 'byteArray', value: blockIds }, - Data: { type: 'byteArray', value: dataIds }, - Height: { type: 'short', value: store.imageHeight }, - Length: { type: 'short', value: length }, - Materials: { type: 'string', value: 'Alpha' }, - TileEntities: { type: 'list', value: { - type: 'compound', - value: [] - } - }, - WEOffsetX: { type: 'int', value: offsetX }, - WEOffsetY: { type: 'int', value: 0 }, - WEOffsetZ: { type: 'int', value: offsetZ }, - WEOriginX: { type: 'int', value: 0 }, - WEOriginY: { type: 'int', value: 0 }, - WEOriginZ: { type: 'int', value: 0 }, - Width: { type: 'short', value: width } - } + this._addToHistory("replace", history); + return Object.keys(history.current).length; + }; + + this.setSettingsValue = (key, value) => { + store.settings[key] = value; + }; + + this.reset = () => { + store.imageConvertedHex = null; + store.offset.x = 0; + store.offset.y = 0; + store.scale.current = 0.0625; + store.history.log = []; + store.history.currentPos = -1; + store.history.lastMaxPos = -1; + store.interface.eyedropCurrent = 1; + store.interface.toolCurrent = "pencil"; + store.interface.brushSize = 9; + store.interface.selection.start = null; + store.interface.selection.end = null; + store.settings.showRulers = true; + store.settings.showGrid = false; + store.settings.showOriginal = false; + store.settings.showDebugDrawGroups = false; + store.settings.gridColor = "#ff4778"; + this.resetGroups(); + }; + + this.open = (uint8Arr) => { + this.reset(); + this._setPosOnOpen(); + this.loadImageHex(uint8Arr); + this.render(); + }; + + this.save = (facing) => { + const schem = new SchematicsHelper(); + const blockIds = []; + const dataIds = []; + let width, length, offsetZ, offsetX; + + for (let i = 0; i < store.imageConvertedHex.length; i++) { + let int; + if (facing === "south" || facing === "east") { + int = + (store.imageHeight - Math.ceil((i + 1) / store.imageWidth)) * + store.imageWidth + + (i % store.imageWidth); + } else if (facing === "north" || facing === "west") { + int = store.imageConvertedHex.length - i - 1; + } + const pos = this._getPosFromInt(int); + const block = store.getBlockById( + this._getBlockIdByPosition(pos.x, pos.y) + ); + if (block) { + let dataId = block.data_id; - const blob = new Blob([schem.encode(tag)], {type : 'text/plain'}) - return _URL.createObjectURL(blob) + if (block.axis) { + if (facing === "west" || facing === "east") { + dataId += 8; + } else if (facing === "north" || facing === "south") { + dataId += 4; + } + } + + blockIds.push(block.block_id); + dataIds.push(dataId); + } else { + blockIds.push(0); + dataIds.push(0); + } } - this.resetGroups = () => { - store.groups = null + switch (facing) { + case "south": + width = 1; + length = store.imageWidth; + offsetX = 0; + offsetZ = 1; + break; + case "east": + width = store.imageWidth; + length = 1; + offsetX = 1; + offsetZ = 0; + break; + case "north": + width = 1; + length = store.imageWidth; + offsetX = 0; + offsetZ = -store.imageWidth; + break; + case "west": + width = store.imageWidth; + length = 1; + offsetX = -store.imageWidth; + offsetZ = 0; + break; } - this.setOriginalImage = (obj) => { - store.originalImage.img.src = obj.src - store.originalImage.x = obj.x - store.originalImage.y = obj.y - store.originalImage.width = obj.width - store.originalImage.height = obj.height + var tag = { + Blocks: { type: "byteArray", value: blockIds }, + Data: { type: "byteArray", value: dataIds }, + Height: { type: "short", value: store.imageHeight }, + Length: { type: "short", value: length }, + Materials: { type: "string", value: "Alpha" }, + TileEntities: { + type: "list", + value: { + type: "compound", + value: [], + }, + }, + WEOffsetX: { type: "int", value: offsetX }, + WEOffsetY: { type: "int", value: 0 }, + WEOffsetZ: { type: "int", value: offsetZ }, + WEOriginX: { type: "int", value: 0 }, + WEOriginY: { type: "int", value: 0 }, + WEOriginZ: { type: "int", value: 0 }, + Width: { type: "short", value: width }, + }; + + const blob = new Blob([schem.encode(tag)], { type: "text/plain" }); + return _URL.createObjectURL(blob); + }; + + this.resetGroups = () => { + store.groups = null; + }; + + this.setOriginalImage = (obj) => { + store.originalImage.img.src = obj.src; + store.originalImage.x = obj.x; + store.originalImage.y = obj.y; + store.originalImage.width = obj.width; + store.originalImage.height = obj.height; + }; + + this.convertAsRaw = (facing) => { + if (store.groups === null) { + this._convertToGroups(); } - this.convertAsRaw = (facing) => { - if (store.groups === null) { - this._convertToGroups() - } + let output = []; + store.groups.forEach((item) => { + output.push("/" + this._convertGroupToCommand(item, facing)); + }); - let output = [] - store.groups.forEach((item) => { - output.push('/' + this._convertGroupToCommand(item, facing)) - }) + return output; + }; - return output + this.convertAsMcfunction = (facing) => { + if (store.groups === null) { + this._convertToGroups(); } - this.convertAsMcfunction = (facing) => { - if (store.groups === null) { - this._convertToGroups() - } + let output = ""; + store.groups.forEach((item) => { + output += this._convertGroupToCommand(item, facing) + "\n"; + }); - let output = "" - store.groups.forEach((item) => { - output += this._convertGroupToCommand(item, facing) + "\n" - }) + return output; + }; - return output + this.convertAsCommandBlock = (facing) => { + if (store.groups === null) { + this._convertToGroups(); } - this.convertAsCommandBlock = (facing) => { - if (store.groups === null) { - this._convertToGroups() - } - - store.debug.drawGroups = [] - - const maxLength = 31390 - 150 - const outputArr = [] - let debugDrawGroup = [] - let commandTemplate, outsideTemplate, passengerTemplate, commandBlockCartId, fallingBlockId, killCommand - let tempStr - - switch (store.settings.minecraftVersion) { - case 9: - case 10: - fallingBlockId = 'FallingSand' - commandBlockCartId = 'MinecartCommandBlock' - killCommand = `kill @e[type=${commandBlockCartId},r=2]` - break - case 11: - case 12: - fallingBlockId = 'falling_block' - commandBlockCartId = 'commandblock_minecart' - killCommand = `kill @e[type=${commandBlockCartId},r=2]` - break - case 13: - fallingBlockId = 'falling_block' - commandBlockCartId = 'command_block_minecart' - killCommand = `kill @e[type=${commandBlockCartId},distance=..2]` - break - } + store.debug.drawGroups = []; + + const maxLength = 31390 - 150; + const outputArr = []; + let debugDrawGroup = []; + let commandTemplate, + outsideTemplate, + passengerTemplate, + commandBlockCartId, + fallingBlockId, + killCommand; + let tempStr; + + switch (store.settings.minecraftVersion) { + case 9: + case 10: + fallingBlockId = "FallingSand"; + commandBlockCartId = "MinecartCommandBlock"; + killCommand = `kill @e[type=${commandBlockCartId},r=2]`; + break; + case 11: + case 12: + fallingBlockId = "falling_block"; + commandBlockCartId = "commandblock_minecart"; + killCommand = `kill @e[type=${commandBlockCartId},r=2]`; + break; + case 13: + fallingBlockId = "falling_block"; + commandBlockCartId = "command_block_minecart"; + killCommand = `kill @e[type=${commandBlockCartId},distance=..2]`; + break; + } - commandTemplate = `summon ${fallingBlockId} ~ ~1 ~ {Time:1,Passengers:[%passenger%]}` + commandTemplate = `summon ${fallingBlockId} ~ ~1 ~ {Time:1,Passengers:[%passenger%]}`; - passengerTemplate = ` + passengerTemplate = ` { id: "${commandBlockCartId}", Command: "%command%", Passengers: [%passenger%] } - ` - tempStr = passengerTemplate.replace(/\n|\s/g, '') - - for (let i = 0; i <= store.groups.length; i++) { - if (i === store.groups.length) { - tempStr = tempStr.replace('%command%', killCommand) - .replace(',Passengers:[%passenger%]', '') - outputArr.push(commandTemplate.replace('%passenger%', tempStr)) - store.debug.drawGroups.push(debugDrawGroup) - debugDrawGroup = [] - continue - } - - tempStr = tempStr.replace('%command%', this._convertGroupToCommand(store.groups[i], facing, {y: -1})) - .replace('%passenger%', passengerTemplate.replace(/\n|\s/g, '')) - debugDrawGroup.push(store.groups[i]) - - if (tempStr.length > maxLength) { - tempStr = tempStr.replace('%command%', killCommand) - .replace(',Passengers:[%passenger%]', '') - outputArr.push(commandTemplate.replace('%passenger%', tempStr)) - tempStr = passengerTemplate.replace(/\n|\s/g, '') - store.debug.drawGroups.push(debugDrawGroup) - debugDrawGroup = [] - } - } - return outputArr - } - - this.getQuantityOfBlocks = () => { - const output = [] - const temp = {} - const arr = store.history.currentPos === -1 ? store.imageConvertedHexBackup : store.imageConvertedHex - arr.forEach((item) => { - if (item > 0) { - if (temp[item]) { - temp[item]++ - } else { - temp[item] = 1 - } - } - }) - - for (let key in temp) { - output.push({ - id: key, - quant: temp[key] - }) - } - - output.sort((a,b) => { - return b.quant - a.quant - }) - - return output + `; + tempStr = passengerTemplate.replace(/\n|\s/g, ""); + + for (let i = 0; i <= store.groups.length; i++) { + if (i === store.groups.length) { + tempStr = tempStr + .replace("%command%", killCommand) + .replace(",Passengers:[%passenger%]", ""); + outputArr.push(commandTemplate.replace("%passenger%", tempStr)); + store.debug.drawGroups.push(debugDrawGroup); + debugDrawGroup = []; + continue; + } + + tempStr = tempStr + .replace( + "%command%", + this._convertGroupToCommand(store.groups[i], facing, { y: -1 }) + ) + .replace("%passenger%", passengerTemplate.replace(/\n|\s/g, "")); + debugDrawGroup.push(store.groups[i]); + + if (tempStr.length > maxLength) { + tempStr = tempStr + .replace("%command%", killCommand) + .replace(",Passengers:[%passenger%]", ""); + outputArr.push(commandTemplate.replace("%passenger%", tempStr)); + tempStr = passengerTemplate.replace(/\n|\s/g, ""); + store.debug.drawGroups.push(debugDrawGroup); + debugDrawGroup = []; + } } - - this.getCommandToDelete = (facing) => { - const numOfComs = Math.ceil(store.imageWidth * store.imageHeight / 32768) - const output = [] - for (let i = numOfComs; i >= 1; i--) { - const tempGroup = [ - (Math.ceil(i * (store.imageHeight / numOfComs)) - 1) * store.imageWidth, - Math.floor((i - 1) * (store.imageHeight / numOfComs) + 1) * store.imageWidth - 1, - ] - output.push(this._convertGroupToCommand(tempGroup, facing).replace(/minecraft\:.*/, 'minecraft:air')) + return outputArr; + }; + + this.getQuantityOfBlocks = () => { + const output = []; + const temp = {}; + const arr = + store.history.currentPos === -1 + ? store.imageConvertedHexBackup + : store.imageConvertedHex; + arr.forEach((item) => { + if (item > 0) { + if (temp[item]) { + temp[item]++; + } else { + temp[item] = 1; } - return output - } + } + }); - this.moveOffset = (x, y) => { - store.offset.translate(store.offset.x + x * store.scale.current * store.baseCellSize, store.offset.y + y * store.scale.current * store.baseCellSize) - this.render() + for (let key in temp) { + output.push({ + id: key, + quant: temp[key], + }); } - this.render = () => { - this._renderMainCanvas() - this._renderOverlayCanvas() + output.sort((a, b) => { + return b.quant - a.quant; + }); + + return output; + }; + + this.getCommandToDelete = (facing) => { + const numOfComs = Math.ceil((store.imageWidth * store.imageHeight) / 32768); + const output = []; + for (let i = numOfComs; i >= 1; i--) { + const tempGroup = [ + (Math.ceil(i * (store.imageHeight / numOfComs)) - 1) * store.imageWidth, + Math.floor((i - 1) * (store.imageHeight / numOfComs) + 1) * + store.imageWidth - + 1, + ]; + output.push( + this._convertGroupToCommand(tempGroup, facing).replace( + /minecraft\:.*/, + "minecraft:air" + ) + ); } - - this.init = function(rootNode) { - if (store.initFlag) { - this.reset() - return - } - store.initFlag = true - $root = rootNode - $root.style.position = 'relative' - canvasMain.style.position = 'absolute' - canvasOverlay.style.position = 'absolute' - this.setBoundingRect() - this.setBounds() - $root.appendChild(canvasMain) - $root.appendChild(canvasOverlay) - - ctxMain.imageSmoothingEnabled = false - this._setEventListeners() + return output; + }; + + this.moveOffset = (x, y) => { + store.offset.translate( + store.offset.x + x * store.scale.current * store.baseCellSize, + store.offset.y + y * store.scale.current * store.baseCellSize + ); + this.render(); + }; + + this.render = () => { + this._renderMainCanvas(); + this._renderOverlayCanvas(); + }; + + this.init = function (rootNode) { + if (store.initFlag) { + this.reset(); + return; } + store.initFlag = true; + $root = rootNode; + $root.style.position = "relative"; + canvasMain.style.position = "absolute"; + canvasOverlay.style.position = "absolute"; + this.setBoundingRect(); + this.setBounds(); + $root.appendChild(canvasMain); + $root.appendChild(canvasOverlay); + + ctxMain.imageSmoothingEnabled = false; + this._setEventListeners(); + }; } -export default MineartCanvas +export default MineartCanvas; diff --git a/app/models/convert.js b/app/models/convert.js index cffae4b..2bb00e4 100644 --- a/app/models/convert.js +++ b/app/models/convert.js @@ -1,44 +1,46 @@ -const blocks = require('../../static/baked_blocks.json') +const blocks = require("../../static/baked_blocks.json"); -onmessage = function(e) { - const blocksCopy = Object.assign({}, blocks) +onmessage = function (e) { + const blocksCopy = Object.assign({}, blocks); - e.data.exclude.forEach((item) => { - delete blocksCopy[item - 1] - }) - - const imageData = e.data.imgData + e.data.exclude.forEach((item) => { + delete blocksCopy[item - 1]; + }); - if (imageData.constructor.name != 'Uint8ClampedArray') { - console.error('not uint8!!!') - return - } + const imageData = e.data.imgData; - let output = new Uint8ClampedArray(imageData.length / 4) - - for (let i = 0; i < imageData.length; i += 4) { - let pixelRgb = { - red: imageData[i], - green: imageData[i + 1], - blue: imageData[i + 2], - alpha: imageData[i + 3] - } - if (pixelRgb.alpha > 70) { - let temp = false - for (let key in blocksCopy) { - const item = blocksCopy[key] - let dev = Math.abs(pixelRgb.red - item.red) + Math.abs(pixelRgb.green - item.green) + Math.abs(pixelRgb.blue - item.blue) - if (!temp || dev < temp.deviation) { - temp = item - temp.deviation = dev - } - } - output[i / 4] = temp.id - } else { - output[i / 4] = 0 - } + if (imageData.constructor.name != "Uint8ClampedArray") { + console.error("not uint8!!!"); + return; + } + let output = new Uint8ClampedArray(imageData.length / 4); + + for (let i = 0; i < imageData.length; i += 4) { + let pixelRgb = { + red: imageData[i], + green: imageData[i + 1], + blue: imageData[i + 2], + alpha: imageData[i + 3], + }; + if (pixelRgb.alpha > 70) { + let temp = false; + for (let key in blocksCopy) { + const item = blocksCopy[key]; + let dev = + Math.abs(pixelRgb.red - item.red) + + Math.abs(pixelRgb.green - item.green) + + Math.abs(pixelRgb.blue - item.blue); + if (!temp || dev < temp.deviation) { + temp = item; + temp.deviation = dev; + } + } + output[i / 4] = temp.id; + } else { + output[i / 4] = 0; } + } - postMessage(output) -} + postMessage(output); +}; diff --git a/app/models/counter.js b/app/models/counter.js index 2e876cd..4b86e5a 100644 --- a/app/models/counter.js +++ b/app/models/counter.js @@ -1,88 +1,94 @@ function Counter(node) { - let initFlag = false - let $root - let current = 1 - let max = 1 - let callback = null - const template = ` + let initFlag = false; + let $root; + let current = 1; + let max = 1; + let callback = null; + const template = ` - ` - const nodes = { - doubleLeft: null, - left: null, - input: null, - span: null, - right: null, - doubleRight: null - } + `; + const nodes = { + doubleLeft: null, + left: null, + input: null, + span: null, + right: null, + doubleRight: null, + }; - this._setSpan = () => { - nodes.span.innerHTML = `out of ${max}` - } + this._setSpan = () => { + nodes.span.innerHTML = `out of ${max}`; + }; - this._setEventListeners = () => { - nodes.doubleLeft.onclick = () => { - this.setValue(1) - } + this._setEventListeners = () => { + nodes.doubleLeft.onclick = () => { + this.setValue(1); + }; - nodes.left.onclick = () => { - this.setValue(current - 1) - } + nodes.left.onclick = () => { + this.setValue(current - 1); + }; - nodes.input.onchange = () => { - this.setValue(nodes.input.value) - } + nodes.input.onchange = () => { + this.setValue(nodes.input.value); + }; - nodes.right.onclick = () => { - this.setValue(current + 1) - } + nodes.right.onclick = () => { + this.setValue(current + 1); + }; - nodes.doubleRight.onclick = () => { - this.setValue(max) - } - } + nodes.doubleRight.onclick = () => { + this.setValue(max); + }; + }; - this.setValue = (int) => { - current = int - if (int < 1) { current = 1 } - if (int > max) { current = max } - nodes.input.value = current - if (callback) { - callback(current) - } - } + this.setValue = (int) => { + current = int; + if (int < 1) { + current = 1; + } + if (int > max) { + current = max; + } + nodes.input.value = current; + if (callback) { + callback(current); + } + }; - this.setMax = (int) => { - max = int - if (current > max) { - this.setValue(int) - } - this._setSpan() - } + this.setMax = (int) => { + max = int; + if (current > max) { + this.setValue(int); + } + this._setSpan(); + }; - this.setCallback = (func) => { - callback = func - } + this.setCallback = (func) => { + callback = func; + }; - this.init = (node) => { - if (initFlag === true) { return } - initFlag = true - $root = node - $root.innerHTML = template - nodes.doubleLeft = $root.querySelector('i.fa-angle-double-left') - nodes.left = $root.querySelector('i.fa-angle-left') - nodes.input = $root.querySelector('input.input') - nodes.span = $root.querySelector('span.counter-span') - nodes.right = $root.querySelector('i.fa-angle-right') - nodes.doubleRight = $root.querySelector('i.fa-angle-double-right') - this._setEventListeners() - } + this.init = (node) => { + if (initFlag === true) { + return; + } + initFlag = true; + $root = node; + $root.innerHTML = template; + nodes.doubleLeft = $root.querySelector("i.fa-angle-double-left"); + nodes.left = $root.querySelector("i.fa-angle-left"); + nodes.input = $root.querySelector("input.input"); + nodes.span = $root.querySelector("span.counter-span"); + nodes.right = $root.querySelector("i.fa-angle-right"); + nodes.doubleRight = $root.querySelector("i.fa-angle-double-right"); + this._setEventListeners(); + }; - if (node) { - this.init(node) - } + if (node) { + this.init(node); + } } -export default Counter +export default Counter; diff --git a/app/models/schematics.js b/app/models/schematics.js index 7d28251..b80df3f 100644 --- a/app/models/schematics.js +++ b/app/models/schematics.js @@ -1,30 +1,32 @@ -import Zlib from 'zlibjs/bin/zlib_and_gzip.min.js' -import Nbt from 'nbt' +import Zlib from "zlibjs/bin/zlib_and_gzip.min.js"; +import Nbt from "nbt"; function SchematicsHelper() { - this.Zlib = Zlib.Zlib + this.Zlib = Zlib.Zlib; - this.encode = (obj) => { - const writer = new Nbt.Writer() - writer.compound(obj) - const compound = new Uint8Array(writer.getData()) - const compoundName = 'Schematic' - const output = new Uint8Array(3 + compoundName.length + compound.byteLength) - output[0] = 10 - output[2] = compoundName.length - compoundName.split('').forEach((i, k) => { - output[k + 3] = i.charCodeAt(0) - }) - output.set(compound, 3 + compoundName.length) - var gzip = new this.Zlib.Gzip(output) - var compressed = gzip.compress() - return compressed - } + this.encode = (obj) => { + const writer = new Nbt.Writer(); + writer.compound(obj); + const compound = new Uint8Array(writer.getData()); + const compoundName = "Schematic"; + const output = new Uint8Array( + 3 + compoundName.length + compound.byteLength + ); + output[0] = 10; + output[2] = compoundName.length; + compoundName.split("").forEach((i, k) => { + output[k + 3] = i.charCodeAt(0); + }); + output.set(compound, 3 + compoundName.length); + var gzip = new this.Zlib.Gzip(output); + var compressed = gzip.compress(); + return compressed; + }; - this.decode = (arr, callback) => { - const gzip = new this.Zlib.Gunzip(arr) - Nbt.parse(arr, callback) - } + this.decode = (arr, callback) => { + const gzip = new this.Zlib.Gunzip(arr); + Nbt.parse(arr, callback); + }; } -export default SchematicsHelper \ No newline at end of file +export default SchematicsHelper; diff --git a/app/models/svgCroppy.js b/app/models/svgCroppy.js index c6bae3b..fa37592 100644 --- a/app/models/svgCroppy.js +++ b/app/models/svgCroppy.js @@ -1,431 +1,650 @@ function SvgCroppy() { - function setAttr(node, obj) { - for (let key in obj) { - node.setAttribute(key, obj[key]) - } + function setAttr(node, obj) { + for (let key in obj) { + node.setAttribute(key, obj[key]); } - - const store = { - style: { - cornerWidth: 20, - cornerHeight: 20 - }, - posData: { - boundingRect: null, - selectRect: { - width: 50, - height: 50, - offsetX: 0, - offsetY: 0, - minWidth: 10, - minHeight: 10 - } - }, - nodes: { - root: null, - wrapper: null, - svg: null - }, - svgNodes: { - backgroundRect: null, - selectRect: null, - selectRectMask: null, - cornerLeftTop: null, - cornerRightTop: null, - cornerLeftBottom: null, - cornerRightBottom: null, - barTop: null, - barLeft: null, - barRight: null, - barBottom: null - }, - events: { - transformed: new Event('croppytransformed') - } + } + + const store = { + style: { + cornerWidth: 20, + cornerHeight: 20, + }, + posData: { + boundingRect: null, + selectRect: { + width: 50, + height: 50, + offsetX: 0, + offsetY: 0, + minWidth: 10, + minHeight: 10, + }, + }, + nodes: { + root: null, + wrapper: null, + svg: null, + }, + svgNodes: { + backgroundRect: null, + selectRect: null, + selectRectMask: null, + cornerLeftTop: null, + cornerRightTop: null, + cornerLeftBottom: null, + cornerRightBottom: null, + barTop: null, + barLeft: null, + barRight: null, + barBottom: null, + }, + events: { + transformed: new Event("croppytransformed"), + }, + }; + + var initFlag = false; + + this._storeSetNode = (key, node) => { + if (store.nodes[key] === undefined) { + throw new Error("[SvgCroppy] Unknown key in store.nodes"); } + store.nodes[key] = node; + return node; + }; - var initFlag = false + this._storeGetNode = (key) => { + return store.nodes[key]; + }; - this._storeSetNode = (key, node) => { - if (store.nodes[key] === undefined) { - throw new Error('[SvgCroppy] Unknown key in store.nodes') - } - store.nodes[key] = node - return node - } - - this._storeGetNode = (key) => { - return store.nodes[key] + this._storeSetSvgNode = (key, node) => { + if (store.svgNodes[key] === undefined) { + throw new Error("[SvgCroppy] Unknown key in store.svgNodes"); } - - this._storeSetSvgNode = (key, node) => { - if (store.svgNodes[key] === undefined) { - throw new Error('[SvgCroppy] Unknown key in store.svgNodes') + store.svgNodes[key] = node; + return node; + }; + + this._storeGetSvgNode = (key) => { + return store.svgNodes[key]; + }; + + this._setPosDataSelectRect = (key, value) => { + switch (key) { + case "width": + if (value <= store.posData.selectRect.minWidth) { + store.posData.selectRect.width = store.posData.selectRect.minWidth; + } else if ( + value >= + store.posData.boundingRect.width - store.posData.selectRect.offsetX + ) { + store.posData.selectRect.width = + store.posData.boundingRect.width - store.posData.selectRect.offsetX; + } else { + store.posData.selectRect.width = value; } - store.svgNodes[key] = node - return node - } - - this._storeGetSvgNode = (key) => { - return store.svgNodes[key] - } - - this._setPosDataSelectRect = (key, value) => { - switch (key) { - case 'width': - if (value <= store.posData.selectRect.minWidth) { - store.posData.selectRect.width = store.posData.selectRect.minWidth - } else if (value >= store.posData.boundingRect.width - store.posData.selectRect.offsetX) { - store.posData.selectRect.width = store.posData.boundingRect.width - store.posData.selectRect.offsetX - } else { - store.posData.selectRect.width = value - } - break - case 'height': - if (value <= store.posData.selectRect.minHeight) { - store.posData.selectRect.height = store.posData.selectRect.minHeight - } else if (value >= store.posData.boundingRect.height - store.posData.selectRect.offsetY) { - store.posData.selectRect.height = store.posData.boundingRect.height - store.posData.selectRect.offsetY - } else { - store.posData.selectRect.height = value - } - break - case 'offsetX': - if (value <= 0) { - store.posData.selectRect.offsetX = 0 - } else if (value >= store.posData.boundingRect.width - store.posData.selectRect.width) { - store.posData.selectRect.offsetX = store.posData.boundingRect.width - store.posData.selectRect.width - } else { - store.posData.selectRect.offsetX = value - } - break - case 'offsetY': - if (value <= 0) { - store.posData.selectRect.offsetY = 0 - } else if (value >= store.posData.boundingRect.height - store.posData.selectRect.height) { - store.posData.selectRect.offsetY = store.posData.boundingRect.height - store.posData.selectRect.height - } else { - store.posData.selectRect.offsetY = value - } - break + break; + case "height": + if (value <= store.posData.selectRect.minHeight) { + store.posData.selectRect.height = store.posData.selectRect.minHeight; + } else if ( + value >= + store.posData.boundingRect.height - store.posData.selectRect.offsetY + ) { + store.posData.selectRect.height = + store.posData.boundingRect.height - + store.posData.selectRect.offsetY; + } else { + store.posData.selectRect.height = value; } - } - - this._setEventListeners = () => { - const $root = this._storeGetNode('root'), - $svg = this._storeGetNode('svg'), - $selectRect = this._storeGetSvgNode('selectRect'), - $cornerLeftTop = this._storeGetSvgNode('cornerLeftTop'), - $cornerRightTop = this._storeGetSvgNode('cornerRightTop'), - $cornerLeftBottom = this._storeGetSvgNode('cornerLeftBottom'), - $cornerRightBottom = this._storeGetSvgNode('cornerRightBottom'), - $barTop = this._storeGetSvgNode('barTop'), - $barLeft = this._storeGetSvgNode('barLeft'), - $barRight = this._storeGetSvgNode('barRight'), - $barBottom = this._storeGetSvgNode('barBottom') - - - const svgNodeStyleAliases = { - 'croppy-svg-corner-left-top' : 'CORNER_LEFT_TOP', - 'croppy-svg-corner-right-top' : 'CORNER_RIGHT_TOP', - 'croppy-svg-corner-left-bottom' : 'CORNER_LEFT_BOTTOM', - 'croppy-svg-corner-right-bottom' : 'CORNER_RIGHT_BOTTOM', - 'croppy-svg-bar-top' : 'BAR_TOP', - 'croppy-svg-bar-left' : 'BAR_LEFT', - 'croppy-svg-bar-right' : 'BAR_RIGHT', - 'croppy-svg-bar-bottom' : 'BAR_BOTTOM', - 'croppy-svg-select' : 'SELECT_RECT' + break; + case "offsetX": + if (value <= 0) { + store.posData.selectRect.offsetX = 0; + } else if ( + value >= + store.posData.boundingRect.width - store.posData.selectRect.width + ) { + store.posData.selectRect.offsetX = + store.posData.boundingRect.width - store.posData.selectRect.width; + } else { + store.posData.selectRect.offsetX = value; } - - const grabbed = { - el: null, - startX: null, - startY: null, - oldWidth: null, - oldHeight: null + break; + case "offsetY": + if (value <= 0) { + store.posData.selectRect.offsetY = 0; + } else if ( + value >= + store.posData.boundingRect.height - store.posData.selectRect.height + ) { + store.posData.selectRect.offsetY = + store.posData.boundingRect.height - store.posData.selectRect.height; + } else { + store.posData.selectRect.offsetY = value; } - const svgControls = [$cornerLeftTop, $cornerRightTop, $cornerLeftBottom, $cornerRightBottom, - $barTop, $barLeft, $barRight, $barBottom, - $selectRect] - - for (let key in svgControls) { - svgControls[key].addEventListener('mousedown', (e) => { - const localXY = { - x: e.pageX - store.posData.boundingRect.x, - y: e.pageY - store.posData.boundingRect.y - } - - grabbed.el = svgNodeStyleAliases[e.target.classList[1]] || svgNodeStyleAliases[e.target.classList[0]] - if (grabbed.el === undefined) { throw new Error('[SvgCroppy] Selected node is not defined in aliases') } - grabbed.startX = localXY.x - grabbed.startY = localXY.y - grabbed.oldWidth = store.posData.selectRect.width - grabbed.oldHeight = store.posData.selectRect.height - grabbed.oldOffsetX = store.posData.selectRect.offsetX - grabbed.oldOffsetY = store.posData.selectRect.offsetY - grabbed.oldEndX = store.posData.selectRect.offsetX + store.posData.selectRect.width - grabbed.oldEndY = store.posData.selectRect.offsetY + store.posData.selectRect.height - }) + break; + } + }; + + this._setEventListeners = () => { + const $root = this._storeGetNode("root"), + $svg = this._storeGetNode("svg"), + $selectRect = this._storeGetSvgNode("selectRect"), + $cornerLeftTop = this._storeGetSvgNode("cornerLeftTop"), + $cornerRightTop = this._storeGetSvgNode("cornerRightTop"), + $cornerLeftBottom = this._storeGetSvgNode("cornerLeftBottom"), + $cornerRightBottom = this._storeGetSvgNode("cornerRightBottom"), + $barTop = this._storeGetSvgNode("barTop"), + $barLeft = this._storeGetSvgNode("barLeft"), + $barRight = this._storeGetSvgNode("barRight"), + $barBottom = this._storeGetSvgNode("barBottom"); + + const svgNodeStyleAliases = { + "croppy-svg-corner-left-top": "CORNER_LEFT_TOP", + "croppy-svg-corner-right-top": "CORNER_RIGHT_TOP", + "croppy-svg-corner-left-bottom": "CORNER_LEFT_BOTTOM", + "croppy-svg-corner-right-bottom": "CORNER_RIGHT_BOTTOM", + "croppy-svg-bar-top": "BAR_TOP", + "croppy-svg-bar-left": "BAR_LEFT", + "croppy-svg-bar-right": "BAR_RIGHT", + "croppy-svg-bar-bottom": "BAR_BOTTOM", + "croppy-svg-select": "SELECT_RECT", + }; + + const grabbed = { + el: null, + startX: null, + startY: null, + oldWidth: null, + oldHeight: null, + }; + const svgControls = [ + $cornerLeftTop, + $cornerRightTop, + $cornerLeftBottom, + $cornerRightBottom, + $barTop, + $barLeft, + $barRight, + $barBottom, + $selectRect, + ]; + + for (let key in svgControls) { + svgControls[key].addEventListener("mousedown", (e) => { + const localXY = { + x: e.pageX - store.posData.boundingRect.x, + y: e.pageY - store.posData.boundingRect.y, + }; + + grabbed.el = + svgNodeStyleAliases[e.target.classList[1]] || + svgNodeStyleAliases[e.target.classList[0]]; + if (grabbed.el === undefined) { + throw new Error( + "[SvgCroppy] Selected node is not defined in aliases" + ); } + grabbed.startX = localXY.x; + grabbed.startY = localXY.y; + grabbed.oldWidth = store.posData.selectRect.width; + grabbed.oldHeight = store.posData.selectRect.height; + grabbed.oldOffsetX = store.posData.selectRect.offsetX; + grabbed.oldOffsetY = store.posData.selectRect.offsetY; + grabbed.oldEndX = + store.posData.selectRect.offsetX + store.posData.selectRect.width; + grabbed.oldEndY = + store.posData.selectRect.offsetY + store.posData.selectRect.height; + }); + } - document.addEventListener('mousemove', (e) => { - if (e.target.constructor.name !== 'HTMLHtmlElement') { - if (e.target.parentNode.getAttribute('class') !== 'croppy-svg' && !grabbed.el) { //hardcode - return - } + document.addEventListener("mousemove", (e) => { + if (e.target.constructor.name !== "HTMLHtmlElement") { + if ( + e.target.parentNode.getAttribute("class") !== "croppy-svg" && + !grabbed.el + ) { + //hardcode + return; + } + } + + if (grabbed.el) { + const startLocal = { + x: e.pageX - store.posData.boundingRect.x - grabbed.startX, + y: e.pageY - store.posData.boundingRect.y - grabbed.startY, + }; + switch (grabbed.el) { + case "CORNER_LEFT_TOP": + if ( + grabbed.oldOffsetX + startLocal.x > 0 && + grabbed.oldEndX >= + grabbed.oldOffsetX + + startLocal.x + + store.posData.selectRect.minWidth + ) { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldOffsetX + startLocal.x + ); + this._setPosDataSelectRect( + "width", + grabbed.oldWidth - startLocal.x + ); + } else if (grabbed.oldOffsetX + startLocal.x <= 0) { + this._setPosDataSelectRect("offsetX", 0); + this._setPosDataSelectRect("width", grabbed.oldEndX); + } else { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldEndX - store.posData.selectRect.minWidth + ); + this._setPosDataSelectRect( + "width", + store.posData.selectRect.minWidth + ); } - - if (grabbed.el) { - const startLocal = { - x: e.pageX - store.posData.boundingRect.x - grabbed.startX, - y: e.pageY - store.posData.boundingRect.y - grabbed.startY, - } - switch (grabbed.el) { - case 'CORNER_LEFT_TOP': - if (grabbed.oldOffsetX + startLocal.x > 0 && grabbed.oldEndX >= grabbed.oldOffsetX + startLocal.x + store.posData.selectRect.minWidth) { - this._setPosDataSelectRect('offsetX', grabbed.oldOffsetX + startLocal.x) - this._setPosDataSelectRect('width', grabbed.oldWidth - startLocal.x) - } else if (grabbed.oldOffsetX + startLocal.x <= 0) { - this._setPosDataSelectRect('offsetX', 0) - this._setPosDataSelectRect('width', grabbed.oldEndX) - } else { - this._setPosDataSelectRect('offsetX', grabbed.oldEndX - store.posData.selectRect.minWidth) - this._setPosDataSelectRect('width', store.posData.selectRect.minWidth) - } - if (grabbed.oldOffsetY + startLocal.y <= 0) { - this._setPosDataSelectRect('offsetY', 0) - this._setPosDataSelectRect('height', grabbed.oldEndY) - } else if (grabbed.oldEndY >= grabbed.oldOffsetY + startLocal.y + store.posData.selectRect.minHeight) { - this._setPosDataSelectRect('offsetY', grabbed.oldOffsetY + startLocal.y) - this._setPosDataSelectRect('height', grabbed.oldHeight - startLocal.y) - } else { - this._setPosDataSelectRect('offsetY', grabbed.oldEndY - store.posData.selectRect.minHeight) - this._setPosDataSelectRect('height', store.posData.selectRect.minHeight) - } - break - case 'CORNER_RIGHT_TOP': - if (grabbed.oldOffsetY + startLocal.y <= 0) { - this._setPosDataSelectRect('offsetY', 0) - this._setPosDataSelectRect('height', grabbed.oldEndY) - } else if (grabbed.oldEndY >= grabbed.oldOffsetY + startLocal.y + store.posData.selectRect.minHeight) { - this._setPosDataSelectRect('offsetY', grabbed.oldOffsetY + startLocal.y) - this._setPosDataSelectRect('height', grabbed.oldHeight - startLocal.y) - } else { - this._setPosDataSelectRect('offsetY', grabbed.oldEndY - store.posData.selectRect.minHeight) - this._setPosDataSelectRect('height', store.posData.selectRect.minHeight) - } - - this._setPosDataSelectRect('width', grabbed.oldWidth + startLocal.x) - break - case 'CORNER_LEFT_BOTTOM': - if (grabbed.oldOffsetX + startLocal.x > 0 && grabbed.oldEndX >= grabbed.oldOffsetX + startLocal.x + store.posData.selectRect.minWidth) { - this._setPosDataSelectRect('offsetX', grabbed.oldOffsetX + startLocal.x) - this._setPosDataSelectRect('width', grabbed.oldWidth - startLocal.x) - } else if (grabbed.oldOffsetX + startLocal.x <= 0) { - this._setPosDataSelectRect('offsetX', 0) - this._setPosDataSelectRect('width', grabbed.oldEndX) - } else { - this._setPosDataSelectRect('offsetX', grabbed.oldEndX - store.posData.selectRect.minWidth) - this._setPosDataSelectRect('width', store.posData.selectRect.minWidth) - } - this._setPosDataSelectRect('height', grabbed.oldHeight + startLocal.y) - break - case 'CORNER_RIGHT_BOTTOM': - this._setPosDataSelectRect('width', grabbed.oldWidth + startLocal.x) - this._setPosDataSelectRect('height', grabbed.oldHeight + startLocal.y) - break - case 'BAR_TOP': - if (grabbed.oldOffsetY + startLocal.y <= 0) { - this._setPosDataSelectRect('offsetY', 0) - this._setPosDataSelectRect('height', grabbed.oldEndY) - } else if (grabbed.oldEndY >= grabbed.oldOffsetY + startLocal.y + store.posData.selectRect.minHeight) { - this._setPosDataSelectRect('offsetY', grabbed.oldOffsetY + startLocal.y) - this._setPosDataSelectRect('height', grabbed.oldHeight - startLocal.y) - } else { - this._setPosDataSelectRect('offsetY', grabbed.oldEndY - store.posData.selectRect.minHeight) - this._setPosDataSelectRect('height', store.posData.selectRect.minHeight) - } - break - case 'BAR_LEFT': - if (grabbed.oldOffsetX + startLocal.x > 0 && grabbed.oldEndX >= grabbed.oldOffsetX + startLocal.x + store.posData.selectRect.minWidth) { - this._setPosDataSelectRect('offsetX', grabbed.oldOffsetX + startLocal.x) - this._setPosDataSelectRect('width', grabbed.oldWidth - startLocal.x) - } else if (grabbed.oldOffsetX + startLocal.x <= 0) { - this._setPosDataSelectRect('offsetX', 0) - this._setPosDataSelectRect('width', grabbed.oldEndX) - } else { - this._setPosDataSelectRect('offsetX', grabbed.oldEndX - store.posData.selectRect.minWidth) - this._setPosDataSelectRect('width', store.posData.selectRect.minWidth) - } - break - case 'BAR_RIGHT': - this._setPosDataSelectRect('width', grabbed.oldWidth + startLocal.x) - break - case 'BAR_BOTTOM': - this._setPosDataSelectRect('height', grabbed.oldHeight + startLocal.y) - break - case 'SELECT_RECT': - this._setPosDataSelectRect('offsetX', grabbed.oldOffsetX + startLocal.x) - this._setPosDataSelectRect('offsetY', grabbed.oldOffsetY + startLocal.y) - break - } - this.render() - $root.dispatchEvent(store.events.transformed) + if (grabbed.oldOffsetY + startLocal.y <= 0) { + this._setPosDataSelectRect("offsetY", 0); + this._setPosDataSelectRect("height", grabbed.oldEndY); + } else if ( + grabbed.oldEndY >= + grabbed.oldOffsetY + + startLocal.y + + store.posData.selectRect.minHeight + ) { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldOffsetY + startLocal.y + ); + this._setPosDataSelectRect( + "height", + grabbed.oldHeight - startLocal.y + ); + } else { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldEndY - store.posData.selectRect.minHeight + ); + this._setPosDataSelectRect( + "height", + store.posData.selectRect.minHeight + ); + } + break; + case "CORNER_RIGHT_TOP": + if (grabbed.oldOffsetY + startLocal.y <= 0) { + this._setPosDataSelectRect("offsetY", 0); + this._setPosDataSelectRect("height", grabbed.oldEndY); + } else if ( + grabbed.oldEndY >= + grabbed.oldOffsetY + + startLocal.y + + store.posData.selectRect.minHeight + ) { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldOffsetY + startLocal.y + ); + this._setPosDataSelectRect( + "height", + grabbed.oldHeight - startLocal.y + ); + } else { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldEndY - store.posData.selectRect.minHeight + ); + this._setPosDataSelectRect( + "height", + store.posData.selectRect.minHeight + ); } - }) - - document.addEventListener('mouseup', (e) => { - grabbed.el = null - grabbed.startX = null - grabbed.startY = null - grabbed.oldWidth = null - grabbed.oldHeight = null - grabbed.oldOffsetX = null - grabbed.oldOffsetY = null - grabbed.oldEndX = null - grabbed.oldEndY = null - }) - } - - this.render = () => { - const $selectRect = this._storeGetSvgNode('selectRect'), - $selectRectMask = this._storeGetSvgNode('selectRectMask'), - $cornerLeftTop = this._storeGetSvgNode('cornerLeftTop'), - $cornerRightTop = this._storeGetSvgNode('cornerRightTop'), - $cornerLeftBottom = this._storeGetSvgNode('cornerLeftBottom'), - $cornerRightBottom = this._storeGetSvgNode('cornerRightBottom'), - $barTop = this._storeGetSvgNode('barTop'), - $barLeft = this._storeGetSvgNode('barLeft'), - $barRight = this._storeGetSvgNode('barRight'), - $barBottom = this._storeGetSvgNode('barBottom') - - - setAttr($selectRectMask, { - x: store.posData.selectRect.offsetX, - y: store.posData.selectRect.offsetY, - width: store.posData.selectRect.width, - height: store.posData.selectRect.height - }) - - setAttr($selectRect, { - x: store.posData.selectRect.offsetX, - y: store.posData.selectRect.offsetY, - width: store.posData.selectRect.width, - height: store.posData.selectRect.height - }) - - setAttr($cornerLeftTop, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2), - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2) - }) - - setAttr($cornerRightTop, { - x: store.posData.selectRect.offsetX + store.posData.selectRect.width - Math.round(store.style.cornerWidth / 2), - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2) - }) - - setAttr($cornerLeftBottom, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2), - y: store.posData.selectRect.offsetY + store.posData.selectRect.height - Math.round(store.style.cornerHeight / 2) - }) - - setAttr($cornerRightBottom, { - x: store.posData.selectRect.offsetX + store.posData.selectRect.width - Math.round(store.style.cornerWidth / 2), - y: store.posData.selectRect.offsetY + store.posData.selectRect.height - Math.round(store.style.cornerHeight / 2) - }) - - setAttr($barTop, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2) + store.style.cornerWidth, - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2), - width: store.posData.selectRect.width - store.style.cornerHeight >= 0 ? store.posData.selectRect.width - store.style.cornerHeight : 0, - height: store.style.cornerHeight - }) - - setAttr($barLeft, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2), - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2) + store.style.cornerHeight, - width: store.style.cornerWidth, - height: store.posData.selectRect.height - store.style.cornerHeight >= 0 ? store.posData.selectRect.height - store.style.cornerHeight : 0 - }) - - setAttr($barRight, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2) + store.posData.selectRect.width, - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2) + store.style.cornerHeight, - width: store.style.cornerWidth, - height: store.posData.selectRect.height - store.style.cornerHeight >= 0 ? store.posData.selectRect.height - store.style.cornerHeight : 0 - }) - - setAttr($barBottom, { - x: store.posData.selectRect.offsetX - Math.round(store.style.cornerWidth / 2) + store.style.cornerWidth, - y: store.posData.selectRect.offsetY - Math.round(store.style.cornerHeight / 2) + store.posData.selectRect.height, - width: store.posData.selectRect.width - store.style.cornerHeight >= 0 ? store.posData.selectRect.width - store.style.cornerHeight : 0, - height: store.style.cornerHeight - }) - } - - this.getCropInfo = () => { - return { - offsetX: store.posData.selectRect.offsetX, - offsetY: store.posData.selectRect.offsetY, - width: store.posData.selectRect.width, - height: store.posData.selectRect.height, - boundWidth: store.posData.boundingRect.width, - boundHeight: store.posData.boundingRect.height, + this._setPosDataSelectRect( + "width", + grabbed.oldWidth + startLocal.x + ); + break; + case "CORNER_LEFT_BOTTOM": + if ( + grabbed.oldOffsetX + startLocal.x > 0 && + grabbed.oldEndX >= + grabbed.oldOffsetX + + startLocal.x + + store.posData.selectRect.minWidth + ) { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldOffsetX + startLocal.x + ); + this._setPosDataSelectRect( + "width", + grabbed.oldWidth - startLocal.x + ); + } else if (grabbed.oldOffsetX + startLocal.x <= 0) { + this._setPosDataSelectRect("offsetX", 0); + this._setPosDataSelectRect("width", grabbed.oldEndX); + } else { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldEndX - store.posData.selectRect.minWidth + ); + this._setPosDataSelectRect( + "width", + store.posData.selectRect.minWidth + ); + } + this._setPosDataSelectRect( + "height", + grabbed.oldHeight + startLocal.y + ); + break; + case "CORNER_RIGHT_BOTTOM": + this._setPosDataSelectRect( + "width", + grabbed.oldWidth + startLocal.x + ); + this._setPosDataSelectRect( + "height", + grabbed.oldHeight + startLocal.y + ); + break; + case "BAR_TOP": + if (grabbed.oldOffsetY + startLocal.y <= 0) { + this._setPosDataSelectRect("offsetY", 0); + this._setPosDataSelectRect("height", grabbed.oldEndY); + } else if ( + grabbed.oldEndY >= + grabbed.oldOffsetY + + startLocal.y + + store.posData.selectRect.minHeight + ) { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldOffsetY + startLocal.y + ); + this._setPosDataSelectRect( + "height", + grabbed.oldHeight - startLocal.y + ); + } else { + this._setPosDataSelectRect( + "offsetY", + grabbed.oldEndY - store.posData.selectRect.minHeight + ); + this._setPosDataSelectRect( + "height", + store.posData.selectRect.minHeight + ); + } + break; + case "BAR_LEFT": + if ( + grabbed.oldOffsetX + startLocal.x > 0 && + grabbed.oldEndX >= + grabbed.oldOffsetX + + startLocal.x + + store.posData.selectRect.minWidth + ) { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldOffsetX + startLocal.x + ); + this._setPosDataSelectRect( + "width", + grabbed.oldWidth - startLocal.x + ); + } else if (grabbed.oldOffsetX + startLocal.x <= 0) { + this._setPosDataSelectRect("offsetX", 0); + this._setPosDataSelectRect("width", grabbed.oldEndX); + } else { + this._setPosDataSelectRect( + "offsetX", + grabbed.oldEndX - store.posData.selectRect.minWidth + ); + this._setPosDataSelectRect( + "width", + store.posData.selectRect.minWidth + ); + } + break; + case "BAR_RIGHT": + this._setPosDataSelectRect( + "width", + grabbed.oldWidth + startLocal.x + ); + break; + case "BAR_BOTTOM": + this._setPosDataSelectRect( + "height", + grabbed.oldHeight + startLocal.y + ); + break; + case "SELECT_RECT": + this._setPosDataSelectRect( + "offsetX", + grabbed.oldOffsetX + startLocal.x + ); + this._setPosDataSelectRect( + "offsetY", + grabbed.oldOffsetY + startLocal.y + ); + break; } + this.render(); + $root.dispatchEvent(store.events.transformed); + } + }); + + document.addEventListener("mouseup", (e) => { + grabbed.el = null; + grabbed.startX = null; + grabbed.startY = null; + grabbed.oldWidth = null; + grabbed.oldHeight = null; + grabbed.oldOffsetX = null; + grabbed.oldOffsetY = null; + grabbed.oldEndX = null; + grabbed.oldEndY = null; + }); + }; + + this.render = () => { + const $selectRect = this._storeGetSvgNode("selectRect"), + $selectRectMask = this._storeGetSvgNode("selectRectMask"), + $cornerLeftTop = this._storeGetSvgNode("cornerLeftTop"), + $cornerRightTop = this._storeGetSvgNode("cornerRightTop"), + $cornerLeftBottom = this._storeGetSvgNode("cornerLeftBottom"), + $cornerRightBottom = this._storeGetSvgNode("cornerRightBottom"), + $barTop = this._storeGetSvgNode("barTop"), + $barLeft = this._storeGetSvgNode("barLeft"), + $barRight = this._storeGetSvgNode("barRight"), + $barBottom = this._storeGetSvgNode("barBottom"); + + setAttr($selectRectMask, { + x: store.posData.selectRect.offsetX, + y: store.posData.selectRect.offsetY, + width: store.posData.selectRect.width, + height: store.posData.selectRect.height, + }); + + setAttr($selectRect, { + x: store.posData.selectRect.offsetX, + y: store.posData.selectRect.offsetY, + width: store.posData.selectRect.width, + height: store.posData.selectRect.height, + }); + + setAttr($cornerLeftTop, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2), + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2), + }); + + setAttr($cornerRightTop, { + x: + store.posData.selectRect.offsetX + + store.posData.selectRect.width - + Math.round(store.style.cornerWidth / 2), + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2), + }); + + setAttr($cornerLeftBottom, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2), + y: + store.posData.selectRect.offsetY + + store.posData.selectRect.height - + Math.round(store.style.cornerHeight / 2), + }); + + setAttr($cornerRightBottom, { + x: + store.posData.selectRect.offsetX + + store.posData.selectRect.width - + Math.round(store.style.cornerWidth / 2), + y: + store.posData.selectRect.offsetY + + store.posData.selectRect.height - + Math.round(store.style.cornerHeight / 2), + }); + + setAttr($barTop, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2) + + store.style.cornerWidth, + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2), + width: + store.posData.selectRect.width - store.style.cornerHeight >= 0 + ? store.posData.selectRect.width - store.style.cornerHeight + : 0, + height: store.style.cornerHeight, + }); + + setAttr($barLeft, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2), + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2) + + store.style.cornerHeight, + width: store.style.cornerWidth, + height: + store.posData.selectRect.height - store.style.cornerHeight >= 0 + ? store.posData.selectRect.height - store.style.cornerHeight + : 0, + }); + + setAttr($barRight, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2) + + store.posData.selectRect.width, + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2) + + store.style.cornerHeight, + width: store.style.cornerWidth, + height: + store.posData.selectRect.height - store.style.cornerHeight >= 0 + ? store.posData.selectRect.height - store.style.cornerHeight + : 0, + }); + + setAttr($barBottom, { + x: + store.posData.selectRect.offsetX - + Math.round(store.style.cornerWidth / 2) + + store.style.cornerWidth, + y: + store.posData.selectRect.offsetY - + Math.round(store.style.cornerHeight / 2) + + store.posData.selectRect.height, + width: + store.posData.selectRect.width - store.style.cornerHeight >= 0 + ? store.posData.selectRect.width - store.style.cornerHeight + : 0, + height: store.style.cornerHeight, + }); + }; + + this.getCropInfo = () => { + return { + offsetX: store.posData.selectRect.offsetX, + offsetY: store.posData.selectRect.offsetY, + width: store.posData.selectRect.width, + height: store.posData.selectRect.height, + boundWidth: store.posData.boundingRect.width, + boundHeight: store.posData.boundingRect.height, + }; + }; + + this.hide = () => { + if (store.nodes.svg) { + store.nodes.svg.classList.add("croppy-hidden"); } + }; - this.hide = () => { - if (store.nodes.svg) { - store.nodes.svg.classList.add('croppy-hidden') - } + this.unhide = () => { + if (store.nodes.svg) { + store.nodes.svg.classList.remove("croppy-hidden"); } + this._storeGetNode("root").dispatchEvent(store.events.transformed); + }; - this.unhide = () => { - if (store.nodes.svg) { - store.nodes.svg.classList.remove('croppy-hidden') - } - this._storeGetNode('root').dispatchEvent(store.events.transformed) - } + this.setSizes = () => { + const $svg = this._storeGetNode("svg"); + const $svgSelectRect = this._storeGetSvgNode("selectRect"); + const $wrapper = this._storeGetNode("wrapper"); + const $root = this._storeGetNode("root"); - this.setSizes = () => { - const $svg = this._storeGetNode('svg') - const $svgSelectRect = this._storeGetSvgNode('selectRect') - const $wrapper = this._storeGetNode('wrapper') - const $root = this._storeGetNode('root') + $wrapper.style.height = $root.clientHeight + "px"; - $wrapper.style.height = $root.clientHeight + 'px' + store.posData.selectRect.width = Math.round($root.width * 0.8); + store.posData.selectRect.height = Math.round($root.height * 0.8); + store.posData.selectRect.offsetX = Math.round($root.width * 0.1); + store.posData.selectRect.offsetY = Math.round($root.height * 0.1); - store.posData.selectRect.width = Math.round($root.width * 0.8) - store.posData.selectRect.height = Math.round($root.height * 0.8) - store.posData.selectRect.offsetX = Math.round($root.width * 0.1) - store.posData.selectRect.offsetY = Math.round($root.height * 0.1) - - store.posData.boundingRect = $wrapper.getBoundingClientRect() + store.posData.boundingRect = $wrapper.getBoundingClientRect(); - this.render() - } + this.render(); + }; - this.init = (rootSelector) => { - let $root = null + this.init = (rootSelector) => { + let $root = null; - if (rootSelector.constructor.name === 'String') { - $root = document.querySelector(rootSelector) - } else { - $root = rootSelector - } + if (rootSelector.constructor.name === "String") { + $root = document.querySelector(rootSelector); + } else { + $root = rootSelector; + } - if ($root === null) { throw new Error('[SvgCroppy] rootNode is null') } + if ($root === null) { + throw new Error("[SvgCroppy] rootNode is null"); + } - this._storeSetNode('root', $root) + this._storeSetNode("root", $root); - if (initFlag) { - this.setSizes() - return - } - initFlag = true + if (initFlag) { + this.setSizes(); + return; + } + initFlag = true; - const svgTemplate = ` + const svgTemplate = `