Changeset 548 in tmcsimulator for trunk


Ignore:
Timestamp:
12/25/2019 09:44:50 AM (6 years ago)
Author:
jdalbey
Message:

Evaluation.js restore radio buttons and simplify recordRating(). Add submit button to scrollframe and add collectRatings function to retrieve any rating that have been set.

Location:
trunk/webapps/einotebook
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/webapps/einotebook/roles/index.html

    r540 r548  
    2222      <option value="CHP RADIO">CHP RADIO</option> 
    2323    </select> 
    24        
    2524    <iframe id='view' src='../script/scrollframe.html' frameborder='0' scrolling='yes' 
    2625            width='100%'></iframe> 
     26 
    2727  </body> 
    2828</html> 

  • trunk/webapps/einotebook/script/index.html

    r468 r548  
    1313  <body> 
    1414    
     15 
    1516    <button class="jumpToCurrentEvent"  
    1617            onclick="jumpToLastExecutedEvent()">Jump to Current Event</button> 
    17       
     18     
    1819    <iframe id='view' src='scrollframe.html' frameborder='0' scrolling='yes' 
    1920            width='100%'></iframe> 
     21 
     22      </form> 
     23    
    2024  </body> 
    2125</html> 

  • trunk/webapps/einotebook/script/scrollframe.js

    r468 r548  
    1111        events = theEvents; 
    1212} 
     13 
     14function collectRatings()  
     15{ 
     16    // Consider each event in the incident script 
     17    for (var evtidx = 0; evtidx < events.length; evtidx++) 
     18    { 
     19        // Does this event have any evaluations? 
     20        if (events[evtidx].evaluations.evaluations.length > 0) 
     21        { 
     22            // Examine each evaluation contained in this event 
     23            for (var rating=0; rating<events[evtidx].evaluations.evaluations.length; rating++ ) 
     24            { 
     25                // Extract the rating assigned to this item 
     26                var item = events[evtidx].evaluations.evaluations[rating]; 
     27                // If it not the default value we want to save it 
     28                if (item.rating > 0) 
     29                { 
     30                    console.log("collecting event"+evtidx + " at " + events[evtidx].time.format() +" "+item.type + " " + item.rating) 
     31                } 
     32            } 
     33        } 
     34    } 
     35} 
     36 
     37/* This is an alternative way to collect the ratings values by reading them directly from the radio buttons  
     38function collectRadios() 
     39{ 
     40    var radios = document.getElementsByTagName('input'); 
     41    var count = 0; 
     42    for (var j=0; j<radios.length; j++) 
     43    { 
     44        if (radios[j].type == 'radio')  
     45        { 
     46            count++; 
     47            if (radios[j].checked)  
     48            { 
     49                console.log(radios[j].name + " checked " + radios[j].value)                         
     50            } 
     51        } 
     52    } 
     53    alert("counted " + count + " radios"); 
     54} 
     55*/ 
     56 
     57// TODO 
     58function submitRatings() 
     59{ 
     60        // Using POST to send the data  
     61        var xhr = new XMLHttpRequest(); 
     62        xhr.open("POST", "../../cgi-bin/saveRatings.py", true); 
     63        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8'); 
     64        // send the collected data 
     65        xhr.send("msg="+outString); 
     66} 

  • trunk/webapps/einotebook/script/simscript.js

    r468 r548  
    7070        } 
    7171         
     72    // Add a submit button to the very bottom  
     73    html += "<button style=\"float: right\" onclick=\"collectRatings();\">Submit Ratings</button>" 
    7274        // display events in iframe 
    7375        getDocumentFromFrame('view').body.innerHTML = html;      
    … …  
    7678        resizeIframe(); 
    7779        window.onresize = resizeIframe; 
    78     // This line is causing an error 
    79         //window.frames['view'].setEvents(Script.events); 
    80          
     80    // Pass the events to the scroll frame window 
     81        document.getElementById("view").contentWindow.setEvents(Script.events); 
     82     
    8183        Script.events.win.scrollTo(0, readCookie('scriptScrollY')); 
    8284         

  • trunk/webapps/einotebook/scripts/Evaluation.js

    r397 r548  
    66function Evaluation(type, data) 
    77{ 
    8         //========== private static members ==========// 
    9         Evaluation.id = (typeof Evaluation.id == 'undefined') ? 0 : ++Evaluation.id; 
    10          
    11         //========== public constants ==========// 
    12         this.id = Evaluation.id; 
    13         this.ratingGroupName = "evaluationGroup" + this.id;      
    14         this.textID = "evaluationText" + this.id; 
    15         this.type = type; 
    16         this.data = data; 
    17          
    18         //========== public read-only members ==========// 
    19         this.text = ""; 
    20         this.rating = -1; 
    21          
    22         //========== public methods ==========// 
    23         this.html = html; 
    24         this.recordText = recordText;  
    25         this.recordRating = recordRating; 
    26          
    27         //========== private methods ==========// 
    28         this.smallScaleForm = smallScaleForm; 
    29         this.evaluationForm = evaluationForm; 
    30          
    31         //========== function definitions ==========// 
    32         /** 
    33         * @return The html representation of this evaluation. 
    34         */ 
    35         function html() 
    36         { 
    37                 var text = "<table class='evaluation'>" + 
    38                                    "<tr>" + 
    39                                    "<th class='evaluationType' colspan='2'>" + type + " Evaluation</th>" + 
    40                                    "</tr>" + 
    41                                    "<tr>" + 
    42                                    "<td><table class='evaluationInner2'>"; 
    43                  
    44                 for (i = 0; i < this.data.length; i += 2) 
    45                 { 
    46                         text += "<tr>" + 
    47                                    "<td class='evaluationLabel'>" + this.data[i] + "</td>" + 
    48                                    "<td class='evaluationCriteria'>" + this.data[i+1] + "</td>" + 
    49                                    "</tr>"; 
    50                 } 
    51                 /*  Displays the comment input field  
    52                 text += "<tr><td colspan='2' class='evaluationResponse'>" + 
    53                         "<input onchange='events.getEvaluation(" + this.id + ").recordText();'" + 
    54                         " id='" + this.textID + "' type='text' value='" + this.text + "'" + 
    55                         " class='evaluationResponseText' />"  
    56                         + "</td>"; 
     8    //========== private static members ==========// 
     9    Evaluation.id = (typeof Evaluation.id == 'undefined') ? 0 : ++Evaluation.id; 
     10     
     11    //========== public constants ==========// 
     12    this.id = Evaluation.id; 
     13    this.ratingGroupName = "evaluationGroup" + this.id;     
     14    this.textID = "evaluationText" + this.id; 
     15    this.type = type; 
     16    this.data = data; 
     17     
     18    //========== public read-only members ==========// 
     19    this.text = ""; 
     20    this.rating = -1; 
     21     
     22    //========== public methods ==========// 
     23    this.html = html; 
     24    this.recordText = recordText;  
     25    this.recordRating = recordRating; 
     26     
     27    //========== private methods ==========// 
     28    this.smallScaleForm = smallScaleForm; 
     29    this.evaluationForm = evaluationForm; 
     30     
     31    //========== function definitions ==========// 
     32    /** 
     33    * @return The html representation of this evaluation. 
     34    */ 
     35    function html() 
     36    { 
     37        var text = "<table class='evaluation'>" + 
     38                         "<tr>" + 
     39                         "<th class='evaluationType' colspan='2'>" + type + " Evaluation</th>" + 
     40                         "</tr>" + 
     41                         "<tr>" + 
     42                         "<td><table class='evaluationInner2'>"; 
     43         
     44        for (i = 0; i < this.data.length; i += 2) 
     45        { 
     46            text += "<tr>" + 
     47                   "<td class='evaluationLabel'>" + this.data[i] + "</td>" + 
     48                   "<td class='evaluationCriteria'>" + this.data[i+1] + "</td>" + 
     49                   "</tr>"; 
     50        } 
     51        /*  Displays the comment input field  
     52        text += "<tr><td colspan='2' class='evaluationResponse'>" + 
     53            "<input onchange='events.getEvaluation(" + this.id + ").recordText();'" + 
     54            " id='" + this.textID + "' type='text' value='" + this.text + "'" + 
     55            " class='evaluationResponseText' />"  
     56            + "</td>"; 
    5757        */ 
    58         text += "</table>"; 
    59                 /*  Displays the ranking bubbles 
    60                 text += "</td>" + 
    61                                 "<td class='evaluationScale'>" + this.evaluationForm() + "</td>" + 
    62                             "</tr>"; 
    63         */ 
    64         text += "</table>"; 
     58        text +=    "</table>"; 
     59        /*  Displays the ranking bubbles  */ 
     60        text += "</td>" + 
     61                      "<td class='evaluationScale'>" + this.evaluationForm() + "</td>" + 
     62                   "</tr>"; 
     63         
     64        text +=    "</table>"; 
    6565 
    66                          
    67                 return text; 
    68         } 
    69          
    70         /** 
    71          * Stores the rating given by the evaluation scale radio button form. 
    72          */ 
    73         function recordRating()  
    74         {  
    75                 // list of radio buttons 
    76                 var radioButtons; 
    77                  
    78                 // get list of radio buttons 
    79                 radioButtons = events.doc.getElementsByName(this.ratingGroupName); 
    80                  
    81                 // FOR each radio button 
    82                 for (var i = 0; i < radioButtons.length; i++) 
    83                 { 
    84                         // IF the radio button is checked THEN 
    85                         if (radioButtons[i].checked) 
    86                         { 
    87                                 // save rating 
    88                                 this.rating = radioButtons[i].value; 
    89                         } 
    90                 } 
    91         } 
     66                 
     67        return text; 
     68    } 
     69     
     70    /** 
     71     * Stores the rating given by the evaluation scale radio button form. 
     72     */ 
     73    function recordRating(givenRating)  
     74    {  
    9275 
    93         /** 
    94          * Stores the text in the written response text box. 
    95          */ 
    96         function recordText()  
    97         {  
    98                 this.text = events.doc.getElementById(this.textID).value;  
    99         } 
    100          
    101         /** 
    102          * @return The html for appropriate evaluation form for grading. 
    103          */ 
    104         function evaluationForm() 
    105         { 
    106                 return this.smallScaleForm(); 
    107         } 
    108          
    109         /** 
    110          * @return The html for a 1-5 grading scale. 
    111          */ 
    112         function smallScaleForm() 
    113         { 
    114                 return "<form>" + 
    115                            "<table align='right' class='evaluationScale'>" + 
    116                            "<tr>" + 
    117                            "<td class='eventRadioButtonSmallScale'>Best</td>" + 
    118                            "<td class='eventRadioButtonSmallScale'>Good</td>" + 
    119                            "<td class='eventRadioButtonSmallScale'>Average</td>" + 
    120                            "<td class='eventRadioButtonSmallScale'>Poor</td>" + 
    121                            "<td class='eventRadioButtonSmallScale'>Worst</td>" + 
    122                            "</tr>" + 
    123                            "<tr>" + 
    124                            "<td align='center'><input type='radio' " +  
    125                                         (this.rating == 1 ? "checked='true'" : "") +  
    126                                         " onchange='events.getEvaluation(" + this.id +  
    127                                         ").recordRating()' name='" + this.ratingGroupName +  
    128                                         "' value='1'></td>" + 
    129                            "<td align='center'><input type='radio' " +  
    130                                         (this.rating == 2 ? "checked='true'" : "") +  
    131                                         " onchange='events.getEvaluation(" + this.id +  
    132                                         ").recordRating()' name='" + this.ratingGroupName +  
    133                                         "' value='2'></td>" + 
    134                            "<td align='center'><input type='radio' " +  
    135                                         (this.rating == 3 ? "checked='true'" : "") +  
    136                                         " onchange='events.getEvaluation(" + this.id +  
    137                                         ").recordRating()' name='" + this.ratingGroupName +  
    138                                         "' value='3'></td>" + 
    139                            "<td align='center'><input type='radio' " +  
    140                                         (this.rating == 4 ? "checked='true'" : "") +  
    141                                         " onchange='events.getEvaluation(" + this.id +  
    142                                         ").recordRating()' name='" + this.ratingGroupName +  
    143                                         "' value='4'></td>" + 
    144                            "<td align='center'><input type='radio' " +  
    145                                         (this.rating == 5 ? "checked='true'" : "") +  
    146                                         " onchange='events.getEvaluation(" + this.id +  
    147                                         ").recordRating()' name='" + this.ratingGroupName +  
    148                                         "' value='5'></td>" + 
    149                            "</tr>" + 
    150                            "</table>"  + 
    151                            "</form>"; 
    152         } 
     76        this.rating = givenRating; 
     77 
     78        console.log(this.ratingGroupName + " recordRating of " + this.rating ) 
     79    } 
     80 
     81    /** 
     82     * Stores the text in the written response text box. 
     83     */ 
     84    function recordText()  
     85    {  
     86        this.text = events.doc.getElementById(this.textID).value;  
     87    } 
     88     
     89    /** 
     90     * @return The html for appropriate evaluation form for grading. 
     91     */ 
     92    function evaluationForm() 
     93    { 
     94        return this.smallScaleForm(); 
     95    } 
     96     
     97    /** 
     98     * @return The html for a 1-5 grading scale. 
     99     */ 
     100    function smallScaleForm() 
     101    { 
     102        return "<form>" + 
     103               "<table align='right' class='evaluationScale'>" + 
     104               "<tr>" + 
     105               "<td class='eventRadioButtonSmallScale'>Best</td>" + 
     106               "<td class='eventRadioButtonSmallScale'>Good</td>" + 
     107               "<td class='eventRadioButtonSmallScale'>Average</td>" + 
     108               "<td class='eventRadioButtonSmallScale'>Poor</td>" + 
     109               "<td class='eventRadioButtonSmallScale'>Worst</td>" + 
     110               "</tr>" + 
     111               "<tr>" + 
     112               "<td align='center'><input type='radio' " +  
     113                       (this.rating == 5 ? "checked='true'" : "") +  
     114                       " onchange='events.getEvaluation(" + this.id +  
     115                       ").recordRating(5)' name='" + this.ratingGroupName +  
     116                       "' value='1'></td>" + 
     117               "<td align='center'><input type='radio' " +  
     118                       (this.rating == 4 ? "checked='true'" : "") +  
     119                       " onchange='events.getEvaluation(" + this.id +  
     120                       ").recordRating(4)' name='" + this.ratingGroupName +  
     121                       "' value='2'></td>" + 
     122               "<td align='center'><input type='radio' " +  
     123                       (this.rating == 3 ? "checked='true'" : "") +  
     124                       " onchange='events.getEvaluation(" + this.id +  
     125                       ").recordRating(3)' name='" + this.ratingGroupName +  
     126                       "' value='3'></td>" + 
     127               "<td align='center'><input type='radio' " +  
     128                       (this.rating == 2 ? "checked='true'" : "") +  
     129                       " onchange='events.getEvaluation(" + this.id +  
     130                       ").recordRating(2)' name='" + this.ratingGroupName +  
     131                       "' value='4'></td>" + 
     132               "<td align='center'><input type='radio' " +  
     133                       (this.rating == 1 ? "checked='true'" : "") +  
     134                       " onchange='events.getEvaluation(" + this.id +  
     135                       ").recordRating(1)' name='" + this.ratingGroupName +  
     136                       "' value='5'></td>" + 
     137               "</tr>" + 
     138               "</table>"  + 
     139               "</form>"; 
     140    } 
    153141} 
Note: See TracChangeset for help on using the changeset viewer.