Changing Posenet data to BVH files.<br>
DRAFT not yet working
<ul>
<li>: generate random bvh file data.<br>
<li>: Get posenet data from <a href="https://hpssjellis.github.io/tensorflowjs-bvh/cam/index.html"> Camera</a><br>
<li>: Copy data to 2nd textbox
<li>: Convert data to bvh in third textbox
<li>: Copy data to a file
<li>: Load the file and test it on <a href="http://lo-th.github.io/olympe/BVH_player.html">http://lo-th.github.io/olympe/BVH_player.html</a>
<li>: Make a blender object and add the bvh data to the object	
	
</ul>


<script>
	
var myPoseObject = {}	
	
	
 const myOriginal =  `{
HIERARCHY
ROOT Hips
{
	OFFSET	0.00	0.00	0.00
	CHANNELS 6 Xposition Yposition Zposition Zrotation Xrotation Yrotation
	JOINT Chest
	{
		OFFSET	 0.00	 5.21	 0.00
		CHANNELS 3 Zrotation Xrotation Yrotation
		JOINT Neck
		{
			OFFSET	 0.00	 18.65	 0.00
			CHANNELS 3 Zrotation Xrotation Yrotation
			JOINT Head
			{
				OFFSET	 0.00	 5.45	 0.00
				CHANNELS 3 Zrotation Xrotation Yrotation
				End Site 
				{
					OFFSET	 0.00	 3.87	 0.00
				}
			}
		}
		JOINT LeftCollar
		{
			OFFSET	 1.12	 16.23	 1.87
			CHANNELS 3 Zrotation Xrotation Yrotation
			JOINT LeftUpArm
			{
				OFFSET	 5.54	 0.00	 0.00
				CHANNELS 3 Zrotation Xrotation Yrotation
				JOINT LeftLowArm
				{
					OFFSET	 0.00	-11.96	 0.00
					CHANNELS 3 Zrotation Xrotation Yrotation
					JOINT LeftHand
					{
						OFFSET	 0.00	-9.93	 0.00
						CHANNELS 3 Zrotation Xrotation Yrotation
						End Site 
						{
							OFFSET	 0.00	-7.00	 0.00
						}
					}
				}
			}
		}
		JOINT RightCollar
		{
			OFFSET	-1.12	 16.23	 1.87
			CHANNELS 3 Zrotation Xrotation Yrotation
			JOINT RightUpArm
			{
				OFFSET	-6.07	 0.00	 0.00
				CHANNELS 3 Zrotation Xrotation Yrotation
				JOINT RightLowArm
				{
					OFFSET	 0.00	-11.82	 0.00
					CHANNELS 3 Zrotation Xrotation Yrotation
					JOINT RightHand
					{
						OFFSET	 0.00	-10.65	 0.00
						CHANNELS 3 Zrotation Xrotation Yrotation
						End Site 
						{
							OFFSET	 0.00	-7.00	 0.00
						}
					}
				}
			}
		}
	}
	JOINT LeftUpLeg
	{
		OFFSET	 3.91	 0.00	 0.00
		CHANNELS 3 Zrotation Xrotation Yrotation
		JOINT LeftLowLeg
		{
			OFFSET	 0.00	-18.34	 0.00
			CHANNELS 3 Zrotation Xrotation Yrotation
			JOINT LeftFoot
			{
				OFFSET	 0.00	-17.37	 0.00
				CHANNELS 3 Zrotation Xrotation Yrotation
				End Site 
				{
					OFFSET	 0.00	-3.46	 0.00
				}
			}
		}
	}
	JOINT RightUpLeg
	{
		OFFSET	-3.91	 0.00	 0.00
		CHANNELS 3 Zrotation Xrotation Yrotation
		JOINT RightLowLeg
		{
			OFFSET	 0.00	-17.63	 0.00
			CHANNELS 3 Zrotation Xrotation Yrotation
			JOINT RightFoot
			{
				OFFSET	 0.00	-17.14	 0.00
				CHANNELS 3 Zrotation Xrotation Yrotation
				End Site 
				{
					OFFSET	 0.00	-3.75	 0.00
				}
			}
		}
	}
}
}` 


 

	
	
	
	
</script>


<input type=number id="myFrameNumber" value=2>


<input type=button value="Randomize" onclick="{
   document.getElementById('myFirstButton').click()
   document.getElementById('mySecondButton').click()
   document.getElementById('myThirdButton').click()
}">


