dist/index.html

<!DOCTYPE html><html><head><title>PoseNet-Facemesh - Camera Feed Demo</title><style>body{flex-direction:column;align-items:center}.canvas-container,body{display:flex;justify-content:center}.canvas-container{width:800px;max-width:100%;position:relative}.camera-canvas{position:absolute;transform:scale(.5);transform-origin:0 0;left:10px;top:700px}#main{left:0;top:0;position:absolute}.illustration-canvas{border:1px solid #eee}.footer{position:fixed;left:0;bottom:0;width:100%;color:#000}.footer-text{max-width:600px;text-align:center;margin:auto}@media only screen and (max-width:600px){.dg,.footer-text{display:none}}.sk-spinner-pulse{width:20px;height:20px;margin:auto 10px;float:left;background-color:#333;border-radius:100%;-webkit-animation:sk-pulseScaleOut 1s ease-in-out infinite;animation:sk-pulseScaleOut 1s ease-in-out infinite}@-webkit-keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}@keyframes sk-pulseScaleOut{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1);opacity:0}}.spinner-text{float:left}</style><meta name="viewport" content="width=device-width, initial-scale=1"></head><body> <div id="info" style="display:none"> </div> <div id="loading" style="position:relative;left:0"> <span class="spinner-text" id="status"> Loading PoseNet model... </span> <div class="sk-spinner sk-spinner-pulse"></div> </div> <div class="canvas-container"> <canvas class="illustration-canvas"> <br><br><br><br><br><br><br><br><br> <div id="main" style="display:block"> <video id="video" playsinline="" style="-moz-transform:scaleX(-1);-o-transform:scaleX(-1);-webkit-transform:scaleX(-1);transform:scaleX(-1);display:block;"> </video> </div> </canvas></div> <br><br><br><br><br><br> <div class="footer2"> <div class="footer-text"> <p> <input type="text" id="myInputSVG" size="80" value="https://hpssjellis.github.io/zoom-cartoon-svg/abstract.svg"> <div id="myDiv02">...</div> </p><h6 align="center">Original Github <a href="https://github.com/yemount/pose-animator">https://github.com/yemount/pose-animator</a></h6> <h6 align="center">My Github <a href="https://github.com/hpssjellis/pose-animator">https://github.com/hpssjellis/pose-animator</a></h6> <p></p> </div> </div> <canvas id="output" class="camera-canvas"></canvas> <canvas id="keypoints" class="camera-canvas"></canvas> <script src="camera.a74b2831.js"></script>
</body></html>