moved update interval in directive

public/js/controllers.js

@@ -63,10 +63,10 @@ netStatsApp.controller('StatsCtrl', function($scope, $filter, socket, _, toastr)
 		}
 	}
 
-	var timeout = setInterval(function ()
-	{
-		$scope.$apply();
-	}, 200);
+	// var timeout = setInterval(function ()
+	// {
+	// 	$scope.$apply();
+	// }, 200);
 
 	$scope.getNumber = function (num) {
 		return new Array(num);

public/js/directives.js

@@ -7,6 +7,49 @@ angular.module('netStatsApp.directives', [])
 			elm.text(version);
 		};
 }])
+	.directive('timeAgo', ['$interval', function($interval) {
+		function link (scope, element, attrs)
+		{
+			var timestamp,
+				timeoutId;
+
+			function updateTime() {
+				element.text(timeAgo())
+			}
+
+			function timeAgo()
+			{
+				if(timestamp === 0)
+					return '∞';
+
+				var time = (new Date()).getTime();
+				var diff = Math.floor((time - timestamp)/1000);
+
+				if(diff < 60)
+					return Math.round(diff) + ' s ago';
+
+				return moment.duration(Math.round(diff), 's').humanize() + ' ago';
+			};
+
+			scope.$watch(attrs.timeAgo, function(value) {
+				timestamp = value;
+				updateTime();
+			});
+
+			element.on('$destroy', function() {
+				$interval.cancel(timeoutId);
+			});
+
+			timeoutId = $interval(function () {
+				updateTime();
+			}, 200);
+		};
+
+		return {
+			link: link
+		};
+}])
+
 	.directive('sparkchart', function () {
 		return {
 			restrict: 'E',
@@ -22,6 +65,7 @@ angular.module('netStatsApp.directives', [])
 					attrs.$observe("data", function (newValue)
 					{
 						element.html(newValue);
+						element.addClass("big-details");
 						element.sparkline('html', {
 							type: 'bar',
 							tooltipSuffix: (attrs.tooltipsuffix || '')