fhirsmith 0.3.0

package/tx/html/operations-form.liquid

@@ -0,0 +1,148 @@
+<h2>Expand ValueSet</h2>
+<form method="get" action="ValueSet/$expand" style="margin-left: 10px; margin-top: 5px;">
+  <table class="grid" cellpadding="0" cellspacing="0">
+    <tr>
+      <td style="position: relative;">
+        URL: <input type="text" name="url" id="vsUrlInput" size="40" autocomplete="off"/><span style="color: maroon">*</span>
+        <div id="vsUrlSuggestions" class="typeahead-suggestions" style="display:none; position:absolute; background:white; border:1px solid #ccc; max-height:200px; overflow-y:auto; z-index:1000; width:100%;"></div>
+      </td>
+      <td>Version: <input type="text" name="valueSetVersion" size="10"/></td>
+    </tr>
+    <tr>
+      <td>Filter: <input type="text" name="filter" size="20"/></td>
+      <td>Language: <input type="text" name="displayLanguage" size="10"/></td>
+    </tr>
+    <tr>
+      <td colspan="2">
+        <input type="checkbox" name="includeDesignations" id="expand_desig" value="true"/>
+        <label for="expand_desig">Include Designations</label>
+        <input type="checkbox" name="activeOnly" id="expand_active" value="true"/>
+        <label for="expand_active">Active Only</label>
+        <input type="checkbox" name="excludeNested" id="expand_excludeNested" value="true"/>
+        <label for="expand_excludeNested">Not nested</label>
+      </td>
+    </tr>
+  </table>
+  <button type="submit" class="btn btn-sm btn-primary">Expand</button>
+</form>
+
+<h2>Validate Code</h2>
+<form method="get" action="ValueSet/$validate-code" style="margin-left: 10px; margin-top: 5px;">
+  <input type="hidden" name="inferSystem" id="{{ inferSystemId }}" value="true"/>
+  <table class="grid" cellpadding="0" cellspacing="0">
+    <tr>
+      <td style="position: relative;">
+        ValueSet URL: <input type="text" name="url" id="vcVsUrlInput" size="40" autocomplete="off"/><span style="color: maroon">*</span>
+        <div id="vcVsUrlSuggestions" class="typeahead-suggestions" style="display:none; position:absolute; background:white; border:1px solid #ccc; max-height:200px; overflow-y:auto; z-index:1000; width:100%;"></div>
+      </td>
+      <td>ValueSet Version: <input type="text" name="valueSetVersion" size="10"/></td>
+    </tr>
+    <tr>
+      <td>System: <input type="text" name="system" id="{{ vcSystemId }}" size="30" onchange="updateInferSystem('{{ vcSystemId }}', '{{ inferSystemId }}')"/></td>
+      <td>Version: <input type="text" name="version" size="10"/></td>
+    </tr>
+    <tr>
+      <td>Code: <input type="text" name="code" size="20" required/><span style="color: maroon">*</span></td>
+      <td>Display: <input type="text" name="display" size="20"/></td>
+    </tr>
+    <tr>
+      <td>Language: <input type="text" name="displayLanguage" size="10"/></td>
+      <td>
+        <input type="checkbox" name="abstract" value="true"/>
+        <label>Abstract</label>
+      </td>
+    </tr>
+  </table>
+  <button type="submit" class="btn btn-sm btn-primary">Validate Code</button>
+</form>
+
+<script>
+(function() {
+  const valueSets = {{ valueSetsJson }};
+
+  function setupTypeahead(inputId, suggestionsId) {
+    const input = document.getElementById(inputId);
+    const suggestions = document.getElementById(suggestionsId);
+    let selectedIndex = -1;
+
+    input.addEventListener('input', function() {
+      const query = this.value.toLowerCase();
+      suggestions.innerHTML = '';
+      selectedIndex = -1;
+
+      if (query.length < 2) {
+        suggestions.style.display = 'none';
+        return;
+      }
+
+      const matches = valueSets
+        .filter(vs => vs.toLowerCase().includes(query))
+        .slice(0, 50);
+
+      if (matches.length === 0) {
+        suggestions.style.display = 'none';
+        return;
+      }
+
+      for (const match of matches) {
+        const div = document.createElement('div');
+        div.textContent = match;
+        div.style.padding = '4px 8px';
+        div.style.cursor = 'pointer';
+        div.addEventListener('mouseenter', function() {
+          this.style.backgroundColor = '#e0e0e0';
+        });
+        div.addEventListener('mouseleave', function() {
+          this.style.backgroundColor = 'white';
+        });
+        div.addEventListener('click', function() {
+          input.value = match;
+          suggestions.style.display = 'none';
+        });
+        suggestions.appendChild(div);
+      }
+
+      suggestions.style.display = 'block';
+    });
+
+    input.addEventListener('keydown', function(e) {
+      const items = suggestions.querySelectorAll('div');
+      if (items.length === 0) return;
+
+      if (e.key === 'ArrowDown') {
+        e.preventDefault();
+        selectedIndex = Math.min(selectedIndex + 1, items.length - 1);
+        updateSelection(items);
+      } else if (e.key === 'ArrowUp') {
+        e.preventDefault();
+        selectedIndex = Math.max(selectedIndex - 1, 0);
+        updateSelection(items);
+      } else if (e.key === 'Enter' && selectedIndex >= 0) {
+        e.preventDefault();
+        input.value = items[selectedIndex].textContent;
+        suggestions.style.display = 'none';
+      } else if (e.key === 'Escape') {
+        suggestions.style.display = 'none';
+      }
+    });
+
+    function updateSelection(items) {
+      items.forEach((item, i) => {
+        item.style.backgroundColor = i === selectedIndex ? '#e0e0e0' : 'white';
+      });
+      if (selectedIndex >= 0) {
+        items[selectedIndex].scrollIntoView({ block: 'nearest' });
+      }
+    }
+
+    document.addEventListener('click', function(e) {
+      if (!input.contains(e.target) && !suggestions.contains(e.target)) {
+        suggestions.style.display = 'none';
+      }
+    });
+  }
+
+  setupTypeahead('vsUrlInput', 'vsUrlSuggestions');
+  setupTypeahead('vcVsUrlInput', 'vcVsUrlSuggestions');
+})();
+</script>

