rdfa-wasm 0.3.6

Graph rdfa Processor
Documentation
<!doctype html>
<html lang="en" data-bs-theme="dark">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>RDFa Playground</title>
    <link rel="icon" type="image/x-icon" href="favicon.ico" />
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
      crossorigin="anonymous"
    />
    <link rel="stylesheet" href="./style.css" />
    <script type="module" src="./app.js"></script>
  </head>

  <body>
    <div class="ps-1">
      <h1>RDFa Playground</h1>
      <p>
        This is a poc of an rdfa library written in rust. If you find any bug,
        please <a href="#issueLink" id="issueLink">open an issue.</a>
      </p>
    </div>
    <hr />
    <div class="overflow-x-hidden">
      <div class="d-lg-flex justify-content-center d-block">
        <div class="col-lg-4 col-12 me-lg-1">
          <div class="card terminal">
            <div class="card-body">
              <form action="" id="rdfaForm">
                <div class="mb-2 align-items-center">
                  <div class="col-auto">
                    <label for="base" class="col-form-label fw-bold"
                      >Base</label
                    >
                  </div>
                  <div class="col-auto">
                    <input
                      required
                      type="url"
                      id="base"
                      name="base"
                      class="form-control flat"
                      aria-describedby="base url"
                      value="http://example.com"
                    />
                  </div>
                </div>

                <div class="mb-2 align-items-center">
                  <div class="col-auto">
                    <label for="base" class="col-form-label fw-bold"
                      >Well Known prefix</label
                    >
                  </div>
                  <div class="col-auto">
                    <input
                      type="url"
                      id="wellKnownPrefix"
                      name="wellKnownPrefix"
                      class="form-control flat"
                      aria-describedby="well known prefix"
                      value="http://example.com/.well-known/"
                    />
                    <div id="passwordHelpBlock" class="form-text">
                      Well known prefix for
                      <a
                        target="_blank"
                        href="https://www.w3.org/2011/rdf-wg/wiki/Skolemisation"
                        >Skolemisation</a
                      >
                    </div>
                  </div>
                </div>
                <!-- Doesnt work on github pages because of cors -->
                <!-- <div class="mb-2 align-items-center"> -->
                <!--   <div class="col-auto"> -->
                <!--     <label for="from_url" class="col-form-label fw-bold" -->
                <!--       >Load HTML from url</label -->
                <!--     > -->
                <!--   </div> -->
                <!--   <div class="col-auto"> -->
                <!--     <div class="input-group"> -->
                <!--       <input -->
                <!--         type="url" -->
                <!--         id="fromUrl" -->
                <!--         name="fromUrl" -->
                <!--         class="form-control flat" -->
                <!--         aria-describedby="From an url" -->
                <!--       /> -->
                <!--       <div class="input-group-append"> -->
                <!--         <button -->
                <!--           class="btn btn-outline-secondary" -->
                <!--           id="loadFromUrlBtn" -->
                <!--         > -->
                <!--           Load -->
                <!--         </button> -->
                <!--       </div> -->
                <!--     </div> -->
                <!--   </div> -->
                <!-- </div> -->
                <div class="mb-2 align-items-center">
                  <div class="col-auto">
                    <label for="html" class="col-form-label fw-bold"
                      >Html</label
                    >
                  </div>
                  <div class="col-auto">
                    <textarea
                      required
                      rows="18"
                      id="html"
                      name="html"
                      class="form-control flat"
                      aria-describedby="Html content"
                    ></textarea>
                  </div>
                </div>
                <div class="d-grid gap-2">
                  <button type="submit" class="btn btn-outline-danger">
                    Submit
                  </button>
                  <button class="btn btn-primary" id="copyToClipboard">
                    Copy Output
                  </button>
                </div>
              </form>
            </div>
          </div>
        </div>
        <div class="col-lg-8 col-12 mt-lg-0 mt-2">
          <div class="card terminal">
            <div class="card-body">
              <pre class="p-2 h-100" id="out"></pre>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>