Introducing multiple questionnary for dr

Author: perki

dr-controler.js

@@ -18,24 +18,61 @@ async function stateChange(state) {
   if (state === 'loggedIN') {
     document.getElementById('please-login').style.visibility = 'hidden';
     document.getElementById('data-view').style.visibility = 'visible';
-    setSharingLink();
-    const {headers, patientsData} = await setPatientList(questionaryId);
-    document.getElementById('button-download').onclick = () => {
-      exportCSVFile(headers, patientsData, 'patients');
-    }
+    setQuestionnaries();
 
   } else {
     document.getElementById('please-login').style.visibility = 'visible';
     document.getElementById('data-view').style.visibility = 'hidden';
   }
 }
 
+async function setQuestionnaries() {
+  const select = document.getElementById("select-questionnary");
+  const optionNull = document.createElement("option");
+  optionNull.text = '---';
+  optionNull.value = '';
+  select.add(optionNull);
+
+  const quests = await drLib.getQuestionnaires();
+  for (const [key, value] of Object.entries(quests)) {
+    const option = document.createElement("option");
+    option.text = value.title;
+    option.value = key;
+    select.add(option);
+  }
+ 
+  // -- 
+  select.onchange = function () {
+    if (select.value === '') {
+      showQuestionnary(null);
+      return;
+    }
+    showQuestionnary(select.value);
+  }
+}
+
+async function showQuestionnary(questionaryId) {
+  if (questionaryId == null) {
+    document.getElementById('questionnary-view').style.visibility = 'hidden';
+    return;
+  }
+
+  setSharingLink(questionaryId);
+  const {headers, patientsData} = await setPatientList(questionaryId);
+  document.getElementById('button-download').onclick = () => {
+    exportCSVFile(headers, patientsData, 'patients');
+  }
+  document.getElementById('questionnary-view').style.visibility = 'visible';
+}
+
 const rowItems = ['name', 'surname', 'nationality'];
 /**
  * Update the patient list
  */
 async function setPatientList(questionaryId) {
   const table = document.getElementById('patients-table');
+  // clear table
+  table.innerHTML = '';
   const fields = drLib.getFields(questionaryId);
   const headers = {
     status: 'Status',
@@ -84,12 +121,12 @@ async function setPatientList(questionaryId) {
 /**
  * Creates the sharing link on the page
  */
-async function setSharingLink() {
+async function setSharingLink(questionaryId) {
   const currentPage = window.location.href;
   const posDrHTML = currentPage.indexOf('dr.html');
   const patientURL = currentPage.substring(0, posDrHTML) + 'patient.html';
 
-  const formApiEndpoint = await drLib.getSharingToken();
+  const formApiEndpoint = await drLib.getSharingToken(questionaryId);
   const sharingLink = patientURL + '?formApiEndpoint=' + formApiEndpoint;
   const sharingMailBody = 'Hello,\n\nI am sending you a link to fill out a form.\nPlease click on the link below to access the form: \n\n' + sharingLink + '\n\nBest regards,\nYour Doctor';
   const sharingLinkHTML = `<A HREF="mailto:?subject=Invitation&body=${encodeURI(sharingMailBody)}">Send by email</A> - ${sharingLink}`;

dr-lib.js

@@ -6,7 +6,8 @@ export const drLib = {
   showLoginButton,
   getSharingToken,
   getPatientsList,
-  getFields
+  getFields,
+  getQuestionnaires
 }
 
 function showLoginButton (loginSpanId, stateChangeCallBack) {
@@ -49,6 +50,11 @@ function showLoginButton (loginSpanId, stateChangeCallBack) {
   }
 }
 
+// -------- Questionnaties ----- 
+async function getQuestionnaires() {
+  return dataDefs.questionnaires;
+}
+
 // -------- Fetch patient list --------
 
 const patients = {};
@@ -207,7 +213,6 @@ function dataFieldFromEvent (formProfile, event) {
     event: event
   };
   if (dataField.type === 'date') {
-    // convert the date to a Date object
     const date = new Date(event.content);
     if (!isNaN(date)) {
       field.value = date.toISOString().split('T')[0]; // format YYYY-MM-DD
@@ -234,14 +239,23 @@ async function initDrAccount (connection) {
  * Initialize or get the sharing token for patients
  * @returns 
  */
-async function getSharingToken () {
+async function getSharingToken (questionaryId) {
   const accessesCheckRes = await drConnection.api([{ method: 'accesses.get', params: {}}]);
   const sharedAccess = accessesCheckRes[0].accesses.find(access => access.name === 'demo-dr-form-shared');
   if (sharedAccess) {
     console.log('## Dr account already has a shared access');
     return sharedAccess.apiEndpoint;
   }
-  const accessRes = await drConnection.api([{ 
+  
+
+  const resultStreamAndAccess = await drConnection.api([{ 
+    method: 'streams.create', // make sure streamId with questionnaryId exists 
+    params: {
+      id: 'demo-dr-forms-questionary-x',
+      name: 'Questionnary x',
+      parentId: 'demo-dr-forms'
+    }
+  }, { // create access 
     method: 'accesses.create', 
     params: {
       name: 'demo-dr-form-shared',
@@ -251,7 +265,7 @@ async function getSharingToken () {
           level: 'create-only'
         },
         {
-          streamId: 'demo-dr-forms-questionary-x',
+          streamId: questionaryId,
           level: 'read'
         },
         { // for "publicly shared access" always forbid the selfRevoke feature
@@ -260,13 +274,13 @@ async function getSharingToken () {
         }],
       clientData: {
         'demo-dr-form': {
-          questionaryId: 'demo-dr-forms-questionary-x'
+          questionaryId
         }
       }
     }
   }]);
-  console.log('## Dr account shared access created', accessRes);
-  return accessRes[0].access.apiEndpoint;
+  console.log('## Dr account shared access created', resultStreamAndAccess);
+  return resultStreamAndAccess[1].access.apiEndpoint;
 }
 
 
@@ -317,13 +331,6 @@ async function initStreams () {
         id: 'demo-dr-forms',
         name: 'Demo Dr Forms'
       }
-    },
-    { 
-      method: 'streams.create',
-      params: {
-        id: 'demo-dr-forms-questionary-x',
-        name: 'Questionnary x'
-      }
     }
   ];
   const result = await drConnection.api(apiCalls);

dr.html

@@ -36,22 +36,24 @@ <h2 class="card-title">Welcome</h2>
       </div>
     </div>
     <div class="card" id="data-view" style="visibility: hidden;">
-      <div class="card-login">
-        <h2 class="card-title">Sharing link</h2>
-        <span id="sharing-link">
-          
-      </div>
-      <div class="card-login">
-        <h2 class="card-title">Patients</h2>
-        <button id="button-download" class="btn btn-secondary">Download</button>
-        <table id='patients-table' class="table">
-          <thead>
-            <!-- will be filled by setPatientList-->
-          </thead>
-          <tbody>
-            <!-- will be filled by setPatientList-->
-          </tbody>
-        </table>
+      Select a questionnary: <select id="select-questionnary" class="form-control"></select>
+      <div id="questionnary-view">
+        <div class="card">
+          <h2 class="card-title">Sharing link</h2>
+          <span id="sharing-link">
+        </div>
+        <div class="card">
+          <h2 class="card-title">Patients</h2>
+          <button id="button-download" class="btn btn-secondary">Download</button>
+          <table id='patients-table' class="table">
+            <thead>
+              <!-- will be filled by setPatientList-->
+            </thead>
+            <tbody>
+              <!-- will be filled by setPatientList-->
+            </tbody>
+          </table>
+        </div>
       </div>
     </div>
   </div>