Issue #1200💬 AnsweredOpened June 13, 2018by ivanezeigbo1 reactions

Modify grapes.min.js to allow video types on AssetManager

快速解答by WkRPcoN1

This is how I was able to trigger the asset manager on dbl click. See the events property below.

Read full answer below ↓

Question

Please, I would like to modify my grapes.min.js because I would like to add the video type to my assetManager. For some reason, the am.addType() messes up my page and does not work as well. I am not sure why, but I am curious about where to make the changes on my grapes.min.js to include video types. Please help.

Answers (3)

WkRPcoNJune 18, 2018

This is how I was able to trigger the asset manager on dbl click. See the events property below.

export default (editor, config = {}) => {
  const comps = editor.DomComponents;
  
  //const defaultType = domc.getType('default');
  var defaultType = comps.getType('video');
  const defaultModel = defaultType.model;
  const defaultView = defaultType.view;
  // ...

  
  comps.addType('video', {
      view: defaultType.view.extend({
      init(){
        // The 'active' is triggered by the 'activeOnRender' you've used inside your block
       this.listenTo(this.model, 'active', this.doStuff);
     },
      events: {
        dblclick: function(){
          console.log('dbl click');
          this.doStuff();
        }
      },
      doStuff(){
          this.opts.config.em.get('Editor').runCommand('open-assets', { target: this.model, types:['video'], accept: 'video/*'})
      }
    }),
  });
}
artfJune 14, 2018

I think it will be much easier to understand what is wrong with am.addType. Please provide a live demo of your case.

ps. As you've created an issue I removed your comment in #802 because the content is the same but left like this it was just creating confusion

ivanezeigboJune 17, 2018

@artf Never mind. I found out I was just mixing up the versions used. Thank you! I actually used another way around. I added activeOnRender:1 to video and removed the default src in the blocks-basic.js. This allowed me to choose my own src by just including the link to the video. However, I am unable to reopen the AssetsManager on dblclick. Please do you know how I can also make that possible for videos?

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →
Premium option

Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.

Browse premium plugins →

Related tutorials

In-depth guides on the same topic.

All tutorials →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.