Context Navigation

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

Last change on this file since 114 was 114, checked in by fpvanagthoven, 14 years ago
questions get loaded in fully
File size: 18.5 KB

Line
1	<?php
2
3	/**
4	* Tool that displays a list and an edit panel
5	*
6	* @author fpvanagthoven
7	*/
8	class QuestionCreationTool {
9	private $questions;
10	private $questionEditPanel;
11
12	public function __construct($questions) {
13	$this->questions = $questions;
14	$this->javascript();
15	$this->displayList();
16	$this->displayEditPanel();
17	}
18
19	private function javascript() {
20	?>
21	<script type="text/javascript">
22	function handleType(select)
23	{
24	var type = select.valueOf().value;
25	clearSpecifications();
26
27	/* set answerCount for options */
28	document.getElementById("answerSpecifications").answerCount = 1;
29
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:
46
47	break;
48	}
49
50	}
51
52	function clearSpecifications()
53	{
54	var specs = document.getElementById("answerSpecifications");
55	specs.innerHTML = "";
56	specs.clicked = null;
57	specs.lastAnswer = null;
58
59	var questionType = document.getElementById("questionType");
60	var buttons = document.getElementById("questionButtons");
61	if(buttons != null)
62	questionType.removeChild(buttons);
63	}
64
65	function addOption()
66	{
67	var specs = document.getElementById("answerSpecifications");
68
69	addAddRemoveOptionButtonsOnce(specs);
70	addAnswerInput(specs);
71
72	}
73
74	function removeOption()
75	{
76	var specs = document.getElementById("answerSpecifications");
77
78	if(specs.lastAnswer.prev != null)
79	{
80	specs.removeChild(specs.lastAnswer);
81	specs.lastAnswer = specs.lastAnswer.prev;
82	specs.answerCount--;
83	}
84	}
85
86	function addAnswerInput(specs)
87	{
88	var answerCount = specs.answerCount;
89
90	/* set value for option textbox */
91	var optionStr = "Option " + answerCount;
92
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";
99
100	specs.appendChild(answerInput);
101
102	/* Singly linked list */
103	answerInput.prev = specs.lastAnswer; // remember last one
104	specs.lastAnswer = answerInput; // new lastAnswer
105
106	specs.answerCount++;
107	}
108
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);
118
119	addAddOptionButton(buttonsDiv);
120	addRemoveOptionButton(buttonsDiv);
121
122	specs.clicked = true;
123	}
124	}
125
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	}
136
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	}
146
147	function minMax(min, max)
148	{
149	if (min == null)
150	var min = '';
151	if (max == null)
152	var max = '';
153
154	var specs = document.getElementById("answerSpecifications");
155
156	var answerDiv = document.createElement("div");
157
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' />";
161
162	specs.appendChild(answerDiv);
163	}
164
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	}
180
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 = '';
193
194	var specs = document.getElementById("answerSpecifications");
195
196	var answerDiv = document.createElement("div");
197	answerDiv.className = "answerDiv";
198
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";
205
206	var leftInput = document.createElement("input");
207	leftInput.type = "text";
208	leftInput.value = left;
209	leftInput.name= "ans1";
210	leftInput.setAttribute("onchange", "handleAnswerChange()");
211
212	var rightInput = document.createElement("input");
213	rightInput.type = "text";
214	rightInput.value = right;
215	rightInput.name = "ans2";
216	rightInput.setAttribute("onchange", "handleAnswerChange()");
217
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";
225
226	answerDiv.appendChild(leftLabel);
227	answerDiv.appendChild(leftInput);
228	answerDiv.appendChild(rightLabel);
229	answerDiv.appendChild(rightInput);
230	answerDiv.appendChild(scaleLabel);
231	answerDiv.appendChild(scaleInput);
232
233	specs.appendChild(answerDiv);
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	}
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	clearSpecifications();
298	}
299
300	</script>
301	<?php
302	}
303
304	private function displayList() {
305	?>
306	<div id="questionListWrapper">
307	<select id="questionsList" size="9999">
308	<?php $this->populateList(); ?>
309	</select>
310	</div>
311	<?php
312	}
313
314	private function displayEditPanel() {
315	?>
316	<div id="questionCreation" class="floatLeft">
317	<?php $this->displayForm(); ?>
318	</div>
319	<?php
320	}
321
322	private function displayForm() {
323	?>
324	<form id="questionEditForm" method="post" action="" onsubmit="">
325	<table class="questionTable">
326	<tr>
327	<td><label for="questionCategory">Category</label></td>
328	<td id="categoryBox"><!-- Select should be filled with existing categories-->
329	<select id="questionCategorySelect" name="questionCategory">
330	<option value='Uncategorized' selected='selected'>Uncategorized</option>
331	</select>
332	<!-- New category button -->
333	<input type="button" class="surveyButton" onclick="newCategory()" value="New Category" />
334	</td>
335	</tr>
336	<tr>
337	<td><label for="questionCode">Code</label></td>
338	<td><input id="questionCode" name="questionCode" size="5" /></td>
339	</tr>
340	<tr>
341	<td><label for="questionTitle">Title</label></td>
342	<td><input id="questionTitle" name="questionTitle" size="60" /></td>
343	</tr>
344	<tr>
345	<td><label for="questionDescription">Description</label></td>
346	<td><input id="questionDescription" name="questionDescription" size="60" /></td>
347	</tr>
348	<tr>
349	<td><label for="questionType">Type answer</label></td>
350	<td id="questionType">
351	<select id="questionTypeSelect" name="questionType" onchange="handleType(this)">
352	<option value='text' selected='selected'>Text</option>
353	<option value='int'>Integer</option>
354	<option value='mc'>Multiple choice</option>
355	<option value='checkboxes'>Checkboxes</option>
356	<option value='scale'>Scale</option>
357	</select>
358	</td>
359	</tr>
360	</table>
361	<div id="answerSpecifications"></div>
362	<input id="clearQuestionFields" type="button" onclick="clearFields()" class="surveyButton" value="Clear" />
363	<input id="saveQuestion" type="submit" class="surveyButton" value="Save" />
364	</form>
365	<?php
366	}
367
368	private function populateList()
369	{
370	foreach ($this->questions as $question)
371	{
372	?>
373	<option value="<?php echo $question->code; ?>">
374	<?php echo $question->code . " - " . $question->title; ?>
375	</option>
376	<?php
377	}
378	}
379
380	}
381	?>

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

Download in other formats: