updated researchStudies

episphere · Oct 31, 2023 · 16618e5 · 16618e5
1 parent 785f58c
commit 16618e5
Show file tree

Hide file tree

Showing 6 changed files with 65 additions and 22 deletions.
diff --git a/confluence.js b/confluence.js
@@ -349,7 +349,7 @@ export const confluence = async () => {
       const element = document.getElementById("data2");
       if (!element) return;
       if (element.classList.contains("navbar-active")) return;
-      document.title = "Testing";
+      document.title = "Research Studies";
       assignNavbarActive(element);
       confluenceDiv.innerHTML = testPage2();
       hideAnimation();

diff --git a/src/config.js b/src/config.js
@@ -26,5 +26,9 @@ export const config = {
 export const boxRoles = {
     'Editor': 'Upload, download, preview, share, edit, and delete',
     'Viewer': 'Download, preview and share',
-    'Uploader': 'Upload only'
+    'Previewer': 'Preview',
+    'Uploader': 'Upload only',
+    'Previewer Uploader': 'Preview and upload',
+    'Viewer Uploader': 'View and upload',
+    'Co-owner': 'Co-own'
 }
diff --git a/src/manageAuthentication.js b/src/manageAuthentication.js
@@ -30,8 +30,7 @@ export const loginObs = () => {
 };
 
 export const loginAppDev = () => {
-  location.href = `https://account.box.com/api/oauth2/authorize?response_type=code&client_id=${config.iniAppLocal.client_id}&redirect_uri=${location.origin + location.pathname}&state=${config.iniAppLocal.stateIni
-  }`;
+  location.href = `https://account.box.com/api/oauth2/authorize?response_type=code&client_id=${config.iniAppLocal.client_id}&redirect_uri=${location.origin + location.pathname}&state=${config.iniAppLocal.stateIni}`;
 };
 
 export const loginAppEpisphere = () => {

diff --git a/src/pages/researchStudies.js b/src/pages/researchStudies.js
@@ -10,13 +10,13 @@ export const testPage2 = () => {
                 </div>
               </div>
               <div class="data-submission div-border font-size-18" style="padding-left: 1rem; padding-right: 1rem;">
-                The following are DCEG studies with data platform that provide information about the studies and instructions on requesting study data:
-                <div class="row m-0">  
+                <div class="row m-0 center">  
                   <span>
-                    <br><a href= "https://aghealth.nih.gov/" target="__blank">Agricultural Health Study</a><br>
-                    <br><a href= "http://dietandhealth.cancer.gov/" target="__blank">NIH-AARP Diet and Health Study</a><br>
-                    <br><a href= "https://biometry.nci.nih.gov/cdas/plco/" target="__blank">The Prostate, Lung, Colorectal and Ovarian</a><br>
-                    <br><a href= "https://dceg2.cancer.gov/gemshare/" target="__blank">GEMINI Shared Repoisitory</a><br> 
+                    <br><iframe title="Report Section" width="1024" height="800" src=https://app.powerbigov.us/view?r=eyJrIjoiNTlkMjUwMzUtYWRmZS00NGMyLWFlMzktOGFjZWJjMDgwMWEzIiwidCI6IjE0Yjc3NTc4LTk3NzMtNDJkNS04NTA3LTI1MWNhMmRjMmIwNiJ9&pageName=ReportSection400e38af4048821418ee frameborder="0" allowFullScreen="true"></iframe></br>
+                    <!--<br><a href= "https://aghealth.nih.gov/" target="__blank">Agricultural Health Study</a></br>
+                    <br><a href= "http://dietandhealth.cancer.gov/" target="__blank">NIH-AARP Diet and Health Study</a></br>
+                    <br><a href= "https://biometry.nci.nih.gov/cdas/plco/" target="__blank">The Prostate, Lung, Colorectal and Ovarian</a></br>
+                    <br><a href= "https://dceg2.cancer.gov/gemshare/" target="__blank">GEMINI Shared Repoisitory</a></br>-->
                   </span> 
                 </div>
               </div>

diff --git a/src/pages/uploaddata.js b/src/pages/uploaddata.js
@@ -41,9 +41,9 @@ export const dataUploadForm = async () => {
     "-" +
     ("0" + (dateToday.getMonth() + 1)).slice(-2);
   let template = `
-        <div class="input-group input-group2">
+      <div class="input-group input-group2" hidden>
           <button class="nav-link nav-menu-links custom-btn" title="Login ERa" id="loginERa">
-            Login ERa
+            <img src="./static/images/era.png"> Login ERa
           </button>
         </div>
         <form class="contact-form" id="regForm">
@@ -58,21 +58,21 @@ export const dataUploadForm = async () => {
             </div>
 
             <div class="input-group input-group2 d-none">
-              <label for="dsmp_type"> <b>What type of DSMP(s) are you selecting from? </b><span class='required-label'>*</span> </label>      
+              <label for="dsmp_type"> <b>What type of DMSP(s) are you selecting from? </b><span class='required-label'>*</span> </label>      
                 <input id="dsmp_pubpres" name="dsmp_type" type="radio" value="Publication/Presentation" required/>
                   <label class="inline" for="dsmp_pubpres"> Publication/Presentation </label>
                 <input id="dsmp_study" name="dsmp_type" type="radio" value="Study" required/>
                   <label class="inline" for="dsmp_study"> Study </label>
             </div>
 
             <div class='input-group input-group2 d-none' >
-              <label for="dsmp_name"> <b>Please select from a DSMP:</b><span class='required-label'>*</span> </label>
+              <label for="dsmp_name"> <b>Please select from a DMSP:</b><span class='required-label'>*</span> </label>
                 <select class='form-select' id='approvedDSMP' name='dsmp_name' multiple>
                 </select>             
             </div>
 
             <div class='d-none' id="dsmp_no">
-              <p class="dsmpno"><b>A DSMP must first be created before uploading. <a href="https://nih.sharepoint.com/sites/NCI-DCEG-myDCEG/SitePages/Data-Sharing-and-Management-(DSM)-Policy.aspx" target="__blank">Click here to create a DSMP.</a></b></p>
+              <p class="dsmpno"><b>A DMSP must first be created before uploading. <a href="https://nih.sharepoint.com/sites/NCI-DCEG-myDCEG/SitePages/Data-Sharing-and-Management-(DSM)-Policy.aspx" target="__blank">Click here to create a DMSP.</a></b></p>
             </div>
 
             <div class='input-group input-group2 d-none' id="duoSel">
@@ -143,8 +143,9 @@ export const dataUploadForm = async () => {
   var currentTab = 0;
   showTab(currentTab);
   //console.log(currentTab);
-  const dsmp = await (await fetch("https://raw.githubusercontent.com/episphere/dataplatform/main/imports/dmsp_output.csv")).text()//await (await fetch("./imports/dsmp_output.csv")).text();
-  //console.log(dsmp);
+  const dsmp = await (await fetch("https://raw.githubusercontent.com/episphere/dataplatform/main/imports/dmsp_output.csv")).text();//await (await fetch("./imports/dsmp_output.csv")).text();
+  // const icoutput = await (await fetch("https://raw.githubusercontent.com/episphere/dataplatform/main/imports/ic_output.csv")).text();
+  // console.log(icoutput);
   let csvData = csv2JsonTest(dsmp);
   //await populateApprovedSelect(csvData);
   document.getElementById("approvedyes").addEventListener("click", approvedFormSelect);
@@ -220,13 +221,21 @@ export const approvedFormSelect = async (csvData) => { //Is there a DSMP functio
 
 export const dsmpSelected = async (csvData) => {
   document.getElementById("nextBtn").style.display = "inline";
+  const icoutput = await (await fetch("https://raw.githubusercontent.com/episphere/dataplatform/main/imports/ic_output.csv")).text();
+  let icData = csv2JsonTest(icoutput);
+  console.log(icData);
   let template =`
   <label for="duoSel"> <b>Please select the required data use restrictions and requirements associated with the data based on the study's Institutional Certification (IC). If you have questions about your study's IC, please contact your <a href="https://nih.sharepoint.com/sites/NCI-DCEG-myDCEG/SitePages/Data-Sharing-and-Management-(DSM)-Policy.aspx" target="__blank">Data Sharing Administrator (DSA)</a>.</b><span class='required-label'>*</span> </label>
     <div class='input-group input-group2 font-size-22'>`;
   var ele = document.getElementById("approvedDSMP");
   var values = Array.from(ele.selectedOptions).map(({ value }) => value);//Array.from(ele.selectedOptions).map(v=>v.value);
   //console.log(values);
   for (const value of values){
+    let dmspVal = value.split('.v')[0];
+    var dmspIC = icData.data.find(item => item.planID === dmspVal);
+    if (dmspIC){
+      console.log('yes');
+    }
     var selectedData = csvData.data.find(item => item.planID === value);
     if (!selectedData.studyName){
       selectedData.studyName = 'None'
@@ -241,8 +250,28 @@ export const dsmpSelected = async (csvData) => {
     const duoEl = document.getElementById("duoSel");
     duoEl.classList.toggle("d-none", values === "");
     template +=`
-          <h3>DSMP: ${value}</h3>`;
-            for (let i=0; i <studies.length; i++) {
+          <h3>DMSP: ${value}</h3>`;
+    if (dmspIC){
+      for (let i=0; i <studies.length; i++) {
+      template += `
+      <div class="input-group input-group2 font-size-22">
+        <div class="inline-field field-br">
+          <input id="${value}sel${i}" name="studySel" type="checkbox" value="${value}duo${i}" checked/> <!---${studies.length === 1 ? 'checked':''}--->
+          <label class="container-ul" for="${value}sel${i}"><h4><b>cas: ${cas[i]}</b>, ${studies[i]}</h4></label>
+        </div>
+        <div class="input-group input-group2">
+          <ul class="form2" id='${value}duo${i}' cas='${cas[i]}' study='${studies[i]}'>
+            <div class="inline-field">
+              <input id="${value}${dmspIC.dul}${i}" name="duoSel" type="checkbox" value="NR" checked disabled/>
+              <label class="container-ul" for="${value}nores${i}">${dmspIC.dul}: ${dmspIC.ds_dul}</label>
+            </div>
+          </ul>
+          </div>
+        </div>
+      `
+      }
+    } else {
+    for (let i=0; i <studies.length; i++) {
               //console.log(studies[i]);
     template += `
             <div class="input-group input-group2 font-size-22">
@@ -284,6 +313,7 @@ export const dsmpSelected = async (csvData) => {
               </div>
             `
             }
+    }
   }
   template +=`
             </div>`
@@ -344,7 +374,7 @@ export const populateApprovedSelect = async (csvData) => { //Pulling data from d
   optionEl.disabled = true;
   optionEl.selected = true;
   optionEl.value = '';
-  optionEl.text = `--select a DSMP--`;
+  optionEl.text = `--select a DMSP--`;
   approvedEl.appendChild(optionEl);
   options.forEach((option) => {
     const optionEl = document.createElement("option");
@@ -367,7 +397,7 @@ export const populateApprovedSelect = async (csvData) => { //Pulling data from d
       optionEl.style="font-style:italic";
       optionEl.value = '';
       //console.log(optionEl.value);
-      optionEl.text = `${studies[i]}, cas: ${cas[i]}`;
+      optionEl.text = `${studies[i]}`; //`${studies[i]}, cas: ${cas[i]}`;
       approvedEl.appendChild(optionEl);
     }
   });
@@ -557,7 +587,7 @@ export async function nextPrev(n, currentTab) {
       const study = form.getAttribute('study');
       template +=
       `<div class="contact-form input-group input-group2 font-size-22" id="${id}Form">
-        <h3>DSMP: ${id.split('duo')[0]}</h3>
+        <h3>DMSP: ${id.split('duo')[0]}</h3>
         <div class="input-group input-group2 font-size-22">
           <h4><b>cas: ${cas}</b>, ${study}</h4>
             <div class='input-group input-group2' >

diff --git a/static/css/confluence.css b/static/css/confluence.css
@@ -1797,6 +1797,11 @@ form {
   border: 0px;
 }
 
+.custom-btn img {
+  width: 50px;
+  height: auto;
+}
+
 .custom-border {
   border: 3px solid #dddddd !important;
 }
@@ -2360,4 +2365,9 @@ button.previous-btn {
   .form-inline input {
     margin: 10px 0 !important;
   }
+}
+
+.center {
+  display: flex;
+  justify-content: center;
 }