im working on making a roguelike game and I decided to post my progress here, maybe this might help someone with their games in the future. roguelike game demo11-3-2022_12-49-33.wick
wasd to move
mouse to aim
left click to use your weapon
Things to add:
I might be able to help a bit. I just discovered the wick editor though and want to find out, what it is capable of, but I am a flash and js veteran.
I don’t know how far you progressed since you posted this or if you are still working on it, but there are different ways to achieve what you want.
Very simple ones that work for just this exact type of level, or advanced ones, that gives you more power later on.
I would probably make use of a physics libary, like Box2D, which might look scary at first look, but gives very nice results.
So you would define your walls as static boxes(that cannot move) and the player and the enemies as a circle with a given size and mass and friction. Moving would mean applying a force to them. All a bit complex, but it also means that you get effects like pushed back by a stroke.
You can have magic projectiles that bounce of enemies for example and have all the logic and movement done by the engine.
The simple solution would be to all do this by hand.
Which is easy, but exhausting with the walls, so you can only move in one direction, if there is not alreay a wall.
So instead of simple
if (key === 'a') {
this.x -= 5
}
We would have to check if it is a allowed move
if (key === 'a' && isPointAllowed({x:this.x-5, this.y}) {
this.x -= 5
}
And the logic to work
var forbiddenAreas=[ {x:0,y:0,w:64,h:64*4},{x:64,y:0,w:64*3,h:64*2}]
function isPointAllowed(p){
for(var i=0;i<forbiddenAreas.length;i++){
if (isPointInRectangle(p,forbiddenAreas[i])
return 1
}
}
function isPointInRectangle(p,r){
if(p.x>r.x && p.x< r.x+w && p.y>r.y && p.y< r.y+h )
return 1
}
But you also would have to do that with the enemies. And you cannot make things as easy, as having a explosion that pushes game objects around as you would have to check for every element, if it is a aloowed position and if it is not a allowed position than where to place to instead etc.
I play around a bit with it, and might post a update to your game.
please that seems complicated and would take forever for me as I don’t have that much time each day do do that.
Well, I do not really have that much time either, as I work on a more elaborate game I wanted to publish before christmas, but did not because it is just not done and polished …
(I use the wick editor for some animation assets in the game).
But doing that code here is easy routine for me - except I have to figure out, how to make javascript functions globally accessible. That is not as straightforward as I would have expected and hoped, otherwise I really like the wick editor.
Well, debugging code in the wick editor is not really pleasant, but I got it working.
roguelike game demo12-27-2022_19-39-20.wick (31.5 KB)
This is the main logic, so far only the top left corner is defined, you can add all the other corners easily, by doing some basic math …
window.forbiddenAreas=[ {x:0,y:0,w:64,h:64*4},{x:64,y:0,w:64*3,h:64*2}]
function isPointAllowed(p){
for(var i=0;i<forbiddenAreas.length;i++){
if (isPointInRectangle(p,forbiddenAreas[i]))
return 0
}
return 1
}
window.isPointAllowed=isPointAllowed
window.isPointInRectangle=isPointInRectangle
function isPointInRectangle(p,r){
if(p.x>r.x && p.x< r.x+r.w && p.y>r.y && p.y< r.y+r.h )
return 1
}Ok, so as a bonus, this addition defines also the bottom left walls.
window.forbiddenAreas=[ {x:0,y:0,w:64,h:64*4},{x:64,y:0,w:64*3,h:64*2}, {x:0,y:384,w:64,h:64*3},{x:64,y:512,w:64*3,h:64*2}]
Basically you define a rectangele {x,y,w,h} with the position and size of the box, that is forbidden to move
edit: I suggest you to try to understand it yourself, it just looks like scary, but is quite simple
In either case, here is the demo working with wallcollision
thanks I might use this