Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CodeMirror, how fold all the code

With code mirror, we can fold the code. I would like fold all the code with brace. I found this method

How i can fold the entire code, this is my HTML script :

window.onload = function() {
  var te = document.getElementById("code");
  var sc = document.getElementById("script");

  var te_clike = document.getElementById("code-clike");

  window.editor_clike = CodeMirror.fromTextArea(te_clike, {
    mode: "text/x-csharp",
    lineNumbers: true,
    extraKeys: {"Ctrl-Q": function(cm){ cm.foldCode(cm.getCursor()); }},
    foldGutter: true,
    readOnly: true,
    gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
  });

};

Thanks you for your help...

like image 588
virginie Avatar asked Mar 09 '17 13:03

virginie


2 Answers

There is also a function designed to do it for you, for example:

editor.setOption("extraKeys", {
  "Ctrl-Y": cm => CodeMirror.commands.foldAll(cm),
  "Ctrl-I": cm => CodeMirror.commands.unfoldAll(cm),
})
like image 89
Nicolas Després Avatar answered Oct 23 '22 22:10

Nicolas Després


CodeMirror has a foldCode plugin which enables a foldCode() method. Reference can be found here: https://codemirror.net/doc/manual.html#addon_foldcode

You can then loop through all the lines and call that function to fold the code at that particular line, like the solution here: https://groups.google.com/forum/#!msg/CodeMirror/u3IYL-5g0t4/lmK8XuTxbdQJ

cm.operation(function() { 
   for (var l = cm.firstLine(); l <= cm.lastLine(); ++l) 
     cm.foldCode({line: l, ch: 0}, null, "fold"); 
}); 

where cm is the CodeMirror instance.

like image 7
Felix Guo Avatar answered Oct 23 '22 22:10

Felix Guo