search

GrapesJS / mjml

Newsletter Builder with MJML components in GrapesJS
http://grapesjs.com/demo-mjml.html
BSD 3-Clause "New" or "Revised" License
629 stars 226 forks source link

Extending mj-image not working.... #209

Closed josfh2005 closed 3 years ago

josfh2005 commented 3 years ago

Hi,

BTW awesome job with grapesjs.

I am trying to extend mj-image component to create mj-video, which will take an youtube/vimeo URL an present the video preview frame in the image and the url to the video.

But so far nothing is working.

comps.addType('mj-video', { isComponent: el => el.tagName === 'mj-video'.toUpperCase(), extend: 'mj-image' });

I am using grapes inside Angular 8 app, and the mjml plugin as an external link.

What else should I need?

Thanks in advanced.

DRoet commented 3 years ago

Probably better to just define a custom block like described here https://github.com/artf/grapesjs-mjml/issues/195#issuecomment-673664804 that inserts a mj-image which links to a video

josfh2005 commented 3 years ago

Thanks @DRoet,

Now i am doing just that, I put an attribute and use that to recognize it as a video component to show some different trait.

josfh2005 commented 3 years ago

Finally made work like this...

editor.DomComponents.addType('mj-video', { isComponent: el => el.tagName === 'MJ-IMAGE' && el.getAttribute('type') === 'video', extend: 'mj-image' });

For anyone who may need this!