Context Navigation

source: Dev/trunk/classes_old/SurveyCreationTool.php @ 137

Last change on this file since 137 was 137, checked in by jkraaijeveld, 14 years ago
Added old classes
File size: 40.1 KB

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

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

Download in other formats: