<commit_before><!doctype html>
<html>
<head>
  	<meta charset="utf-8">
  	<title>A-Frame GUI</title>
    <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
    <script src="components.js"></script>
	<link href="https://fonts.googleapis.com/css?family=Fira+Sans" rel="stylesheet">
	<style type="text/css">
		@font-face{
			font-family:"Ionicons";
			src:url("assets/fonts/ionicons.eot?v=2.0.1");
			src:url("assets/fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"),url("assets/fonts/ionicons.ttf?v=2.0.1") format("truetype"),url("assets/fonts/ionicons.woff?v=2.0.1") format("woff"),url("assets/fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg");
			font-weight:normal;
			font-style:normal
		}
		body{font-family:Ionicons;} 
		#playbtn, 
		#musicbtn{font-family:Ionicons;}
		ul li{
		    position: relative;
		    z-index: 0;
		    display: inline-block;
		    padding: 22px;
		    width: 42px;
		    border-radius: 4px;
		    list-style: none;
		    text-align: center;
		    font-weight: normal;
		    font-size: 32px;
		    cursor: pointer;

		}
		li:nth-child(1):before {
    		content: "\f215"; //play
		}
		li:nth-child(2):before {
    		content: "\f210"; //pause
		}
		li:nth-child(3):before {
    		content: "\f20c"; //music
		}
		


	</style>
</head>
<body>
<ul>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ul>
	<a-scene>
		<a-assets>
			<!-- Text Canvas -->
			<!--<canvas id="canvasObjBack" crossorigin="anonymous" webkit-playsinline=""></canvas>
			<canvas id="canvasObjFront" crossorigin="anonymous" webkit-playsinline=""></canvas> -->
			<canvas id="canvasObj" crossorigin="anonymous" webkit-playsinline=""></canvas>

			<img id="gradient" src="assets/gradient.png">
			<img id="ground" src="assets/ground.png">
			<img id="panel" src="assets/settings.png">
		</a-assets>

		<a-light
			type="directional"
			color="#FFF"
			intensity="1"
			position="-1 1 2">
		</a-light>
		<a-light
			type="ambient"
			color="#ebd9e9">
		</a-light>
		
		<a-sky src="#gradient"></a-sky>
  		<a-image position="0 -.025 0" height="300" width="300" rotation="90 0 0" src="#ground" repeat="300 300" material="color:#ebd9e9"></a-image>
		<a-entity gui-item="type: flex-container; width: 5; height: 3;"
			gui-flex-container="flexDirection: column; justifyContent: center; alignItems: normal; componentPadding: 0.1; opacity: 0.7"
			position="-0.5 1.5 -3"
			rotation="0 0 0"
		 >
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: testButtonAction;"
					geometry="primitive: plane;"
					gui-button="
				text:label copy;
				fontFamily:'Fira Sans';
			"
					material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity gui-item="type: toggle; width: 2.5; height: 0.75;"
					  gui-interactable="clickAction: testToggleAction;"
					geometry="primitive: plane;"
					gui-toggle="
				text:label copy;
				backgroundColor: red;
				opacity: 1;
				fontFamily:'Fira Sans';
			"
					material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>

			<a-entity id="playbtn" gui-item="type: icon-button; height: 0.75;"
					   gui-interactable="clickAction: testButtonAction;"
					geometry="primitive: plane;"
					gui-icon-button="
				fontFamily:'Ionicons';
				icon:'\f20c';
				iconActive:'\f20c';
			"
					material="shader: flat; transparent: true; opacity: 1; side:double;"
				>
			</a-entity>

			<a-entity id="musicbtn" gui-item="type: icon-button; height: 0.75;"
					   gui-interactable="clickAction: testButtonAction;"
					geometry="primitive: plane;"
					gui-icon-button="
				fontFamily:'Ionicons';
				icon:'\f215';
				iconActive:'\f20c';
			"
					material="shader: flat; transparent: true; opacity: 1; side:double;"
				>
			</a-entity>

		</a-entity>


		<!-- Camera + cursor. -->
		<a-entity camera="userHeight: 1.6" look-controls="" wasd-controls>

			<a-entity id="cursor"
					  raycaster="interval: 1000; objects: [gui-interactable]"
					  cursor="fuse: true; fuseTimeout: 2000"
					  gui-cursor=""
					  position="0 0 -1"
					  geometry="primitive: ring; radiusInner:0.000001; radiusOuter:0.025"
					  material="color: #ffffff; shader: flat"
			>
			</a-entity> <!-- /cursor -->

		</a-entity> <!-- /camera -->

	</a-scene>
</body>
</html><commit_msg>Implmenting demo.html<commit_after><!doctype html>
<html>
<head>
  	<meta charset="utf-8">
  	<title>A-Frame GUI</title>
    <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
    <script src="components.js"></script>
	<link href="https://fonts.googleapis.com/css?family=Fira+Sans" rel="stylesheet">
	<style type="text/css">
		@font-face{
			font-family:"Ionicons";
			src:url("assets/fonts/ionicons.eot?v=2.0.1");
			src:url("assets/fonts/ionicons.eot?v=2.0.1#iefix") format("embedded-opentype"),url("assets/fonts/ionicons.ttf?v=2.0.1") format("truetype"),url("assets/fonts/ionicons.woff?v=2.0.1") format("woff"),url("assets/fonts/ionicons.svg?v=2.0.1#Ionicons") format("svg");
			font-weight:normal;
			font-style:normal
		}
		body{font-family:Ionicons;} 
		#playbtn, 
		#musicbtn{font-family:Ionicons;}
		ul li{
		    position: relative;
		    z-index: 0;
		    display: inline-block;
		    padding: 22px;
		    width: 42px;
		    border-radius: 4px;
		    list-style: none;
		    text-align: center;
		    font-weight: normal;
		    font-size: 32px;
		    cursor: pointer;

		}
		li:nth-child(1):before {
    		content: "\f215"; //play
		}
		li:nth-child(2):before {
    		content: "\f210"; //pause
		}
		li:nth-child(3):before {
    		content: "\f20c"; //music
		}
		


	</style>
