Support view for tracking player positions

[foreza]

Is your feature request related to a problem? Please describe.

We want to be able to track player, npc, and monster positions on the DM overview. This will allow the DM and players to more readily follow along with the store in lieu of a physical game board, as well as increase engagement with viewers / audience members who may have just joined and are not aware of the current game state.

During combat, it is hard to visualize (without physical game pieces / board) where the monsters are in relation to the party. During exploration, it is somewhat difficult to get a sense for how far the next objective or encounter is unless well described

Describe the solution you'd like

Design Specification

• [x] a) must have 2 modes - combat vs travel / exploration.
• [x] k) will ignore size categories / space for now.
• [x] c) explore mode can be free movement and can select character dots to move them about. the scale can be anything the DM wants (open / free) and the backdrop can be a png/jpg/file of their choice
• [x] j) each player will be represented by a colored dot that will also be next to their name, clicking on the character portrait / name will select them for movement. clicking anywhere else will view the detailed stats
• [x] b) combat mode should be grid based and locked down. 5mx5m tiles, initial prototype can be 50x50m. should correspond to an 'encounter' section which will show the monsters encountered. background can be a png/jpg/file of their choice
• [x] d) switching from explore to combat mode should persist the character's positions
• [ ] e) DM can spawn npcs or monsters onto the combat mode map (use a temp placeholder for now) that can correspond to the "monster" section which will mimic the character HUD
• [x] g) on combat mode, to move a character, dm and or player can select the player "tactical movement" action and then click on a cell to move that player there
• [ ] h) on explore mode, dm and or player can select player local movement (walk/hustle/run) action and then drop the character wherever (for first MVP), ignore aerial combat for now
• [ ] i) for both modes, difficult terrain / hampered movement can be ignored / enforced by the DM as requested and will not be accounted for
• [ ] f) DM can spawn npcs or generic items of interest onto the free map
• [ ] l) encounter begins will be on a different coordinate plane and will return characters back to where they came from after the encounter is over, + a small distance x/y depending on ending location in the encounter

Technical Specification

• combat mode and travel mode info should persist switching from mode to mode. store each player's coordinates for combat and travel within a JSON object (below)
• when travel -> combat, take each player's current location and place them on the nearest 5x5 corresponding to where the encounter begins and the encounter monsters / content on the other side. spawnPlayers(playerUnitCombatLoc) // spawnEncounter(otherUnitsCombatLoc)
• clicking colored dot should reference some key/UID that we bind onDOMLoaded and indicate that player is currently selected. we do not want to store all player info here. let the firebase store populate. we need only an additional reference made to link the dot on the map to the corresponding player/monster/npc
• need to extend clickable region on player to clearly indicate what triggers movement (ideally portrait and name) or a button that indicates movement onClick
• need to patch gameBoardState and update view every time a movement is done. the operations should be atomic - no other move operation should be happening. can log every atomic operation to be used later (ie: moved from lastX, lastY -> thisX, thisY
• can spawn/place npc + other game objects + units. these should all extend some base class so we can perform mass update / operations as needed in the future (ie: all of the orcs, tauren, and npcs should have the same defined abstract method move() but their distance might vary depending on what we define for base constructor)

Sample gamelocationobject:

player1 : {
uid : 1234 
locX :  15, 
locY : 10,
}, 

Sample 'persistent' gameboardstate object that we'll store locally for now

gameBoardState {

inCombat : false
currentlySelected: <gamelocationobject>
lastMoved: <gamelocationobject>

combatState {

playerUnitCombatLoc [
player1 : { locX :  15, locY : 10 }, 
player2 :  { locX :  15, locY : 10 }...
]
otherUnitsCombatLoc [
murloc : { locX :  15, locY : 10, size : tbd }, 
goblin :  { locX :  15, locY : 10, size: tbd}...
]
}

exploreState {

playerLoc [
player1 : { locX :  153, locY : 520 }, 
player2 :  { locX :  154, locY : 524 }...
]

unitLoc [
murloc : { locX :  15, locY : 10, size : tbd }, 
goblin :  { locX :  15, locY : 10, size: tbd}...
]

libraries:

https://github.com/flauwekeul/honeycomb#hexagon

resources:

http://archive.wizards.com/default.asp?x=dnd/rg/20040608a https://crobi.github.io/dnd5e-quickref/preview/quickref.html http://www.d20srd.org/srd/movement.htm http://dnd.wizards.com/products/tabletop/players-basic-rules

[foreza]

Will work more on this today

@thireven assign to me please

[foreza]

@thireven Do you think it's a good idea to re-use croppie for uploading the background image for the map?

[foreza]

As of 4d233786654297f44f44304ca4710b92770a02a3 we have basic movement (local) that is hardcoded specifically for /room/movementroom2/characters

Next step would be to persist all of these on the firestore DB and retrieve the gameBoardState / characters for rendering.

[thireven]

Do you think it's a good idea to re-use croppie for uploading the background image for the map?

Should be fine.

[foreza]

• Keep combat mode
• Redo map not in canvas, use divs / elements, 1x1, have borders, each cell is one unit
• be able to drag and drop a pin representing that character / keep track of row and index
• remove stats
• map and stats are now in 2 separate panes
• update model to use location on the room itself instead of binding to character, push to collection/room
• remove x.y location from template
• cannot have people on same cell - if you try to put them on the same cell, cancel the action
• upload image button / crop to 400x400

MVP:

have 3 monsters 3 players persist location on map drag and drop pointers

Wishlist

be able to calculate distance between enemy and player expose values X/Y to DM