app.directive('messageLogScroll', function ($timeout, $rootScope, bunkerData) {
	return {
		scope: {
			onScrollTop: '&'
		},
		link: function ($scope, elem) {
			var el = elem[0];
			var tolerance = 31;
			var clearMessageCounter = 0;

			$rootScope.$on('bunkerMessaged', function(evt, message) {
				if(message.room.id == $rootScope.roomId) {
					if (el.scrollTop + el.clientHeight + tolerance >= el.scrollHeight) { // We're at the bottom
						// Check for images
						var image = angular.element('#' + message.id).find('img');
						if (image.length) { // If we have an image, wait for it to load before scrolling
							image.load(function () {
								scroll(250);
							});
						} else { // Otherwise scroll immediately
							scroll();
						}

						// if the user is only watching new messages, trim the message log
						clearMessageCounter++;
						if (clearMessageCounter > 5) {
							bunkerData.clearOldMessages($rootScope.roomId);
							clearMessageCounter = 0;
						}
					} else {
						clearMessageCounter = 0;
					}
				}
			});

			// Watch scrolling to top, execute given function
			angular.element(el).bind('scroll', function () {
				if (el.scrollTop == 0 && angular.isFunction($scope.onScrollTop)) { // We're at the top
					var originalHeight = el.scrollHeight;
					$scope.onScrollTop().then(function () {
						$timeout(function () {
							el.scrollTop = el.scrollHeight - originalHeight;
						});
					});
				}
			});

			// Scroll after state changes
			$scope.$on('roomIdChanged', function () {
				scroll();
			});

			$rootScope.$on('youtube.player.ready', function () {
				scroll();
			});

			function scroll(waitTime) {
				$timeout(function () {
					elem.scrollTop(el.scrollHeight);
				}, waitTime || 0);
			}
		}
	};
});

app.directive('messageLogScroll', function ($timeout, $rootScope, bunkerData) {
	return {
		scope: {
			onScrollTop: '&'
		},
		link: function ($scope, elem) {
			var el = elem[0];
			var tolerance = 31;
			var clearMessageCounter = 0;

			$rootScope.$on('bunkerMessaged', function(evt, message) {
				var roomId = message.room.id || message.room;
				if(roomId == $rootScope.roomId) {
					if (el.scrollTop + el.clientHeight + tolerance >= el.scrollHeight) { // We're at the bottom
						// Check for images
						var image = angular.element('#' + message.id).find('img');
						if (image.length) { // If we have an image, wait for it to load before scrolling
							image.load(function () {
								scroll(250);
							});
						} else { // Otherwise scroll immediately
							scroll();
						}

						// if the user is only watching new messages, trim the message log
						clearMessageCounter++;
						if (clearMessageCounter > 5) {
							bunkerData.clearOldMessages($rootScope.roomId);
							clearMessageCounter = 0;
						}
					} else {
						clearMessageCounter = 0;
					}
				}
			});

			// Watch scrolling to top, execute given function
			angular.element(el).bind('scroll', function () {
				if (el.scrollTop == 0 && angular.isFunction($scope.onScrollTop)) { // We're at the top
					var originalHeight = el.scrollHeight;
					$scope.onScrollTop().then(function () {
						$timeout(function () {
							el.scrollTop = el.scrollHeight - originalHeight;
						});
					});
				}
			});

			// Scroll after state changes
			$scope.$on('roomIdChanged', function () {
				scroll();
			});

			$rootScope.$on('youtube.player.ready', function () {
				scroll();
			});

			function scroll(waitTime) {
				$timeout(function () {
					elem.scrollTop(el.scrollHeight);
				}, waitTime || 0);
			}
		}
	};
});

fix box not scrolling on system messages