add setting to toggle fold mode

demo/kitchen-sink/demo.js

@@ -283,6 +283,7 @@ var docEl = document.getElementById("doc");
 var modeEl = document.getElementById("mode");
 var wrapModeEl = document.getElementById("soft_wrap");
 var themeEl = document.getElementById("theme");
+var foldingEl = document.getElementById("folding");
 var selectStyleEl = document.getElementById("select_style");
 var highlightActiveEl = document.getElementById("highlight_active");
 var showHiddenEl = document.getElementById("show_hidden");
@@ -324,6 +325,8 @@ function updateUIEditorOptions() {
     docEl.value = session.name;
     modeEl.value = session.getMode().name || "text";
 
+    session.setFoldStyle(foldingEl.value);
+
     if (!session.getUseWrapMode()) {
         wrapModeEl.value = "off";
     } else {
@@ -365,6 +368,10 @@ bindDropdown("fontsize", function(value) {
     env.split.setFontSize(value);
 });
 
+bindDropdown("folding", function(value) {
+    env.editor.getSession().setFoldStyle(value);
+});
+
 bindDropdown("soft_wrap", function(value) {
     var session = env.editor.getSession();
     var renderer = env.editor.renderer;
@@ -496,7 +503,7 @@ event.addListener(container, "drop", function(e) {
 
     if (window.FileReader) {
         var reader = new FileReader();
-        reader.onload = function(e) {
+        reader.onload = function() {
             env.editor.getSelection().selectAll();
 
             var mode = modesByName.text;

kitchen-sink.html

@@ -91,6 +91,17 @@
         </select>
       </td>
     </tr>
+    <tr>
+      <td>
+        <label for="folding">Code Folding</label>
+      </td><td>
+        <select id="folding" size="1">
+          <option value="manual">manual</option>
+          <option value="markbegin" selected="selected">mark begin</option>
+          <option value="markbeginend">mark begin and end</option>
+        </select>
+      </td>
+    </tr>
     <tr>
       <td>
         <label for="select_style">Full Line Selection</label>

lib/ace/edit_session/folding.js

@@ -596,22 +596,23 @@ function Folding() {
             var re = new RegExp(token.type.replace(/\..*/, "\\."));
             do {
                 token = iterator.stepBackward();
-            } while(token && re.test(token.type))
+            } while(token && re.test(token.type));
 
             iterator.stepForward();
             range.start.row = iterator.getCurrentTokenRow();
             range.start.column = iterator.getCurrentTokenColumn() + 2;
 
-            var iterator = new TokenIterator(this, row, column);
+            iterator = new TokenIterator(this, row, column);
 
             do {
                 token = iterator.stepForward();
-            } while(token && re.test(token.type))
+            } while(token && re.test(token.type));
+            
             token = iterator.stepBackward();
 
             range.end.row = iterator.getCurrentTokenRow();
             range.end.column = iterator.getCurrentTokenColumn() + token.value.length - 1;
-            return range
+            return range;
         }
     };
 
@@ -631,28 +632,51 @@ function Folding() {
                 this.addFold("...", range);
             } catch(e) {}
         }
-    }
+    };
+    
+    this.$foldStyles = {
+        "manual": 1,
+        "markbegin": 1,
+        "markbeginend": 1
+    };
+    this.$foldStyle = "markbegin";
+    this.setFoldStyle = function(style) {
+        if (!this.$foldStyles[style])
+            throw new Error("invalid fold style: " + style + "[" + Object.keys(this.$foldStyles).join(", ") + "]");
+        
+        if (this.$foldStyle == style)
+            return;
+
+        this.$foldStyle = style;
+        
+        // reset folding
+        var mode = this.$foldMode;
+        this.$setFolding(null);
+        this.$setFolding(mode);
+    };
 
     // structured folding
     this.$setFolding = function(foldMode) {
-        
         if (this.$foldMode == foldMode)
             return;
+            
         this.$foldMode = foldMode;
         
         this.removeListener('change', this.$updateFoldWidgets);
+        this._emit("changeAnnotation");
         
-        if (!foldMode) {
+        if (!foldMode || this.$foldStyle == "manual") {
             this.foldWidgets = null;
             return;
         }
         
         this.foldWidgets = [];
-        this.getFoldWidget = foldMode.getFoldWidget.bind(foldMode, this);
+        this.getFoldWidget = foldMode.getFoldWidget.bind(foldMode, this, this.$foldStyle);
-        this.getFoldWidgetRange = foldMode.getFoldWidgetRange.bind(foldMode, this);
+        this.getFoldWidgetRange = foldMode.getFoldWidgetRange.bind(foldMode, this, this.$foldStyle);
         
         this.$updateFoldWidgets = this.updateFoldWidgets.bind(this);
         this.on('change', this.$updateFoldWidgets);
+        
     };
 
     this.onFoldWidgetClick = function(row, e) {

lib/ace/editor.js

@@ -314,7 +314,7 @@ var Editor = function(renderer, session) {
         this.renderer.updateLines(rows.first, rows.last);
     };
 
-    this.onCursorChange = function(e) {
+    this.onCursorChange = function() {
         this.renderer.updateCursor();
 
         if (!this.$blockScrolling) {

lib/ace/mode/folding/cstyle.js

@@ -49,7 +49,7 @@ oop.inherits(FoldMode, BaseFoldMode);
     this.foldingStartMarker = /(\{|\[)[^\}\]]*$|^\s*(\/\*)/;
     this.foldingStopMarker = /^[^\[\{]*(\}|\])|^[\s\*]*(\*\/)/;
     
-    this.getFoldWidgetRange = function(session, row) {
+    this.getFoldWidgetRange = function(session, foldStyle, row) {
         var line = session.getLine(row);
         var match = line.match(this.foldingStartMarker);
         if (match) {

lib/ace/mode/folding/fold_mode.js

@@ -49,28 +49,28 @@ var FoldMode = exports.FoldMode = function() {};
     this.foldingStopMarker = null;
 
     // must return "" if there's no fold, to enable caching
-    this.getFoldWidget = function(session, row) {
+    this.getFoldWidget = function(session, foldStyle, row) {
         if (this.foldingStartMarker) {
             if (this.foldingStopMarker) {
                 // rewrite getFoldWidget so the check is only performed once
                 FoldMode.prototype.getFoldWidget = this.$testBoth;
-                return this.$testBoth(session, row);
+                return this.$testBoth(session, foldStyle, row);
             }
             else {
                 // rewrite getFoldWidget so the check is only performed once
                 FoldMode.prototype.getFoldWidget = this.$testStart;
-                return this.$testStart(session, row);
+                return this.$testStart(session, foldStyle, row);
             }
         }
         else
             return "";
     };
     
-    this.getFoldWidgetRange = function(session, row) {
+    this.getFoldWidgetRange = function(session, foldStyle, row) {
         return null;
     };
 
-    this.indentationBlock = function(session, row) {
+    this.indentationBlock = function(session, foldStyle, row) {
         var re = /^\s*/;
         var startRow = row;
         var endRow = row;
@@ -96,17 +96,17 @@ var FoldMode = exports.FoldMode = function() {};
         }
     };
 
-    this.$testStart = function(session, row) {
+    this.$testStart = function(session, foldStyle, row) {
         if (this.foldingStartMarker.test(session.getLine(row)))
             return "start";
         return "";
     };
     
-    this.$testBoth = function(session, row) {
+    this.$testBoth = function(session, foldStyle, row) {
         var line = session.getLine(row);
         if (this.foldingStartMarker.test(line))
             return "start";
-        if(this.foldingStopMarker.test(line))
+        if (foldStyle == "markbeginend" && this.foldingStopMarker.test(line))
             return "end";
         return "";
     };

lib/ace/mode/folding/mixed.js

@@ -57,29 +57,29 @@ oop.inherits(FoldMode, BaseFoldMode);
         return null;
     };
     
-    this.$tryMode = function(state, session, row) {
+    this.$tryMode = function(state, session, foldStyle, row) {
         var mode = this.$getMode(state);
-        return (mode ? mode.getFoldWidget(session, row) : "");
+        return (mode ? mode.getFoldWidget(session, foldStyle, row) : "");
     };
 
-    this.getFoldWidget = function(session, row) {
+    this.getFoldWidget = function(session, foldStyle, row) {
         return (
-            this.$tryMode(session.getState(row-1), session, row) ||
+            this.$tryMode(session.getState(row-1), session, foldStyle, row) ||
-            this.$tryMode(session.getState(row), session, row) ||
+            this.$tryMode(session.getState(row), session, foldStyle, row) ||
-            this.defaultMode.getFoldWidget(session, row)
+            this.defaultMode.getFoldWidget(session, foldStyle, row)
         );
     };
 
-    this.getFoldWidgetRange = function(session, row) {
+    this.getFoldWidgetRange = function(session, foldStyle, row) {
         var mode = this.$getMode(session.getState(row-1));
         
-        if (!mode || !mode.getFoldWidget(session, row))
+        if (!mode || !mode.getFoldWidget(session, foldStyle, row))
             mode = this.$getMode(session.getState(row));
         
-        if (!mode || !mode.getFoldWidget(session, row))
+        if (!mode || !mode.getFoldWidget(session, foldStyle, row))
             mode = this.defaultMode;
         
-        return mode.getFoldWidgetRange(session, row);
+        return mode.getFoldWidgetRange(session, foldStyle, row);
     };
 
 }).call(FoldMode.prototype);

lib/ace/mode/folding/xml.js

@@ -50,7 +50,7 @@ oop.inherits(FoldMode, BaseFoldMode);
 
 (function() {
 
-    this.getFoldWidget = function(session, row) {
+    this.getFoldWidget = function(session, foldStyle, row) {
         var tags = session.getTokens(row, row)[0].tokens
             .filter(function(token) {
                 return token.type === "meta.tag";
@@ -77,7 +77,7 @@ oop.inherits(FoldMode, BaseFoldMode);
         return "start";
     };
         
-    this.getFoldWidgetRange = function(session, row) {
+    this.getFoldWidgetRange = function(session, foldStyle, row) {
         var start, end;
         var stack = [];