API tools faq
paste
Guest User

Untitled

a guest
Aug 1st, 2012
101
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
jQuery 8.05 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2.   <head>
  3.     <title>Michael's Testery</title>
  4.     <link rel="stylesheet" type="text/css" href="../../assets/mathquill/mathquill.css" />
  5.     <link rel="stylesheet" type="text/css" href="../../assets/jquery/ui.themes/base/jquery.ui.theme.css" />
  6.     <link rel="stylesheet" type="text/css" href="../../assets/jquery/ui.themes/base/jquery.ui.button.css" />
  7.     <link rel="stylesheet" type="text/css" href="../../assets/wysiwyg/jquery.wysiwyg.css" />
  8.     <link rel="stylesheet" type="text/css" href="../../modules/misc/testeryStyle.css" />
  9.     <script type="text/javascript" src="../../assets/jquery/jquery.js"></script>
  10.     <script type="text/javascript" src="../../assets/jquery/jquery.ui.js"></script>
  11.     <script type="text/javascript" src="../../assets/wysiwyg/jquery.wysiwyg.js"></script>
  12.     <script type="text/javascript" src="../../assets/wysiwyg/controls/wysiwyg.image.js"></script>
  13.     <script type="text/javascript" src="../../assets/wysiwyg/controls/wysiwyg.link.js"></script>
  14.     <script type="text/javascript" src="../../assets/wysiwyg/controls/wysiwyg.table.js"></script>
  15.     <script type="text/javascript" src="../../assets/wysiwyg/controls/wysiwyg.image.js"></script>
  16.     <script type="text/javascript" src="../../assets/mathquill/mathquill.js"></script>
  17.     <script type="text/javascript">
  18.       function editFunctionImg(event, img){
  19.         event.stopPropagation();
  20.         $("#feditor").mathquill('latex', $(img).attr("alt"));
  21.         $("#fwysiwyg").data("img", $(img)).dialog("open");
  22.       }
  23.       $(function(){
  24.         $("#symbols").buttonset();
  25.         $("#jwysiwyg").dialog({
  26.           title: "Text Editor",
  27.           width: 700,
  28.           height: 300,
  29.           autoOpen: false,
  30.           dialogClass: 'no-close',
  31.           resizable: false,
  32.           open: function(event, ui) { $("#wysiwyg").wysiwyg("setContent", $(this).data("caller").html()); },
  33.           buttons: {
  34.             Ok: function(){
  35.               $(this).data("caller").html($("#wysiwyg").wysiwyg("getContent"));
  36.               $(this).dialog("close");
  37.             }
  38.           }
  39.         });
  40.         $("#fwysiwyg").dialog({
  41.           title: "Formula Editor",
  42.           width: 330,
  43.           height: 190,
  44.           autoOpen: false,
  45.           dialogClass: 'no-close',
  46.           resizable: false,
  47.           zIndex: 1001,
  48.           open: function(event, ui) { $("#feditor").focus(); },
  49.           buttons: {
  50.             Ok: function(){
  51.               $.post("latexrender/latex2image.php", { latex: $("#feditor").mathquill('latex') },
  52.                 function(data){
  53.                   if($("#fwysiwyg").data("img")===undefined){
  54.                     $("#wysiwyg").wysiwyg("insertImage", $(data).attr("src"), { "alt": $(data).attr("alt"), "onclick": 'parent.editFunctionImg(event, this)'});
  55.                   }else{
  56.                     $("#fwysiwyg").data("img").attr("src", $(data).attr("src")).attr("alt", $(data).attr("alt"));
  57.                   }
  58.                   $("#fwysiwyg").removeData("img");
  59.                   $("#fwysiwyg").dialog("close");
  60.                 }
  61.               );
  62.             }
  63.           }
  64.         });
  65.         $("#wysiwyg").wysiwyg({
  66.           iFrameClass: "wysiwyg_frame",
  67.           rmUnusedControls: true,
  68.           controls: {
  69.             bold : {visible : true},
  70.             italic : {visible : true},
  71.             strikeThrough : {visible : true},
  72.             underline : {visible : true},
  73.             justifyLeft : {visible : true},
  74.             justifyCenter : {visible : true},
  75.             justifyRight : {visible : true},
  76.             justifyFull : {visible : true},
  77.             indent : {visible : true},
  78.             outdent : {visible : true},
  79.             subscript : {visible : true},
  80.             superscript : {visible : true},
  81.             undo : {visible : true},
  82.             redo : {visible : true},
  83.             insertOrderedList : {visible : true},
  84.             insertUnorderedList : {visible : true},
  85.             insertImage : {visible : true},
  86.             h1 : {visible : true},
  87.             h2 : {visible : true},
  88.             h3 : {visible : true},
  89.             increaseFontSize : {visible : true},
  90.             decreaseFontSize : {visible : true},
  91.             html : {visible : true},
  92.             insertTable : {visible : true}
  93.           }
  94.         });
  95.         $("#jwysiwyg").on("click", "#formulaEditor", function(){
  96.           $("#fwysiwyg").dialog("open");
  97.         });
  98.         $("#jwysiwyg .wysiwyg .toolbar").append('<li id="formulaEditor" role="menuitem" unselectable="on" class="formulaEditor" title="Open Formula Editor">Formula Editor</li>');
  99.         $(".input").click(function(){
  100.           $("#jwysiwyg").data("caller", $(this)).dialog("open");
  101.         });
  102.         $("#question_add").click(function(){
  103.           var json = {};
  104.           json[$("#Question .answer").attr("name")] = $("#Question .answer").html();
  105.           $("#"+$("#question_type").find('option:selected').val()+" .answer").each(function(){
  106.             if($(this).html().trim().length){
  107.               json[$(this).attr("name")] = $(this).html();
  108.             }
  109.           });
  110.           alert(JSON.stringify(json));
  111.         });
  112.         $("#question_type").change(function(){
  113.           $("#question_add").show();
  114.           $(".question_customizer").hide();
  115.           $("#"+$(this).find('option:selected').val()).show();
  116.         });
  117.         $("button").click(function(){
  118.           $("#feditor").mathquill("cmd", this.id);
  119.           $("#feditor").focus();
  120.         });
  121.       });
  122.     </script>
  123.   </head>
  124.   <body>
  125.     <div id="jwysiwyg">
  126.       <textarea id="wysiwyg"></textarea>
  127.     </div>
  128.     <div id="fwysiwyg">
  129.       <span id="feditor" class="mathquill-editable"></span>
  130.       <div id="symbols">
  131.         <?php
  132.           $symbols = array(
  133.             "sqrt"     => "&radic;",
  134.             "pm"       => "&plusmn;",
  135.             "neq"      => "&ne;",
  136.             "leq"      => "&le;",
  137.             "geq"      => "&ge;",
  138.             "approx"   => "&asymp;"
  139.           );
  140.           foreach($symbols as $id => $value){
  141.             echo '<button id="'.$id.'">'.$value.'</button>';
  142.           }
  143.         ?>
  144.       </div>
  145.     </div>
  146.     <div id="theForm">
  147.       <form id="Question">
  148.         Question Text: <div name="q_text" class="answer input"></div><br />
  149.         Question Type:
  150.           <select id="question_type">
  151.             <option value="GR" name="q_type">Gridded Response</option>
  152.             <option value="MC" name="q_type">Multiple Choice</option>
  153.             <option value="ER" name="q_type">Extended Response</option>
  154.             <option value="SR" name="q_type">Short Response</option>
  155.             <option value="FR" name="q_type">Fraction Response</option>
  156.             <option value="TF" name="q_type">True/False</option>
  157.           </select><br />
  158.       </form>
  159.       <form id="GR" class="question_customizer">
  160.         Correct Answer: <input name="gr_c_answer" class="answer" type="text" /><br />
  161.       </form>
  162.       <form id="MC" class="question_customizer">
  163.         Correct Answer: <div name="mc_c_answer" class="answer input"></div><br />
  164.         Incorrect Answer 1: <div name="mc_i_answer1" class="answer input"></div><br />
  165.         Incorrect Answer 2: <div name="mc_i_answer2" class="answer input"></div><br />
  166.         Incorrect Answer 3: <div name="mc_i_answer3" class="answer input"></div><br />
  167.       </form>
  168.       <form id="ER" class="question_customizer">
  169.         Suggestion/Hint: <div name="er_suggestion" class="answer input"></div>
  170.       </form>
  171.       <form id="SR" class="question_customizer">
  172.         Suggestion/Hint: <div name="sr_suggestion" class="answer input"></div>
  173.       </form>
  174.       <form id="FR" class="question_customizer">
  175.         Correct Answer: <input name="fr_c_answer" class="answer" type="text" /><br />
  176.       </form>
  177.       <form id="TF" class="question_customizer">
  178.         Correct Answer: <input type="radio" name="tf_answer" value="TRUE" />True&nbsp;&nbsp;<input type="radio" name="tf_answer" value="FALSE" />False<br />
  179.       </form>
  180.       <input type="button" value="Add Question" id="question_add" />
  181.     </div>
  182.   </body>
  183. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!