Table of Contents
The scene is split into 2 halves and configured for Isometric view only. 1 with the 3D Iso world and the other with the HTML player controller. Use the controller in blue to move your cube avatar from the starting point around the field.
- Use the player controller to move Up Left, Up Right, Down Left or Down Right within the connected nodes.
- Desktop - Click & Drag from the center circle to 1 of the 4 directional options.
- Mobile - Swipe from the center circle to 1 of the 4 directional options.
Only the movement options are active.
What to Do
Using the player controller, select a direction in which your avatar would be able to travel on the node map. Avatar Travel requires a lined connection and cooresponds to the directions of Up Left, Up Right, Down Left and Down Right based on the user's location to the connected node.
- node-grid-gen : Generates the numbered grid, lines, colors, positions, layout and animation stack for each node. Every node that has a line connecting to 1 of it's 4 sides generates an animation to that line's end position which activates from an event naming scheme of node#to-node#. As well as an accompanying entity with it's own reveal and hide animation when the user moves to and from that node specifically.
- player-travel : Hardwired logic for traversing the node map in it's current form, animation event timings, the player controller inputs as well as event emitters for all possible movements that activate the avatar's position animation./li>
If you are a quick swiper you can move quite fast and even off the line animation grid to kind of fly through to your destination. This is an interesting side effect of the current implementation which simply animates the user to the node's current position and that animation being updated on each subsequent directional input. Otherwise it seems that you would have to create an animation queue to cycle through the selected list in a a-timeline as animations will conflict with each other if they share the same properties at the same time.
What I want to build upon this, in the future...
This effect in VR finally and support the normal click / swipe to start a drag, click to stop drag or drag to option for selection which seems to cover Desktop, Mobile and VR controller. Or instant / activated hover select dragging with additional control selections similar to the locomotion belt controller in the Hub scene. And allow the user to travel this node map with the teleportation mode types as well.