2/9/2016 - NAS Tools Team Builder

Introduction

I put up a new version of the Ninja All Stars Tools. The biggest feature this time around is the Team Builder. Which allows you to create a team roster of any of the clans and Ronin. It displays your teams stats, keywords, and abilities.

Here's an intro video for it.

Technical

The Team Builder page is basically a stand alone client side application. Written using php, html, css, javascript, and json. For Libraries it's currently using jQuery and jQuery UI. On page load the first thing the app does is load json data for the keywords, and the models. It puts them into what I'm calling an object store which is pretty much a wrapper of accessor methods around the raw json data. The data is being pulled from two previous pages that I wrote. The models page and the keywords page. Notice that both of those pages have json buttons. That data in it's json format is available for use to pretty much any website.

You may be asking what is JSON or you might already know; in either case let's look at an example. 


"model_74":{
	"clan":null,
	"type":"ronin",
	"name":"Arashikage",
	"mv":6,
	"at":5,
	"df":2,
	"kb":23,
	"upkeep":6,
	"affinity":"Fire, Water",
	"allowance":"0-1",
	"keywords":[
		"Close Combat Master",
		"Combined Attack","Entangle",
		"Leap",
		"Resilient",
		"Ronin"
	],
	"abChoice":0,
	"flavor":"Arashikage can call upon both Fire and Water styles with equal skill,
	and this blending showed him his true path, as a perfect balance of schools and clans.
	That balance shattered when he witnessed his fellow students apparently murder his Tora master.
	He swore revenge and has wandered in search of the killer ever since. ",
	"affinityNote":null,
	"abilities":[
		{
			"type":"required",
			"name":"Ranged 5",
			"description":"-2at, Stealthy"
		},{
			"type":"required",
			"name":"Cobra Strike",
			"description":"When Arashikage makes a non-ranged attack
			against a ninja that is on non elevated terrain
			while he is on elevated terrain he gets +2at"
		}
	]
},
This is Arashikage from the model json output, and only him. It comprises all al his stats keywords and abilities into a format that javascript can read natively. It's sort of a like a CSV but with arrays and sub objects. With JSON you can model relatively complex data and accessing the parts you need is easy.

After the JSON gets loaded I emit out an event telling the Team Builder page to build out its clan and ronin lists. The Drag and Drop functionality I get pretty much pain free from jQuery UI. Once the page is loaded with it's data after that point it's a client side only application. It doesn't have a need to poll back to the server for any of it's data. That also means that any interactions the user has with the page is impermanent, and will simply vanish with a page reload. However setting up a roster literally takes only a minute or so and it's a trade off for now.

Future Development

The most most requested feature is the Team Advancement. It's also the least straight forward to implement.