Context Navigation

source: Dev/trunk/classes/SurveyCreationTool.php @ 64

Last change on this file since 64 was 64, checked in by fpvanagthoven, 14 years ago
Start at SessionCreationTool?.
File size: 28.3 KB

Line
1	<?php
2
3	/**
4	* Description of SurveyTool
5	*
6	* SurveyTool is where the survey can be created.
7	*
8	*/
9	class SurveyCreationTool {
10
11	private $survey;
12	private $timeStamp;
13
14	public function __construct($survey = null, $timeStamp = null) {
15	$this->survey = $survey;
16	$this->timeStamp = $timeStamp;
17
18	if (isset($this->survey->id))
19	SurveyCreationTool::javascript($this->survey->id);
20	else
21	SurveyCreationTool::javascript();
22	?>
23
24	<div id="surveyCreation" class="creation"><form id="survey" action="surveycreation.php" method="post">
25	<?php
26	$this->surveyHead();
27	$this->questionCreationForm();
28	SurveyCreationTool::addQuestionButton();
29	SurveyCreationTool::removeLastQuestionButton();
30	?></form></div>
31	<?php
32	}
33
34	private static function javascript($id = null) {
35	?>
36	<script type="text/javascript" src="js/creation.js"></script>
37	<script type="text/javascript">
38	/* autosave every 3 minutes */
39	setTimeout("save('<?php echo $id; ?>')", 180000);
40
41	var questionCount = 1;
42
43	function getNewQuestion(title, description)
44	{
45	if (title == null)
46	var title = 'Untitled Question';
47
48	if (description != null)
49	var description = description;
50	else
51	var description = 'Write a question description here.';
52
53	var questionDiv = document.createElement("div");
54	var htmlStr =
55	"<div id='question" + questionCount + "' class='question'>" +
56	"<table class='questionTable'>" +
57	"<th>Question " + questionCount + "</th>" +
58	"<tr><td><label for='questionTitle'>Title</label></td>" +
59	"<td><input type='text' class='questionTitle' name='questionTitle" + questionCount + "' onfocus='handleFocus(this)' size='30' value='" + title + "' /></td></tr>" +
60	"<tr><td><label for='questionDescription'>Description</label></td>" +
61	"<td><input type='text' class='questionDescription' name='questionDescription" + questionCount + "' onfocus='handleFocus(this)' size='60' value='" + description + "' /></td>" +
62	"<tr><td><label for='questionType'>Answer type</label></td>" +
63	"<td><select id='" + questionCount + "' name='questionType" + questionCount + "' onchange='handleType(this)'><br />"+
64	"<option value='text' selected='selected'>Text</option>" +
65	"<option value='int'>Integer</option>" +
66	"<option value='mc'>Multiple choice</option>" +
67	"<option value='checkboxes'>Checkboxes</option>" +
68	"<option value='scale'>Scale</option>" +
69	"</select></td></tr>" +
70	"</table>" +
71	"<div id='answersDiv" + questionCount + "' class='answersDiv'></div>" +
72	"</div>";
73
74	questionDiv.innerHTML = htmlStr;
75
76	return questionDiv;
77	}
78
79	function handleType(select, answers)
80	{
81	var numQ = select.id; // questionNumber
82	var type = select.valueOf().value;
83	var answersDiv = document.getElementById("answersDiv" + numQ );
84
85	removeQuestionID(numQ);
86
87	answersDiv.answerCount = 1;
88	answersDiv.clicked = null;
89
90	switch (type) {
91	case 'mc':
92	answersDiv.innerHTML = "";
93	if (answers != null)
94	{
95	for (var i = 1; i < answers.length; i++)
96	{
97	addOption(numQ, answers[i]);
98	}
99	}
100	else
101	addOption(numQ);
102
103	break;
104	case 'text':
105	answersDiv.innerHTML = "";
106	break;
107	case 'int':
108	answersDiv.innerHTML = "";
109
110	//min max
111	if (answers != null)
112	minMax(numQ, answers[1], answers[2]);
113	else
114	minMax(numQ);
115	break;
116	case 'checkboxes':
117	answersDiv.innerHTML = "";
118	if (answers != null)
119	{
120	for (var i = 1; i < answers.length; i++)
121	{
122	addOption(numQ, answers[i]);
123	}
124	}
125	else
126	addOption(numQ);
127	break;
128	case 'scale':
129	answersDiv.innerHTML = "";
130	//what scale (min max incr)
131	if (answers != null)
132	minMaxIncr(numQ, answers[1], answers[2], answers[3]);
133	else
134	minMaxIncr(numQ);
135	break;
136	default:
137	break;
138	}
139
140	}
141
142	function handleAnswerChange(questionNumber)
143	{
144	removeQuestionID(questionNumber);
145	}
146
147	function removeQuestionID(questionNumber)
148	{
149	/* When type changes, remove question ID, because question changes */
150	var questionIDInput = document.getElementById("questionID" + questionNumber);
151	if (questionIDInput != null)
152	{
153	var questionsDiv = document.getElementById("questionsDiv");
154	questionsDiv.removeChild(questionIDInput);
155	}
156
157	}
158
159
160	function addOption(questionNumber, optionStr)
161	{
162	var answersDiv = document.getElementById("answersDiv" + questionNumber);
163	var answerCount = answersDiv.answerCount;
164	var answerDiv = document.createElement("div");
165
166	if (optionStr == null)
167	var optionStr = "Option " + answerCount;
168
169
170	answerDiv.className = "answerDiv";
171
172	var htmlStr = "<input type='text' name='q" +
173	questionNumber + "ans" + answerCount + "' onchange='handleAnswerChange(" + questionNumber + ")' value='" + optionStr + "' />";
174
175	if (answersDiv.clicked == null)
176	{
177	htmlStr += "<input type='button' id='addOpt'"
178	+ " class='surveyButton' onclick='addOption(" + questionNumber + ")' value='Add Option' />" +
179	"<input type='button' class='surveyButton' onclick='removeOption(" + questionNumber + ")' value='x' />";
180
181	answersDiv.clicked = true;
182	}
183
184	answerDiv.innerHTML = htmlStr;
185
186	answerDiv.prev = answersDiv.lastAnswer; //singly linked list
187	answersDiv.lastAnswer = answerDiv;
188
189	answersDiv.appendChild(answerDiv);
190	answersDiv.answerCount++;
191
192	handleAnswerChange(questionNumber);
193	}
194
195	function removeOption(questionNumber)
196	{
197	var answersDiv = document.getElementById("answersDiv" + questionNumber);
198
199	if (answersDiv.lastAnswer.prev != null)
200	{
201	answersDiv.removeChild(answersDiv.lastAnswer);
202	answersDiv.lastAnswer = answersDiv.lastAnswer.prev;
203	answersDiv.answerCount--;
204	}
205
206	handleAnswerChange(questionNumber);
207	}
208
209	function minMax(questionNumber, min, max)
210	{
211	if (min == null)
212	var min = '';
213	if (max == null)
214	var max = '';
215
216	var answersDiv = document.getElementById("answersDiv" + questionNumber);
217
218	var answerDiv = document.createElement("div");
219
220	answerDiv.className = "answerDiv";
221	answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + min + "' name='q" + questionNumber + "ans1' />" +
222	"<label for='max'>Max</label><input type='text' class='intBox' onchange='checkInt(this)' value='" + max + "' name='q" + questionNumber + "ans2' />";
223
224	answersDiv.appendChild(answerDiv);
225	}
226
227	function minMaxIncr(questionNumber, left, right, incr)
228	{
229	if (left == null)
230	var left = '';
231	if (right == null)
232	var right = '';
233	if (incr == null)
234	var incr = '';
235
236	var answersDiv = document.getElementById("answersDiv" + questionNumber);
237
238	var answerDiv = document.createElement("div");
239	answerDiv.className = "answerDiv";
240	answerDiv.innerHTML = "<label>Left label</label><input type='text' value='" + left + "' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans1' />" +
241	"<label>Right label</label><input type='text' value='" + right + "' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans2' />" +
242	"<label>Scale count</label><input type='text' class='intBox' value='" + incr + "' onblur='checkInt(this)' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans3' />" +
243	"<div id='inputCheckFeedback'" + questionNumber + "";
244
245	answersDiv.appendChild(answerDiv);
246	}
247
248
249	function addQuestion(title, description)
250	{
251	var questionsDiv = document.getElementById('questionsDiv');
252	var newQuestion = getNewQuestion(title, description);
253
254
255	newQuestion.prev = document.lastQuestion;
256	document.lastQuestion = newQuestion;
257
258	questionsDiv.appendChild(newQuestion);
259	questionCount++;
260	}
261
262	function removeLastQuestion()
263	{
264	var questionsDiv = document.getElementById('questionsDiv');
265
266	if (document.lastQuestion.prev != null)
267	{
268	questionsDiv.removeChild(document.lastQuestion);
269	document.lastQuestion = document.lastQuestion.prev;
270	questionCount--;
271	}
272	else
273	{
274	// do nothing
275	}
276	}
277
278	function save(surveyID)
279	{
280	if (checksPassed())
281	{
282	var form = document.getElementById('survey');
283	var questionsDiv = document.getElementById('questionsDiv');
284	form.action = "surveycreation.php";
285
286	/* extra time stamp */
287	var date = new Date();
288	var minutes = date.getUTCMinutes();
289	if (minutes < 10)
290	minutes = "0" + minutes;
291	var timeStamp = date.getHours() + ":" + minutes;
292	var timeStampInput = document.createElement("input");
293	timeStampInput.name = "timeStamp";
294	timeStampInput.value = timeStamp;
295	timeStampInput.type = "hidden";
296
297	var surveyIDInput = document.createElement("input");
298	surveyIDInput.name = "surveyID";
299	surveyIDInput.value = surveyID;
300	surveyIDInput.type = "hidden";
301
302	questionsDiv.appendChild(timeStampInput);
303	questionsDiv.appendChild(surveyIDInput);
304	form.submit();
305	}
306	}
307
308	function selectAll(input)
309	{
310	input.select();
311	}
312
313	/* --- input checking --- */
314	function checksPassed()
315	{
316	var form = document.getElementById('survey');
317
318	for (var i = 0; i < form.length; i++)
319	{
320	if (form.elements[i].checkPassed == 'no')
321	return false;
322	}
323	return true;
324	}
325
326	function checkInt(input)
327	{
328	input.style.borderWidth = '1px' ;
329	var value = input.value;
330	if (isNaN(value))
331	{
332	input.style.borderColor = 'red';
333	input.checkPassed = 'no';
334	}
335	else
336	{
337	input.style.border = '1px solid #888;';
338	input.checkPassed = null;
339	}
340	}
341
342	</script>
343	<?php
344	}
345
346	private function surveyHead() {
347	?><div id="surveyHead">
348	<?php
349	$this->titleBox();
350	$this->saveSurvey();
351	$this->descriptionBox();
352	$this->surveyLink();
353	?></div>
354	<?php
355	}
356
357	private function titleBox() {
358	if (isset($this->survey->title))
359	$value = $this->survey->title;
360	else
361	$value = 'Untitled Survey';
362	?>
363	<input type="text" id="surveyTitle" class="titleBox" name="surveyTitle" value="<?php echo $value; ?>" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
364	<?php
365	}
366
367	private function saveSurvey() {
368	if (isset($this->timeStamp))
369	echo "<div id='timeStamp'>Last saved " . $this->timeStamp . '</div>';
370	if (isset($this->survey->id))
371	$id = $this->survey->id;
372	else
373	$id = null;
374	?>
375	<input id="surveySaveButton" type="button" onclick="save('<?php echo $id; ?>')" class='surveyButton' value='Save' />
376	<?php
377	}
378
379	private function descriptionBox() {
380	if (isset($this->survey->description))
381	$value = $this->survey->description;
382	else
383	$value = 'Write a helpful description for this survey here.';
384	?>
385	<textarea id="surveyDescription" class="descriptionBox" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)"><?php echo $value; ?></textarea>
386	<?php
387	}
388
389	private function surveyLink() {
390	if (isset($this->survey)) {
391	$surveyID = $this->survey->id;
392
393	$link = $_SERVER['HTTP_HOST'] . dirname($_SERVER['PHP_SELF']) .
394	'/survey.php?id=' . $surveyID;
395	?>
396	<input type="text" value="<?php echo $link; ?>" id="surveyLink" onclick="selectAll(this)">
397	<?php
398	}
399	}
400
401	private function questionCreationForm() {
402	?>
403	<div id='questionsDiv'>
404	</div>
405	<?php
406	if (isset($this->survey)) {
407	foreach ($this->survey->questions as $numQ => $question) {
408	?>
409	<script type="text/javascript">
410	var answers = new Array();
411	<?php
412	/* Put all answers in js array */
413	foreach ($question->answers as $numA => $answer) {
414	echo "answers[" . $numA . "] = '" . $answer . "'; ";
415	}
416	?>
417
418	addQuestion('<?php echo $question->title; ?>', '<?php echo $question->description; ?>');
419
420	var select = document.getElementById('<?php echo $numQ; ?>');
421	var type = '<?php echo $question->type; ?>';
422
423	for (var i = 0; i < select.options.length; i++) {
424	if (select.options[i].value == type)
425	{
426	select.options[i].selected = true;
427	handleType(select, answers)
428	break;
429	}
430	}
431
432
433	/* questionID stuff */
434	var questionIDInput = document.createElement("input");
435	questionIDInput.id = "questionID<?php echo $numQ; ?>";
436	questionIDInput.name = "questionID<?php echo $numQ; ?>";
437	questionIDInput.value = "<?php echo $question->id; ?>";
438	questionIDInput.type = "hidden";
439
440	document.getElementById("questionsDiv").appendChild(questionIDInput);
441
442	</script>
443	<?php
444	}
445	} else {
446	?>
447	<script type="text/javascript"> addQuestion();</script>
448	<?php
449	}
450	}
451
452	private static function addQuestionButton() {
453	?>
454	<input id="addQuestionButton" type="button" onclick="addQuestion()" value="Add New Question" class="surveyButton" />
455	<?php
456	}
457
458	private static function removeLastQuestionButton() {
459	?>
460	<input type="button" onclick="removeLastQuestion()" value="x" class="surveyButton" />
461	<?php
462	}
463
464	}
465	?>

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

Download in other formats: