How to use the medium-editor function in medium-editor

To help you get started, we’ve selected a few medium-editor examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github brijeshb42 / kattappa / src / components / medium.js View on Github external
componentDidMount() {
    var _this = this;

    var dom = ReactDOM.findDOMNode(this);
    this.dom = dom;
    var options = this.props.options;
    console.log(options);
    this.medium = new MediumEditor(dom, options);
    // this.medium.setContent(this.state.content);

    this.medium.subscribe('editableKeydown', this.handleBeforeInput);

    if(this.props.enterCapture) {
      this.medium.subscribe('editableKeyup', this.captureReturn);
      this.medium.subscribe('editableInput', (e) => {
        this._updated = true;
        this.change(dom.innerHTML.replace('<p><br></p>', ''));
      });
    } else {
      this.medium.subscribe('editableInput', (e) =&gt; {
        this._updated = true;
        this.change(dom.innerHTML);
      });
    }
github VisualComposer / builder / public / sources / primitives / text / component.js View on Github external
componentDidMount () {
    if (this.state.contentEditable) {
      this.editorActivated = false
      const contentWindow = document.getElementById('vcv-editor-iframe').contentWindow
      const dom = ReactDOM.findDOMNode(this)
      this.medium = new MediumEditor(dom, {
        delay: 1000,
        toolbar: {buttons: ['bold', 'italic', 'underline']},
        paste: {
          cleanPastedHTML: true,
          cleanAttrs: ['style', 'dir'],
          cleanTags: ['label', 'meta'],
          unwrapTags: ['sub', 'sup']
        },
        contentWindow: contentWindow,
        ownerDocument: contentWindow.document,
        elementsContainer: contentWindow.document.body
      })
/*      dom.addEventListener('mousedown', () => {

      }) */
      /* const contentWindow = document.getElementById('vcv-editor-iframe').contentWindow
github Someguy123 / understeem / app / components / elements / ReactMediumEditor.jsx View on Github external
componentDidMount() {
        const dom = ReactDOM.findDOMNode(this);
        this.medium = new MediumEditor(dom, {
            toolbar: {
                buttons: ['bold', 'italic', 'underline', 'anchor', 'h2', 'h3', 'quote', 'image'],
            },
            placeholder: {
                text: '',
                hideOnClick: true
            },
        })
        const _this = this
        $(dom).mediumInsert({
            editor: this.medium,
            addons: {
                embeds: {
                    // placeholder: 'Paste a YouTube, Vimeo, Facebook, Twitter or Instagram link and press Enter', //available
                    placeholder: 'Paste a YouTube or Vimeo and press Enter', // the ones with iframes
                    oembedProxy: null,
github directus / api / extensions / core / interfaces / wysiwyg / input.vue View on Github external
init() {
      this.editor = new MediumEditor(this.$refs.editor, this.editorOptions);

      if (this.value) {
        this.editor.setContent(this.value);
      }

      this.editor.origElements.addEventListener("input", () =&gt; {
        const content = this.editor.getContent();

        if (content === "<p><br></p>") {
          return this.$emit("input", null);
        }

        this.$emit("input", content);
      });
    },
    destroy() {
github Radiergummi / kiosk / resources / assets / js / legacy / src / edit.js View on Github external
document.addEventListener('DOMContentLoaded', () => {
  let inputElements = Array.from(document.querySelectorAll('label > input'));

  inputElements.forEach(input => input.addEventListener('focus', event => {
    input.parentNode.classList.add('focus');
  }));

  inputElements.forEach(input => input.addEventListener('blur', event => {
    input.parentNode.classList.remove('focus');
  }));

  /**
   * set up the WYSIWYG editor for the description
   */
  const editor = new Editor('.editor', {
    autoLink:            true,
    imageDragging:       true,
    delay:               0,
    disableReturn:       false,
    disableDoubleReturn: false,
    disableExtraSpaces:  true,
    disableEditing:      false,
    elementsContainer:   document.querySelector('form.add-book'),
    extensions:          {},
    spellcheck:          true,
    targetBlank:         true,
    placeholder:         {
      text:        'Text eingeben',
      hideOnClick: true
    },
    toolbar:             {
github upvalue / meditations / src / common / components / Editable.tsx View on Github external
"h4",
            "h5",
            "h6",
            "table"
          ]
        },

        keyboardCommands: false,

        paste: { cleanPastedHTML: true, forcePlainText: false },
        extensions: {
          table: new MediumEditorTable()
        }
      };

      const editor = new MediumEditor(this.body, options);

      const listener = function (e: BeforeUnloadEvent) {
        const msg = "You have unsaved changes";
        e.returnValue = msg;
        return msg;
      };

      editor.subscribe("focus", (e) => {
        window.addEventListener("beforeunload", listener);
        this.onFocus(e);
      });

      editor.subscribe("blur", () => {
        this.onBlur();

        if (this.interval) {
github BigDataBoutique / ElastiQuill / admin-frontend / src / components / ContentEditor / index.js View on Github external
componentDidMount() {
    this.editor = new MediumEditor(this.container.current, {
      toolbar: {
        buttons: [
          "bold",
          "italic",
          "underline",
          {
            name: "anchor",
            action: "createLink",
            aria: "link",
            tagNames: ["a"],
            contentDefault: '<i class="fa fa-link"></i>',
          },
          "h2",
          "h3",
          "quote",
        ],
github jkhaui / predictable / src / App.js View on Github external
componentDidMount() {
        new MediumEditor(
            this.editorContainer.current,
            {
                placeholder: {
                    text: 'Start writing...'
                },
                toolbar: true,
                autoLink: false,
                imageDragging: false,
                disableExtraSpaces: true
            }
        );

        const editor = document.getElementById( this.state.editorId );
        editor.addEventListener( 'keydown', this.preventTabDefault );
        editor.addEventListener( 'keyup', e => {
            const predictableContainer = document.getElementById( this.state.predictableContainerId );
github VisualComposer / builder / public / editor / modules / content / layout / lib / helpers / contentEditable / contentEditableComponent.js View on Github external
command: function () {},
            key: 'U',
            meta: true,
            shift: false,
            alt: false
          }
        ]
      }
      editorSettings.disableReturn = true
      editorSettings.paste = {
        forcePlainText: true,
        leanPastedHTML: true
      }
    }

    this.medium = new MediumEditor(dom, editorSettings)
    this.medium.destroy()
    this.updateHtmlWithServer(this.props.children)
  }
github relax / relax / lib / shared / components / medium-editor / index.jsx View on Github external
componentDidMount () {
    const {options} = this.props;

    this.medium = new MediumEditor(findDOMNode(this), Object.assign({
      toolbar: {
        buttons: ['bold', 'italic', 'underline', 'anchor']
      },
      placeholder: 'Double click to edit text',
      imageDragging: false
    }, options));
    this.medium.subscribe('editableInput', this.onChange);
  }