package/tx/html/search-form.liquid

@@ -0,0 +1,62 @@
+<h3>Search</h3>
+
+<form method="get" id="searchForm" action="{{ baseUrl }}/CodeSystem">
+<table class="grid" cellpadding="0" cellspacing="0">
+<tr>
+<td colspan="2">URL: <input type="text" name="url" size="40"/></td>
+<td>Version: <input type="text" name="version"/></td>
+</tr>
+<tr>
+<td title="Searches in name, title, description, publisher">Text: <input type="text" name="text"/></td>
+<td>Status: <select name="status" class="form-select"><option value="">(any status)</option>
+<option value="draft">draft</option><option value="active">active</option>
+<option value="retired">retired</option><option value="unknown">unknown</option></select></td>
+<td>Language: <input type="text" name="lang" size="10"/> (ietf code)</td>
+</tr>
+<tr>
+<td colspan="2" title="CodeSystem - for supplements, value sets, and concept maps">System: <input type="text" name="system" size="40"/></td>
+<td>CS Content: <select name="content-mode" class="form-select"><option value="">(any content)</option>
+<option value="not-present">not-present</option><option value="example">example</option>
+<option value="fragment">fragment</option><option value="complete">complete</option>
+<option value="supplement">supplement</option></select></td>
+</tr>
+</table>
+
+<input type="hidden" name="_elements" id="elementsInput" value="url,version,name,title,status,content,date" disabled/>
+
+<button type="submit" class="btn btn-primary">Search:</button>
+<input type="radio" name="mode" value="cs" checked onchange="updateSearchAction('{{ baseUrl }}')"/> CodeSystems
+<input type="radio" name="mode" value="vs" onchange="updateSearchAction('{{ baseUrl }}')"/> ValueSets
+<input type="radio" name="mode" value="cm" onchange="updateSearchAction('{{ baseUrl }}')"/> ConceptMaps
+|
+<input type="checkbox" id="summaryTable" onchange="updateSummaryTable()"/> <label for="summaryTable">Summary Table</label>
+</form>
+
+<p>Or see the <a href="op.html">Operations</a></p>
+
+<script>
+function updateSearchAction(baseUrl) {
+  const form = document.getElementById('searchForm');
+  const mode = document.querySelector('input[name="mode"]:checked').value;
+  const resourceMap = { cs: 'CodeSystem', vs: 'ValueSet', cm: 'ConceptMap' };
+  form.action = baseUrl + '/' + resourceMap[mode];
+}
+
+function updateSummaryTable() {
+  const checkbox = document.getElementById('summaryTable');
+  const elementsInput = document.getElementById('elementsInput');
+  elementsInput.disabled = !checkbox.checked;
+  localStorage.setItem('txSummaryTable', checkbox.checked);
+}
+
+// Restore summary table preference on page load
+document.addEventListener('DOMContentLoaded', function() {
+  const saved = localStorage.getItem('txSummaryTable');
+  if (saved === 'true') {
+    const checkbox = document.getElementById('summaryTable');
+    checkbox.checked = true;
+    document.getElementById('elementsInput').disabled = false;
+  }
+});
+
+</script>

