/**
 * Created by house on 12/02/15.
 */
function scrollerTile(item, type, addStyle) {
	var classList = "", lockedHTML = "", statusHTML= "", tileHTML = [], tileImage = "", subText = "";
	// If colour required add to class list.
	//console.log(item.supervisor.id == me.user.id);
	if (addStyle) {
		if ((type == "student")) {
			// If in a group.
			if (item.group != null) {
				// If has a project.
				if (item.group.project != null) {
					// If my project.
					if (item.group.project.supervisor.id == me.user.id) {
						classList += " blueStatus"; //classList += " blueTile";
					}
					else {
						classList += " greenStatus"; //classList += " greenTile";
					}
				}
				else {
					classList += " yellowStatus"; //classList += " yellowTile";
				}
			}
			else {
				classList += " redStatus"; //classList += " redTile";
				//statusHTML += "<div class='circleStatus redStatus'></div>";
			}
		}
		else if (type == "project") {
			subText = '<span class="tileSubText"><a href="/profile.php?type=staff&id='+ item.supervisor.id + '">' + item.supervisor.name + '</a></span>'
			if (item.group != null) {
				lockedHTML = "<span class='banner'>Taken</span>";
			}
			if (item.supervisor.id == me.user.id) {
				classList += " blueStatus"; //classList += " blueTile";
			}
		}
		else if (type == "group") {
			// If project.
			if (item.project != null) {
				if (item.project.supervisor.id == me.user.id) {
					classList += " blueStatus"; //classList += " blueTile";
				}
				else {
					classList += " greenStatus"; //classList += " greenTile";
				}
			}
			else {
				classList += " yellowStatus"; //classList += " yellowTile";
			}
		}
	}
	// If image then add image tag
	if (item.role)  { tileImage = '<span class="tileImage"><img class="tilePic" src="/uploads/' + md5(item.email) + '"/></span>'; }
	else { tileImage = ''};
	// Set class list
	classList = " class='tileLi tileLi" + type + classList + "'";

	// Create tile from HTML segments and return as a string.
	tileHTML.push(
		'<li ' + classList + '>',
		'<div class="fillLi">',
		'<div class="tile-title"><a href="/profile.php?type=' + type + '&id='+ item.id + '">' + item.name + '</a></div>',
		tileImage,
		subText,
		lockedHTML,
		statusHTML,
		'</a>',
		'</div>',
		'</li>'
	);
	return tileHTML.join("");
}

function scrollerHTML(data, type, addStyle) {
	if (data && data.length > 0) {
		var item, HTML = [];
		for (var i = 0; i < data.length; i++) {
			item = data[i];
			HTML.push(scrollerTile(item, type, addStyle));
		}
		HTML.push('<div class="scrollerPlaceholder noBottomMargin displayNone hideTile"><div class="text-info text-center">There\'s nothing to show here...</div></div>');
		return HTML.join("");
	}
	else {
		return false;
	}
}

function scroller(element) {
	var $frame = $(element);
	var $wrap = $frame.parent();

	// Call Sly on frame
	$frame.sly({
		horizontal: 1,
		itemNav: 'basic',
		smart: 1,
		activateOn: 'click',
		mouseDragging: 1,
		touchDragging: 1,
		releaseSwing: 1,
		startAt: 0,
		scrollBar: $wrap.find('.scrollbar'),
		scrollBy: 1,
		pagesBar: $wrap.find('.pages'),
		activatePageOn: 'click',
		speed: 300,
		elasticBounds: 1,
		easing: 'easeOutExpo',
		dragHandle: 1,
		dynamicHandle: 1,
		clickBar: 1,

		// Buttons
		prevPage: $wrap.find('.prevPage'),
		nextPage: $wrap.find('.nextPage')
	});

	$(window).resize(function(e) {
		$frame.sly('reload');
	});
};

function generateScroller(ulClass, data, type, addStyle) {
	var scroller = scrollerHTML(data, type, addStyle);
	if (!scroller) {
		//Set max size of thing.
		document.querySelector(ulClass).className = document.querySelector(ulClass).className + " fullWidth";
		return '<div class="scrollerPlaceholder noBottomMargin displayNone"><div class="text-info text-center">There\'s nothing to show here...</div></div>';
	}
	else {
		return scroller;
	}
}
@@ -1075,16 +1075,17 @@
 %3C/span%3E'
+;
 %0A%09%09%09if (
@@ -1352,24 +1352,166 @@
  != null) %7B%0A
+%09%09%09%09subText = '%3Cspan class=%22tileSubText%22%3E%3Ca href=%22/profile.php?type=project&id='+ item.project.id + '%22%3E' + item.project.name + '%3C/a%3E%3C/span%3E';%0A
 %09%09%09%09if (item

Add project name as subtext to group tile.