Merge pull request #268 from jviereck/split

Implementing split views, closes issue #35

demo/demo.js

@@ -152,9 +152,23 @@ exports.launch = function(env) {
     docs.textile.setMode(new TextileMode());
     docs.textile.setUndoManager(new UndoManager());
 
+    // Add a "name" property to all docs
+    for (doc in docs) {
+        docs[doc].name = doc;
+    }
+
     var container = document.getElementById("editor");
     var cockpitInput = document.getElementById("cockpitInput");
-    env.editor = new Editor(new Renderer(container, theme));
+
+    // Splitting.
+    var Split = require("ace/split").Split;
+    var split = new Split(container, theme, 1);
+    env.editor = split.getEditor(0);
+    split.on("focus", function(editor) {
+        env.editor = editor;
+        updateUIEditorOptions();
+    });
+    env.split = split;
     window.env = env;
     window.ace = env.editor;
 
@@ -181,14 +195,36 @@ exports.launch = function(env) {
         return modes[modeEl.value];
     }
 
+    var docEl = document.getElementById("doc");
     var modeEl = document.getElementById("mode");
     var wrapModeEl = document.getElementById("soft_wrap");
+    var themeEl = document.getElementById("theme");
+    var selectStyleEl = document.getElementById("select_style");
+    var highlightActiveEl = document.getElementById("highlight_active");
+    var showHiddenEl = document.getElementById("show_hidden");
+    var showGutterEl = document.getElementById("show_gutter");
+    var showPrintMarginEl = document.getElementById("show_print_margin");
+    var highlightSelectedWordE = document.getElementById("highlight_selected_word");
+    var showHScrollEl = document.getElementById("show_hscroll");
+    var softTabEl = document.getElementById("soft_tab");
 
     bindDropdown("doc", function(value) {
         var doc = docs[value];
-        env.editor.setSession(doc);
+        var session = env.split.setSession(doc);
+        session.name = doc.name;
 
-        var mode = doc.getMode();
+        updateUIEditorOptions();
+
+        env.editor.focus();
+    });
+
+    function updateUIEditorOptions() {
+        var editor = env.editor;
+        var session = editor.session;
+
+        docEl.value = session.name;
+
+        var mode = session.getMode();
         if (mode instanceof JavaScriptMode) {
             modeEl.value = "javascript";
         }
@@ -238,13 +274,22 @@ exports.launch = function(env) {
             modeEl.value = "text";
         }
 
-        if (!doc.getUseWrapMode()) {
+        if (!session.getUseWrapMode()) {
             wrapModeEl.value = "off";
         } else {
-            wrapModeEl.value = doc.getWrapLimitRange().min || "free";
+            wrapModeEl.value = session.getWrapLimitRange().min || "free";
         }
-        env.editor.focus();
-    });
+
+        selectStyleEl.checked = editor.getSelectionStyle() == "line"
+        themeEl.value = editor.getTheme();
+        highlightActiveEl.checked = editor.getHighlightActiveLine();
+        showHiddenEl.checked = editor.getShowInvisibles();
+        showGutterEl.checked = editor.renderer.getShowGutter();
+        showPrintMarginEl.checked = editor.renderer.getShowPrintMargin();
+        highlightSelectedWordE.checked = editor.getHighlightSelectedWord();
+        showHScrollEl.checked = editor.renderer.getHScrollBarAlwaysVisible();
+        softTabEl.checked = session.getUseSoftTabs();
+    }
 
     bindDropdown("mode", function(value) {
         env.editor.getSession().setMode(modes[value] || modes.text);
@@ -259,7 +304,7 @@ exports.launch = function(env) {
     });
 
     bindDropdown("fontsize", function(value) {
-        document.getElementById("editor").style.fontSize = value;
+        env.split.setFontSize(value);
     });
 
     bindDropdown("soft_wrap", function(value) {
@@ -320,6 +365,31 @@ exports.launch = function(env) {
         env.editor.getSession().setUseSoftTabs(checked);
     });
 
+    var secondSession = null;
+    bindDropdown("split", function(value) {
+        var sp = env.split;
+        if (value == "none") {
+            if (sp.getSplits() == 2) {
+                secondSession = sp.getEditor(1).session;
+            }
+            sp.setSplits(1);
+        } else {
+            var newEditor = (sp.getSplits() == 1);
+            if (value == "below") {
+                sp.setOriantation(sp.BELOW);
+            } else {
+                sp.setOriantation(sp.BESIDE);
+            }
+            sp.setSplits(2);
+
+            if (newEditor) {
+                var session = secondSession || sp.getEditor(0).session;
+                var newSession = sp.setSession(session, 1);
+                newSession.name = session.name;
+            }
+        }
+    });
+
     function bindCheckbox(id, callback) {
         var el = document.getElementById(id);
         var onCheck = function() {
@@ -343,7 +413,8 @@ exports.launch = function(env) {
         container.style.width = width + "px";
         cockpitInput.style.width = width + "px";
         container.style.height = (document.documentElement.clientHeight - 22) + "px";
-        env.editor.resize();
+        env.split.resize();
+//        env.editor.resize();
     };
 
     window.onresize = onResize;