package/tx/html/tx-template.html

@@ -0,0 +1,133 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<html xml:lang="en" lang="en">
+<head>
+    <title>FHIRsmith: [%title%]</title>
+
+  <meta charset="utf-8"/>
+  <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
+  <meta content="http://hl7.org/fhir" name="author"/>
+  <meta charset="utf-8" http-equiv="X-UA-Compatible" content="IE=edge" />
+
+  <link rel="stylesheet" href="/fhir.css"/>
+
+    <!-- Bootstrap core CSS -->
+  <link rel="stylesheet" href="/assets/css/bootstrap.css"/>
+  <link rel="stylesheet" href="/assets/css/bootstrap-fhir.css"/>
+
+    <!-- Project extras -->
+  <link rel="stylesheet" href="/assets/css/project.css"/>
+  <link rel="stylesheet" href="/assets/css/pygments-manni.css"/>
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!-- [if lt IE 9]>
+    <script src="/assets/js/html5shiv.js"></script>
+    <script src="/assets/js/respond.min.js"></script>
+    <![endif] -->
+
+    <!-- Favicons -->
+  <link sizes="144x144" rel="apple-touch-icon-precomposed" href="/assets/ico/apple-touch-icon-144-precomposed.png"/>
+  <link sizes="114x114" rel="apple-touch-icon-precomposed" href="/assets/ico/apple-touch-icon-114-precomposed.png"/>
+  <link sizes="72x72" rel="apple-touch-icon-precomposed" href="/assets/ico/apple-touch-icon-72-precomposed.png"/>
+  <link rel="apple-touch-icon-precomposed" href="/assets/ico/apple-touch-icon-57-precomposed.png"/>
+  <link rel="shortcut icon" href="/assets/ico/favicon.png"/>
+<script type="text/javascript" src="/assets/js/json2.js"></script>
+<script type="text/javascript" src="/assets/js/jquery.min.js"></script>
+<script type="text/javascript" src="/assets/js/bootstrap.min.js"></script>
+</head>
+
+<body>
+  <script>
+      function toggleJsonSource(id) {
+          const elem = document.getElementById(id);
+          const btn = elem.previousElementSibling;
+          if (elem.style.display === 'none') {
+              elem.style.display = 'block';
+              btn.textContent = 'Hide JSON Source';
+          } else {
+              elem.style.display = 'none';
+              btn.textContent = 'Show JSON Source';
+          }
+      }
+      function toggleOriginalNarrative(id) {
+          const elem = document.getElementById(id);
+          const btn = elem.previousElementSibling;
+          if (elem.style.display === 'none') {
+              elem.style.display = 'block';
+              btn.textContent = 'Hide Original Narrative';
+          } else {
+              elem.style.display = 'none';
+              btn.textContent = 'Show Original Narrative';
+          }
+      }
+      function toggleOperations(id) {
+          const elem = document.getElementById(id);
+          const btn = elem.previousElementSibling;
+          if (elem.style.display === 'none') {
+              elem.style.display = 'block';
+              btn.textContent = 'Hide Operations';
+          } else {
+              elem.style.display = 'none';
+              btn.textContent = 'Show Operations';
+          }
+      }
+
+      function updateInferSystem(systemId, inferSystemId) {
+          const systemInput = document.getElementById(systemId);
+          const inferSystemInput = document.getElementById(inferSystemId);
+          inferSystemInput.disabled = (systemInput.value.trim() !== '');
+      }
+  </script>
+	<div id="segment-navbar" class="segment">
+		<div id="stripe"> </div>
+		<div class="container">
+		<div style="background-color: #ad1f2f; padding: 6px; color: white;">
+  <a href="http://www.hl7.org/fhir" style="color: gold" title="Fast Healthcare Interoperability Resources - Home Page"><img border="0" src="/icon-fhir-16.png" style="vertical-align: text-bottom"/> <b>FHIR</b></a> [%fhir-version%] &copy; HL7.org &nbsp;|&nbsp;
+  <a href="https://github.com/HealthIntersections/FHIRsmith/blob/main/README.md" style="color: gold"><img border="0" src="/FHIRsmith16.png" style="vertical-align: text-bottom"/> FHIRsmith</a> [%ver%] &nbsp;|&nbsp;
+  <a href="/" style="color: gold"> Server Home</a> &nbsp;|&nbsp;
+  <a href="[%endpoint-path%]" style="color: gold">TX Home</a>  &nbsp;|&nbsp;
+            <a href="[%endpoint-path%]/metadata" style="color: gold">Capability Statement</a>  &nbsp;|&nbsp;
+            <a href="[%endpoint-path%]/metadata?mode=terminology" style="color: gold">Terminology Capabilities</a>  &nbsp;|&nbsp;
+            <a href="[%endpoint-path%]/op.html" style="color: gold">Operations</a>  &nbsp;|&nbsp;
+  &nbsp;
+		</div>
+		</div>
+</div>
+
+	<div id="segment-content" class="segment">
+	<div class="container">
+            <div class="row">
+            	<div class="inner-wrapper">
+ <div class="col-12">
+
+  <h2><img border="0" src="/FHIRsmith32.png" style="vertical-align: text-bottom"/> TX: [%title%] </h2>
+
+[%content%]
+
+
+ </div>
+
+				</div>
+            </div>
+        </div>
+    </div>
+
+	<div id="segment-footer" class="segment">
+		<div class="container">
+			<div class="inner-wrapper">
+				<p>
+                    <a href="http://www.hl7.org/fhir" style="color: gold" title="Fast Healthcare Interoperability Resources - Home Page"><img border="0" src="/icon-fhir-16.png" style="vertical-align: text-bottom"/> <b>FHIR</b></a> &copy; HL7.org 2011+.  &nbsp;|&nbsp;
+                    <a href="https://github.com/HealthIntersections/FHIRsmith/blob/main/README.md" style="color: gold"><img border="0" src="/FHIRsmith16.png" style="vertical-align: text-bottom"/> FHIRsmith</a>  [%ver%]  &copy; HealthIntersections.com.au 2023+ &nbsp;|&nbsp;
+         FHIR Version [%fhir-version%] &nbsp;|&nbsp; ([%ms%] ms)
+        </p>
+			</div>
+		</div>
+	</div>
+
+      <!-- JS and analytics only. -->
+<script src="/assets/js/respond.min.js"/>
+<script src="/assets/js/fhir.js"/>
+
+</body>
+
+</html>

