Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Handled Custom Block Tools #2

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Handled Custom Block Tools #2

wants to merge 3 commits into from

Conversation

Maxpnl
Copy link

@Maxpnl Maxpnl commented Sep 18, 2020

Hello, I managed to handle custom block tools, I updated the readme with an explanation of how I did it, it's not a really clean code, you have to serve a file named "custom-editorjs-tools.js" containing the custom tools and to get the class from the classname I use an eval, but if the classname doesn't depend on user input (and that will probably be the case), it should be safe to use.

I hope you'll merge this, or at least take inspiration from this PR as I think it could be helpfull to most people that are using this.

Thanks.

Added custom editor tools, this is supposed to be in the static files for the current project (whatever it is), it can contain any custom tool (I got this one from the editorjs wiki)
With this patch you can use something like

        editorjs_config={
            "tools": {
                "Custom": {
                    "Customimage": {
                        "class": "SimpleImage"
                    }
                }
            }
        }

And it will be evaluated (of course, the class name should be added by someone who is trusted, and should never depend on user input as it would lead to xss)
Explained how to use custom tools
@Maxpnl
Copy link
Author

Maxpnl commented Sep 18, 2020

Here's an example of custom-editorjs-tools.js

class SimpleImage {
  static get toolbox() {
    return {
      title: 'Customimage',
      icon: '<svg width="17" height="15" viewBox="0 0 336 276" xmlns="http://www.w3.org/2000/svg"><path d="M291 150V79c0-19-15-34-34-34H79c-19 0-34 15-34 34v42l67-44 81 72 56-29 42 30zm0 52l-43-30-56 30-81-67-66 39v23c0 19 15 34 34 34h178c17 0 31-13 34-29zM79 0h178c44 0 79 35 79 79v118c0 44-35 79-79 79H79c-44 0-79-35-79-79V79C0 35 35 0 79 0z"/></svg>'
    };
  }

  render() {
    return document.createElement('input');
  }

  save(blockContent) {
    return {
      url: blockContent.value
    }
  }
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant