diff --git a/README.md b/README.md
new file mode 100644
index 0000000..969618c
--- /dev/null
+++ b/README.md
@@ -0,0 +1,57 @@
+# Online Map Maker for the 42 so_long project
+
+With this **online** map maker you can visually design your own maps for the 42 so_long project and export them as a number map.
+
+If you have any suggestions or want to add features yourself, just join the project.
+
+
+
+
+# Toolbox
+
+There are several tools in the Map Maker which are explained below. New features will be added soon.
+
+## Map size
+
+**Height:** Set the height of your map
+**Width:** Set the hidth of your map
+
+if you create a big map you will have to use the zoom out feature.
+
+## Enemy Identification (so_long BONUS)
+
+If you want to create a map with enemies you can set your so_long bonus enemy char / int.
+
+## Rubber
+
+Not sure which Block you want at this Position? No problem, just use the rubber to delete the actual block.
+You dont have to use the rubber, **you can just replace the actual block with another one.**
+
+**IMPORTANT:** if you generate a map with white rubber places you will have some "6" in your number map. its only for visual purpose.
+
+## Zoom out
+
+To see the whole map, you can zoom in.
+**Be careful:** zooming in can freeze the page at the moment.
+
+## Pencils
+
+**Wall:** Draw walls (NumberMap identifier: 1)
+**Floor:** Draw the floor. Floor is the default filled block (NumberMap identifier: 0)
+**Collectible:** Draw collectibles (NumberMap identifier: 1)
+**Player/Start:** Draw start (NumberMap identifier: P)
+**Enemy:** Draw enemy (NumberMap identifier: [your choice -> default F])
+**Goal:** Draw exit (NumberMap identifier: E)
+
+## Generate
+
+just click on generate and copy your generated NumberMap!
+
+
+# Future features
+
+- **Auto Maze/Map Generator** (generate tons of maps that automatically follow the rules or are suitable for evaluations)
+- **multiple pencil settings** (like size) and tools like "**fill an area**"
+- **Custom start fill** ((currently it's the floor))
+- **Better Map graphics** (if you have good ones push them ;) )
+- **import** your current map to edit it
\ No newline at end of file
diff --git a/custom.js b/custom.js
index 702fdc9..06b2504 100644
--- a/custom.js
+++ b/custom.js
@@ -4,6 +4,7 @@ document.addEventListener("DOMContentLoaded", function () {
document.getElementById("nw").addEventListener("change", map_async);
document.getElementById("nh").addEventListener("change", map_async);
document.getElementById("generate").addEventListener("click", generate_map_code);
+ document.getElementById("close-modal").addEventListener("click", close_modal);
// Pencil Selection --> need more pencils like brush
document.querySelectorAll('.pencil').forEach(function(pencil) {
@@ -17,6 +18,13 @@ document.addEventListener("DOMContentLoaded", function () {
});
});
+ window.onload = function() {
+ setTimeout(function() {
+ document.getElementById('modal').style.opacity = 1;
+ document.getElementById('modal-content').style.transform = 'translateX(0)';
+ }, 1500);
+ };
+
// Zoom Slider --> need to be improved, a bit laggy
let zoomTimeout;
@@ -44,6 +52,10 @@ document.addEventListener("DOMContentLoaded", function () {
return numberMap;
}
+ function close_modal() {
+ document.getElementById("modal").style.display = "none";
+ }
+
// clear all visual cells from the game container
function clearCells() {
const cells = document.querySelectorAll(".cell");
diff --git a/img/screenshot.png b/img/screenshot.png
new file mode 100644
index 0000000..f077fe8
Binary files /dev/null and b/img/screenshot.png differ
diff --git a/index.html b/index.html
index fc70d50..a70a70f 100644
--- a/index.html
+++ b/index.html
@@ -14,6 +14,23 @@
42 So Long Map Maker
+
+
+
Some Informations:
+
With this map maker you can visually design your own maps for your so_long project and export them as a number map.
+ Although it's still under development, you can choose different pencils to customize your map with walls, floor, collectibles and even enemies with your specific character (like "A" or a number).
+
if you wanna scale your map (width & height) up you may have to use the zoom function.
+
BE CAREFUL: zoom in may cause page freeze at the moment
+
coming soon:
+
+
- Map Generator (generate tons of maps that automatically follow the rules or are suitable for evaluations)
+ - multiple pencil settings (like size) and tools like "fill an area"
+ - Custom start fill (at the moment it's the Floor)
+ - Better Map graphics (if you have good ones push them ;) )