package/tx/html/valueset-operations.liquid

@@ -0,0 +1,54 @@
+<div class="operations" style="margin-top: 20px;">
+  <button type="button" class="btn btn-sm btn-outline-secondary" onclick="toggleOperations('{{ opsId }}')">Show Operations</button>
+  <div id="{{ opsId }}" style="display: none; margin-top: 10px;">
+
+    <div class="operation-form" style="margin-bottom: 15px;">
+      <strong>Expand</strong>
+      <form method="get" action="$expand" style="margin-left: 10px; margin-top: 5px;">
+        <input type="hidden" name="url" value="{{ url }}"/>
+        <table class="grid" cellpadding="0" cellspacing="0">
+          <tr>
+            <td>Filter: <input type="text" name="filter" size="20"/></td>
+            <td>Language: <input type="text" name="displayLanguage" size="10"/></td>
+          </tr>
+          <tr>
+            <td colspan="2">
+              <input type="checkbox" name="includeDesignations" id="expand_desig" value="true"/>
+              <label for="expand_desig">Include Designations</label>
+              <input type="checkbox" name="activeOnly" id="expand_active" value="true"/>
+              <label for="expand_active">Active Only</label>
+            </td>
+          </tr>
+        </table>
+        <button type="submit" class="btn btn-sm btn-primary">Expand</button>
+      </form>
+    </div>
+
+    <div class="operation-form" style="margin-bottom: 15px;">
+      <strong>Validate Code (ValueSet)</strong>
+      <form method="get" action="$validate-code" style="margin-left: 10px; margin-top: 5px;">
+        <input type="hidden" name="url" value="{{ url }}"/>
+        <input type="hidden" name="inferSystem" id="{{ inferSystemId }}" value="true"/>
+        <table class="grid" cellpadding="0" cellspacing="0">
+          <tr>
+            <td>System: <input type="text" name="system" id="{{ vcSystemId }}" size="30" onchange="updateInferSystem('{{ vcSystemId }}', '{{ inferSystemId }}')"/></td>
+            <td>Version: <input type="text" name="version" size="10"/></td>
+          </tr>
+          <tr>
+            <td>Code: <input type="text" name="code" size="20" required/></td>
+            <td>Display: <input type="text" name="display" size="20"/></td>
+          </tr>
+          <tr>
+            <td>Language: <input type="text" name="displayLanguage" size="10"/></td>
+            <td>
+              <input type="checkbox" name="abstract" value="true"/>
+              <label>Abstract</label>
+            </td>
+          </tr>
+        </table>
+        <button type="submit" class="btn btn-sm btn-primary">Validate Code</button>
+      </form>
+    </div>
+
+  </div>
+</div>