Ace - The High Performance Code Editor for the Web

Ace はJavaScriptで記述された、Webシステムに組み込み可能なコードエディタです。

本家: Ace - The High Performance Code Editor for the Web
ソースコード: GitHub - ajaxorg/ace: Ace (Ajax.org Cloud9 Editor)

  <script src='/_media/javascript/ace/src-noconflict/ace.js'></script>
  <script src="/_media/javascript/ace/src-noconflict/ext-static_highlight.js"></script>
  <!--[if lt IE 9]>
    <script src="/_media/javascript/ace/src-noconflict/ext-old_ie.js"></script>
  <![endif]-->
  <script src="/_media/javascript/ace/src-noconflict/mode-json.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/mode-html.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/mode-javascript.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/ext-emmet.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/ext-language_tools.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/snippets/text.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/snippets/javascript.js"></script>
  <script src="/_media/javascript/ace/src-noconflict/snippets/html.js"></script>
  <script>
    jQuery(function($) {
      const editor = ace.edit("ace_editor");
      editor.setTheme("ace/theme/chrome");
      editor.session.setMode("ace/mode/javascript");
      const lines = editors[i].getSession().getDocument().getLength();
      editor.setOptions({maxLines: lines});
    });
  </script>

ビルド済みファイルを取得する。

$ git clone https://github.com/ajaxorg/ace-builds.git

Ace をソースからビルドするには node.js が必要です。

ソースを取得する。

$ git clone git://github.com/ajaxorg/ace.git

npm (node package manager) で Ace のビルドに必要な依存パッケージをインストールする。

$ cd ace
$ npm install

※npm は ace ディレクトリ直下の package.json を参照して自動でインストールしてくれます。

Ace をビルドする。

$ make build

ビルドが終わると実行に必要なファイル群が ace/build に生成されます。

$ cd ace
$ git pull
$ make build

  //#region [Ace Editor fold all region]
  isCommentFold = (line) => {
    var isAFold = false;
    if (/^\s*(\/\*|\/\/)#?region\b/.test(line)) { isAFold = true; }
    if (/\/\/(.*)\{/.test(line)) { isAFold = true; }
    return isAFold;
  }
  ace.EditSession.prototype.foldAllRegion = function(startRow, endRow, depth) {
    if (depth == undefined)
       depth = 100000; // JSON.stringify doesn't hanle Infinity
    var foldWidgets = this.foldWidgets;
    if (!foldWidgets)
      return; // mode doesn't support folding
    endRow = endRow || this.getLength();
    startRow = startRow || 0;
    for (var row = startRow; row < endRow; row++) {
      if (foldWidgets[row] == null)
        foldWidgets[row] = this.getFoldWidget(row);
      if (foldWidgets[row] != "start")
        continue;
      if (!isCommentFold(this.getLine(row))) continue
      var range = this.getFoldWidgetRange(row);
      // sometimes range can be incompatible with existing fold
      // TODO change addFold to return null istead of throwing
      if (range && range.isMultiLine()
          && range.end.row <= endRow
          && range.start.row >= startRow) {
        row = range.end.row;
        try {
          // addFold can change the range
          var fold = this.addFold("...", range);
          if (fold)
            fold.collapseChildren = depth;
        } catch(ex) {}
      }
    }
  };
  //#endregion