crf/views/crfPortal.html

<style>
p.hidden{
	display:none;
}
table {margin-bottom:20px;table-layout:fixed; border-collapse:collapse; border-spacing:10px}
table.t1 {width:400px; border:1px solid black}
table.t1 th {border:1px solid black;padding:4px;background-color:#e0e0e0}
table.t1 td {text-align:center}
table.t2 {width:800px; border:1px solid black;}
table.t2 th {border:1px solid black;padding:4px;background-color:#e0e0e0}
table.t2 td {border:1px solid black; text-align:center}

table.headTable {width:800px}
table.headTable th {font-size:20px,text-align:center,background-color:#e0e0e0}
table.headTable td {font-size:20px,text-align:center}

div.d1 {text-align:center; width=400px; background-color:#e0e0e0;
        font-size:      20px; margin-bottom:20px}

</style>

<div class="d1">Clinical Report Form Portal</div>

<div id="generalDataHead"></div>
<div id="generalDataDiv" style="display:none">
<table id="generalDataTable" cellspacing="2" cellpadding="5" border="0">
<tr><td>Eudra CT Number: </td><td><strong id="eudraCTNumber">Loading</strong></td></tr>
<tr><td>Study Sponsor: </td><td><strong id="studySponsor">Loading</strong></td></tr>
<tr><td>Study Coordinator: </td><td><strong id="studyCoordinator">Loading</strong></td></tr>
<tr><td>Regulatory authority Entry Number:</td><td><strong id="regulatoryNumber">Loading</strong></td></tr>
</table>
</div>

<div id="pickFormHead"></div>
<div id="pickFormDiv" style="display:none">
	<div id="formDiv"></div>
	<div id="selectFormDiv" style="display:block"></div>
	<div id="listDiv"></div>
</div>

<div id="startDiv"></div>

<div id="debugAreaHead"></div>
<div id="debugAreaDiv" style="display:none">
<textarea cols="95" rows="5" name="formStatus" id="formStatus">Entering data</textarea>
</div>

<script type="text/javascript">

    document.getElementById("formStatus").value+="\nStarting";
    window.onload = init();



// Initialize the form by populating the Reagent drop-down list and
// entering data associated with the current user.
function init() {

    var config=new Object();
    config.document=document;
	config.debugId='formStatus';

	generateHead(config,"debugAreaHead","debugAreaDiv","Debug info");
	generateHead(config,"generalDataHead","generalDataDiv","General data");
	generateHead(config,"pickFormHead","pickFormDiv","Select CRF");
	return;

	//parameters should include
	//divName - place to render select entry table
	//masterQuery - the master query that will collect al the data
	//masterSelectVarName - variable that is going to fill the content of select. 
	//		  Typically, the variable is a lookup in the master query
	//masterUserVarName	- variable that stores the user id in the master query 
	//		only entries matching current user in the master query will be selected
	//authorization - additional data to check:
	//	* if the current user is authorized to perform action and/or 
	// 	* limit number of different queryVariable values user is entitled to use
	//authorization should contain:
	//	* queryName - query of user/queryVariable pairs to check for authorized access
	//	* authUserVarName - name of the variable in authorization.queryName that contain usesId
	//	* authSelectVarName - name of the selectVar in authorization query
	//callback - function that executes when value of the select changes (onchange).
	//		argument to callback are the parameters
	//selectId - id of the DOM element where select is rendered - to check for value in callback
	//dataDiv - div element to render potential output of the callback

	//rework to enable addNew
	let par=new Object();
	par.masterQuery="crfEntry";
	par.dataDiv="listDiv";
	par.masterUserVarName="UserId";
	par.formStatusName="FormStatus";
	par.formStatus=1;
	par.addDiv="selectFormDiv";
	
	par.config=config;

	par.source=new Object();
	par.source.queryName="StudyProperties";
	par.source.schemaName="study";
	par.source.vars=["eudraCTNumber","studyCoordinator","regulatoryNumber","studySponsor"];

	par.vars=new Object();

	//User
	let parUser=new Object();
	parUser.masterSelectVarName="UserId";
	parUser.callback=function(){};
	parUser.selectId="UserSelect";
	parUser.inputType="select";
	
	//only display users in crfEditors list
	parUser.filter=new Object();
	parUser.filter.queryName="crfEditors";
	parUser.filter.filterVarName="User";
	parUser.filter.filters=new Object();
	parUser.filter.filters["User"]=LABKEY.Security.currentUser.id;
	par.vars["User"]=parUser;
	


	//Crf		
	let parCrf=new Object();
	parCrf.masterSelectVarName="entryId";
	parCrf.callback=generateList;
	parCrf.selectId="crfSelect";
	parCrf.addSelect=true;
	parCrf.addNewFlag=-1;
	parCrf.inputType="select";
	par.vars["Crf"]=parCrf;

	//Site
	let parSite=new Object();
	parSite.masterSelectVarName="Site";
	
	parSite.callback=generateListAndPopulateDaughterSelect;
	parSite.selectId="SiteSelect";
	parSite.daughterSelect="Crf";
	parSite.inputType="select";
	
	//apply additional filter to variable - specify
	//- queryName, 
	//- name of variable in queryName 
	// - list of filters with name of the variable associated targeted value

	parSite.filter=new Object();
	parSite.filter.queryName="crfEditors";
	parSite.filter.filterVarName="Site";
	parSite.filter.filters=new Object();
	parSite.filter.filters["User"]=LABKEY.Security.currentUser.id;
	par.vars["Site"]=parSite;

	//Form
	par.vars["Form"]=new Object();
	let parForm=par.vars["Form"];
	parForm.masterSelectVarName="Form";
	parForm.callback=function(){};
	parForm.selectId="FormSelect";
	parForm.selectAll=true;
	parForm.inputType="select";
	parForm.urlName="formUrl";

	//FormStatus;
	par.vars["FormStatus"]=new Object();
	let parFormStatus=par.vars["FormStatus"];
	parFormStatus.masterSelectVarName="FormStatus";
	parFormStatus.callback=generateListAndPopulateDaughterSelect;
	parFormStatus.selectId="FormStatusSelect";
	parFormStatus.daughterSelect="Crf";
	parFormStatus.inputType="select";

	parFormStatus.filter=new Object();
	parFormStatus.filter.queryName="formStatusVisibility";	
	parFormStatus.filter.filterVarName="formStatus";
	parFormStatus.filter.filters=new Object();
	parFormStatus.filter.filters["visibilityLevel"]="crfEditor"; 

		
	par.vars["eudraCTNumber"]=sourceVar("EudraCTNumber","eudraCTNumber","EudraCTNumber");
	par.vars["studyCoordinator"]=sourceVar("StudyCoordinator","studyCoordinator","StudyCoordinator");
	par.vars["studySponsor"]=sourceVar("StudySponsor","studySponsor","StudySponsor");
	par.vars["regulatoryNumber"]=sourceVar("RegulatoryNumber","regulatoryNumber","RegulatoryNumber");

	par.filters=["User","Site","FormStatus"];
	//par.filters=["User","Site"];
	drawForm(par);
	
}
	
	
</script>