
function GUI() {
	this.api = 'http://lahdenvuo.info/social/';

	// Will be loaded later.
	this.channels = null;
	this.channel = null;
	this.graph = null;
	this.current = '';
	this.inflation = 8;
	this.currentReq = null;
}

GUI.prototype.loadChannels = function(cb) {
	var self = this;

	d3.json(self.api + 'graph', function (channels) {
		self.channels = channels;

		var chan = window.location.hash.substr(1);

		self.channel = (channels.indexOf(chan) !== -1) ? chan : channels[0];

		cb();
	});
};

GUI.prototype.initGUI = function() {
	var self = this;

	var gui = self.gui = new dat.GUI();

	gui.close();

	gui.add(self, 'fullscreen')
		.name('Toggle Fullscreen');

	gui.add(self, 'channel', self.channels)
		.name('Select Channel')
		.onFinishChange(self.loadGraph.bind(self));

	var algos = gui.addFolder('Algorithms');
	algos.open();

	self.bfsButt = algos.add(self, 'bfs')
		.name('BFS');

	algos.add(self, 'inflation', 2, 40).step(1)
		.name('Inflation');
	self.clusterButt = algos.add(self, 'cluster')
		.name('Markov Clusters');
};

GUI.prototype.bfs = function () {
	var self = this;

	if (self.current === 'bfs') {
		self.bfsButt.name('BFS');
		self.loadGraph();
		return;
	}

	self.bfsButt.name('Select start node');

	self.graph.elements.nodes.on('click.bfs', function (node) {
		deleteGraph();
		self.bfsButt.name('Close BFS');
		self.graph.elements.nodes.on('click.bfs', null);
		self.graph = undefined;
		self.current = 'bfs';

		d3.json(self.api + 'bfs/' + self.channel + '/' + escape(node.label) + '.json', function (data) {
			self.graph = initTree(data);
		});
	});
};

GUI.prototype.cluster = function () {
	var self = this;

	if (self.current === 'cluster') {
		self.clusterButt.name('Markov Clusters');
		self.loadGraph();
		return;
	}

	self.current = 'cluster';
	self.clusterButt.name('Loading Clusters...');

	self.currentReq = d3.json(self.api + 'clusters/' + self.channel + '/' + self.inflation + '.json', function (data) {
		deleteGraph();
		self.clusterButt.name('Close Clusters');
		self.graph = initClusters(data);
	});
};

GUI.prototype.loadGraph = function () {
	var self = this

	self.clusterButt.name('Markov Clusters');
	self.bfsButt.name('BFS');

	if (self.currentReq) {
		self.currentReq.abort();
		delete self.currentReq;
	}

	if (this.graph) {
		deleteGraph();
	}

	d3.json(self.api + 'graph/' + self.channel + '.json', function (data) {
		window.location.hash = self.channel;
		self.graph = initGraph(data);
		self.current = 'graph';
	});
};

GUI.prototype.fullscreen = function () {
	if (!document.fullscreenElement &&    // alternative standard method
		!document.mozFullScreenElement && !document.webkitFullscreenElement) {  // current working methods
		if (document.documentElement.requestFullscreen) {
			document.documentElement.requestFullscreen();
		} else if (document.documentElement.mozRequestFullScreen) {
			document.documentElement.mozRequestFullScreen();
		} else if (document.documentElement.webkitRequestFullscreen) {
			document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
		}
	} else {
		if (document.cancelFullScreen) {
			document.cancelFullScreen();
		} else if (document.mozCancelFullScreen) {
			document.mozCancelFullScreen();
		} else if (document.webkitCancelFullScreen) {
			document.webkitCancelFullScreen();
		}
	}
};

GUI.prototype.init = function () {
	var self = this;

	self.loadChannels(function () {
		self.initGUI();

		

		self.loadGraph();
	});
};
@@ -896,75 +896,8 @@
 );%0A%0A
-%09algos.add(self, 'inflation', 2, 40).step(1)%0A%09%09.name('Inflation');%0A
 %09sel
@@ -967,16 +967,158 @@
 ters');%0A
+%09algos.add(self, 'inflation', 2, 50).step(1)%0A%09%09.name('Inflation').onFinishChange(function () %7B%0A%09%09%09self.current = '';%0A%09%09%09self.cluster();%0A%09%09%7D);%0A
 %7D;%0A%0AGUI.
@@ -3495,18 +3495,16 @@
 GUI();%0A%0A
-%09%09
 %0A%0A%09%09self

Update clusters when inflation is changed.