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

Rev	Line
[10]	1	<?php
	2
	3	/**
	4	* Description of SurveyTool
	5	*
	6	* SurveyTool is where the survey can be created.
	7	*
	8	*/
	9	class SurveyCreationTool {
	10
[29]	11	private $survey;
	12	private $timeStamp;
	13
[24]	14	public function __construct($survey = null, $timeStamp = null) {
[29]	15	$this->survey = $survey;
	16	$this->timeStamp = $timeStamp;
	17
[32]	18	if (isset($this->survey->id))
[30]	19	SurveyCreationTool::javascript($this->survey->id);
	20	else
	21	SurveyCreationTool::javascript();
[11]	22	?>
[17]	23
[61]	24	<div id="surveyCreation" class="creation"><form id="survey" action="surveycreation.php" method="post">
[11]	25	<?php
[29]	26	$this->surveyHead();
	27	$this->questionCreationForm();
[17]	28	SurveyCreationTool::addQuestionButton();
[19]	29	SurveyCreationTool::removeLastQuestionButton();
[11]	30	?></form></div>
	31	<?php
[10]	32	}
	33
[30]	34	private static function javascript($id = null) {
[11]	35	?>
[64]	36	<script type="text/javascript" src="js/creation.js"></script>
[11]	37	<script type="text/javascript">
[24]	38	/* autosave every 3 minutes */
[30]	39	setTimeout("save('<?php echo $id; ?>')", 180000);
[53]	40
[30]	41	var questionCount = 1;
[53]	42
[30]	43	function getNewQuestion(title, description)
[17]	44	{
[33]	45	if (title == null)
[30]	46	var title = 'Untitled Question';
[53]	47
[30]	48	if (description != null)
	49	var description = description;
	50	else
	51	var description = 'Write a question description here.';
[53]	52
[30]	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>";
[53]	73
[30]	74	questionDiv.innerHTML = htmlStr;
[53]	75
[30]	76	return questionDiv;
[17]	77	}
[53]	78
[32]	79	function handleType(select, answers)
[30]	80	{
[32]	81	var numQ = select.id; // questionNumber
[30]	82	var type = select.valueOf().value;
[32]	83	var answersDiv = document.getElementById("answersDiv" + numQ );
[53]	84
[37]	85	removeQuestionID(numQ);
[53]	86
[30]	87	answersDiv.answerCount = 1;
	88	answersDiv.clicked = null;
[53]	89
[30]	90	switch (type) {
	91	case 'mc':
	92	answersDiv.innerHTML = "";
[32]	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);
[53]	102
[30]	103	break;
	104	case 'text':
	105	answersDiv.innerHTML = "";
	106	break;
	107	case 'int':
	108	answersDiv.innerHTML = "";
[53]	109
[30]	110	//min max
[32]	111	if (answers != null)
	112	minMax(numQ, answers[1], answers[2]);
	113	else
	114	minMax(numQ);
[30]	115	break;
	116	case 'checkboxes':
[32]	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);
[30]	127	break;
	128	case 'scale':
	129	answersDiv.innerHTML = "";
	130	//what scale (min max incr)
[32]	131	if (answers != null)
	132	minMaxIncr(numQ, answers[1], answers[2], answers[3]);
	133	else
	134	minMaxIncr(numQ);
[30]	135	break;
	136	default:
	137	break;
[11]	138	}
[30]	139
	140	}
[53]	141
[37]	142	function handleAnswerChange(questionNumber)
	143	{
	144	removeQuestionID(questionNumber);
	145	}
[53]	146
[37]	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	}
[53]	158
	159
[32]	160	function addOption(questionNumber, optionStr)
[30]	161	{
	162	var answersDiv = document.getElementById("answersDiv" + questionNumber);
	163	var answerCount = answersDiv.answerCount;
	164	var answerDiv = document.createElement("div");
[53]	165
[32]	166	if (optionStr == null)
	167	var optionStr = "Option " + answerCount;
[53]	168
	169
[30]	170	answerDiv.className = "answerDiv";
[53]	171
[30]	172	var htmlStr = "<input type='text' name='q" +
[37]	173	questionNumber + "ans" + answerCount + "' onchange='handleAnswerChange(" + questionNumber + ")' value='" + optionStr + "' />";
[53]	174
[30]	175	if (answersDiv.clicked == null)
[11]	176	{
[30]	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' />";
[53]	180
[30]	181	answersDiv.clicked = true;
[25]	182	}
[53]	183
[30]	184	answerDiv.innerHTML = htmlStr;
[53]	185
[30]	186	answerDiv.prev = answersDiv.lastAnswer; //singly linked list
	187	answersDiv.lastAnswer = answerDiv;
[53]	188
[30]	189	answersDiv.appendChild(answerDiv);
[49]	190	answersDiv.answerCount++;
[53]	191
[37]	192	handleAnswerChange(questionNumber);
[17]	193	}
[53]	194
[30]	195	function removeOption(questionNumber)
[17]	196	{
[30]	197	var answersDiv = document.getElementById("answersDiv" + questionNumber);
[53]	198
[30]	199	if (answersDiv.lastAnswer.prev != null)
	200	{
	201	answersDiv.removeChild(answersDiv.lastAnswer);
	202	answersDiv.lastAnswer = answersDiv.lastAnswer.prev;
	203	answersDiv.answerCount--;
	204	}
[53]	205
[37]	206	handleAnswerChange(questionNumber);
[11]	207	}
[53]	208
[32]	209	function minMax(questionNumber, min, max)
[20]	210	{
[32]	211	if (min == null)
	212	var min = '';
	213	if (max == null)
	214	var max = '';
[53]	215
[30]	216	var answersDiv = document.getElementById("answersDiv" + questionNumber);
[53]	217
[30]	218	var answerDiv = document.createElement("div");
[53]	219
[30]	220	answerDiv.className = "answerDiv";
[53]	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
[30]	224	answersDiv.appendChild(answerDiv);
	225	}
