[DIY] making html5 wesnoth-themed roguelike

Discuss the development of other free/open-source games, as well as other games in general.

Moderators: Forum Moderators, Developers

Post Reply
Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

[DIY] making html5 wesnoth-themed roguelike

Post by Shadow_Walker » July 27th, 2014, 4:38 pm

DOWLOADS: http://www.indiedb.com/games/wessense/downloads

Hi All,

I've been enjoying Battle for Wesnoth for many years, but now I start wondering why BfW totally escaped this html5 indie gaming hype? Where are Wesnoth-inspired fast-paced roguelikes? Polished pixel art/graphics is there, storyline is quite developed, html5 is easy to learn, but no wesnoth-driven browser-based games out there? Did I miss something? It would be really great to have one.

I'm no big expert in JS programming, but I want such game so much that I started hacking up some foundation for a single-player browser-based roguelike. Long story short: randomly generated island (forests, mountains, swamps, deserts), randomly placed monsters, kidnapped elven princess / captured old mage and one (out of six) hero to try taking this island on. Very early stage, so it is not published anywhere (no GPL violations - personal use for now).

Here are my early development screenshots (hex violated KISS principle and was eliminated, hehe):

Image
Image

More screenshots:
http://i60.tinypic.com/2gxnwjk.png
http://i59.tinypic.com/23svkwm.png

So, what do you think: is it worth working on (if there are no games like that found in the wild, of course)? Should it be a standalone game, or engine-like thing so interested games/programmers can have a jump start for their own versions, or it is a total waste of time?

UPD: latest version is available at the link below:
http://www.wessense.org/

DOWLOADS: http://www.indiedb.com/games/wessense/downloads
Last edited by Shadow_Walker on February 20th, 2016, 4:34 am, edited 7 times in total.

Yomar
Posts: 285
Joined: October 27th, 2011, 5:14 am
Contact:

Re: looking for html5 wesnoth-themed roguelike

Post by Yomar » July 27th, 2014, 7:36 pm

Very cool, I would love playing it, especially if I could choose between various classes.

User avatar
ancestral
Developer
Posts: 1108
Joined: August 1st, 2006, 5:29 am
Location: Motion City

Re: looking for html5 wesnoth-themed roguelike

Post by ancestral » July 29th, 2014, 2:19 am

That looks great!

Yes, there’s no reason not to have inspired HTML5 games.

BTW, you might be curious in Wesnoth Canvas, my (incomplete) map viewer, which is drawn in canvas.
Wesnoth BestiaryPREVIEW IT HERE )
Unit tree and stat browser
CanvasPREVIEW IT HERE )
Exp. map viewer

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 1st, 2014, 2:42 am

Okay, I'll take these replies as an overall positive response, will post updates as it goes. Thanks to everybody.

Stupid question: I am making sprite sheets (multiple images combined into one) to be used with the game. Should I embed GPL notice and wesnoth.org link directly into spritesheets (say, at the spare space at the bottom), or what is the recommended way to go? Html5 game is self-documented, and there is no obvious way to provide README file with GPL reference due to the simplest tablet-friendly, point-n-click game interface with no menus involved.

User avatar
ancestral
Developer
Posts: 1108
Joined: August 1st, 2006, 5:29 am
Location: Motion City

Re: looking for html5 wesnoth-themed roguelike

Post by ancestral » August 3rd, 2014, 6:17 am

That’s a good question. Especially with the web, I don’t believe there is any kind of specific guidance.

If it were me, what I would do is leave a GPL notice in the same directory as those files (or alternatively at the root of your whole project) and create a README at the root directory explaining where the Wesnoth files came from. I would also show this during the use of the app, by making a screen (“credits” or somethng else) that says content came from the Wesnoth project, and provide a link to the GPL. That should cover your bases.
Wesnoth BestiaryPREVIEW IT HERE )
Unit tree and stat browser
CanvasPREVIEW IT HERE )
Exp. map viewer

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 8th, 2014, 2:28 am

Okay, this freeware indie gamemaking thingie goes easier than I hoped for. JavaScript is not as bad as I expected it to be. It is more about my code, which is ugly :)

Six heroes - is it enough? Each hero will have different hack'n'slash style (melee/ranged/move/defence/quests):
Image

I managed to animate multiframe projectiles:
Image

