He implementado un pequeño editor GrapesJS que permite editar plantillas de Django/Jinja2. GrapesJS por defecto intenta OBTENER la vista previa de imagen de mi elemento: <a href="{{producturl}}" objetivo="blank"><img src="{{imageurl}}" ancho="130"/></a> La petición ocurre cada vez que cargo la plantilla en el editor G...
artf
Hola @mathiasbc usando la última https://github.com/artf/grapesjs/releases/tag/v0.14.43 Debería funcionar con algo así '''js editor.on('component:mount', model => { si (model.is('imagen')) { si (model.get('src') == '{{image_url}}') { model...
artf
Hola Mathias, actualmente la única posibilidad que veo ahora es ampliar el componente 'imagen' y su método 'render()'. Probablemente añada algún evento nuevo de componentes para facilitar la gestión de este caso
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.
Aparentemente esto es un fragmento válido de html y css: '<div style="color: red; / altura 200px; /; peso-fuente: negrita;">' (De ahí la propiedad de altura comentada) Grapesjs tiene dificultades para tratar este tipo de atributo, ya que el atributo estilo en el modelo se almacena así: ! screenshot20181113165603 El gr...
emilsedgh
Vale, por fin he conseguido reproducir esto de nuevo. Reabriendo con mejor violín. El código dentro de GJS es '''html <p style="/ color: #ffffff; /"></p> <span style="color: red;">Bar</span> El problema es que el '/* color:#ffffff;' no tie...
artf
Hola Emil, he probado esto https://jsfiddle.net/37n5691f/ pero no veo el problema
no-response[bot]
Este asunto se ha cerrado automáticamente porque no ha recibido respuesta a nuestra solicitud de más información por parte del autor original. Con solo la información que actualmente hay en el asunto, no tenemos suficiente información para...
Hola a todos, Estoy usando la última versión estable de grapesjs (40) y he notado el siguiente error en el editor de texto enriquecido: si el usuario arrastra y suelta un editor de texto enriquecido en el lienzo, hace clic en él e intenta clonarlo por ejemplo (o cualquier acción en la barra de herramientas como elimin...
arthuralmeidap
PR: https://github.com/artf/grapesjs/pull/1800
artf
Sí, eso ocurre por esta comprobación, al estar en modo edición necesitamos evitar algunas acciones (por ejemplo, hacer clic canc/retroceso activa el mismo comando). Probablemente necesitamos poner algún tipo de opción de fuerza
alimajed93
Hola @artf, Ah, ya veo. ¿Podrías darme algunos ejemplos de por qué añadimos esta comprobación? Quiero decir, ¿qué problemas teníamos y qué se resolvían con este cheque? Gracias.
Hola @artf, Tengo un problema con el gestor de deshacer y he comprobado que también está en tu página de demostraciones. El problema es que el administrador de deshacer también cuenta el evento cuando hacemos clic fuera de la sección de editor como en el botón de capa, el botón de estilo, el botón de bloquear o cualqu...
Hola, lamentablemente no encuentro documentación y no consigo entenderla por código: Sé que hay un comando incorporado 'pantalla completa', pero con mi configuración (del tutorial) solo carga el canvas en pantalla completa, sin paneles. Aquí está mi código html: Y aquí mi código de panel: ¿Alguien puede ponerme en el...
electrotype
@nativeer tuve el mismo problema. Mi solución es llamar a 'stopCommand' antes que a 'runCommand': Parece que me funciona.
artf
Buen punto, el comando por defecto Fullscreen activa la pantalla completa en el contenedor ('#gjs'), pero con paneles externos esto obviamente no funciona, y por eso solo ves el lienzo. Agradecería mucho un récord permanente para una nueva...
gabjdev
Hola @artf, El código anterior funcionaba en pantalla completa, pero después de salir de pantalla completa manualmente, ya no funciona. ¿Podrías poner código para salir de pantalla completa con el mismo botón?
Hola @artf, Como se describe en la siguiente tarea, hice una compilación del ckeditor 5 que funciona con GrapesJS, aunque algunas funcionalidades no funcionan como se esperaba. Los puntos clave y los números se crean sin problema, pero las opciones de Negrita, Cursiva y Enlace no. ¿Hay alguna posibilidad de que puedas...
FrciSmrci
Hola @artf, gracias por la respuesta. La versión personalizada ya no es necesaria, porque la solución estaba dentro de la última versión. Estoy usando la versión de compilación en línea de @ckeditor/ckeditor5-editor. Voy a echar un vistazo...
FrciSmrci
@Unsigno El código debería ser un nuevo plugin que se pueda proporcionar en GrapesJS como grapesjs-plugin-ckeditor, solo que este plugin debería soportar ckeditor5 (grapesjs-plugin-ckeditor5). @gabrigcl desarrollado gran parte del plugin m...
artf
Hola @FrciSmrci no puedo decir que sea una de mis prioridades, pero puedes evaluar abrir una recompensa en https://www.bountysource.com/teams/grapesjs y ver si alguien más puede comprobarlo. Por cierto, preferiría una integración con el CK...
Estoy buscando usar Tailwind con GrapesJS, pero este framework utiliza Classes CSS Utility-First para crear layouts rápidos. El problema es que también utiliza clases 'especiales' para definir variantes de estilo, por ejemplo: 'hover:bg-blue' o 'md:w-full', etc. El problema es que la función 'escape' del selector Grap...
artf
Agradecería un :) de relaciones públicas
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, ¿Podrías indicar la forma de añadir o eliminar clase en el administrador de deshacer? Además, en la demo en vivo, cuando arrastramos la cuenta atrás y hacemos clic en el botón de deshacer, el elemento de cuenta atrás no tiene ningún efecto. Gracias de antemano
takecore
Tengo el mismo problema. ¿Alguien ha resuelto algo?
artf
Cierro este tema en favor de la mejora general de la API de UndoManager https://github.com/artf/grapesjs/issues/3639
Descargué el código fuente por zip y ejecuté 'npm i', pero no puedo ejecutar 'npm start'. Así es como solucioné el problema.Funciona cuando cambio package.json antes: Después:
artf
Vale, pero '-- -w' está pensado para el reloj en los archivos SCSS, con tu cambio creo que no funcionará. (Supongo que usas Windows) Probablemente deberíamos hacer algo así para que funcione multiplataforma: '''js "inicio": "npm ejecutar b...
Gyanxie
@artf Sí, uso Windows.Acabo de probarlo con tu cambio, pero no funciona. ! imagenAquí tienes un ejemplo de que funciona. ! imagenVersión NPM ! imagen
Gyanxie
@artf He hecho una 'lista de 'npm', si es necesario. npmList.txt
Estoy intentando crear un componente personalizado que genere su propia vista con HTML anidado. No quiero que este HTML se renderice como un componente, así que uso (usando jQuery) view: defaultType.view.extend({ init: function () { $(this.el).html('<div class="container"></div>'); }, getChildrenSelector: function ()...
artf
Si añades elementos a través de Vista no puedes seleccionarlos, solo los modelos pueden ser seleccionables Lee esta página https://grapesjs.com/docs/modules/Components.html también creas nuevos tipos sin 'isComponent'
prestonkscott
@artf entiendo cómo usar isComponent. Voy a usar 'fromElement: false', así que no es necesario para cómo quiero usar uvas. No quiero que se seleccionen los elementos añadidos a la vista, pero sí quiero que los componentes anidados sean sel...
artf
Vale, ahora lo entiendo. El 'getChildrenContainer' debería funcionar como esperas, solo intentaré eliminar esos 'pointer-events' y hacer que el 'pasar' funcione más como el 'select'. Por cierto, no necesitas jquery, grapesjs bajo el capó u...