[53]	226
[32]	227	function minMaxIncr(questionNumber, left, right, incr)
[30]	228	{
[32]	229	if (left == null)
	230	var left = '';
	231	if (right == null)
	232	var right = '';
	233	if (incr == null)
	234	var incr = '';
[53]	235
[30]	236	var answersDiv = document.getElementById("answersDiv" + questionNumber);
[53]	237
[30]	238	var answerDiv = document.createElement("div");
	239	answerDiv.className = "answerDiv";
[37]	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' />" +
[53]	242	"<label>Scale count</label><input type='text' class='intBox' value='" + incr + "' onblur='checkInt(this)' onchange='handleAnswerChange(" + questionNumber + ")' name='q" + questionNumber + "ans3' />" +
[30]	243	"<div id='inputCheckFeedback'" + questionNumber + "";
[53]	244
[30]	245	answersDiv.appendChild(answerDiv);
	246	}
[53]	247
	248
[30]	249	function addQuestion(title, description)
	250	{
	251	var questionsDiv = document.getElementById('questionsDiv');
	252	var newQuestion = getNewQuestion(title, description);
[53]	253
[19]	254
[30]	255	newQuestion.prev = document.lastQuestion;
	256	document.lastQuestion = newQuestion;
[19]	257
[30]	258	questionsDiv.appendChild(newQuestion);
	259	questionCount++;
	260	}
[53]	261
[30]	262	function removeLastQuestion()
[19]	263	{
[30]	264	var questionsDiv = document.getElementById('questionsDiv');
[53]	265
[30]	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	}
[19]	276	}
[53]	277
[30]	278	function save(surveyID)
[24]	279	{
[53]	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	}
[30]	306	}
[53]	307
[50]	308	function selectAll(input)
	309	{
	310	input.select();
	311	}
[53]	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	{
[59]	337	input.style.border = '1px solid #888;';
[53]	338	input.checkPassed = null;
	339	}
	340	}
[54]	341
[11]	342	</script>
	343	<?php
	344	}
	345
[29]	346	private function surveyHead() {
[24]	347	?><div id="surveyHead">
	348	<?php
[29]	349	$this->titleBox();
	350	$this->saveSurvey();
	351	$this->descriptionBox();
[50]	352	$this->surveyLink();
[24]	353	?></div>
	354	<?php
	355	}
	356
[29]	357	private function titleBox() {
	358	if (isset($this->survey->title))
	359	$value = $this->survey->title;
	360	else
	361	$value = 'Untitled Survey';
[11]	362	?>
[64]	363	<input type="text" id="surveyTitle" class="titleBox" name="surveyTitle" value="<?php echo $value; ?>" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
[11]	364	<?php
[10]	365	}
[11]	366
[29]	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;
[24]	374	?>
[29]	375	<input id="surveySaveButton" type="button" onclick="save('<?php echo $id; ?>')" class='surveyButton' value='Save' />
[24]	376	<?php
	377	}
	378
[29]	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.';
[11]	384	?>
[64]	385	<textarea id="surveyDescription" class="descriptionBox" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)"><?php echo $value; ?></textarea>
[11]	386	<?php
[10]	387	}
[53]	388
[50]	389	private function surveyLink() {
[53]	390	if (isset($this->survey)) {
	391	$surveyID = $this->survey->id;
	392
	393	$link = $_SERVER['HTTP_HOST'] . dirname($_SERVER['PHP_SELF']) .
[50]	394	'/survey.php?id=' . $surveyID;
[53]	395	?>
	396	<input type="text" value="<?php echo $link; ?>" id="surveyLink" onclick="selectAll(this)">
	397	<?php
[50]	398	}
	399	}
[11]	400
[29]	401	private function questionCreationForm() {
[17]	402	?>
	403	<div id='questionsDiv'>
	404	</div>
	405	<?php
[30]	406	if (isset($this->survey)) {
[32]	407	foreach ($this->survey->questions as $numQ => $question) {
[30]	408	?>
[36]	409	<script type="text/javascript">
[32]	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	?>
[53]	417
[32]	418	addQuestion('<?php echo $question->title; ?>', '<?php echo $question->description; ?>');
[53]	419
[32]	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	}
[36]	430	}
[53]	431
	432
[36]	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";
[53]	439
[36]	440	document.getElementById("questionsDiv").appendChild(questionIDInput);
[32]	441
[30]	442	</script>
	443	<?php
	444	}
	445	} else {
	446	?>
	447	<script type="text/javascript"> addQuestion();</script>
	448	<?php
	449	}
[11]	450	}
	451
	452	private static function addQuestionButton() {
[17]	453	?>
	454	<input id="addQuestionButton" type="button" onclick="addQuestion()" value="Add New Question" class="surveyButton" />
	455	<?php
[10]	456	}
	457
[19]	458	private static function removeLastQuestionButton() {
	459	?>
	460	<input type="button" onclick="removeLastQuestion()" value="x" class="surveyButton" />
	461	<?php
	462	}
	463
[10]	464	}
	465	?>

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

Download in other formats: