Insert javascript-dependent HTML from javascript

[plack-app-gruntmaster.git] / js / 90-tracker.js

(function(){
	'use strict';

	function tick()  { return $('<span class="tick tracker-mark">✔</span>') }
	function xmark() { return $('<span class="x tracker-mark">✘</span>')    }

	function clean_tracker(){
		$('.tracker-mark').detach();
		$('.tracker-info').removeClass('tracker-info info');
	}

	var tracker;

	function update_tracker(){
		var data = localStorage.getItem('tracker_data');
		var user = localStorage.getItem('tracker_username');
		if(!data)
			return;
		data = JSON.parse(data);
		var solved = {};
		var attempted = {};
		var solvednr = 0;
		var attemptednr = 0;
		data.problems.forEach(function(e){
			if(e.solved){
				solved[e.problem] = 1;
				solvednr++;
			} else {
				attempted[e.problem] = 1;
				attemptednr++;
			}
		});

		var contests = {};
		data.contests.forEach(function(e){
			contests[e.contest] = 1;
		});

		clean_tracker();
		$('#tracker_userlink').html(data.name);
		$('#tracker_solved').html(solvednr);
		$('#tracker_attempted').html(attemptednr);
		$('#tracker_contests').html(data.contests.length);
		$('#tracker_log').attr('href', '/log/?owner=' + user);

		if(location.pathname == '/pb/')
			$('table').find('.name').find('a').each(function() {
				var id = $(this).attr('href').split('?', 2)[0];
				if(solved[id])
					$(this).parent().prepend(tick());
				else if(attempted[id])
					$(this).parent().prepend(xmark());
			});

		if(location.pathname == '/ct/')
			$('table').find('.name').find('a').each(function() {
				var id = $(this).attr('href').substr(4);
				if(contests[id])
					$(this).parent().prepend(tick());
			});

		if(location.pathname == '/log/')
			$('table').find('tbody').find('tr').each(function() {
				if($(this).find('.owner').find('a').attr('href') != '/us/' + user)
					return;
				$(this).find('.id').append($(this).find('.r0').size() ? tick() : xmark());
			});

		if(location.pathname.match(/^\/st\//) || location.pathname == '/us/')
			$('table').find('tbody').find('tr').each(function() {
				if($(this).find('.user').find('a').attr('href') == '/us/' + user)
					$(this).addClass('info tracker-info');
			});
	}

	function start_tracking(user){
		localStorage.setItem('tracker_username', user);
		$('#tracker_userlink').attr('href', '/us/' + user).html(user);
		tracker.removeClass('hidden');
		update_tracker();
		var lastfetch = localStorage.getItem('tracker_lastfetch');
		if(Date.now() - lastfetch > 60 * 10 * 1000)
			refresh_tracker();
	}

	function refresh_tracker(){
		var user = localStorage.getItem('tracker_username');
		var xhr = new XMLHttpRequest();
		xhr.open('GET', '/us/' + user + '?format=json');
		xhr.onload = function () {
			localStorage.setItem('tracker_data', this.responseText);
			localStorage.setItem('tracker_lastfetch', Date.now());
			update_tracker();
		};
		xhr.send();
	}
	window.refresh_tracker = refresh_tracker;
	window.start_tracking = start_tracking;

	function stop_tracking(){
		clean_tracker();
		localStorage.removeItem('tracker_username');
		localStorage.removeItem('tracker_data');
		localStorage.removeItem('tracker_lastfetch');
		tracker.addClass('hidden');
	}

	$( document ).ready(function(){
		tracker = $('<div id="tracker" class="hidden">Tracking <a id="tracker_userlink"></a>.<br><a id="tracker_stop" role="button">Stop tracking</a><br><a id="tracker_log">Job log</a><dl class="dl-horizontal"><dt>Solved</dt>    <dd id="tracker_solved">?</dd><dt>Attempted</dt> <dd id="tracker_attempted">?</dd><dt>Contests</dt>  <dd id="tracker_contests">?</dd></dl></div>');
		tracker.prependTo($('#sidebar'));
		$('#tracker_stop').on('click', stop_tracking);
		$('#track_user').on('click', function() { stop_tracking(); start_tracking($(this).data('user')) });
		$('#submitform').on('submit', function() { localStorage.removeItem('tracker_lastfetch') });

		if(localStorage.getItem('tracker_username'))
			start_tracking(localStorage.getItem('tracker_username'));
	});
})();