Get online PlanetSide 2 outfit members and show them in a table. uses jQuery & KnockoutJS. See www.redmistoutfit.com for an example (it's in the right sidebar)

member_online_status.html

<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.2.min.js" type="text/javascript"></script>
<script src="//ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js" type="text/javascript"></script>
 
<script type="text/javascript">
(function($) {
	var ViewModel = function(options) {
		var self = this;
		this.options = options;
		this.url = 'http://census.soe.com/get/ps2/outfit_member?c:limit=1000&c:resolve=online_status,character(name,battle_rank,active_profile_id)&c:join=type:profile^list:0^inject_at:profile^show:name.en^on:character.active_profile_id^to:id&id=' + this.options.outfit_tag;
		this.Members = ko.observableArray([]);
		this.HideOffline = ko.observable(true);
		this.IsLoading = ko.observable(false);
		
		this.MembersSorted = ko.computed(function(){
			// filter out records without character data
			var result = ko.utils.arrayFilter(self.Members(), function(item){
				return item.character && item.character.name;
			});
			
			// filter on/off line and sort by name.
			result = ko.utils.arrayFilter(result, function(item){
				return self.HideOffline() ? item.online_status > 0 : true;
			}).sort(function(l,r){ 
				if (!l.character || !l.character.name || !r.character || !r.character.name)
					return -1;
				return l.character.name.first_lower == r.character.name.first_lower ? 0 : (l.character.name.first_lower > r.character.name.first_lower ? 1 : -1 )
			});
			return result;
		});
		
		this.start = function() {
			self.refresh();
		}
		
		this.refresh = function() {
			self.IsLoading(true);
			$.ajax({
				dataType: "jsonp",
				url: this.url
			}).done(function ( data ) {
				self.Members(data.outfit_member_list);
				self.IsLoading(false);
			});
		}
	};
	
	$(function(){
	  	var options = { outfit_tag: '37511178772817792' };
		var viewmodel = new ViewModel(options);
		
		ko.applyBindings(viewmodel, $('#memberlist')[0]);
		viewmodel.start();
	});
})(jQuery);
</script>
<div id="memberlist">
	<div style="float:left; padding-left:10px">
		<span href="#" data-bind="visible: IsLoading">loading...</span>
	</div>
	<div style="float:left; padding-left:10px">
		<label><input type="checkbox" data-bind="checked: HideOffline" />Hide offline members</label>
	</div>
	<div style="float:right; padding-right:10px">
		<a href="#" data-bind="click: refresh">refresh</a>
	</div>
	<table width="100%" style="width:100%">
		<tr style="font-weight:bold">
			<td>
				<span>Player:</span>
			</td>
			<td>
				<span>BR:</span>
			</td>
			<td>
				<span>Playing:</span>
			</td>
		</tr>
		<tbody data-bind="foreach: MembersSorted">
			<tr>
				<td>
					<span data-bind="text: character.name.first"></span>
				</td>
				<td>
					<span data-bind="text: character.battle_rank.value"></span>
				</td>
				<td>
					<span data-bind="text: character.profile.name.en"></span>
				</td>
			</tr>
		</tbody>
	</table>
</div>

Hi @remcoros ! First of all I want to thank you. Great Script :)

I have a question:

I want to add a function that toggles between all Outfit Members and only the online Members.

My first step was to change line 16:

return self.HideOffline() ? item.online_status >= 0 : true;

But I only get 18 Items... and then an error:

Error: Unable to parse bindings. Message: ReferenceError: character is not defined; Bindings value: text: character.name.first

Do you have a hint or can you push me in the right direction?

Thanks.

hey @Gegh , it seems github didn't send any notifications about your comment (or I didn't catch it in my mail).
sorry for the delay.

I just updated this code, maybe it helps.

Also, I didn't test it with showing offline members. It's kind of left over code.
ps2 api does some weird things sometimes with returned empty character data. My code probably misses some null checks.

I'd be happy to help you. drop me a mail on: r.ros (at) proscat (dot) nl
or even better, join our teamspeak on: ts.redmistoutfit.com between 19:00 - 23:00 (GMT).

yes, ps2 changed some data structures. I updated it on our website and forum. but didn't update the gist.

let me know if it works!

btw, adding a toggle is as easy as adding a checkbox with the correct binding to HideOffline.

ie.:

<label><input type="checkbox" data-bind="checked: HideOffline" />Hide offline members</label>

I updated this gist and www.redmistoutfit.com if you want to try this out.