Context Navigation

source: Dev/trunk/classes/QuestionCreationTool.php @ 112

Last change on this file since 112 was 112, checked in by fpvanagthoven, 14 years ago
Code to get questions and put them in objects
File size: 18.0 KB

Rev	Line
[102]	1	<?php
	2
	3	/**
	4	* Tool that displays a list and an edit panel
	5	*
	6	* @author fpvanagthoven
	7	*/
	8	class QuestionCreationTool {
	9
	10	private $list;
	11	private $questionEditPanel;
	12
	13	public function __construct() {
[103]	14	$this->javascript();
[102]	15	$this->displayList();
	16	$this->displayEditPanel();
	17	}
	18
[103]	19	private function javascript() {
	20	?>
	21	<script type="text/javascript">
	22	function handleType(select)
	23	{
	24	var type = select.valueOf().value;
	25	clearSpecifications();
[104]	26
[103]	27	/* set answerCount for options */
	28	document.getElementById("answerSpecifications").answerCount = 1;
[104]	29
[103]	30	switch (type) {
	31	case "text":
	32	break;
	33	case "mc":
	34	addOption();
	35	break;
	36	case "int":
	37	minMax();
	38	break;
	39	case "checkboxes":
	40	addOption();
	41	break;
	42	case "scale":
	43	minMaxIncr();
	44	break;
	45	default:
[104]	46
[103]	47	break;
	48	}
	49
	50	}
[104]	51
[103]	52	function clearSpecifications()
	53	{
	54	var specs = document.getElementById("answerSpecifications");
	55	specs.innerHTML = "";
	56	specs.clicked = null;
	57	specs.lastAnswer = null;
[104]	58
[103]	59	var questionType = document.getElementById("questionType");
	60	var buttons = document.getElementById("questionButtons");
	61	if(buttons != null)
	62	questionType.removeChild(buttons);
	63	}
[104]	64
[103]	65	function addOption()
	66	{
	67	var specs = document.getElementById("answerSpecifications");
[104]	68
[103]	69	addAddRemoveOptionButtonsOnce(specs);
	70	addAnswerInput(specs);
[104]	71
[103]	72	}
[104]	73
[103]	74	function removeOption()
	75	{
	76	var specs = document.getElementById("answerSpecifications");
[104]	77
[103]	78	if(specs.lastAnswer.prev != null)
	79	{
	80	specs.removeChild(specs.lastAnswer);
	81	specs.lastAnswer = specs.lastAnswer.prev;
	82	specs.answerCount--;
	83	}
	84	}
[104]	85
[103]	86	function addAnswerInput(specs)
	87	{
	88	var answerCount = specs.answerCount;
[104]	89
[103]	90	/* set value for option textbox */
	91	var optionStr = "Option " + answerCount;
[104]	92
[103]	93	/* the input textbox */
	94	var answerInput = document.createElement("input");
	95	answerInput.setAttribute("type", "text");
	96	answerInput.setAttribute("name", "ans" + answerCount);
	97	answerInput.setAttribute("value", optionStr);
	98	answerInput.className = "answerInput";
[104]	99
[103]	100	specs.appendChild(answerInput);
[104]	101
[103]	102	/* Singly linked list */
	103	answerInput.prev = specs.lastAnswer; // remember last one
	104	specs.lastAnswer = answerInput; // new lastAnswer
[104]	105
[103]	106	specs.answerCount++;
	107	}
[104]	108
[103]	109	function addAddRemoveOptionButtonsOnce(specs)
	110	{
	111	if (specs.clicked == null)
	112	{
	113	var buttonsDiv = document.createElement("div");
	114	buttonsDiv.id = "questionButtons";
	115	buttonsDiv.style.display = "inline";
	116	var typeBox = document.getElementById("questionType");
	117	typeBox.appendChild(buttonsDiv);
[104]	118
[103]	119	addAddOptionButton(buttonsDiv);
	120	addRemoveOptionButton(buttonsDiv);
[104]	121
[103]	122	specs.clicked = true;
	123	}
	124	}
[104]	125
[103]	126	function addAddOptionButton(buttonsDiv)
	127	{
	128	var addOpt = document.createElement("input");
	129	addOpt.setAttribute("type", "button");
	130	addOpt.setAttribute("id", "addOpt");
	131	addOpt.setAttribute("class", "surveyButton");
	132	addOpt.setAttribute("onclick", "addOption()");
	133	addOpt.setAttribute("value", "Add Option");
	134	buttonsDiv.appendChild(addOpt);
	135	}
[104]	136
[103]	137	function addRemoveOptionButton(buttonsDiv)
	138	{
	139	var removeOpt = document.createElement("input");
	140	removeOpt.setAttribute("type", "button");
	141	removeOpt.className = "surveyButton";
	142	removeOpt.setAttribute("onclick", "removeOption()");
	143	removeOpt.setAttribute("value", "x");
	144	buttonsDiv.appendChild(removeOpt);
	145	}
[104]	146
[103]	147	function minMax(min, max)
	148	{
	149	if (min == null)
	150	var min = '';
	151	if (max == null)
	152	var max = '';
[104]	153
[103]	154	var specs = document.getElementById("answerSpecifications");
[104]	155
[103]	156	var answerDiv = document.createElement("div");
[104]	157
[103]	158	answerDiv.className = "answerDiv";
	159	answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + min + "' name='ans1' />" +
	160	"<label for='max'>Max</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + max + "' name='ans2' />";
[104]	161
[103]	162	specs.appendChild(answerDiv);
	163	}
[104]	164
[103]	165	function checkInt(input)
	166	{
	167	input.style.borderWidth = '1px' ;
	168	var value = input.value;
	169	if (isNaN(value))
	170	{
	171	input.style.borderColor = 'red';
	172	input.checkPassed = 'no';
	173	}
	174	else
	175	{
	176	input.style.border = '1px solid #888;';
	177	input.checkPassed = null;
	178	}
	179	}
[104]	180
[103]	181	function minMaxIncr(left, right, incr)
	182	{
	183	if (left == null)
	184	var left = '';
	185	else
	186	left.replace("'", "'");
	187	if (right == null)
	188	var right = '';
	189	else
	190	right.replace("'", "'");
	191	if (incr == null)
	192	var incr = '';
[104]	193
[103]	194	var specs = document.getElementById("answerSpecifications");
[104]	195
[103]	196	var answerDiv = document.createElement("div");
	197	answerDiv.className = "answerDiv";
[104]	198
[103]	199	var leftLabel = document.createElement("label");
	200	var rightLabel = document.createElement("label");
	201	var scaleLabel = document.createElement("label");
	202	leftLabel.innerHTML = "Left label";
	203	rightLabel.innerHTML = "Right label";
	204	scaleLabel.innerHTML = "Scale count";
[104]	205
[103]	206	var leftInput = document.createElement("input");
	207	leftInput.type = "text";
	208	leftInput.value = left;
	209	leftInput.name= "ans1";
	210	leftInput.setAttribute("onchange", "handleAnswerChange()");
[104]	211
[103]	212	var rightInput = document.createElement("input");
	213	rightInput.type = "text";
	214	rightInput.value = right;
	215	rightInput.name = "ans2";
	216	rightInput.setAttribute("onchange", "handleAnswerChange()");
[104]	217
[103]	218	var scaleInput = document.createElement("input");
	219	scaleInput.type = "text";
	220	scaleInput.className = "intBox";
	221	scaleInput.value = incr;
	222	scaleInput.setAttribute("onblur", "checkInt(this)");
	223	scaleInput.setAttribute("onchange", "");
	224	scaleInput.name = "ans3";
[104]	225
[103]	226	answerDiv.appendChild(leftLabel);
	227	answerDiv.appendChild(leftInput);
	228	answerDiv.appendChild(rightLabel);
	229	answerDiv.appendChild(rightInput);
	230	answerDiv.appendChild(scaleLabel);
	231	answerDiv.appendChild(scaleInput);
[104]	232
[103]	233	specs.appendChild(answerDiv);
[108]	234	}
	235
	236	function newCategory()
	237	{
	238	var categoryBox = document.getElementById("categoryBox");
	239	categoryBox.innerHTML = "";
	240
	241	var categoryInput = document.createElement("input");
	242	categoryInput.name = "questionCategory";
	243
	244	categoryBox.appendChild(categoryInput);
	245	}
[112]	246
	247	function clearFields()
	248	{
	249	clearCategory();
	250	clearCode();
	251	clearTitle();
	252	clearDescription();
	253	clearType();
	254	}
	255
	256	function clearCategory()
	257	{
	258	var categoryBox = document.getElementById("categoryBox");
	259	categoryBox.innerHTML = "";
	260
	261	var questionCategorySelect = document.createElement("select");
	262	questionCategorySelect.setAttribute("name", "questionCategory");
	263	questionCategorySelect.id = "questionCategorySelect";
	264
	265	var newCategoryButton = document.createElement("input");
	266	newCategoryButton.setAttribute("type", "button");
	267	newCategoryButton.setAttribute("onclick", "newCategory()");
	268	newCategoryButton.setAttribute("value", "New Category");
	269	newCategoryButton.className = "surveyButton";
	270
	271	categoryBox.appendChild(questionCategorySelect);
	272	categoryBox.appendChild(newCategoryButton);
	273	}
	274
	275	function clearCode()
	276	{
	277	var codeInput = document.getElementById("questionCode");
	278	codeInput.value = "";
	279	}
	280
	281	function clearTitle()
	282	{
	283	var titleInput = document.getElementById("questionTitle");
	284	titleInput.value ="";
	285	}
	286
	287	function clearDescription()
	288	{
	289	var descriptionInput = document.getElementById("questionDescription");
	290	descriptionInput.value = "";
	291	}
	292
	293	function clearType()
	294	{
	295	var typeSelect = document.getElementById("questionTypeSelect");
	296	typeSelect.selectedIndex = 0;
	297	}
	298
[103]	299	</script>
	300	<?php
	301	}
	302
[102]	303	private function displayList() {
	304	?>
	305	<div id="questionListWrapper">
[103]	306	<select id="questionsList" size="9999">
[102]	307	</select>
	308	</div>
	309	<?php
	310	}
	311
	312	private function displayEditPanel() {
	313	?>
[104]	314	<div id="questionCreation" class="floatLeft">
	315	<?php $this->displayForm(); ?>
[102]	316	</div>
	317	<?php
	318	}
	319
[104]	320	private function displayForm() {
	321	?>
	322	<form id="questionEditForm" method="post" action="" onsubmit="">
	323	<table class="questionTable">
	324	<tr>
[108]	325	<td><label for="questionCategory">Category</label></td>
	326	<td id="categoryBox"><!-- Select should be filled with existing categories-->
[112]	327	<select id="questionCategorySelect" name="questionCategory">
[108]	328	<option value='Test Category'>Test Category</option>
	329	</select>
	330	<!-- New category button -->
	331	<input type="button" class="surveyButton" onclick="newCategory()" value="New Category" />
	332	</td>
	333	</tr>
	334	<tr>
[104]	335	<td><label for="questionCode">Code</label></td>
	336	<td><input id="questionCode" name="questionCode" size="5" /></td>
	337	</tr>
	338	<tr>
	339	<td><label for="questionTitle">Title</label></td>
[108]	340	<td><input id="questionTitle" name="questionTitle" size="60" /></td>
[104]	341	</tr>
	342	<tr>
	343	<td><label for="questionDescription">Description</label></td>
	344	<td><input id="questionDescription" name="questionDescription" size="60" /></td>
	345	</tr>
	346	<tr>
	347	<td><label for="questionType">Type answer</label></td>
	348	<td id="questionType">
[112]	349	<select id="questionTypeSelect" name="questionType" onchange="handleType(this)">
[104]	350	<option value='text' selected='selected'>Text</option>
	351	<option value='int'>Integer</option>
	352	<option value='mc'>Multiple choice</option>
	353	<option value='checkboxes'>Checkboxes</option>
	354	<option value='scale'>Scale</option>
	355	</select>
	356	</td>
	357	</tr>
	358	</table>
	359	<div id="answerSpecifications"></div>
[112]	360	<input id="clearQuestionFields" type="button" onclick="clearFields()" class="surveyButton" value="Clear" />
[104]	361	<input id="saveQuestion" type="submit" class="surveyButton" value="Save" />
	362	</form>
	363	<?php
	364	}
	365
[102]	366	}
	367	?>

Note: See TracBrowser for help on using the repository browser.

Download in other formats: