Ignore:
File:
1 edited

Legend:

Unmodified
Added
Removed
  • Dev/trunk/classes/SurveyCreationTool.php

    r20 r30  
    99class SurveyCreationTool {
    1010
    11     public function __construct() {
    12         SurveyCreationTool::javascript();
    13         ?>
    14 
    15         <div id="surveyCreation"><form action="submitsurvey.php" method="post">
     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"><form id="survey" action="submitsurvey.php" method="post">
    1625                <?php
    17                 SurveyCreationTool::titleBox();
    18                 SurveyCreationTool::descriptionBox();
    19                 SurveyCreationTool::questionCreationForm();
     26                $this->surveyHead();
     27                $this->questionCreationForm();
    2028                SurveyCreationTool::addQuestionButton();
    2129                SurveyCreationTool::removeLastQuestionButton();
     
    2533    }
    2634
    27     private static function javascript() {
     35    private static function javascript($id = null) {
    2836        ?>
    2937        <script type="text/javascript">
    30             var questionCount = 1;           
    31                                                                                                                    
    32             function getNewQuestion()
    33             {
     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 = title;
     47                else
     48                    var title = 'Untitled Question';
     49               
     50                if (description != null)
     51                    var description = description;
     52                else
     53                    var description = 'Write a question description here.';
     54                                   
    3455                var questionDiv = document.createElement("div");
    3556                var htmlStr =
     
    3859                    "<th>Question " + questionCount + "</th>" +
    3960                    "<tr><td><label for='questionTitle'>Title</label></td>" +
    40                     "<td><input type='text' class='questionTitle' name='questionTitle" + questionCount + "' size='30' value='Untitled Question' /></td></tr>" +
     61                    "<td><input type='text' class='questionTitle' name='questionTitle" + questionCount + "' onfocus='handleFocus(this)' size='30' value='" + title + "' /></td></tr>" +
    4162                    "<tr><td><label for='questionDescription'>Description</label></td>" +
    42                     "<td><input type='text' class='questionDescription' name='questionDescription" + questionCount + "' size='60' value='Write a question description here.' /></td>" +
     63                    "<td><input type='text' class='questionDescription' name='questionDescription" + questionCount + "' onfocus='handleFocus(this)' size='60' value='" + description + "' /></td>" +
    4364                    "<tr><td><label for='questionType'>Answer type</label></td>" +
    4465                    "<td><select id='" + questionCount + "' name='questionType" + questionCount + "' onchange='handleType(this)'><br />"+
     
    5071                    "</select></td></tr>" +
    5172                    "</table>" +
    52                     "<div id='answersDiv" + questionCount + "'></div>" +
     73                    "<div id='answersDiv" + questionCount + "' class='answersDiv'></div>" +
    5374                    "</div>";
    54                                                                                                                
     75                                                                                                                                                                                                               
    5576                questionDiv.innerHTML = htmlStr;
    56                                                                                                                
     77                                                                                                                                                                                                               
    5778                return questionDiv;
    5879            }
    59                                                                                                                    
     80                                                                                                                                                                                                                   
    6081            function handleFocus(input)
    6182            {
     
    6788                }
    6889            }
    69                                                                                                                                                    
     90                                                                                                                                                                                                                                                   
    7091            function handleBlur(input)
    7192            {       
    7293                var surveyTitle = document.getElementById('surveyTitle');
    7394                var surveyDescription = document.getElementById('surveyDescription');
    74                                                                                                                                    
     95                                                                                                                                                                                                                                   
    7596                if (input.value == "")
    7697                {
    7798                    input.style.color = "gray";
    7899                    input.clicked = null;
    79                                                                                                                                                            
     100                                                                                                                                                                                                                                                           
    80101                    if (input == surveyTitle)
    81102                    {
     
    88109                }                           
    89110            }
    90                                                                                                    
     111                                                                                                                                                                                                   
    91112            function handleType(select)
    92113            {
     
    95116                answersDiv.answerCount = 1;
    96117                answersDiv.clicked = null;
    97                                                        
     118                                                                                                                                                       
    98119                switch (type) {
    99120                    case 'mc':
    100121                        answersDiv.innerHTML = "";
    101122                        addOption(select.id);
    102                                                                                        
     123                                                                                                                                                                                       
    103124                        break;
    104125                    case 'text':
     
    124145
    125146            }
    126                                                                                    
    127                                                                            
     147                                                                                                                                                                                   
     148                                                                                                                                                                           
    128149            function addOption(questionNumber)
    129150            {       
     
    132153                var answerDiv = document.createElement("div");
    133154                answerDiv.className = "answerDiv";
    134                                                                                
     155                                                                                                                                                                               
    135156                var htmlStr = "<input type='text' name='q" +
    136157                    questionNumber + "ans" + answerCount + "' value='Option " + answerCount + "' />";
    137                                                        
     158                                                                                                                                                       
    138159                if (answersDiv.clicked == null)
    139160                {
     
    141162                        + " class='surveyButton' onclick='addOption(" + questionNumber + ")' value='Add Option' />" +
    142163                        "<input type='button' class='surveyButton' onclick='removeOption(" + questionNumber + ")' value='x' />";
    143                            
     164                                                                                                                           
    144165                    answersDiv.clicked = true;
    145166                }
    146                                                                                        
     167                                                                                                                                                                                      
    147168                answerDiv.innerHTML = htmlStr;
    148                        
     169                                                                                                                       
    149170                answerDiv.prev = answersDiv.lastAnswer; //singly linked list
    150171                answersDiv.lastAnswer = answerDiv;
    151                                                                                        
     172                                                                                                                                                                                      
    152173                answersDiv.appendChild(answerDiv);
    153174                answersDiv.answerCount++;
    154175            }
    155                    
     176                                                                                                                   
    156177            function removeOption(questionNumber)
    157178            {
    158179                var answersDiv = document.getElementById("answersDiv" + questionNumber);
    159                        
     180                                                                                                                      
    160181                if (answersDiv.lastAnswer.prev != null)
    161182                {
     
    165186                }
    166187            }
    167                                            
     188                                                                                                                                           
    168189            function minMax(questionNumber)
    169190            {
    170191                var answersDiv = document.getElementById("answersDiv" + questionNumber);
    171                                                
     192                                                                                                                                               
     193                var answerDiv = document.createElement("div");
     194                                                                                                               
     195                answerDiv.className = "answerDiv";
     196                answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' name='q" + questionNumber + "ans1' />" +
     197                    "<label for='max'>Max</label><input type='text' name='q" + questionNumber + "ans2' />";
     198                                                                                                                                           
     199                answersDiv.appendChild(answerDiv);
     200            } 
     201                                                                                                                                           
     202            function minMaxIncr(questionNumber)
     203            {
     204                var answersDiv = document.getElementById("answersDiv" + questionNumber);
     205                                                                                                                                               
    172206                var answerDiv = document.createElement("div");
    173207                answerDiv.className = "answerDiv";
    174                 answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' name='min" + questionNumber + "' />" +
    175                     "<label for='max'>Max</label><input type='text' name='max" + questionNumber + "' />";
    176                                            
    177                 answersDiv.appendChild(answerDiv);
    178             } 
    179                                            
    180             function minMaxIncr(questionNumber)
    181             {
    182                 minMax(questionNumber);
    183                 var answersDiv = document.getElementById("answersDiv" + questionNumber);
    184                                                
    185                 var answerDiv = document.createElement("div");
    186                 answerDiv.className = "answerDiv";
    187                 answerDiv.innerHTML = "<label for='incr'>Increment by</label><input type='text' name='incr" + questionNumber + "' />";
    188                                            
     208                answerDiv.innerHTML = "<label>Left label</label><input type='text' name='q" + questionNumber + "ans1' />" +
     209                    "<label>Right label</label><input type='text' name='q" + questionNumber + "ans2' />" +
     210                    "<label>Scale count</label><input type='text' name='q" + questionNumber + "ans3' />" +
     211                    "<div id='inputCheckFeedback'" + questionNumber + "";
     212                                                                                                                                           
    189213                answersDiv.appendChild(answerDiv);
    190214            }         
    191                                                                                                  
    192                                                                                                          
    193             function addQuestion()
     215                                                                                                                                                                                                
     216                                                                                                                                                                                                        
     217            function addQuestion(title, description)
    194218            {
    195219                var questionsDiv = document.getElementById('questionsDiv');
    196                 var newQuestion = getNewQuestion();
    197                                        
     220                var newQuestion = getNewQuestion(title, description);
     221                                                                                                                                       
    198222
    199223                newQuestion.prev = document.lastQuestion;
     
    203227                questionCount++;
    204228            }
    205                                    
     229                                                                                                                                   
    206230            function removeLastQuestion()
    207231            {
    208232                var questionsDiv = document.getElementById('questionsDiv');
    209                                        
     233                                                                                                                                       
    210234                if (document.lastQuestion.prev != null)
    211235                {
     
    219243                }               
    220244            }
    221                                  
    222                                            
    223                                                                                                                                                                                                                            
     245                                                                                                             
     246            function save(surveyID)
     247            {
     248                var form = document.getElementById('survey');
     249                var questionsDiv = document.getElementById('questionsDiv');
     250                form.action = "surveycreation.php";
     251                                                                               
     252                /* extra time stamp */
     253                var date = new Date();
     254                var minutes = date.getUTCMinutes();
     255                if (minutes < 10)
     256                    minutes = "0" + minutes;
     257                var timeStamp = date.getHours() + ":" + minutes;
     258                var timeStampInput = document.createElement("input");
     259                timeStampInput.name = "timeStamp";
     260                timeStampInput.value = timeStamp;
     261                timeStampInput.type = "hidden";
     262                                   
     263                var surveyIDInput = document.createElement("input");
     264                surveyIDInput.name = "surveyID";
     265                surveyIDInput.value = surveyID;
     266                surveyIDInput.type = "hidden";
     267                                                             
     268                questionsDiv.appendChild(timeStampInput);
     269                questionsDiv.appendChild(surveyIDInput);
     270                form.submit();
     271            }
     272                                                                                                                                           
     273                                                                                                                                                                                                                                                                                                                           
    224274        </script>
    225275        <?php
    226276    }
    227277
    228     private static function titleBox() {
    229         ?>
    230         <input type="text" id="surveyTitle" name="surveyTitle" value="Untitled Survey" size="30" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
    231         <?php
    232     }
    233 
    234     private static function descriptionBox() {
    235         ?>
    236         <textarea id="surveyDescription" rows="3" cols="80" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)">Write a helpful description for this survey here.</textarea>
    237         <?php
    238     }
    239 
    240     private static function questionCreationForm() {
     278    private function surveyHead() {
     279        ?><div id="surveyHead">
     280        <?php
     281        $this->titleBox();
     282        $this->saveSurvey();
     283        $this->descriptionBox();
     284        ?></div>
     285        <?php
     286    }
     287
     288    private function titleBox() {
     289        if (isset($this->survey->title))
     290            $value = $this->survey->title;
     291        else
     292            $value = 'Untitled Survey';
     293        ?>
     294        <input type="text" id="surveyTitle" name="surveyTitle" value="<?php echo $value ?>" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
     295        <?php
     296    }
     297
     298    private function saveSurvey() {
     299        if (isset($this->timeStamp))
     300            echo "<div id='timeStamp'>Last saved " . $this->timeStamp . '</div>';
     301        if (isset($this->survey->id))
     302            $id = $this->survey->id;
     303        else
     304            $id = null;
     305        ?>
     306        <input id="surveySaveButton" type="button" onclick="save('<?php echo $id; ?>')" class='surveyButton' value='Save' />
     307        <?php
     308    }
     309
     310    private function descriptionBox() {
     311        if (isset($this->survey->description))
     312            $value = $this->survey->description;
     313        else
     314            $value = 'Write a helpful description for this survey here.';
     315        ?>
     316        <textarea id="surveyDescription" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)"><?php echo $value; ?></textarea>
     317        <?php
     318    }
     319
     320    private function questionCreationForm() {
    241321        ?>
    242322        <div id='questionsDiv'>
    243323        </div>
    244         <script type="text/javascript"> addQuestion(); </script>
    245         <?php
     324        <?php
     325        if (isset($this->survey)) {
     326            foreach ($this->survey->questions as $question) {
     327                ?>
     328                <script type="text/javascript"> addQuestion('<?php echo $question->title; ?>', '<?php echo $question->description; ?>');
     329                </script>
     330                <?php
     331            }
     332        } else {
     333            ?>
     334            <script type="text/javascript"> addQuestion();</script>
     335            <?php
     336        }
    246337    }
    247338
Note: See TracChangeset for help on using the changeset viewer.