<commit_before><html>
	<head>
		<title>Statistiks</title>
		<style>
			html, body
			{
				padding: 0px;
				margin: 0px;

				background-color: #ffffff;
			}

			#graph
			{
				position: absolute;
				left: 0px;
				bottom: 0px;
				width: auto;
				height: 100%;

				z-index: 0;
			}
		</style>
	</head>
	<body>
		<div id = "graph"></div>
	</body>
</html>
<script>
	var socket = new WebSocket('ws://www.jessemillar.com:1234') // The global variable we'll use to keep track of the server

	socket.onopen = function()
	{
		socket.send('data_request')
	}

	socket.onmessage = function(message)
	{
		database = JSON.parse(message.data)
		console.log('Data received', JSON.parse(message.data))
		graph()
	}

	var barWidth = 75
	var maxBarHeight = window.innerHeight - 10

	var colorBarTallest = '#FF1D23'
	var colorBarTaller = '#D40D12'
	var colorBarShorter = '#94090D'
	var colorBarShortest = '#5C0002'
	var colorBarMiniscule = '#450003'

	var database = new Array()

	function graph()
	{
		var largestVisitorCount = 0 // Check for the greatest value
		for (var i = 0; i < database.length; i++)
		{
			if (database[i].visitors > largestVisitorCount)
			{
				largestVisitorCount = database[i].visitors
			}
		}

		var high = maxBarHeight * 0.8
		var medium = maxBarHeight * 0.6
		var low = maxBarHeight * 0.4
		var miniscule = maxBarHeight * 0.2

		if (database.length > 0)
		{
			for (var i = 0; i < database.length; i++)
			{
				var container = document.createElement('div')
					container.id = String('container' + i)
					container.style.position = 'absolute'
					container.style.left = String(i * barWidth + 'px')
					container.style.bottom = '0px'
					container.style.width = String(barWidth + 'px')
					container.style.height = String(window.innerHeight + 'px')
					if (database[i].visitors > 1)
					{
						container.title = database[i].visitors + ' visitors on ' + database[i].date
					}
					else
					{
						container.title = database[i].visitors + ' visitor on ' + database[i].date
					}

				document.getElementById('graph').appendChild(container)

				var bar = document.createElement('div')
					bar.id = String('bar' + i)
					bar.style.position = 'absolute'
					bar.style.left = '0px'
					bar.style.bottom = '0px'
					bar.style.width = String(barWidth + 'px')
					if (largestVisitorCount > maxBarHeight)
					{
						bar.style.height = String((maxBarHeight / largestVisitorCount) * database[i].visitors + 'px')
					}
					else
					{
						bar.style.height = String(database[i].visitors + 'px')
					}
					if (database[i].visitors > high)
					{
						bar.style.background = colorBarTallest
					}
					else if (database[i].visitors > medium)
					{
						bar.style.background = colorBarTaller
					}
					else if (database[i].visitors > low)
					{
						bar.style.background = colorBarShorter
					}
					else if (database[i].visitors > miniscule)
					{
						bar.style.background = colorBarShortest
					}
					else
					{
						bar.style.background = colorBarMiniscule
					}

				document.getElementById(String('container' + i)).appendChild(bar)
			}
		}
		else
		{
			console.log('No visitor data to show')
		}
	}
</script><commit_msg>Moved the bars to the middle of the screen.<commit_after><html>
	<head>
		<title>Statistiks</title>
		<style>
			html, body
			{
				padding: 0px;
				margin: 0px;

				background-color: #ffffff;
			}

			#graph
			{
				position: absolute;
				left: 0px;
				bottom: 0px;
				width: auto;
				height: 100%;

				z-index: 0;
			}
		</style>
	</head>
	<body>
		<div id = "graph"></div>
	</body>
</html>
<script>
	var socket = new WebSocket('ws://www.jessemillar.com:1234') // The global variable we'll use to keep track of the server

	socket.onopen = function()
	{
		socket.send('data_request')
	}

	socket.onmessage = function(message)
	{
		database = JSON.parse(message.data)
		console.log('Data received', JSON.parse(message.data))
		graph()
	}

	var barWidth = 65
	var maxBarHeight = window.innerHeight - 10

	var colorBarTallest = '#FF1D23'
	var colorBarTaller = '#D40D12'
	var colorBarShorter = '#94090D'
	var colorBarShortest = '#5C0002'
	var colorBarMiniscule = '#450003'

	var database = new Array()

	function graph()
	{
		var largestVisitorCount = 0 // Check for the greatest value
		for (var i = 0; i < database.length; i++)
		{
			if (database[i].visitors > largestVisitorCount)
			{
				largestVisitorCount = database[i].visitors
			}
		}

		var high = maxBarHeight * 0.8
		var medium = maxBarHeight * 0.6
		var low = maxBarHeight * 0.4
		var miniscule = maxBarHeight * 0.2

		if (database.length > 0)
		{
			for (var i = 0; i < database.length; i++)
			{
				var container = document.createElement('div')
					container.id = 'container' + i
					container.style.position = 'absolute'
					container.style.left = i * barWidth + 'px'
					container.style.bottom = '0px'
					container.style.width = barWidth + 'px'
					container.style.height = window.innerHeight + 'px'
					if (database[i].visitors > 1)
					{
						container.title = database[i].visitors + ' visitors on ' + database[i].date
					}
					else
					{
						container.title = database[i].visitors + ' visitor on ' + database[i].date
					}

				document.getElementById('graph').appendChild(container)

				var bar = document.createElement('div')
					bar.id = 'bar' + i
					bar.style.position = 'absolute'
					bar.style.left = '0px'
					bar.style.top = '50%'
					bar.style.width = barWidth + 'px'
					if (largestVisitorCount > maxBarHeight)
					{
						bar.style.height = (maxBarHeight / largestVisitorCount) * database[i].visitors + 'px'
						bar.style.marginTop = ((maxBarHeight / largestVisitorCount) * database[i].visitors) / 2 * -1 + 'px'
					}
					else
					{
						bar.style.height = database[i].visitors + 'px'
						bar.style.marginTop = database[i].visitors / 2 * -1 + 'px'
					}

					if (database[i].visitors > high)
					{
						bar.style.background = colorBarTallest
					}
					else if (database[i].visitors > medium)
					{
						bar.style.background = colorBarTaller
					}
					else if (database[i].visitors > low)
					{
						bar.style.background = colorBarShorter
					}
					else if (database[i].visitors > miniscule)
					{
						bar.style.background = colorBarShortest
					}
					else
					{
						bar.style.background = colorBarMiniscule
					}

				document.getElementById(String('container' + i)).appendChild(bar)
			}
		}
		else
		{
			console.log('No visitor data to show')
		}
	}
</script>
{'fraction_non_alphanumeric': 0.13508095605242867, 'fraction_numerical': 0.017733230531996914, 'mean_word_length': 2.6561443066516346, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 47, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '555162', 'n_tokens_mistral': 2877, 'n_tokens_neox': 2178, 'n_words': 481}