alectrolytes.github.io/pgx-cds.html at master · alectrolytes/alectrolytes.github.io · 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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
---
layout: default
title: Team Nexus - PGX CDS Simulator
---

  <link rel="stylesheet" href="/css/pgx-cds.css"/>
  <script src="/js/pgx-cds.js"></script>
</head>
<body>
    <!-- background tint-->
    <div class="overlay"></div>

    <!-- awesome zoom box navbar! -->
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container">
        <div id="projects-btn" class="box">
          Projects
          <span class="top"></span>
          <span class="right"></span>
          <span class="bottom"></span>
          <span class="left"></span>
          <a href="http://teamnex.us/#projects" class="boxlink"></a>
        </div>
      </div>
    </nav>

    <div class="content">
      <!-- title -->
      <div class="title">
        <h1>Prototype PGx-CDS</h1>
      </div>

      <!-- cpoe -->
      <div class="cpoe">
        <div class="medication">
          <div class="details">
            <button type="button" class="btn btn-success add">Add New Medication</button>
            <button type="button" class="btn btn-danger remove">Remove</button>
          </div>
          <ul class="order">
            <li class="med-list">
          		<table class="table" style="table-layout:fixed">
          			<tbody class="list">
          				<tr>
          					<td id="acetaminophen" class="med">
                      <p>Acetaminophen</p>
                    </td>
          				</tr>
                  <tr>
          					<td id="codeine" class="med">
                      <p>Acetaminophen with Codeine</p>
                      <img class="pgx-warning" src="/img/warning.png" alt="PGX Flag" style="float: right">
                    </td>
          				</tr>
                  <tr>
                    <td id="fentanyl" class="med">
                      <p>Fentanyl</p>
                    </td>
                  </tr>
                  <tr>
                    <td id="morphine" class="med">
                      <p>Morphine</p>
                    </td>
                  </tr>
                  <tr>
                    <td id="tramadol" class="med">
                      <p>Tramadol</p>
                    </td>
                  </tr>
          			</tbody>
          		</table>
            </li>
            <li class="strength-list">
              <table id="strength-table" class="table" style="table-layout:fixed">
              </table>
            </li>
            <li class="route-list">
              <table id="route-table" class="table" style="table-layout:fixed">
              </table>
            </li>
            <li class="frequency-list">
              <table id="frequency-table" class="table" style="table-layout:fixed">
              </table>
            </li>
          </ul>
          <div class="report">
            <button type="button" class="btn btn-info info-btn">More Info</button>
          </div>
        </ul>
      </div>
    </div>

    <!-- more info lightbox -->
    <div id='more-info' class="white_content">
      <h1>More Info</h1>
      <h3>Level of Evidence: Strong</h3>
      <div id='description'>
        <p>CYP2D6 metabolizes codeine into morphine. At normal doses, an ultra-rapid metabolizer patient may experience increased morphine levels and the symptoms of overdose: extreme sleepiness, confusion, or shallow breathing.</p>
      </div>
      <div id='support'>
        <p>List of Studies</p>
        <ul>
          <li><a href="https://www.pharmgkb.org/guideline/PA166104996" target="_blank">CPIC Guideline</a></li>
          <li><a href="https://www.pharmgkb.org/guideline/PA166122666" target="_blank">PRO Guideline</a></li>
          <li><a href="https://www.pharmgkb.org/guideline/PA166104970" target="_blank">DPWG Guideline</a></li>
        </ul>
      </div>
      <button id='close-btn' type="button" class="btn btn-info">Close</button>
    </div>

    <!-- popup case -->
    <div id='case' class="white_content">
      <h1>Case: John Doe</h1>
      <p>John Doe, a 40 y/o WM with no PMH, presents to the Team Nexus clinic after having his wisdom teeth pulled. He complains of pain with a score of 5 on a Likert pain scale. In the EHR, JD does not have any data besides a complementary genetic test. With this information, please provide an appropriate therapy for patient John Doe.</p>
      <button id='begin-btn' type="button" class="btn btn-primary">Begin</button>
    </div>

    <div id='fade' class="black_overlay"></div>