Not sure why, but Firefox and Chrome treat requestAnimationFrame differently. Chrome tries to call it as often as possible, while I really need to get it at lower FPS to reduce CPU cycles. Not a first person shooter, so I have to throttle it manually. Ugly. Is there a way to tell browser that I don't need more than 20-30 frames per second, really?

User avatar
ancestral
Developer
Posts: 1108
Joined: August 1st, 2006, 5:29 am
Location: Motion City

Re: looking for html5 wesnoth-themed roguelike

Post by ancestral » August 8th, 2014, 3:26 pm

These problems have largely been solved already. What you need is an app engine library.

Take a look at some of these: http://html5gameengine.com
Wesnoth BestiaryPREVIEW IT HERE )
Unit tree and stat browser
CanvasPREVIEW IT HERE )
Exp. map viewer

optimother
Posts: 76
Joined: July 12th, 2014, 4:09 am

Re: looking for html5 wesnoth-themed roguelike

Post by optimother » August 8th, 2014, 4:11 pm

Congrats! Looks absolutely gorgeous, where to play it? :)
Not a first person shooter, so I have to throttle it manually. Ugly. Is there a way to tell browser that I don't need more than 20-30 frames per second, really?
Agree, should not waste energy on laptop for example without any good reason.

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 8th, 2014, 9:12 pm

ancestral wrote:These problems have largely been solved already. What you need is an app engine library.
Take a look at some of these: http://html5gameengine.com
Thanks for the pointers, but I have two issues with it: (1) most free game engines are maid specifically for side-scroller realtime platformers, while I am more into top-down turn-based strategy, (2) I will learn almost nothing new from ready-to-use engines. Already tried some, and they all have limitations, and do not solve things I plan to implement (requestAnimationFrame throttling is one example). I do use some external libraries, though. jQuery (obviously), PerlinJS for the random island mask generation, amplify.js for the event subscription handling, PathFinding.js for A* pathfinding etc.
optimother wrote:Congrats! Looks absolutely gorgeous, where to play it? :)
Thanks! Right now I keep it on my laptop. It is about ~30% ready, so it is a bit early to invite alpha testers :)

It has just minimum minimorum implemented: intro screens with character selection, island + monsters + items generation, simple autotile engine (no tile transitions, just overlaps as pictured on screenshots), barebone player control functionality (move using pathfinding, melee/ranged attacks with animations, calculate enemy damage). Villages can be (re)captured, setting player flag waiving. Enemies are positioned but standing still (no reactions / AI implemented yet - it is quite a task), and game goals are not fully tracked. Ah, and there is no final screen with happy hero and saved princess, leaving island on a luxurious Cruise Liner.

Will upload this game to some free html hosting (like Google Drive) when missing pieces are implemented.

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 9th, 2014, 12:30 am

Oh, about those heros... They should probably have appropriately heroic names, like all characters in Wesnoth do, right? Could someone point me to the rules of making typical elvish and dwarvish-sounding names in Wesnoth? Or, even better, make a few male/female names for all six playable characters: human knight / mage, elven archer / fighter, dwarven scout / dragonguard aka rifleman? Please? Dready Necromant, Ancient Lich, Elven Queen, Dwarven King and potential hostages (Elven Princess / Human Archmage) will benefit from having names too, I suppose. Don't forget unicorn - there must be one in game, with some Nature-inspired name. Island is probably going to stay unnamed, to keep it apart from official Wesnothian history. Well, if someone has a cool name for the island - so be it.

optimother
Posts: 76
Joined: July 12th, 2014, 4:09 am

Re: looking for html5 wesnoth-themed roguelike

Post by optimother » August 9th, 2014, 7:18 am

