Context Navigation

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

Last change on this file since 71 was 71, checked in by fpvanagthoven, 14 years ago

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

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

Download in other formats: