Introduction
With the ends of both phases 2 and 3 of game development in sight, this seemed like a good moment for some code spring cleaning.
I've grouped lots of changes in this contribution - all under the same umbrella theme of clean-up. The changes include increasing code robustness, adding tools to detect and understand bugs, and removing some bugs found to date.
The full list of new features are:
- Developer tools settings panel and icon
- Robustness of transitions
- Removal of event listeners during transitions
- Adding board border
There bugs removed were:
- Reworking screen resolution
- Land discovery error correction
- Removal of off-board click error
Phases 2 (Resources, Goods, Building, and Trade Contracts) and 3 (Conflicts) of Archipelago development are now well underway.
For a full view of the current state of the game development see my github-hosted page.
https://miniature-tiger.github.io/archipelago/
Please note that the game is not yet complete - you can see current progress and test functionality but you will have to wait a little longer to play!
Background details of the project can be found at the end of this contribution post.
Repository
The repository for Archipelago can be found here:
https://github.com/miniature-tiger/archipelago
New Features covered by this Contribution
Developer tools settings panel and icon
Finding the reason behind the game not running as expected has often proved difficult. To remedy this I've added some developer / debugging tools - something which has been on my wish-list for a while.
A developer panel has been added to the settings cog and can be launched by clicking on the new spanner icon. Currently there are two options: the first allows the work flow of the game to be monitored in the console.log, the second provides very detailed comments of the piece transition and tile movements. These have brought a lot of clarity to the code running and should show where methods are overlapping or running out of the desired order.
The code changes for the above new feature can be found here:
https://github.com/miniature-tiger/archipelago/pull/65/files
Robustness of transitions
I've been wanting to improve the robustness of the code for a while with the aim of making sure everything runs smoothly before computer opponents are added to an already complex mix.
The area most at risk of errors is code running while the transitions are being completed. Previously setTimeout delays were used to force the code to wait for the requisite amount of time. In the new version transitionend event listeners have been applied to recognise the completion of board piece transitions and the game work flow has been reorganised to only proceed once the transitions are complete. This should make the automation of movement more robust and prevent data slippages corrupting play.
The code changes for the above features can be found here:
https://github.com/miniature-tiger/archipelago/pull/59/files
Removal of event listeners during transitions
Along similar lines to the above, all event listeners are now disabled while transitions are on-going. This prevents a new move being applied or a new turn being commenced while an existing transition is still underway.
The code changes for the above features can be found here:
https://github.com/miniature-tiger/archipelago/pull/61
Adding board border
In a broadly unrelated change I've added a border around the edge of the game board. Well, it looks kind of cleaner, no?
The code changes for the above features can be found here:
https://github.com/miniature-tiger/archipelago/pull/64/files
Bug extermination covered by this Contribution
Reworking screen resolution
There were a few issues with the layout on different size displays, including the footer commentary overlay blocking the end turn button (thanks to 
Changes were made to the following areas to make sure they scaled correctly on different sized screens.
- Surround sizes
- Archipelago logo
- Font size in dashboards and on commentary
- Drawing of tiles (their width and gaps around them)
- Next turn button
Hopefully that captures everything!
The code changes for the above correction can be found here:
https://github.com/miniature-tiger/archipelago/pull/60/files
Land discovery error correction
The land discovery method was causing errors at the edge of the board due to incorrect boundaries on valid tile numbers when searching for land. This has now been corrected.
The code changes for the above correction can be found here:
https://github.com/miniature-tiger/archipelago/pull/63/files
Removal of off-board click error
Clicking on the board node but not on the tile area was creating errors as movement.js tried to process moves to invalid tiles (i.e those above row/col or those less than zero). Now corrected.
The code changes for the above correction can be found here:
https://github.com/miniature-tiger/archipelago/pull/62/files
Proof of Work Carried Out
This is the full url to my github account:
https://github.com/miniature-tiger
All a little on the dull side but on to more exciting things next time!
That is all for this update. If you have any queries please drop them in the comments or contact me on discord.
Details of the Archipelago Project
What is the Project About?
Archipelago is a new project that I have been working on. The aim is to develop a seafaring and trading turn-based strategy game. Players will guide their ships around the islands, searching for goods to aid construction of ships and their bases, trading with the Kingdom settlements and avoiding hazards like pirates and whirlpools.
Technology Stack
The project is a browser based game:
- Mechanics: Javascript
- Visuals: HTML and CSS initially but now moved across to Canvas and SVG.
Roadmap
Phase 1 - the first main goal of getting ships on the board and moving at different speeds under the influence of the compass is complete.
The graphics overhaul is also now complete.
Work is now ongoing on Phase 2 which is resource discovery, goods production, building and the trade contracts that underlie the game.
Work has also begun on adding pirates and conflicts.
Phase 1 - Board and ship movement: COMPLETE!!!
- Board set up - COMPLETE
- Basic ship creation: functionality and graphics - COMPLETE
- Manual ship movement and board updating - COMPLETE
- Basic compass creation: functionality and graphics - COMPLETE
- Turn based activity of ship movement - COMPLETE
- Logic of length of longer moves around obstacles - COMPLETE
- Chaining together transitions to allow graphics of longer moves - COMPLETE
- Separation of board layers (Canvas base layer, Canvas activation layer overlay, SVG piece overlays) - COMPLETE
Phase 2 - Resources, Goods, Building and Trade Contracts
Resources
- Add Resource tiles (forest, ironworks, flax, gold etc) - in progress: forest, ironworks, quarry, plantation added
- Discovery of resource tiles - COMPLETE
- Claiming of resource tiles - COMPLETE
- Dashboard of player pieces - COMPLETE
Goods
- Creation of new goods each turn - COMPLETE
- Loading, unloading and transportation of goods - COMPLETE
- Dashboard of goods pieces - COMPLETE
- Goods icons - COMPLETE
- Variable quantity of goods to be loaded / unloaded - COMPLETE
Contracts for delivery:
- Semi-random (equitable) generation of trade delivery contracts - COMPLETE
- Creation of trade settlements - COMPLETE
- Dashboard for contracts - COMPLETE
- Mechanics for contract sign-up - COMPLETE
- Mechanics for contract delivery - COMPLETE
- Island naming: for describing location of trading settlements - COMPLETE
- Graphics of trade routes - COMPLETE
- Continuance of contracts over time
- Breaking of contracts due to interference
Building (On hold - decide if necessary once contracts implemented)
- Recipes, time to implement, graphics etc
Scoring:
- Work out scoring mechanism (linked to contracts)
- Add score dashboard
Phase 3 - Conflicts
Pirates
- Add pirate ships - COMPLETE
- Automate pirate ship movements (basic movement with wind and search for cargo ships) - COMPLETE
- Search - telescope range of 5 tiles for stronger search for ships - COMPLETE
- Consider separate cargo and war ships for teams
Forts
- Add fort icons - COMPLETE
- Create safe harbour from pirate ships - COMPLETE
Conflicts
- Attack - Develop conflict method between ships - COMPLETE
- Stealing of cargo - COMPLETE
- Limping back to harbour - COMPLETE
- Ship repair - COMPLETE
Phase 4 - Game Management and Settings
Settings
- Settings pop up box created - COMPLETE
- Options added - In progress - game speed added, developer tools added
- Local options (player name etc)
- Game saving and replay
Phase 5 - Central trading centre
- Develop central market allowing players without resources to trade and fulfill contracts
Phase 6 - One player version development
Artificial Intelligence levels for computer players
Phase 7 - Rules, roll-out, documentation, testing etc
Contact / Contribute
You can get in touch with me on discord if you would like to contribute.
You can find the current state of the game here:
https://miniature-tiger.github.io/archipelago/
The repository for the project is here:
https://github.com/miniature-tiger/archipelago
Have fun!