Shadow_Walker wrote:... and do not solve things I plan to implement (requestAnimationFrame throttling is one example). I do use some external libraries, though. jQuery (obviously), PerlinJS for the random island mask generation, amplify.js for the event subscription handling, PathFinding.js for A* pathfinding etc.
Nice tool set. You can use underscore.js it's quite perf. optimized and has throttle and debounce helpers. Aside of ton of other vital helpers.
Thanks! Right now I keep it on my laptop. It is about ~30% ready, so it is a bit early to invite alpha testers :)
Some while ago I started making somewhat similar game, and wanted to look how you solved the selection of melee/ranged attack. :) My idea was a mix of HoMM3 combat field (moves order), Wesnoth (attacks, villages, units) and Arachnid wars (can play it here: http://armorgames.com/play/3232/arachnid-wars-15 ).
Enemies are positioned but standing still (no reactions / AI implemented yet - it is quite a task), ..
If I understand the game correctly, the simplest thing is to start with some random actions. For example, attack hero if it can, else just crawl around some spot.

yahiko
Posts: 12
Joined: July 26th, 2014, 1:12 am

Re: looking for html5 wesnoth-themed roguelike

Post by yahiko » August 9th, 2014, 10:20 am

I like your project Shadow_Walker.

I am working on a Javascript Game and would be glad to follow your progress and have more details about your implementation.

I've already did couple of small games in the past and I "worked" several months ago on a kind of proof of concept for testing my Javascript skill with a game based on the Naruto manga
Spoiler:

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 9th, 2014, 1:51 pm

optimother wrote:Some while ago I started making somewhat similar game, and wanted to look how you solved the selection of melee/ranged attack. :) My idea was a mix of HoMM3 combat field (moves order), Wesnoth (attacks, villages, units) and Arachnid wars
Well, current game model is much like Wayward: whole island is a 512x512 grid, and every move/attack marks the end of turn. "fast" units are allowed to make two steps per turn, if terrain allows it. Ranged attacks are truly ranged (work within several square radius), melee attacks apply to adjacent squares only. For the enemy AI I plan to use Finite State Machine, because simplistic model with many IFs turned out to be a tree of about 10-15 levels deep and growing - too hard to maintain, really :)

Since we are talking about single player character / hero (not expendable), I replaced "luck" (full hit or no damage at all) with defense-based randomized damage. So, some damage is guaranteed on every attack, but it is reduced by tile/unit defense rating and randomized to achieve some gameplay variability. Same thing with wesnothian 3-5 levels per hero feature: I am currently using 30-level model, essentially 3 x 10, where every 10th level results in serious advance (improved traits, hero image changes, attack changes), while intermediate level changes just increase attack/armor/health stats by a small amount. Enemies do not progress in levels, so they are fixed to the usual 3-5 level grade.

optimother
Posts: 76
Joined: July 12th, 2014, 4:09 am

Re: looking for html5 wesnoth-themed roguelike

Post by optimother » August 9th, 2014, 3:52 pm

Shadow_Walker wrote:Well, current game model is much like Wayward: whole island is a 512x512 grid, and every move/attack marks the end of turn. "fast" units are allowed to make two steps per turn, if terrain allows it. Ranged attacks are truly ranged (work within several square radius), melee attacks apply to adjacent squares only.
I was wondering how you decide if player wants a step and melee hit or ranged attack? Or you cannot use melee attack the same turn you come to enemy?

Thanks for link will take a look at Wayward.
For the enemy AI I plan to use Finite State Machine, because simplistic model with many IFs turned out to be a tree of about 10-15 levels deep and growing - too hard to maintain, really :)
FSMs are not the solution to all problems, but absolutely capable when done right, especially when combined with other approaches for certain states.
Since we are talking about single player character / hero (not expendable), I replaced "luck" (full hit or no damage at all) with defense-based randomized damage. ....
This and later on sound very promising! ;)

Shadow_Walker
Posts: 80
Joined: July 27th, 2014, 4:34 pm

Re: looking for html5 wesnoth-themed roguelike

Post by Shadow_Walker » August 9th, 2014, 4:06 pm

optimother wrote:I was wondering how you decide if player wants a step and melee hit or ranged attack? Or you cannot use melee attack the same turn you come to enemy?
Let's say, we have a "slow" mage with just 1 move allowed per turn. Attack action ends turn, so does absense of moves. So, in this case it would be either one step, or one attack per turn. Now, we have a knight, with two moves allowed per turn. Then it would be either two steps and no attack, or one step + one attack or just one attack per turn with potential attack bonus for unspent move(s) aka "full strike". Suggestions/comments are highly appreciated.

So far it seems to work okay - when there are no enemies around, player may just move freely with no noticeable lag between turns. It is possible to click on a tile a few moves away and travel path will be created, to be automatically executed each turn. This autopath is cancelled when player is attacked or enemy is seen.

Post Reply