Skip to content
Snippets Groups Projects
Commit 4f08a5c4 authored by Beni Cherniavsky-Paskin's avatar Beni Cherniavsky-Paskin Committed by Marijn Haverbeke
Browse files

[bidi demo] Expose global direction and rtlMoveVisually

parent 3c18925b
No related branches found
No related tags found
No related merge requests found
......@@ -8,8 +8,9 @@
<script src="../lib/codemirror.js"></script>
<script src="../mode/xml/xml.js"></script>
<style type="text/css">
.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
</style>
.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
fieldset {border: none}
</style>
<div id=nav>
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../doc/logo.png"></a>
......@@ -25,8 +26,8 @@
<article>
<h2>Bi-directional Text Demo</h2>
<form><textarea id="code" name="code"><!-- Piece of the CodeMirror manual, 'translated' into Arabic by
Google Translate -->
<form><textarea id="code" name="code"><!-- Piece of the CodeMirror manual, 'translated' into Arabic by Google Translate -->
<!-- قطعة من دليل CodeMirror، "ترجم" إلى العربية بواسطة جوجل ترجمة -->
<dl>
<dt id=option_value><code>value (string or Doc)</code></dt>
......@@ -53,13 +54,37 @@
سيتم تعيين كل من <code>cm-s-foo</code> و <code>cm-s-bar</code>
الطبقات إلى المحرر.</dd>
</dl>
</textarea></form>
</textarea>
<fieldset>
Editor default direction:
<input type="radio" id="ltr" name="direction"/><label for="ltr">LTR</label>
<input type="radio" id="rtl" name="direction"/><label for="rtl">RTL</label>
</fieldset>
<fieldset>
<input type="checkbox" id="rtlMoveVisually"/><label for="rtlMoveVisually">Use visual order for arrow key movement.</label>
</fieldset>
</form>
<script>
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
mode: "text/html",
lineNumbers: true
lineNumbers: true,
lineWrapping: true,
direction: "rtl"
});
var dirRadios = {ltr: document.getElementById("ltr"),
rtl: document.getElementById("rtl")};
dirRadios[editor.getOption("direction")].checked = true;
dirRadios["rtl"].onchange = dirRadios["ltr"].onchange = function() {
editor.setOption("direction", dirRadios["rtl"].checked ? "rtl" : "ltr");
};
var moveCheckbox = document.getElementById("rtlMoveVisually");
moveCheckbox.checked = editor.getOption("rtlMoveVisually");
moveCheckbox.onchange = function() {
editor.setOption("rtlMoveVisually", moveCheckbox.checked);
};
</script>
<p>Demonstration of bi-directional text support. See
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment