@opentiny/fluent-editor/es/modules/counter.es.js

A rich text editor based on Quill 2.0, which extends rich modules and formats on the basis of Quill. It's powerful and out-of-the-box.

import Quill from "quill";
import "../config/index.es.js";
import { CHANGE_LANGUAGE_EVENT } from "../config/editor.config.es.js";
class Counter {
  constructor(quill, options) {
    this.quill = quill;
    this.renderCount = () => {
      setTimeout(() => {
        const { format, count: totalCount, unit, template: counterTemplate, errorTemplate } = this.options;
        const count = this.getContentLength(format);
        const restCount = totalCount - count;
        const countUnit = unit === "char" ? this.quill.getLangText("char") : this.quill.getLangText("word");
        let template = counterTemplate;
        if (typeof template === "function") {
          template = template(count, restCount);
        }
        const desc = template.replace("{{count}}", count).replace("{{totalCount}}", String(totalCount)).replace("{{restCount}}", String(restCount)).replace(/{{countUnit}}/g, countUnit);
        let limitTemplate = errorTemplate || this.quill.getLangText("counter-limit-tips");
        if (typeof limitTemplate === "function") {
          limitTemplate = limitTemplate(count, restCount);
        }
        const limitTips = limitTemplate.replace("{{countUnit}}", countUnit);
        if (restCount < 0) {
          this.container.innerHTML = errorTemplate ? limitTips : `<span style="color:red">${limitTips}</span>`;
        } else {
          this.container.innerHTML = desc;
        }
      });
    };
    this.options = this.resolveOptions(options);
    this.container = quill.addContainer("ql-counter");
    quill.on(Quill.events.TEXT_CHANGE, this.renderCount);
    this.quill.emitter.on(CHANGE_LANGUAGE_EVENT, () => {
      this.options = this.resolveOptions(options);
      this.renderCount();
    });
    this.renderCount();
  }
  resolveOptions(options) {
    return Object.assign({
      format: "text",
      unit: "char",
      template: this.quill.getLangText("counter-template"),
      count: 500
    }, options);
  }
  getContentLength(format) {
    let content = this.quill.getText();
    if (format === "html") {
      let html = this.quill.root.innerHTML;
      if (html === "<p><br></p>" || html === "<div><br><div>") {
        html = "";
      }
      content = html;
    }
    const text = content.replace(/\s/g, "").trim();
    if (this.options.unit === "word") {
      return !content.trim() ? 0 : content.trim().split(/\s+/).length;
    }
    return text.length;
  }
}
export {
  Counter as default
};
//# sourceMappingURL=counter.es.js.map