<input id="myFirstButton" type=hidden value="Set" onclick="{
   document.myMotion = new Array(document.getElementById('myFrameNumber').value);
      for (var i = 0; i < document.getElementById('myFrameNumber').value+1; i++) {
     document.myMotion[i] = new Array(57-1);
   }


document.myMotion[0][0] = 'MOTION' 
document.myMotion[0][1] = 'Frames:' 
document.myMotion[0][2] = 2
document.myMotion[0][3] = 'Frame Time:'
document.myMotion[0][4] = 0.033333

	
	

	
//MOTION
//Frames:    2
//Frame Time: 0.033333
// 8.03	 35.01	 88.36	-3.41	 14.78	-164.35	 13.09	 40.30	-24.60	 7.88	 43.80	 0.00	-3.61	-41.45	 5.82	 10.08	 0.00	 10.21	 97.95	-23.53	-2.14	-101.86	-80.77	-98.91	 0.69	 0.03	 0.00	-14.04	 0.00	-10.50	-85.52	-13.72	-102.93	 61.91	-61.18	 65.18	-1.57	 0.69	 0.02	 15.00	 22.78	-5.92	 14.93	 49.99	 6.60	 0.00	-1.14	 0.00	-16.58	-10.51	-3.11	 15.38	 52.66	-21.80	 0.00	-23.95	 0.00	
 //7.81	 35.10	 86.47	-3.78	 12.94	-166.97	 12.64	 42.57	-22.34	 7.67	 43.61	 0.00	-4.23	-41.41	 4.89	 19.10	 0.00	 4.16	 93.12	-9.69	-9.43	 132.67	-81.86	 136.80	 0.70	 0.37	 0.00	-8.62	 0.00	-21.82	-87.31	-27.57	-100.09	 56.17	-61.56	 58.72	-1.63	 0.95	 0.03	 13.16	 15.44	-3.56	 7.97	 59.29	 4.97	 0.00	 1.64	 0.00	-17.18	-10.02	-3.08	 13.56	 53.38	-18.07	 0.00	-25.93	 0.00	

	
	
	
  for (myLoop = 0; myLoop <= 57-1; myLoop++){						    
	document.myMotion[1][myLoop] = 0.00				    
  }	
	
  for (myLoop2 = 2; myLoop2 <= document.getElementById('myFrameNumber').value; myLoop2++){	
     for (myLoop3 = 0; myLoop3 <= 57-1; myLoop3++){						    
	document.myMotion[myLoop2][myLoop3] = ((Math.floor(Math.random()*1000)/100)-5).toFixed(2)				    
     }	
  }	  
	
					       
}">



<input id="mySecondButton" type=hidden value="Original" onclick="{

  document.getElementById('myBVH').value = myOriginal						       
}">


<input id="myThirdButton"   type=hidden value="Change Number Frames" onclick="{
document.myMotion[0][2] = document.getElementById('myFrameNumber').value							 
							 
							 
 myTemp =  document.myMotion[0][0]+ '\n'                                           // MOTION
 myTemp += document.myMotion[0][1]+'    '+ document.myMotion[0][2]+'\n'            // Frames:    2
 myTemp += document.myMotion[0][3]+' '+ document.myMotion[0][4]+'\n'   	           // Frame Time: 0.033333
							 

 for (myNums=1;  myNums <= document.getElementById('myFrameNumber').value; myNums++){   // ignore location 0
    for (myNums2=0;  myNums2 <= 57-1; myNums2++){
	myTemp += document.myMotion[myNums][myNums2] + '\t'						 
     }
  myTemp +=	'\n'						 
 }						 
							 
 myString = document.getElementById('myBVH').value
					       

myString = myString.substring(0, myString.length - 1)
					       
myString += myTemp		       
myString += '}'
document.getElementById('myBVH').value = myString							 
							 
				          
}">




<input type=button value="Show motion array" onclick="{
alert(document.myMotion)						       
					       
}"><br>





<textarea id="myBVH" rows=20 cols=500 ></textarea><br><br>

Posenet data goes here<br>

<textarea id="myFromPosenet" rows=20 cols=500 ></textarea><br><br><br>

<input id="myCheck" type=text value="">

<input type=button value="Parse Posenet" onclick="{
   
myPoseObject =JSON.parse(document.getElementById('myFromPosenet').value)					  

						  
alert(myPoseObject[0][0])						  
						  
						  
 alert('Score = '+myPoseObject.score+'\n'+myPoseObject.keypoints)
						  
