index.html

<html>
    <head>
        <title>WeMeet Video Conferences</title>
        <meta charset="utf-8">
        <link rel="icon" href="assets/images/video.png" type="image/png">
        <link rel="stylesheet" href="assets/styles.css">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
    </head>

    <body class="body">

        <nav class="navbar navbar-expand-lg">
            <div class="container">
                <a class="navbar-brand" href="#">
                    <img src="assets/images/video.png" alt="WeMeet Logo" width="60" height="60">
                </a>
                <ul class="navbar-nav">
                    <li class="nav-item"><h2>WeMeet Video Conferences</h2></li>
                </ul>
            </div>
        </nav>

        <div class="video-call">
            <p>
                <b>Start a meeting:</b> Enter a meeting ID of your preference<br> 
                <b>Join a meeting:</b> Enter a provided meeting ID
            </p>
            <form id="registration">
                <input type="text" id="meeting-id" name="name" required placeholder="Enter a meeting ID">
                <button>Enter</button>
            </form>
        </div>

        <div id="call">
            <div id="subscribers"></div>
            <div id="publishers"></div>
        </div>
        

        <!-- Scripts - must be imported at the end-->
        <script src="https://static.opentok.com/v2/js/opentok.min.js"></script>
        <script src="./functions/src/app.js"></script>
        
    </body>
</html>