Ignore:
Timestamp:
07/19/11 16:59:59 (14 years ago)
Author:
fpvanagthoven
Message:

Some styling. Survey will now autosave itself every 3 minutes. Autosave is not yet functional though.

File:
1 edited

Legend:

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

    r23 r24  
    99class SurveyCreationTool {
    1010
    11     public function __construct() {
     11    public function __construct($survey = null, $timeStamp = null) {
    1212        SurveyCreationTool::javascript();
    1313        ?>
    1414
    15         <div id="surveyCreation"><form action="submitsurvey.php" method="post">
     15        <div id="surveyCreation"><form id="survey" action="submitsurvey.php" method="post">
    1616                <?php
    17                 SurveyCreationTool::titleBox();
    18                 SurveyCreationTool::descriptionBox();
     17                SurveyCreationTool::surveyHead($timeStamp);
    1918                SurveyCreationTool::questionCreationForm();
    2019                SurveyCreationTool::addQuestionButton();
     
    2827        ?>
    2928        <script type="text/javascript">
    30             var questionCount = 1;           
    31                                                                                                                    
     29            /* autosave every 3 minutes */
     30            setTimeout("save()", 180000);
     31           
     32            var questionCount = 1;         
     33                                                                                                                                                   
    3234            function getNewQuestion()
    3335            {
     
    5254                    "<div id='answersDiv" + questionCount + "' class='answersDiv'></div>" +
    5355                    "</div>";
    54                                                                                                                
     56                                                                                                                                               
    5557                questionDiv.innerHTML = htmlStr;
    56                                                                                                                
     58                                                                                                                                               
    5759                return questionDiv;
    5860            }
    59                                                                                                                    
     61                                                                                                                                                   
    6062            function handleFocus(input)
    6163            {
     
    6769                }
    6870            }
    69                                                                                                                                                    
     71                                                                                                                                                                                   
    7072            function handleBlur(input)
    7173            {       
    7274                var surveyTitle = document.getElementById('surveyTitle');
    7375                var surveyDescription = document.getElementById('surveyDescription');
    74                                                                                                                                    
     76                                                                                                                                                                   
    7577                if (input.value == "")
    7678                {
    7779                    input.style.color = "gray";
    7880                    input.clicked = null;
    79                                                                                                                                                            
     81                                                                                                                                                                                           
    8082                    if (input == surveyTitle)
    8183                    {
     
    8890                }                           
    8991            }
    90                                                                                                    
     92                                                                                                                                   
    9193            function handleType(select)
    9294            {
     
    9597                answersDiv.answerCount = 1;
    9698                answersDiv.clicked = null;
    97                                                        
     99                                                                                       
    98100                switch (type) {
    99101                    case 'mc':
    100102                        answersDiv.innerHTML = "";
    101103                        addOption(select.id);
    102                                                                                        
     104                                                                                                                       
    103105                        break;
    104106                    case 'text':
     
    124126
    125127            }
    126                                                                                    
    127                                                                            
     128                                                                                                                   
     129                                                                                                           
    128130            function addOption(questionNumber)
    129131            {       
     
    132134                var answerDiv = document.createElement("div");
    133135                answerDiv.className = "answerDiv";
    134                                                                                
     136                                                                                                               
    135137                var htmlStr = "<input type='text' name='q" +
    136138                    questionNumber + "ans" + answerCount + "' value='Option " + answerCount + "' />";
    137                                                        
     139                                                                                       
    138140                if (answersDiv.clicked == null)
    139141                {
     
    141143                        + " class='surveyButton' onclick='addOption(" + questionNumber + ")' value='Add Option' />" +
    142144                        "<input type='button' class='surveyButton' onclick='removeOption(" + questionNumber + ")' value='x' />";
    143                            
     145                                                           
    144146                    answersDiv.clicked = true;
    145147                }
    146                                                                                        
     148                                                                                                                      
    147149                answerDiv.innerHTML = htmlStr;
    148                        
     150                                                       
    149151                answerDiv.prev = answersDiv.lastAnswer; //singly linked list
    150152                answersDiv.lastAnswer = answerDiv;
    151                                                                                        
     153                                                                                                                      
    152154                answersDiv.appendChild(answerDiv);
    153155                answersDiv.answerCount++;
    154156            }
    155                    
     157                                                   
    156158            function removeOption(questionNumber)
    157159            {
    158160                var answersDiv = document.getElementById("answersDiv" + questionNumber);
    159                        
     161                                                      
    160162                if (answersDiv.lastAnswer.prev != null)
    161163                {
     
    165167                }
    166168            }
    167                                            
     169                                                                           
    168170            function minMax(questionNumber)
    169171            {
    170172                var answersDiv = document.getElementById("answersDiv" + questionNumber);
    171                                                
     173                                                                              
    172174                var answerDiv = document.createElement("div");
    173                
     175                                               
    174176                answerDiv.className = "answerDiv";
    175177                answerDiv.innerHTML = "<label for='min'>Min</label><input type='text' name='q" + questionNumber + "ans1' />" +
    176178                    "<label for='max'>Max</label><input type='text' name='q" + questionNumber + "ans2' />";
    177                                            
     179                                                                          
    178180                answersDiv.appendChild(answerDiv);
    179181            } 
    180                                            
     182                                                                           
    181183            function minMaxIncr(questionNumber)
    182184            {
    183185                var answersDiv = document.getElementById("answersDiv" + questionNumber);
    184                                                
     186                                                                              
    185187                var answerDiv = document.createElement("div");
    186188                answerDiv.className = "answerDiv";
     
    188190                    "<label>Right label</label><input type='text' name='q" + questionNumber + "ans2' />" +
    189191                    "<label>Scale count</label><input type='text' name='q" + questionNumber + "ans3' />";
    190                                            
     192                                                                          
    191193                answersDiv.appendChild(answerDiv);
    192194            }         
    193                                                                                                  
    194                                                                                                          
     195                                                                                                                                
     196                                                                                                                                        
    195197            function addQuestion()
    196198            {
    197199                var questionsDiv = document.getElementById('questionsDiv');
    198200                var newQuestion = getNewQuestion();
    199                                        
     201                                                                       
    200202
    201203                newQuestion.prev = document.lastQuestion;
     
    205207                questionCount++;
    206208            }
    207                                    
     209                                                                   
    208210            function removeLastQuestion()
    209211            {
    210212                var questionsDiv = document.getElementById('questionsDiv');
    211                                        
     213                                                                       
    212214                if (document.lastQuestion.prev != null)
    213215                {
     
    221223                }               
    222224            }
    223                                  
    224225                                           
    225                                                                                                                                                                                                                            
     226            function save()
     227            {
     228                var form = document.getElementById('survey');
     229                var questionsDiv = document.getElementById('questionsDiv');
     230                form.action = "surveycreation.php";
     231               
     232                /* extra time stamp */
     233                var date = new Date();
     234                var timeStamp = date.getHours() + ":" + date.getUTCMinutes();
     235                var timeStampInput = document.createElement("input");
     236                timeStampInput.name = "timeStamp";
     237                timeStampInput.value = timeStamp;
     238                timeStampInput.type = "hidden";
     239               
     240                questionsDiv.appendChild(timeStampInput);
     241                form.submit();
     242            }
     243                                                                           
     244                                                                                                                                                                                                                                                           
    226245        </script>
    227246        <?php
    228247    }
    229248
     249    private static function surveyHead($timeStamp = null) {
     250        ?><div id="surveyHead">
     251        <?php
     252        SurveyCreationTool::titleBox();
     253        SurveyCreationTool::saveSurvey($timeStamp);
     254        SurveyCreationTool::descriptionBox();
     255        ?></div>
     256        <?php
     257    }
     258
    230259    private static function titleBox() {
    231260        ?>
    232         <input type="text" id="surveyTitle" name="surveyTitle" value="Untitled Survey" size="30" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
     261        <input type="text" id="surveyTitle" name="surveyTitle" value="Untitled Survey" onblur="handleBlur(this)" onfocus="handleFocus(this)" />
     262        <?php
     263    }
     264
     265    private static function saveSurvey($timeStamp = null) {
     266        if (isset($timeStamp))
     267            echo "<div id='timeStamp'>Last saved " . $timeStamp . '</div>';
     268        ?>
     269        <input id="surveySaveButton" type="button" onclick="save()" class='surveyButton' value='Save' />
    233270        <?php
    234271    }
     
    236273    private static function descriptionBox() {
    237274        ?>
    238         <textarea id="surveyDescription" rows="3" cols="80" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)">Write a helpful description for this survey here.</textarea>
     275        <textarea id="surveyDescription" name="surveyDescription" onblur="handleBlur(this)" onfocus="handleFocus(this)">Write a helpful description for this survey here.</textarea>
    239276        <?php
    240277    }
Note: See TracChangeset for help on using the changeset viewer.