<commit_before><!DOCTYPE html>
<html lang="en">
	<head>
		<title>three.js webgl - clipping stencil</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
		<style>
			body {
				color: #ffffff;
				font-family:Monospace;
				font-size:13px;
				text-align:center;
				font-weight: bold;

				background-color: #000000;
				margin: 0px;
				overflow: hidden;
			}
			#info {
				color: #fff;
				position: absolute;
				top: 0px; width: 100%;
				padding: 5px;
			}
		</style>
	</head>
	<body>

		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - solid geometry with clip planes and stencil materials</div>

		<script src="../build/three.js"></script>
		<script src="js/controls/OrbitControls.js"></script>
		<script src="js/libs/stats.min.js"></script>
		<script src="js/libs/dat.gui.min.js"></script>

		<script>

			var camera, scene, renderer, startTime, object, stats;
			var planes, planeObjects, planeHelpers;
			var clock;

			var params = {

				animate: true,
				planeX: {

					constant: 0,
					negated: false,
					displayHelper: false

				},
				planeY: {

					constant: 0,
					negated: false,
					displayHelper: false

				},
				planeZ: {

					constant: 0,
					negated: false,
					displayHelper: false

				}


			};

			init();
			animate();

			function createPlaneStencilGroup( geometry, plane, renderOrder ) {

				var group = new THREE.Group();
				var baseMat = new THREE.MeshBasicMaterial();
				baseMat.depthWrite = false;
				baseMat.depthTest = false;
				baseMat.colorWrite = false;
				baseMat.stencilWrite = true;
				baseMat.stencilFunc = THREE.AlwaysStencilFunc;

				// back faces
				var mat0 = baseMat.clone();
				mat0.side = THREE.BackSide;
				mat0.clippingPlanes = [ plane ];
				mat0.stencilFail = THREE.IncrementWrapStencilOp;
				mat0.stencilZFail = THREE.IncrementWrapStencilOp;
				mat0.stencilZPass = THREE.IncrementWrapStencilOp;

				var mesh0 = new THREE.Mesh( geometry, mat0 );
				mesh0.renderOrder = renderOrder;
				group.add( mesh0 );

				// front faces
				var mat1 = baseMat.clone();
				mat1.side = THREE.FrontSide;
				mat1.clippingPlanes = [ plane ];
				mat1.stencilFail = THREE.DecrementWrapStencilOp;
				mat1.stencilZFail = THREE.DecrementWrapStencilOp;
				mat1.stencilZPass = THREE.DecrementWrapStencilOp;

				var mesh1 = new THREE.Mesh( geometry, mat1 );
				mesh1.renderOrder = renderOrder;

				group.add( mesh1 );

				return group;

			}

			function init() {

				clock = new THREE.Clock();

				scene = new THREE.Scene();

				camera = new THREE.PerspectiveCamera( 36, window.innerWidth / window.innerHeight, 1, 100 );
				camera.position.set( 0, 1.3, 3 );

				scene.add( new THREE.AmbientLight( 0xffffff, 0.5 ) );

				var dirLight = new THREE.DirectionalLight( 0xffffff, 1 );
				dirLight.position.set( 5, 10, 7.5 );
				dirLight.castShadow = true;
				dirLight.shadow.camera.right = 2;
				dirLight.shadow.camera.left = - 2;
				dirLight.shadow.camera.top	= 2;
				dirLight.shadow.camera.bottom = - 2;
<commit_msg>Set a better starting camera position<commit_after><!DOCTYPE html>
<html lang="en">
	<head>
		<title>three.js webgl - clipping stencil</title>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
		<style>
			body {
				color: #ffffff;
				font-family:Monospace;
				font-size:13px;
				text-align:center;
				font-weight: bold;

				background-color: #000000;
				margin: 0px;
				overflow: hidden;
			}
			#info {
				color: #fff;
				position: absolute;
				top: 0px; width: 100%;
				padding: 5px;
			}
		</style>
	</head>
	<body>

		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - solid geometry with clip planes and stencil materials</div>

		<script src="../build/three.js"></script>
		<script src="js/controls/OrbitControls.js"></script>
		<script src="js/libs/stats.min.js"></script>
		<script src="js/libs/dat.gui.min.js"></script>

		<script>

			var camera, scene, renderer, startTime, object, stats;
			var planes, planeObjects, planeHelpers;
			var clock;

			var params = {

				animate: true,
				planeX: {

					constant: 0,
					negated: false,
					displayHelper: false

				},
				planeY: {

					constant: 0,
					negated: false,
					displayHelper: false

				},
				planeZ: {

					constant: 0,
					negated: false,
					displayHelper: false

				}


			};

			init();
			animate();

			function createPlaneStencilGroup( geometry, plane, renderOrder ) {

				var group = new THREE.Group();
				var baseMat = new THREE.MeshBasicMaterial();
				baseMat.depthWrite = false;
				baseMat.depthTest = false;
				baseMat.colorWrite = false;
				baseMat.stencilWrite = true;
				baseMat.stencilFunc = THREE.AlwaysStencilFunc;

				// back faces
				var mat0 = baseMat.clone();
				mat0.side = THREE.BackSide;
				mat0.clippingPlanes = [ plane ];
				mat0.stencilFail = THREE.IncrementWrapStencilOp;
				mat0.stencilZFail = THREE.IncrementWrapStencilOp;
				mat0.stencilZPass = THREE.IncrementWrapStencilOp;

				var mesh0 = new THREE.Mesh( geometry, mat0 );
				mesh0.renderOrder = renderOrder;
				group.add( mesh0 );

				// front faces
				var mat1 = baseMat.clone();
				mat1.side = THREE.FrontSide;
				mat1.clippingPlanes = [ plane ];
				mat1.stencilFail = THREE.DecrementWrapStencilOp;
				mat1.stencilZFail = THREE.DecrementWrapStencilOp;
				mat1.stencilZPass = THREE.DecrementWrapStencilOp;

				var mesh1 = new THREE.Mesh( geometry, mat1 );
				mesh1.renderOrder = renderOrder;

				group.add( mesh1 );

				return group;

			}

			function init() {

				clock = new THREE.Clock();

				scene = new THREE.Scene();

				camera = new THREE.PerspectiveCamera( 36, window.innerWidth / window.innerHeight, 1, 100 );
				camera.position.set( 2, 2, 2 );

				scene.add( new THREE.AmbientLight( 0xffffff, 0.5 ) );

				var dirLight = new THREE.DirectionalLight( 0xffffff, 1 );
				dirLight.position.set( 5, 10, 7.5 );
				dirLight.castShadow = true;
				dirLight.shadow.camera.right = 2;
				dirLight.shadow.camera.left = - 2;
				dirLight.shadow.camera.top	= 2;
				dirLight.shadow.camera.bottom = - 2;

{'fraction_non_alphanumeric': 0.1334502551020408, 'fraction_numerical': 0.020886479591836735, 'mean_word_length': 2.952741020793951, 'pattern_counts': {'":': 0, '<': 51, '<?xml version=': 0, '>': 51, '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': '5199396', 'n_tokens_mistral': 2798, 'n_tokens_neox': 2103, 'n_words': 461}