[AYUDA] Arrastrar contenido externo a Canvas

Question

Estoy intentando añadir funcionalidad de d&d desde un modal que lista un montón de archivos html (fragmentos de html)... Al lienzo del editor. Cada uno de ellos encierra el contenido con un '<section>'

Intenté usar 'canvas:dragdata' para permitir soltar en el lienzo

editor.on('canvas:dragdata', (dataTransfer, result) => {
          if(el.tagName == 'SECTION' && el.classList.contains('section')){
		result.content = { type: 'text/html'}
          }
		
});

Según entendí, esto es para extender los tipos de archivo que se pueden eliminar, GrapesJS soporta texto + imagen, ¿así que el enfoque anterior debería funcionar?

Mientras tanto, y después de trastear con 'Editor. DomComponents.addType' Estoy cambiando el alcance de mi problema... ver comentario abajo

orionseye · Accepted Answer

Estoy aclarando lo que quiero conseguir: Tengo unos 100+ fragmentos de html que uso en el constructor 'hecho a mano' actual y necesito migrarlos a GrapesJS. Para mi sorpresa, esto no parece un trabajo sencillo. Actualmente, con 2 funciones Ajax consigo lo que se necesita. a) ajax + scan_dir para listar todos los archivos dentro de un directorio (archivo imagen y html) b) el usuario hace clic (o arrastra) la imagen (vista previa) en la div editable y Ajax recupera el archivo html correspondiente...

artf · Answer

Aquí puedes encontrar cómo hacerlo https://github.com/artf/grapesjs/issues/2595

Arrastrar contenido externo a Canvas

Pregunta

Respuestas (2)

Preguntas y respuestas relacionadas

BUG: Los componentes en modal personalizado no son editables

[PREGUNTA] ¿Puedo añadir un oyente cuando el usuario arrastra un elemento en el lienzo?

¿Cómo puedo incrustar un modal y poder editarlo en mi contenido html?

Componente SVG no arrastrable

Plugins de pago que cumplen con este problema

Explorar categorías de plugins