Using plain javascript and canvas, let's create a level that looks and act like the game Lemmings.
Specifics are:
- randomly generated textures using some noise function, the most important here is that it looks smooth and colorful
- randomly generated map using some noise function - the map should be drawn on a 960x960 canvas - it should be easy to do collision detection against the generated map.
- we want to draw the map
- need to implement all the types of lemmings (blocker, bomber, floater etc)
- we also want to make sure the lemmings automatically move and collide on the map, we want one of each type spawned on the map at start
Instead of giving me the implementation to everything right away, generate prompts I can give to you in
portions to eventually get a full implemention. We have to do it this way because of the context window size.
After each time you replied to a prompt, you should tell me what I should ask from you next. Also tell me what code I would need to include, if any, to get an answer.
---------------------
Like the game Lemmings, I want to procedurally generate a random map of platforms which the lemmings walk on.
The platforms are made of dirt, background color is black, here and there there should be water.
Also come up with a solution to efficiently do collision detection between lemmings and the map.
The map should be drawn on a canvas using plain javascript. Give me only the code, no explanation is needed other
than comments in the code.
----
Like the game Lemmings, I want to procedurally generate a random map of platforms which the lemmings walk on.
The platforms are layered from top to bottom and are made of dirt, the background color is black, there is
rock here and there. At the bottom there should water.
Use perlin noise with fractal brownian motion to generate the platforms and the rock.
Make sure that we have some continuous platforms and not a map filled with randomness.
I'll draw an example map in ASCII:
|------------------------------------------|
| #### # |
| ================###### ## |
| #### |
| ### ========================= |
| #### ### |
| #### =========== #### |
| #### #### |
| ### =======================#######|
| ###### ##### |
|%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%|
% is blue water
| and - is canvas border
= is brown dirt platform
Just because the ASCII map is all squares, does not mean the elements of the map should be. In fact, the
map should look organic, mountainy and rough.
The API for the noise generator looks like this:
const noiseGenerator = new ImprovedNoise();
const noiseValue = noiseGenerator.noise(x * noiseScale * frequency, 0, 0) * 0.5 + 0.5;
The map should be drawn on a canvas using plain client-side javascript. Give me only the code, no explanation is needed other
than comments in the code.