CodeMirror 格式化内容和内容选择


CodeMirror 设置内容后自动格式化

参考:

https://stackoverflow.com/questions/25109809/codemirror-auto-format-after-setvalue

https://codemirror.net/2/demo/formatting.html

CodeMirror格式化插件JS

https://codemirror.net/2/lib/util/formatting.js

在formatting.js基础上扩展出来一个格式化所有文本的方法

JavaScript 全选
(function() {

  CodeMirror.extendMode("css", {
    commentStart: "/*",
    commentEnd: "*/",
    newlineAfterToken: function(type, content) {
      return /^[;{}]$/.test(content);
    }
  });

  CodeMirror.extendMode("javascript", {
    commentStart: "/*",
    commentEnd: "*/",
    // FIXME semicolons inside of for
    newlineAfterToken: function(type, content, textAfter, state) {
      if (this.jsonMode) {
        return /^[\[,{]$/.test(content) || /^}/.test(textAfter);
      } else {
        if (content == ";" && state.lexical && state.lexical.type == ")") return false;
        return /^[;{}]$/.test(content) && !/^;/.test(textAfter);
      }
    }
  });

  CodeMirror.extendMode("xml", {
    commentStart: "<!--",
    commentEnd: "-->",
    newlineAfterToken: function(type, content, textAfter) {
      return type == "tag" && />$/.test(content) || /^</.test(textAfter);
    }
  });

  // Comment/uncomment the specified range
  CodeMirror.defineExtension("commentRange", function (isComment, from, to) {
    var cm = this, curMode = CodeMirror.innerMode(cm.getMode(), cm.getTokenAt(from).state).mode;
    cm.operation(function() {
      if (isComment) { // Comment range
        cm.replaceRange(curMode.commentEnd, to);
        cm.replaceRange(curMode.commentStart, from);
        if (from.line == to.line && from.ch == to.ch) // An empty comment inserted - put cursor inside
          cm.setCursor(from.line, from.ch + curMode.commentStart.length);
      } else { // Uncomment range
        var selText = cm.getRange(from, to);
        var startIndex = selText.indexOf(curMode.commentStart);
        var endIndex = selText.lastIndexOf(curMode.commentEnd);
        if (startIndex > -1 && endIndex > -1 && endIndex > startIndex) {
          // Take string till comment start
          selText = selText.substr(0, startIndex)
          // From comment start till comment end
            + selText.substring(startIndex + curMode.commentStart.length, endIndex)
          // From comment end till string end
            + selText.substr(endIndex + curMode.commentEnd.length);
        }
        cm.replaceRange(selText, from, to);
      }
    });
  });

  // Applies automatic mode-aware indentation to the specified range
  CodeMirror.defineExtension("autoIndentRange", function (from, to) {
    var cmInstance = this;
    this.operation(function () {
      for (var i = from.line; i <= to.line; i++) {
        cmInstance.indentLine(i, "smart");
      }
    });
  });

  // Applies automatic formatting to the specified range
  CodeMirror.defineExtension("autoFormatRange", function (from, to) {
    var cm = this;
    var outer = cm.getMode(), text = cm.getRange(from, to).split("\n");
    var state = CodeMirror.copyState(outer, cm.getTokenAt(from).state);
    var tabSize = cm.getOption("tabSize");

    var out = "", lines = 0, atSol = from.ch == 0;
    function newline() {
      out += "\n";
      atSol = true;
      ++lines;
    }

    for (var i = 0; i < text.length; ++i) {
      var stream = new CodeMirror.StringStream(text[i], tabSize);
      while (!stream.eol()) {
        var inner = CodeMirror.innerMode(outer, state);
        var style = outer.token(stream, state), cur = stream.current();
        stream.start = stream.pos;
        if (!atSol || /\S/.test(cur)) {
          out += cur;
          atSol = false;
        }
        if (!atSol && inner.mode.newlineAfterToken &&
            inner.mode.newlineAfterToken(style, cur, stream.string.slice(stream.pos) || text[i+1] || "", inner.state))
          newline();
      }
      if (!stream.pos && outer.blankLine) outer.blankLine(state);
      if (!atSol) newline();
    }

    cm.operation(function () {
      cm.replaceRange(out, from, to);
      for (var cur = from.line + 1, end = from.line + lines; cur <= end; ++cur)
        cm.indentLine(cur, "smart");
      cm.setSelection(from, cm.getCursor(false));
    });
  });
  // 2021年12月8日 10点08分 新增,支持格式化所有 Applies automatic formatting to the specified range
  CodeMirror.defineExtension("autoFormatRangeAll", function () {
    var cm = this;
	from = {line:editorPluginHtml.firstLine(),ch:0,sticky:null}
	to = {line:editorPluginHtml.lastLine(),ch:editorPluginHtml.getLine(editorPluginHtml.lastLine()).length,sticky:null}
    var outer = cm.getMode(), text = cm.getRange(from, to).split("\n");
    var state = CodeMirror.copyState(outer, cm.getTokenAt(from).state);
    var tabSize = cm.getOption("tabSize");

    var out = "", lines = 0, atSol = from.ch == 0;
    function newline() {
      out += "\n";
      atSol = true;
      ++lines;
    }

    for (var i = 0; i < text.length; ++i) {
      var stream = new CodeMirror.StringStream(text[i], tabSize);
      while (!stream.eol()) {
        var inner = CodeMirror.innerMode(outer, state);
        var style = outer.token(stream, state), cur = stream.current();
        stream.start = stream.pos;
        if (!atSol || /\S/.test(cur)) {
          out += cur;
          atSol = false;
        }
        if (!atSol && inner.mode.newlineAfterToken &&
            inner.mode.newlineAfterToken(style, cur, stream.string.slice(stream.pos) || text[i+1] || "", inner.state))
          newline();
      }
      if (!stream.pos && outer.blankLine) outer.blankLine(state);
      if (!atSol) newline();
    }

    cm.operation(function () {
      cm.replaceRange(out, from, to);
      for (var cur = from.line + 1, end = from.line + lines; cur <= end; ++cur)
        cm.indentLine(cur, "smart");
      cm.setSelection(from, cm.getCursor(false));
    });
  });
})();

 

全选实现,selectAll.js

JavaScript 全选
(function() {
  // selectALL
  CodeMirror.defineExtension("selectALL", function () {
    var cm = this
    from = {line:editorPluginHtml.firstLine(),ch:0,sticky:null}
    to = {line:editorPluginHtml.lastLine(),ch:editorPluginHtml.getLine(editorPluginHtml.lastLine()).length,sticky:null}
    cm.setSelection(from,to)
  });
})();

 

版权声明:本文为YES开发框架网发布内容,转载请附上原文出处连接
管理员
上一篇:CodeMirror Razor支持
下一篇:JS生成一个随机字符串
评论列表

发表评论

评论内容
昵称:
关联文章

CodeMirror 格式化内容内容选择
Razor模板编辑高亮CodeMirror格式化JS-Beautify
CodeMirror行号内容重叠了
CodeMirror配合js-beautify格式化代码后,光标恢复到原来位置
WPF_15_格式化绑定的数据
CodeMirror Razor支持
ag-grid内容格式化显示 日期格式化
C# winform选择dll文件
dotnet 将自动代码格式化机器人带入团队 GitLab 平台
VSCode无法格式化python代码py文件的解决办法
JSON.stringify 输出格式化文本
YES-CMS内容管理系统 代码高亮配置
YES-CMS 内容管理系统介绍
页面内容防止复制的方案
ag-grid内容格式化显示 金额两位小数
C#格式化JSON字符串
web前端格式化缩进Razor代码,razor format
C# Winform选择文件夹目录
省市区选择组件
C# Newtonsoft日期格式化处理

联系我们
联系电话:15090125178(微信同号)
电子邮箱:garson_zhang@163.com
站长微信二维码
微信二维码