Hola. Necesito que este evento se active en esta situación: tengo algunos elementos fuera del lienzo que hay que ocultar en modo de vista previa y mostrarlos al salir del modo de previsualización. Sin embargo, el evento stop:preview no se activa cuando salgo de la vista previa y vuelvo a la edición de canvas. He cread...
theanhmx
@artf perdón por esta pregunta tan tonta, ¿Pero cuándo estará disponible la solución en el paquete NPM? ¿O de qué rama puedo extraer manualmente el código con esta corrección y compilación?
lock[bot]
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
Hola @artf otro problema al usar el gestor personalizado: ¿qué ponemos en las imágenes de fondo? editor.getSelected().set('src', URL) no funciona en imágenes de fondo. ¿Debería reemplazar 'SRC' por 'background'?
artf
Usa esto '''js editor.getSelected() .addStyle({'imagen-fondo': 'url(${url})'}); ```
suraj740
@artf ¡Gracias por el trabajo increíble, tío! 👍
lock[bot]
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
La wiki de la API del editor lista un conjunto de eventos relacionados con componentes que pueden ser escuchados (por ejemplo, 'component:add', 'component:update'). Sin embargo, no se menciona qué tipo de objetos de evento recibe el oyente ni cómo están estructurados (qué propiedades tienen y qué valores pueden conten...
ppisecky
@artf gracias por tu respuesta. Sin embargo, buscaba un ejemplo más general para determinar si hubo cambios y cuáles fueron, por ejemplo, algo como esto: '''javascript editor.on('component:update', model => { if (model.isChanged()) { //......
artf
Gracias @ppisecky por señalarlo, actualicé el código fuente, pero básicamente cualquier evento relacionado con componentes recibe el modelo activado. Sobre tu caso de 'tamaño de fuente', puedes configurar este oyente '''js editor.on('compo...
lock[bot]
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
Hola, ¿Cómo puedo activar algún evento cuando se actualiza cualquier bloque o contenido nuevo dentro del canvas? Algo como 'editor.onCanvasUpdate()' ¡Gracias!
ryandeba
Hola @fsaiyedOB, He podido lograr esto con el evento 'component:update' que se muestra aquí: https://github.com/artf/grapesjs/wiki/API-Editor#available-events Mi código se ve algo así
duskhacker
Cuando pregunté por saber cuándo el lienzo está sucio para poder indicar, @artf me dijo:
artf
También añadiría un evento específico para cada bloque '''js editor.on('bloque:arrastrar:stop', modelo => console.log('drop', model)) ```
Estoy sustituyendo richtexteditor por ckeditor en grapesjs pero no funciona. Richtexteditor sigue apareciendo. ¿Cómo debería resolver esto? Mi código es: editor.setCustomRte({ enable: function(el, rte) { rte = new CKEDITOR.inline(el, { barra de herramientas: [{ Atributos: { "Clase": "FA FA-Imagen" }, comando: "open-di...
ryandeba
Hola @NorthstarTech, Veo que tu código incluye el archivo grapesjs-plugin-ckeditor.js. ¿También estás incluyendo ese plugin al llamar a 'grapesjs.init()' como se muestra aquí?
NorthstarTech
Sí, también he añadido el plugin en grapesjs.init(), pero no funciona. Muestra el error que se muestra a continuación. ! error
ryandeba
No conozco muy bien el plugin ckeditor, pero parece que espera el plugin sharedspace ckeditor (ver aquí). Creo que solo tienes que asegurarte de incluir ese plugin en tu configuración de CKEditor. Aquí tienes un enlace a ese plugin, pero a...
¿Hay alguna forma de no permitir que ningún componente específico se deshaga más de una vez en la página? Tengo un componente personalizado y el usuario no puede dejarlo más de uno en la página, así que si el componente ya está añadido en la página, quiero mostrar un mensaje específico y no permitir que se elimine en...
ryandeba
Hola @krunal039, Mi mejor sugerencia sería escuchar el evento component:add. En la función de escucha de eventos podrías comprobar si el componente añadido es del tipo que buscas, y si ahora existen más de uno de esos componentes en el lie...
bunomonteiro
``` editor.on('component:add', model => { // ... Tu lógica va aquí if(remove){ model.destroy(); } });
artf
@krunal039 la sugerencia de Ryan es la forma correcta de cumplir tu petición
Hola @artf, He notado que si añado un componente que contiene una combinación de texto y una <a>etiqueta '', el texto no es editable como suele ser. Si sustituyo la etiqueta '<a>' por una '<span>', entonces puedo editar el texto sin problema. Aquí hay algo para ilustrar a qué me refiero (fíjate en las últimas dos líne...
artf
Gracias, Daniel, estoy de acuerdo contigo y me encargaré de tus sugerencias. Solo quiero señalar, en el cuarto caso, que también puedes indicar explícitamente al editor dónde es un componente de texto '''html <div data-gjs-type="text"> Un...
¿Es posible añadir propiedades de borde arriba, borde derecho o borde izquierdo individualmente bajo el encabezado de decoración en grapesjs? Esto sería similar al radio de frontera. Por ahora solo muestra el ancho del borde, lo que da todos los bordes laterales. Solo quiero bordes a la derecha o a la izquierda.
ryandeba
Hola @NorthstarTech, No tengo un ejemplo de código, pero ¿has mirado https://github.com/artf/grapesjs/wiki/API-Style-Manager#addproperty? Hay un ejemplo ahí que añade "min-height" — ¿podrías modificar ese ejemplo para adaptarlo a tus neces...
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
¿Hay alguna forma de usar grapesjs con zeronet? https://zeronet.io/ Puedes crear sitios en zeronet, pero para añadir cabeceras, banners y otras cosas tienes que acceder al CSS y HTML para escribir código. Odio programar con pasión y me gustaría usar grapesjs en zeronet para poder usar las funciones de arrastre y solta...
artf
Hola Jeffery, por desgracia Daniel tiene razón, si quieres usar GrapesJS en otros proyectos alguien (los desarrolladores) primero tiene que integrarlo. Creo que podrías al menos intentar preguntar a los desarrolladores de ZeroNet si han in...
duskhacker
@Snarkly GrapesJS no es una solución llave en mano de entrada directa. Tendrás que entender (y hacer) programación en Javascript solo para que el editor funcione. Su propósito es añadir un editor HTML avanzado a una pila web existente.
lock[bot]
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.
¿Cómo añadir el texto en una posición específica del cursor en RichTextEditor? ¿Algún código de ejemplo? Necesito urgentemente Gracias,
ryandeba
Hola @NorthstarTech, ¿Puedes explicar qué quieres decir con "posición específica del cursor"? ¿Es ese el principio/final de la selección? ¿O la posición objetivo es más dinámica? Un ejemplo de código que muestre lo que tienes hasta ahora (...
artf
Gracias Ryan por la explicación tan detallada, por cierto, creo que esto es lo mismo que el #111, así que casi es una duplicación
lock[bot]
Este hilo se ha bloqueado automáticamente porque no ha habido actividad reciente desde que se cerró. Por favor, abre un nuevo problema para bugs relacionados.