Skip to main content

Live Proctor

Introduction​

Live Proctor provides instructors with real-time status updates of what's happening in an assessment, while it's happening. Live Proctor can alert instructors when learners need assistance and display results and scores as assessments are submitted, all with the intention of allowing instructors to gain valuable information more quickly so they may move past the assessment, and back to learning, more quickly.

Demo​

Try out our Live Proctor component inside of our Developer Demo application without writing a single line of code.

Launch using SDK​

Save the contents of this file to your local drive, modify the auth and examConfigId values, then launch inside of any web browser to see the Live Proctor in action.

<!DOCTYPE html>
<html>
  <head>
    <title>Campfire LTI Integration</title>
    <link rel="stylesheet"
      href="https://unpkg.com/modern-normalize@2.0.0/modern-normalize.css" />
    <style type="text/css">
      iframe {
        width: 100%;
        height: 90vh;
        border: 1px solid #999;
      }
      div#app {
        height: 100%;
      }
      div#tool {
        border-top: solid 1px #ddd;
      }
      html, body, #tool {
        height: 100%;
      }
      html {
        font-size: 62.5%;
        font-family: "Nunito", sans-serif;
      }
      body {
        font-size: 1.2rem;
      }
      h1 {
        margin: 0;
      }
      .title {
        padding: 2rem 1rem;
      }
    </style>
    <style id="campfire-imports">
      @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap");
    </style>
    <script
      src="https://unpkg.com/@campfirelearning/sdk-js@latest/dist/browser/index.js"></script>
  </head>
  <body>
    <div id="app">
      <div class="title">
        <h1>Sample Live Proctor &#128293;</h1>
      </div>
      <div id="tool" name="tool"></d>
    </div>
    <script>
      const auth = "[auth-token]"
      const examConfigId = "[exam-config-id]"
      const component = new CampfireSDKv2.LiveProctor("tool", {
        auth
      });
      component.init({
        examConfigId,
      });
  </script>
  </body>
</html>