ScriptureSearch/index.html at main · NeoAlchemy/ScriptureSearch · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<html>
  <head>
    <title>Scripture Search</title>
    <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
    <link rel="manifest" href="site.webmanifest">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous"></script>
    <script src="https://unpkg.com/imagesloaded@5/imagesloaded.pkgd.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="style.css">
  </head>
  <body class="bg-light">
    <div id="loading"></div>
    <div class="container">
      <div id="heading" class="shadow p-3 mb-5 bg-white bg-body-tertiary rounded">
        <h1>Scripture Search</h1>
        <div class="row g-2 align-items-center">
          <div class="col-sm-9">
            <label class="visually-hidden" for="inlineFormInputGroupUsername">RegEx</label>
            <div class="input-group">
              <input type="text" class="form-control" id="reggie" placeholder="">
            </div>
          </div>
          <div class="col-sm">
            <button type="submit" id="search" class="btn btn-primary">Submit</button>
          </div>
        </div>
        <small id="reggieHelp" class="form-text text-muted">Search the scriptures using a RegEx expression</small><br/>
        <small class="form-text text-muted">Example: Conditional Statements: (?&lt;!as)( if)  </small><br/>
        <small class="form-text text-muted">Example: Law of <i>blank</i> (except Moses): (law of )(?!Moses)</small><br/><br/>
        <div class="form-check form-switch form-check-inline">
          <input class="form-check-input" type="checkbox" role="switch" id="bookOfMormon" checked>
          <label class="form-check-label" for="bookOfMormon">Book of Mormon</label>&nbsp;<small class="text-muted" id="bofmCount"></small>
        </div>
        <div class="form-check form-switch form-check-inline">
          <input class="form-check-input" type="checkbox" role="switch" id="doctorineAndCovenants" checked>
          <label class="form-check-label" for="doctorineAndCovenants">Doctorine and Covenants</label>&nbsp;<small class="text-muted" id="dcCount"></small>
        </div>
        <div class="form-check form-switch form-check-inline">
          <input class="form-check-input" type="checkbox" role="switch" id="pearlOfGreatPrice" checked>
          <label class="form-check-label" for="pearlOfGreatPrice">Pearl of Great Price</label>&nbsp;<small class="text-muted" id="pgpCount"></small>
        </div>
        <div class="form-check form-switch form-check-inline">
          <input class="form-check-input" type="checkbox" role="switch" id="newTestament" checked>
          <label class="form-check-label" for="newTestament">New Testament</label>&nbsp;<small class="text-muted" id="ntCount"></small>
        </div>
        <div class="form-check form-switch form-check-inline">
          <input class="form-check-input" type="checkbox" role="switch" id="oldTestament" checked>
          <label class="form-check-label" for="oldTestament">Old Testament</label>&nbsp;<small class="text-muted" id="otCount"></small>
        </div>
      </div>
      <div class="list row"><div id="grid-sizer"></div>
    </div>
    <script type="text/javascript" src="script.js"></script>
  </body>
</html>