<commit_before><!DOCTYPE html>
<html>
	<head>
		<meta charset=utf-8>
		<title>Lanterns frontend</title>
		<style>
			body { margin: 0; }
			canvas { width: 100%; height: 100% }
		</style>
	</head>
	<body>
		<script src="../three.min.js"></script>
		<script src="../OrbitControls.js"></script>
		<script src="../reconnectingWebSocket.js"></script>
		<script src="../Lanterns.js"></script>

		<script>

			// load configuration from runner
			const layout = window.parent.layout
			const broadcast = !window.parent.development


			const lanterns = new Lanterns(layout)

			if(broadcast) lanterns.connect()


			var scene = new THREE.Scene()
			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 )

			var renderer = new THREE.WebGLRenderer({ antialias: true })
			renderer.setSize( window.innerWidth, window.innerHeight )
			renderer.setPixelRatio(window.devicePixelRatio)
			renderer.setClearColor(0xeeeeee)
			document.body.appendChild( renderer.domElement )


			controls = new THREE.OrbitControls( camera, renderer.domElement )
			controls.enableZoom = false
			camera.position.z = 10


			// add lantern meshes to scene
			const meshes = lanterns.asTHREE()
			meshes.forEach(mesh => scene.add(mesh))


			/*  Ripples bit!  */
			const ripplesDelay = 150 // the max frames between ripples
			var rippleCountdown = 0 // the current frames until next ripple
			const ripples = []

			function addRipple(size, speed) {
	      var geometry = new THREE.SphereGeometry( size, 8, 8)
	      var material = new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, transparent: true, opacity: 1, wireframe: true } )
	      var rippleToAdd = new THREE.Mesh( geometry, material )
				
				// This is crappy random position based on the assumption that the area is about 2 x 2 x 2
				rippleToAdd.position.x = Math.random() * 2 - 1
				rippleToAdd.position.y = Math.random() * 2 - 1
				rippleToAdd.position.z = Math.random() * 2 - 1
        rippleToAdd.speed = speed
				rippleToAdd.material.opacity = 1

        ripples.push(rippleToAdd)


				// comment out this line to see
				// effect in action
				scene.add(rippleToAdd)

			}

			var render = function () {
			    // check if we should add another ripple
			    if (rippleCountdown < 0) {
				    rippleCountdown = ripplesDelay
                    addRipple(0.1, 0.5)
				}
				rippleCountdown --

				// loop over each ripple
                ripples.forEach(function(ripple, index, object) {
					var scale = ripple.scale.x
                    ripple.scale.x = ripple.scale.y = ripple.scale.z = scale + ripple.speed
                    var opacity = ripple.material.opacity - 0.01
                    ripple.material.opacity = opacity
					if (opacity <= 0) {
                        scene.remove(ripple)
                        object.splice(index, 1);
					}
                });


					const spheres = ripples.map(
						ripple => new THREE.Sphere(ripple.position, ripple.scale.x * 0.1)
					)

					// See what lanterns intersect with ripples and apply their colour
					meshes.forEach(m => {
						m.material.color.set(0,0,0)
						spheres.forEach(function(sphere, index, object) {
							const ripple = ripples[index];
							if(sphere.containsPoint(m.position)) {
								m.material.color.lerp(ripple.material.color, ripple.material.opacity * 2)
							}
						})
					})

				requestAnimationFrame( render )
				renderer.render(scene, camera)

				lanterns.writeTHREE(meshes)
			}
			render()
<commit_msg>Pick point from existing lights & refactor<commit_after><!DOCTYPE html>
<html>
	<head>
		<meta charset=utf-8>
		<title>Lanterns frontend</title>
		<style>
			body { margin: 0; }
			canvas { width: 100%; height: 100% }
		</style>
	</head>
	<body>
		<script src="../three.min.js"></script>
		<script src="../OrbitControls.js"></script>
		<script src="../reconnectingWebSocket.js"></script>
		<script src="../Lanterns.js"></script>

		<script>

			// load configuration from runner
			const layout = window.parent.layout
			const broadcast = !window.parent.development


			const lanterns = new Lanterns(layout)

			if(broadcast) lanterns.connect()


			var scene = new THREE.Scene()
			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 )

			var renderer = new THREE.WebGLRenderer({ antialias: true })
			renderer.setSize( window.innerWidth, window.innerHeight )
			renderer.setPixelRatio(window.devicePixelRatio)
			renderer.setClearColor(0xeeeeee)
			document.body.appendChild( renderer.domElement )


			controls = new THREE.OrbitControls( camera, renderer.domElement )
			controls.enableZoom = false
			camera.position.z = 10


			// add lantern meshes to scene
			const meshes = lanterns.asTHREE()
			meshes.forEach(mesh => scene.add(mesh))


			/*  Ripples bit!  */
			const ripplesDelay = 150 // the max frames between ripples
			var rippleCountdown = 0 // the current frames until next ripple
			const ripples = []

			function addRipple(size) {
	      var geometry = new THREE.SphereGeometry(size, 8, 8)
	      var material = new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, transparent: true, opacity: 1, wireframe: true } )
	      var rippleToAdd = new THREE.Mesh( geometry, material )

				// This is crappy random position based on the assumption that the area is about 2 x 2 x 2

				const r = ~~(Math.random() * meshes.length-1)
				const {x, y, z} = meshes[r].position;
				Object.assign(rippleToAdd.position, {x, y, z})

				rippleToAdd.size = size
				rippleToAdd.material.opacity = 1

        ripples.push(rippleToAdd)


				// comment out this line to see
				// effect in action
				scene.add(rippleToAdd)

			}

			var render = function () {
			    // check if we should add another ripple
			    if (rippleCountdown < 0) {
				    rippleCountdown = ripplesDelay

            addRipple(0.3)
				}
				rippleCountdown --

				// loop over each ripple
        ripples.forEach(function(ripple, index, object) {
					var scale = ripple.scale.x

					ripple.scale.x = ripple.scale.y = ripple.scale.z = scale * 1.025

					// var opacity = ripple.material.opacity - 0.006

					ripple.material.opacity = (1/(scale*scale));

					if (ripple.material.opacity < 0.01) {
            scene.remove(ripple)
            object.splice(index, 1);
					}
        });


					const spheres = ripples.map(
						ripple => new THREE.Sphere(ripple.position, ripple.scale.x * ripple.size)
					)

					// See what lanterns intersect with ripples and apply their colour
					meshes.forEach(m => {
						m.material.color.set(0,0,0)
						spheres.forEach(function(sphere, index, object) {
							const ripple = ripples[index];

							if(sphere.containsPoint(m.position)) {

								const d = sphere.center.distanceTo(m.position) / sphere.radius;

								m.material.color.lerp(
									ripple.material.color,
									Math.min(
										1,
										ripple.material.opacity * (1-d)
									)
								)
							}
						})
					})

				requestAnimationFrame( render )
				renderer.render(scene, camera)

				lanterns.writeTHREE(meshes)
			}
			render()

{'fraction_non_alphanumeric': 0.1174322236269139, 'fraction_numerical': 0.014889731703890996, 'mean_word_length': 2.547583457897359, 'pattern_counts': {'":': 0, '<': 45, '<?xml version=': 0, '>': 47, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, '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': '4095765', 'n_tokens_mistral': 2913, 'n_tokens_neox': 2202, 'n_words': 542}