</head>
<body>
	<a-scene>
		<a-assets>
			<!-- Text Canvas -->
			<!--<canvas id="canvasObjBack" crossorigin="anonymous" webkit-playsinline=""></canvas>
			<canvas id="canvasObjFront" crossorigin="anonymous" webkit-playsinline=""></canvas> -->
			<canvas id="canvasObj" crossorigin="anonymous" webkit-playsinline=""></canvas>

			<img id="gradient" src="assets/gradient.png">
			<img id="ground" src="assets/ground.png">
			<img id="panel" src="assets/settings.png">
		</a-assets>

		<a-light
			type="directional"
			color="#FFF"
			intensity="1"
			position="-1 1 2">
		</a-light>
		<a-light
			type="ambient"
			color="#ebd9e9">
		</a-light>
		
		<a-sky src="#gradient"></a-sky>
  		<a-image position="0 -.025 0" height="300" width="300" rotation="90 0 0" src="#ground" repeat="300 300" material="color:#ebd9e9"></a-image>

		<a-entity id="music_type_panel" gui-item="type: flex-container; width: 4; height: 4;"
			gui-flex-container="flexDirection: column; justifyContent: center; alignItems: normal; componentPadding: 0.1; opacity: 0.7"
			position="-5.5 1.5 -1.5"
			rotation="0 45 0"
		 >
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: selectCinematic;"
					geometry="primitive: plane;"
					gui-button="
				text:Cinematic;
				fontFamily:'Fira Sans';
			"
					material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: selectClassicRock;"
					   geometry="primitive: plane;"
					   gui-button="
				text:Classic Rock;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: selectModernFolk;"
					   geometry="primitive: plane;"
					   gui-button="
				text:Modern Folk;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: select90sPop;"
					   geometry="primitive: plane;"
					   gui-button="
				text:90's Pop;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
		</a-entity>

		<a-entity id="music_length_panel" gui-item="type: flex-container; width: 4; height: 4;"
				  gui-flex-container="flexDirection: column; justifyContent: center; alignItems: normal; componentPadding: 0.1; opacity: 0.7"
				  position="-0.5 1.5 -3"
				  rotation="0 0 0"
		>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: select5Seconds;"
					   geometry="primitive: plane;"
					   gui-button="
				text:5 seconds;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: select10Seconds;"
					   geometry="primitive: plane;"
					   gui-button="
				text:10 seconds;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: select15Seconds;"
					   geometry="primitive: plane;"
					   gui-button="
				text:15 seconds;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: submitMusicCreate;"
					   geometry="primitive: plane;"
					   gui-button="
				text:Gimme Music;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
		</a-entity>

		<a-entity id="music_player_panel" id="music_type_panel" gui-item="type: flex-container; width: 5; height: 4;"
				  gui-flex-container="flexDirection: column; justifyContent: center; alignItems: normal; componentPadding: 0.1; opacity: 0.7"
				  position="4.5 1.5 -1.5"
				  rotation="0 -45 0"
		>
			<a-entity gui-item="type: toggle; width: 2.5; height: 0.75;"
					  gui-interactable="clickAction: testToggleAction;"
					  geometry="primitive: plane;"
					  gui-toggle="
				text:Auto Play;
				backgroundColor: black;
				opacity: 1;
				fontColor: white;
				fontFamily:'Fira Sans';
			"
					  material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity gui-item="type: toggle; width: 2.5; height: 0.75;"
					  gui-interactable="clickAction: testToggleAction;"
					  geometry="primitive: plane;"
					  gui-toggle="
				text:Loop;
				backgroundColor: black;
				opacity: 1;
				fontColor: white;
				fontFamily:'Fira Sans';
			"
					  material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: select15Seconds;"
					   geometry="primitive: plane;"
					   gui-button="
				text:Pause;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
			<a-entity  gui-item="type: button; width: 2.5; height: 0.75;"
					   gui-interactable="clickAction: submitMusicCreate;"
					   geometry="primitive: plane;"
					   gui-button="
				text:Play;
				fontFamily:'Fira Sans';
			"
					   material="shader: flat; transparent: true; opacity: 1; side:double;"
			>
			</a-entity>
		</a-entity>

		<!-- Camera + cursor. -->
		<a-entity camera="userHeight: 2.0" look-controls="" wasd-controls>

			<a-entity id="cursor"
					  raycaster="interval: 1000; objects: [gui-interactable]"
					  cursor="fuse: true; fuseTimeout: 2000"
					  gui-cursor=""
					  position="0 0 -1"
					  geometry="primitive: ring; radiusInner:0.000001; radiusOuter:0.025"
					  material="color: #ffffff; shader: flat"
			>
			</a-entity> <!-- /cursor -->

		</a-entity> <!-- /camera -->

	</a-scene>
</body>
</html>
{'fraction_non_alphanumeric': 0.18054507337526204, 'fraction_numerical': 0.030356394129979036, 'mean_word_length': 3.1875, 'pattern_counts': {'":': 0, '<': 147, '<?xml version=': 0, '>': 147, 'https://': 4, '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': '2784694', 'n_tokens_mistral': 5391, 'n_tokens_neox': 4192, 'n_words': 814}