After successfully running the mediapipe face detection demo from Mediapipe official website, I wanted to replicate it on my laptop.
To achieve this, I created an 'index.html' file and meticulously transferred the code from the CodePen demo page (https://codepen.io/mediapipe/pen/dyOzvZM) into the 'index.html' file. Here's how I split the tasks:
- I copied the HTML code from CodePen into the body section of the HTML file.
- I inserted the CSS code from CodePen into the style section within the head tag of the HTML file.
- The TypeScript code was converted into JavaScript and placed within a script tag with 'type="module"' attribute in the HTML file.
<html>
<!-- The rest of the HTML code goes here -->
</html>
<script type="module">
// JavaScript code extracted from TypeScript snippet
// Additional scripts and logic implemented here
</script>
Once all the necessary files were set up, I used Python HTTP server to serve the 'index.html' file which allowed me to access it locally at http://localhost:8000. Upon testing this setup in Chrome browser, no errors were reported in the developer console.
If you are seeking guidance on making the CodePen demo code fully functional on your laptop based on the modifications described above, feel free to let me know!