--- loncom/html/adm/LC_math_editor/test.html	2014/09/24 18:14:31	1.1
+++ loncom/html/adm/LC_math_editor/test.html	2015/02/25 20:53:59	1.3
@@ -6,8 +6,39 @@
     <style>
         div.eqnbox { margin: 1em }
         textarea.math { font-family: monospace; height: 3em; width: 100%; }
-        span.math-error { border: solid 1px red; min-width: 1px; }
     </style>
+    <script>
+      function addField() {
+        var div = document.createElement('div');
+        div.classList.add('eqnbox');
+        var input = document.createElement('input');
+        input.classList.add('math');
+        input.setAttribute('data-implicit_operators', 'true');
+        input.setAttribute('data-unit_mode', 'true');
+        input.setAttribute('data-constants', 'c, pi, e, hbar, amu');
+        input.setAttribute('spellcheck', 'false');
+        div.appendChild(input);
+        var removeb = document.createElement('button');
+        removeb.appendChild(document.createTextNode('remove'));
+        removeb.addEventListener('click', function(e) {
+            div.parentNode.removeChild(div);
+            initEditors();
+        }, false);
+        div.appendChild(removeb);
+        var modeb = document.createElement('button');
+        modeb.appendChild(document.createTextNode('switch mode'));
+        modeb.addEventListener('click', function(e) {
+            if (input.getAttribute('data-unit_mode') == 'true')
+                input.setAttribute('data-unit_mode', 'false');
+            else
+                input.setAttribute('data-unit_mode', 'true');
+            initEditors();
+        }, false);
+        div.appendChild(modeb);
+        document.body.appendChild(div);
+        initEditors();
+      }
+    </script>
 </head>
 <body>
     <p>Strict syntax, symbolic mode:</p>
@@ -27,8 +58,16 @@
         <textarea class="math" data-implicit_operators="true" data-unit_mode="true" data-constants="c, pi, e, hbar, amu" spellcheck="false" autofocus="autofocus"></textarea>
     </div>
     <div class="eqnbox">
-        Test in a field <input class="math" data-implicit_operators="true" spellcheck="false" autofocus="autofocus"></textarea> with text around (Lax syntax, symbolic mode)
+        Test in a field <input class="math" data-implicit_operators="true" spellcheck="false" autofocus="autofocus"> with text around (Lax syntax, symbolic mode)
+    </div>
+    <div style="position: absolute; left: 500px; top: 400px; background: rgba(200, 255, 200, 0.7)">
+        inside an absolute position div (lax symbolic)<br>
+        <textarea class="math" data-implicit_operators="true" spellcheck="false" autofocus="autofocus"></textarea>
     </div>
+    <p><button onclick="addField();">click to add a field</button></p>
+    <p>static math on a line: <span class="math" data-implicit_operators="true">2x/(3y)</span></p>
+    <p>static math as a block:</p>
+    <div class="math" data-implicit_operators="true">2x/(3y)</div>
     <script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=MML_HTMLorMML"></script>
     <script src="src/definitions.js"></script>
     <script src="src/enode.js"></script>
@@ -40,7 +79,8 @@
     <script src="src/ui.js"></script>
     <script>
         window.addEventListener('load', function(e) {
-            initEditors(); // will be LCMATH.init_editors() with the minimized version
+            initEditors(); // will be LCMATH.initEditors() with the minimized version
+            updateMathSpanAndDiv(); // will be LCMATH.updateMathSpanAndDiv()
         }, false);
     </script>
 </body>
