index.html

<!DOCTYPE html>
<html lang="nl">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, width=device-width">
    <title>Yoga pose AI</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>

    <h1>🧘 Yoga pose model 🤸</h1>
    <button type="button" onclick="init()">Start</button>
    <div><canvas id="canvas"></canvas></div>
    <div id="container" class="purple"></div>
    
    <aside>
        <img src="./images/pose.jpg" alt="voorbeeld yoga pose">
        <p>Triangle pose</p>
        <ul>
            <li>Doe de yoga pose hierboven na 👆</li>
            <li>Gelukt? Het balkje wordt groen ✅</li>
        </ul>
    </aside>
    
    <!--!scripts-->
    <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.3.1/dist/tf.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/@teachablemachine/pose@0.8/dist/teachablemachine-pose.min.js"></script>
    <script src="script.js"></script>
</body>
</html>