better-network-chrome-panel/unpacked/panel/assets/javascripts/app.js

var BNPChrome = angular.module('BNPChrome', [])
	.directive('prettyPrint', function ($parse) {
		return {
			restrict: 'E',
			replace: true,
			transclude: false,
			scope: { data: '=data' },
			link: function (scope, element, attrs) {
				let data = scope.data;
				let $el = $('<div></div>');

				if (data === true) {
					data = '<i>true</i>';
				} else if (data === false) {
					data = '<i>false</i>';
				} else if (data === undefined) {
					data = '<i>undefined</i>';
				} else if (data === null) {
					data = '<i>null</i>';
				} else if (typeof data === 'number') {
					// skip (i.e. do default)
				} else if (typeof data === 'string' && (data[0] === '{' || data[0] === '[')) {
					$el = $('<pre></pre>');
					try {
						data = JSON.stringify(JSON.parse(data), null, 4);
						// $el.text()
					} catch (e) {
						console.debug('Error parsing', data);
					}
				} else if (typeof data === 'string') {
					// i.e. a string but not a JSON stringified string
					data = $('<div>').text(data).html();
				}


				$el.html(data);

				element.replaceWith($el);
			}
		};
	})
	.directive('resizableColumns', function ($parse) {
		return {
			link: function (scope, element, attrs) {
				const options = {minWidth: 5};

				if ($(element).data('resizable-columns-sync')) {
					var $target = $($(element).data('resizable-columns-sync'));

					$(element).on('column:resize', function(event, resizable, $leftColumn, $rightColumn, widthLeft, widthRight)
					{
						var leftColumnIndex = resizable.$table.find('.rc-column-resizing').parent().find('td, th').index($leftColumn);

						var $targetFirstRow = $target.find('tr:first');

						$($targetFirstRow.find('td, th').get(leftColumnIndex)).css('width', widthLeft + '%');
						$($targetFirstRow.find('td, th').get(leftColumnIndex + 1)).css('width', widthRight + '%');

						$target.data('resizableColumns').syncHandleWidths();
						$target.data('resizableColumns').saveColumnWidths();
					});
				}

				$(element).resizableColumns(options);
			}
		};
	})
	.directive('scrollToNew', function ($parse) {
		return function(scope, element, attrs) {
			if (scope.showIncomingRequests && scope.$last) {
				const $container = $(element).parents('.data-container').first();
				const $parent = $(element).parent();

				$container.scrollTop($parent.height());
			}
		};
	});