Skip to content
Snippets Groups Projects
index.html 2.06 KiB
Newer Older
  • Learn to ignore specific revisions
  • <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
    
    Nayeem Rahman's avatar
    Nayeem Rahman committed
        <link rel="manifest" href="manifest.json" />
        <link rel="shortcut icon" href="logo.png" />
    
    Yuriy Maksymets's avatar
    Yuriy Maksymets committed
        <link rel="stylesheet" href="styles.css" />
    
        <link
          rel="stylesheet"
          href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
        />
    
        <script>
          if (navigator.serviceWorker) {
            navigator.serviceWorker
              .register("service-worker.js")
              .then(
                (registration) =>
                  console.log(
                    `Service worker registered on scope ${registration.scope}`,
                  ),
                (reason) =>
                  console.log(`Service worker failed to register ~ ${reason}`),
              )
          }
        </script>
    
      <body>
    
        <div style="display:none">
    
          Your client ID: <input id="user-id" type="text" value="" readonly="" />
        </div>
    
        <div style="display:none">
    
          Enter peer ID: <input id="peer-id" type="text" value="" />
          <button id="peer-connect">Connect</button>
        </div>
    
        <div id="top-panel">
          <div class="top-bar">
            <div class="dropdown">
              <button class="dropdown-peers"><i class="fa fa-bars"></i></button>
              <div class="peers">
    
                <ul id="connected-peers">
                  No peers are connected
                </ul>
    
              </div>
            </div>
            <input
              id="room-id"
              type="text"
              value=""
              placeholder="Enter a room to connect to"
              size="25"
              color="gray"
            />
            <button id="room-connect">Connect <i class="fa fa-link"></i></button>
          </div>
          <div id="tools-panel">
            <button id="pen-tool" class="selected">
              <i class="fa fa-paint-brush"></i>
            </button>
            <button id="eraser-tool"><i class="fa fa-eraser"></i></button>
            <div id="connected-room-info">
              You are connected to a room: <span id="connected-room-id"></span>
    
            </div>
          </div>