Subversion Repositories wimsdev

Rev

Rev 7086 | Blame | Compare with Previous | Last modification | View Log | RSS feed

  1. !!hotspot questions  var1 = xmin,xmax,ymin,ymax in coordinatesystem of the graph.
  2. !! without ISMAP
  3.  
  4. !set xmin=!item 1 of $var1
  5. !set xmax=!item 2 of $var1
  6. !set ymin=!item 3 of $var1
  7. !set ymax=!item 4 of $var1
  8.  
  9. !if $use_arrow = 1
  10.     <img id="mouse_dot_w3c" style="position:absolute;z-index:100;display:none;top:0px;left:0px;" src="$arrow" />
  11.     <img id="mouse_dot_ie" style="position:absolute;z-index:100;display:none;top:0px;left:0px;" src="$arrow" />
  12.     <div id="mouse_coords" style="opacity:0.7;position:absolute;z-index:100;display:block;background-color:orange;top:0px;left:0px;font-size:16px;border:1px solid #ff0000;color:black"></div>
  13. !else
  14.     <div id="mouse_coords" style="opacity:0.6;position:absolute;z-index:100;display:block;background-color:lightgreen;top:0px;left:0px;font-size:16px;border:1px solid #ff0000"></div>
  15.     <div id="mouse_dot_ie" style="position:absolute;z-index:100;display:none;background-color:red;top:0px;left:0px;width:4px;min-height:4px;max-height:4px;height:auto!important;height:4px;"><table summary="" bgcolor="red" width="4" height="4"><tr><th></th></tr></table></div>
  16.     <div id="mouse_dot_w3c" style="position:absolute;z-index:100;display:none;background-color:red;top:0px;left:0px;width:6px;height:6px;"></div>
  17. !endif
  18.  
  19. !set n=$counter
  20. <table id="exercise" class="exercise">
  21.     <tr>
  22.     <td class="exercise_t">
  23.     !if $(question$n) != $empty
  24.         $(question$n)
  25.         <br />
  26.     !endif
  27.     !if $(formula$n) != $empty
  28.         !insmath $(formula$n)
  29.         <br />
  30.     !endif
  31.     !if $exotext != $empty
  32.         $exotext
  33.         <br />
  34.     !endif
  35.     </td>
  36. !if $make_tr=1
  37.     </tr>
  38.     <tr>
  39. !endif
  40.     <td class="exercise_c">
  41.         <div id="mydiv">
  42.         !if $draw=1
  43.             !set insdraw_size=$xsize,$ysize
  44.             !set ins_attr= id="myimage"
  45.             !insdraw $(image$n)
  46.         !else
  47.             !if $plot=1
  48.                 !set ins_attr= id="myimage"
  49.                 !set insplot_set=$(image_settings$n)
  50.                 !insplot $(image$n)
  51.             !else
  52.                 $(image$n)
  53.             !endif
  54.         !endif
  55.         </div>
  56.     </td>
  57. !if $inputs>0
  58.     !if $make_tr=1
  59.     </tr>
  60.     <tr>
  61.     !endif
  62.     <td class="exercise_m">
  63.         <table class="zebra_table_h2">
  64.     !set a_items=!itemcnt $(answer$n)
  65.     !if $a_items != $[floor($inputs)]
  66.         !set use_lines=1
  67.     !else
  68.         !set use_lines=0
  69.     !endif
  70.     !for p=1 to $inputs
  71.         !if $wims_user=supervisor
  72.             !if $use_lines=1
  73.                 !set deelantwoord=!line $p of $(answer$n)
  74.             !else
  75.             !set deelantwoord=!item $p of $(answer$n)
  76.             !endif
  77.         !else
  78.             !set deelantwoord=!item $p of $(reply$n)
  79.         !endif
  80.             <tr><td>$(description[$p])</td><td>$m_rightarrow</td><td><input type="text" id="myinput$[$p-1]" class="schaersvoorde_input" size="$cols" value="$deelantwoord" /></td><td>&nbsp;$(ex$p)</td></tr>
  81.     !next p
  82.         </table>
  83.     </td>
  84. !endif
  85.     </tr>
  86. </table>
  87.  
  88. <div id="send_buttons" class="embedded_central">
  89.     <input type="button" id="schaersvoorde_ok_button" onclick="javascript:sendanswer();" value="$send" />
  90.     <input type="button" id="schaersvoorde_nok_button" onclick="javascript:dontknow();"  value="$dontknow" />
  91. </div>
  92.  
  93. <script>
  94. //<![CDATA[
  95. <!-- no validator -->
  96.     function dontknow(){
  97.         myConfirm('$dontknow','?','$wims_ref_name','$session','$module','$counter','$nok_send_color');
  98.     }
  99.  
  100.     function sendanswer(){
  101.         var reply = new Array();
  102.         var p = 0;
  103.         var show="<ol>";
  104.         if( document.getElementById("myinput0") ){
  105.             var tmp;
  106.             while (document.getElementById("myinput"+p)){
  107.                 tmp = document.getElementById("myinput"+p).value;
  108.                 if(tmp.length == 0 ){setAlarm(r1+parseInt(p+1));return;}
  109.                 show = show + "<li>" + tmp + "</li>";
  110.                 reply[p] = tmp;
  111.                 p++;
  112.                 if(p > 100){setAlarm(r2);dontknow();}
  113.             }
  114.         }
  115.         show = show + "("+relx+":"+rely+")";
  116.         reply[p]= relx+","+rely;
  117.         myConfirm(show,reply,'$wims_ref_name','$session','$module','$counter','$ok_send_color');
  118.     }
  119.    
  120.     !! wims variables
  121.     var sizex=$xsize;
  122.     var sizey=$xsize;
  123.     var xmin=$xmin,xmax=$xmax,ymin=$ymin,ymax=$ymax;
  124. !if $rounding < 1
  125.     var rounding = 100;
  126. !else
  127.     var rounding = $rounding;
  128. !endif
  129.     var IE = false;
  130.     var relx = 0;
  131.     var rely = 0;
  132.  
  133.     function showit(){
  134.         recalculate(event.x,event.y);
  135.     }
  136.    
  137.     function showitMOZ(e){
  138.         recalculate(e.pageX,e.pageY);
  139.         e.stopPropagation();   
  140.     }
  141.    
  142.     if (!document.all){
  143.         document.getElementById('myimage').addEventListener("click", showitMOZ, true);
  144.     }
  145.     else
  146.     {
  147.         IE=true;
  148.         document.getElementById('myimage').onclick=showit;
  149.         // will not work: document.getElementById('myimage').addEventListener("click", showit, true);
  150.     }
  151.     function recalculate(x,y){
  152.         var xi = findPosX('myimage');
  153.         var yi = findPosY('myimage');
  154.         if(IE){xi=xi-document.body.scrollLeft ;yi=yi-document.body.scrollTop ;}
  155.         if(x > xi && x < xi+sizex && y > yi && y < yi+sizey){
  156.             xi=x - xi;yi=y - yi;
  157.             relx=px2x(xi);
  158.             rely=px2y(yi);
  159.             relx=(Math.round(rounding*relx))/rounding;
  160.             rely=(Math.round(rounding*rely))/rounding;
  161.             // XHTML 1.0 needs "px"
  162.             if(IE){
  163.                 document.getElementById('mouse_coords').style.top = y+6+document.body.scrollTop+'px';
  164.                 document.getElementById('mouse_coords').style.left = x+6+document.body.scrollLeft+'px';
  165.                 document.getElementById('mouse_dot_ie').style.top = y-4+document.body.scrollTop+'px';
  166.                 document.getElementById('mouse_dot_ie').style.left = x-4+document.body.scrollLeft+'px';            
  167.                 document.getElementById('mouse_dot_ie').style.display = "block";
  168.             }else{
  169.                 document.getElementById('mouse_coords').style.top = y+6+'px';
  170.                 document.getElementById('mouse_coords').style.left = x+6+'px';      
  171.                 document.getElementById('mouse_dot_w3c').style.top = y-3+'px';
  172.                 document.getElementById('mouse_dot_w3c').style.left = x-3+'px';            
  173.                 document.getElementById('mouse_dot_w3c').style.display = "block";
  174.             }
  175.             document.getElementById('mouse_coords').innerHTML='<b>('+relx+':'+rely+')</b>';
  176.         }
  177.     }
  178.    
  179.     function findPosX(i){
  180.         var obj = document.getElementById(i);
  181.         var curleft = 0;
  182.         if(obj.offsetParent){
  183.             while(1){
  184.                 curleft += obj.offsetLeft;
  185.                 if(!obj.offsetParent){break;}
  186.                 obj = obj.offsetParent;
  187.             }
  188.         }
  189.         else
  190.         {
  191.             if(obj.x){
  192.                 curleft += obj.x;
  193.             }
  194.         }
  195.         return curleft;
  196.     }
  197.  
  198.     function findPosY(i){
  199.         var obj = document.getElementById(i);
  200.         var curtop = 0;
  201.         if(obj.offsetParent){
  202.             while(1){
  203.                 curtop += obj.offsetTop;
  204.                 if(!obj.offsetParent){break;}
  205.                 obj = obj.offsetParent;
  206.             }
  207.         }
  208.         else
  209.         {
  210.             if(obj.y){
  211.                 curtop += obj.y;
  212.             }
  213.         }
  214.         return curtop;
  215.     }
  216.    
  217.     function px2x(px){ //pixel to x-coords
  218.         var X = eval(px*(xmax - xmin)/sizex + xmin);
  219.         return X;
  220.     }
  221.    
  222.     function px2y(py){ // pixel to y-coords
  223.         var Y = eval(ymax -  py*(ymax - ymin)/sizey);
  224.         return Y;
  225.     }
  226. //]]>
  227. </script>
  228.  
  229. !exit
  230.