/*
						  
DOES ANY OF THIS HELP???						  
						  
						  
for(n1 in myPoseObject){
    for(n1_1 in myPoseObject[n1]){
       for(n1_2 in myPoseObject[n1][n1_1]){
            for(n1_3 in myPoseObject[n1][n1_1][n1_2]){
                   obj[myPoseObject[n1][n1_1][n1_2].name]=myPoseObject[n1][n1_1][n1_2].value;
            }
        }
    }
}		
	
						  
var result = json.row;
for (var i = 0; i < result.length; i++) {
  var object = result[i];
   for (property in object) {
    var value = object[property];
  }
}						  
						  
						  
						  
						  
						  
						  
						  
*/
						  
						  
						  
 alert('myPoseObject.keypoints[0].position.x  '+myPoseObject.keypoints[0].position.x)
 alert('myPoseObject.keypoints[0].part  '+myPoseObject.keypoints[0].part)
		

 alert('myPoseObject.keypoints[1].position.x  '+myPoseObject.keypoints[2].position.x)
 alert('myPoseObject.keypoints[1].part  '+myPoseObject.keypoints[2].part)
								  
						  
						  
						  
alert(obj)						  
						  
						  
}"><br><br>

Calculating the angle from data points<br>

x1<input id="myx1" type=text value=0>
y1<input id="myy1" type=text value=0>
d1-2=<input id="myd1" type=text value=0> 
Alpha1-2=<input id="myAlpha1" type=text value=0> <br>


x2<input id="myx2" type=text value=100>
y2<input id="myy2" type=text value=0>
d2-3=<input id="myd2" type=text value=0>
Alpha2-3=<input id="myAlpha2" type=text value=><br>


x3<input id="myx3" type=text value=100>
y3<input id="myy3" type=text value=100>
d3-1=<input id="myd3" type=text value=0>
Alpha3-1=<input id="myAlpha3" type=text value=><br>





<input type=button value="alpha" onclick="{
document.getElementById('myd1').value = 0   // always
x21 = ( parseFloat(document.getElementById('myx2').value)-parseFloat(document.getElementById('myx1').value) )
y21 = ( parseFloat(document.getElementById('myy2').value)-parseFloat(document.getElementById('myy1').value) )	
					  
					  
x32 = ( parseFloat(document.getElementById('myx3').value)-parseFloat(document.getElementById('myx2').value) )
y32 = ( parseFloat(document.getElementById('myy3').value)-parseFloat(document.getElementById('myy2').value) )	
					  

x13 = ( parseFloat(document.getElementById('myx1').value)-parseFloat(document.getElementById('myx3').value) )
y13 = ( parseFloat(document.getElementById('myy1').value)-parseFloat(document.getElementById('myy3').value) )						  
					  
myd21Cal = Math.sqrt( Math.pow(x21, 2 ) + Math.pow(y21, 2)   )
myd32Cal = Math.sqrt( Math.pow(x32, 2 ) + Math.pow(y32, 2)   )	
myd13Cal = Math.sqrt( Math.pow(x13, 2 ) + Math.pow(y13, 2)   )	
					  
					  
					  
					  
					  
					  
document.getElementById('myd1').value = myd21Cal
document.getElementById('myd2').value = myd32Cal
document.getElementById('myd3').value = myd13Cal
					  
document.getElementById('myAlpha1').value = (Math.acos( (  (myd13Cal*myd13Cal)  - (myd21Cal*myd21Cal) -(myd32Cal*myd32Cal) ) / ( -2* myd21Cal * myd32Cal)             )*180/Math.PI)
					  
document.getElementById('myAlpha2').value = (Math.acos( (  (myd21Cal*myd21Cal)  - (myd32Cal*myd32Cal) -(myd13Cal*myd13Cal) ) / ( -2* myd32Cal * myd13Cal)             )*180/Math.PI)

document.getElementById('myAlpha3').value = (Math.acos( (  (myd32Cal*myd32Cal)  - (myd13Cal*myd13Cal) -(myd21Cal*myd21Cal) ) / ( -2* myd13Cal * myd21Cal)             )*180/Math.PI)
					  
					  
					  
					  
					  
					  
}">
<input type=button value="--------" onclick="{
			     
}">
<input type=button value="--------" onclick="{
			     
}">
<input type=button value="--------" onclick="{
			     
}"><br>




<textarea id="myToBVH" rows=40 cols=500 ></textarea><br><br><br><br><br><br><br><br><br><br><br><br><br>