Problemas con GrapesJS

El estilo de componente no se actualiza tras el evento de arrastre en Modo de arrastre ('absoluto')

En el nuevo modo de arrastre, el estilo del componente no se actualiza tras arrastrarlo. Comportamiento esperado:Arrastrar el elemento haciendo clic en el componente (o en el icono de la barra de herramientas)Después de que los componentes se 'caigan', el estilo debe actualizarse con la nueva posición Comportamiento a...

artf

Tener valores conjuntos de x e e e (por ejemplo, 0px y 0px) ¿Para x/y te refieres a izquierda/arriba?

MartinPutz

Sí, la izquierda y la parte superior deberían cambiar y actualizarse, pero siguen igual.

artf

Veo que solo cambian después de volver a seleccionar el componente, ¿puedes confirmarlo?

#23734 de noviembre de 2019por FedericoPalma923 respuestas

Reacciones 1

Posición incorrecta para los controles DataPicker y Element

[Bug]: Hola, integré uvas js en un proyecto asp.net core / angular. Tengo dos problemas:Aleatoriamente, tras añadir bloques, la barra de herramientas y el resaltador se muestran en posiciones incorrectas. ! screenpositionCuando hago clic en el selector de datos, se muestra en una posición incorrecta fuera de mi ventan...

artf

Sobre el tema de la posición del color, refieros a este https://github.com/artf/grapesjs/issues/1533#issuecomment-432146597

artf

@picozzo92 ¿Puedes crear una demo mínima y reproducible de este número? Estoy trabajando en una refactorización de gran lienzo que probablemente solucionará todos los problemas relacionados, tener una demo reproducible ayudará a entender e...

SaleDrache

Tuve el mismo problema con el posicionamiento del selector de colores y concluí que su posición se da relacionada con la etiqueta screen / html (posición: absoluta, izquierda: x px), pero si algún elemento padre que contiene gjs-editor tie...

#23661 de noviembre de 2019por benvmatheson3 respuestas

Reacciones 1

Text-shadow elimina los valores RGB cuando se selecciona el elemento

Ejemplo: https://jsfiddle.net/benvmatheson/g1ft06qh/8/ Importa un estilo con una propiedad de texto. 'Sombra-texto:rgb(51, 166, 58) 4px 4px 4px;' Esto funciona correctamente y el objeto se muestra correctamente. Sin embargo, una vez seleccionado el elemento, el valor rgb se elimina y se reemplaza por 0. 'text-shadow:0...

benvmatheson

Parece que 'targetUpdated' se ejecuta dos veces cuando se hace clic en el elemento. Una vez con el valor correcto 'rgb(89, 89, 89) 5px 6px 7px' y otra vez con 'rgb' limpiado '0 5px 6px 7px'. Esto explicaría por qué está confuso si el prime...

artf

Sí, ya soy consciente de este problema. Desafortunadamente, el analizador del Gestor de Estilos es bastante torpe y lo que hace es simplemente separar el valor por un separador, en este caso '' '' (espacio), y distribuir las divisiones a p...

benvmatheson

Esto parece que podría convertirse en un gran proyecto debido a dependencias entre navegadores. ¿Valdría la pena traer un módulo de terceros en vez de intentar resolver esto dentro de Uvas?

#236431 de octubre de 2019por mario-digital3 respuestas

Reacciones 9

Cómo añadir funcionalidad de barra de herramientas al panel de capas.

Estoy intentando añadir la barra de herramientas al panel de capas y no sé cómo hacerlo. ¿Hay alguna forma de lograr esto? barra de herramientas ! iconos de barra de herramientas Dónde me gustaría colocarlas: ! capasPannelUvasJS ¡Gracias por vuestras respuestas, chicos!

artf

Por ahora, no hay una forma fácil de cambiar o personalizar el contenido de los elementos del navegador. Lo que podríamos añadir a continuación es una nueva opción de callback en configs que se ejecutaría dentro de ItemView plantilla y per...

mario-digital

@pouyamiralayi A esto me refiero ! TBimg actualizado

artf

De hecho, ahora debería ser posible usar la opción de callback 'layerManager.onRender'

#235525 de octubre de 2019por ned-kelly3 respuestas

Reacciones 2

¿Soporte para reglas en modo diseñador?

Sé que hay un hilo antiguo que sugiere el soporte para los Gobernantes (pero ya está cerrado). Solo me pregunto si hay alguna posibilidad de ver esto en GJS en el futuro. - Sería una adición genial - Actualmente estoy en proceso de escribir plugins para marcas de recorte/sangrado también para diseño de impresión respo...

ronaldohoch

Hola, que te ayude: https://github.com/Ju99ernaut/grapesjs-rulers

artf

Solo me pregunto si hay alguna posibilidad de ver esto en GJS en el futuro. Claro que quizá lo veamos algún día, pero por ahora no es mi prioridad, así que si alguien más quiere empezar esto como un reparto personal sería genial

artf

Gracias @ronaldohoch, cerraré esto en favor del plugin

#23157 de octubre de 2019por tom-sherman3 respuestas

Reacciones 1

Permitir la devolución de promesas desde los métodos '.load' y '.store' de StorageManager

Esto ofrecería una API más moderna y limpia que el enfoque actual basado en callback. API propuesta: '''javascript editor. StorageManager.add('simple-storage', { load: async keys => { resultado const = await foo(keys) return JSON.parse(resultat) }, async store(data) { resultado const = await bar(data) resultado de ret...

tom-sherman

¡Gracias por vuestras opiniones! Espero tener tiempo de implementarlo esta semana

artf

Muy buena petición de función, Tom, agradecería mucho un reparto personal. Sin duda yo optaría por tu primer enfoque, no romper la API actual siempre es un objetivo a alcanzar. Simplemente añadir la posibilidad de crear gestores de almacen...

artf

Con la nueva refactorización de StorageManager esto puede cerrarse https://github.com/artf/grapesjs/pull/4223

#221322 de agosto de 2019por benvmatheson2 respuestas

Reacciones 1

La propiedad CSS siempre se añadía al final del sector

Quería añadir 'altura-mínima' y 'ancho máximo' a las propiedades predeterminadas. ¿Es posible añadirlos junto a 'altura máxima' en lugar de al final del sector? ¿O tendré que definir manualmente todo el sector para gestionar el orden de la propiedad? Además, tenía curiosidad por saber por qué no se incluyeron en los v...

benvmatheson

Para referencia futura, parece que esta es una configuración predeterminada si alguien necesita usarla como base: https://github.com/artf/grapesjs/blob/dev/index.html#L89

artf

¿Es posible añadir estos al lado de la altura máxima en lugar de al final del sector? ¿O tendré que definir manualmente todo el sector para gestionar el orden de la propiedad? Desafortunadamente, actualmente hay que definir todo el sector....

#221122 de agosto de 2019por abozhinov3 respuestas

Reacciones 0

enhancement inactive

Cómo establecer el estilo para pseudo elementos (:after y :before)

Hola, Añado STATE en el gestor de estilos :before y :after pero todos los estilos se aplican al componente.

artf

¿Te refieres durante la edición? ¿Ves que es bueno si desseleccionas el componente?

abozhinov

Sí, durante la edición. Mi idea era implementar los pseudoelementos. Cuando seleccionas componente para seleccionar estado como pasar el cursor, pero para ser :after o :before. El problema es que necesito establecer contenido: '' en la reg...

artf

Vale, pero ¿es correcto una vez que desseleccionas el componente?

#221022 de agosto de 2019por HommeSauvage3 respuestas

Reacciones 0

Editar texto en Safari no funciona

Cuando abres la página de demostración en Safari, no puedes editar el texto.

artf

MMM parece que el 'arrastrable' (introducido en https://github.com/artf/grapesjs/releases/tag/v0.15.3 con la opción 'draggableComponents') y el 'contendeditable' no funcionan muy bien juntos en Safari Por ahora, solo puedo sugerir desactiv...

gaglioffo

Hola, el mismo problema con Firefox y Edge en la última versión. Gracias

jesusdp

mmm parece que el arrastrable (introducido en https://github.com/artf/grapesjs/releases/tag/v0.15.3 con la opción de arrastrarComponentes) y contendeditable no funcionan bien juntos en Safari Por ahora, solo puedo sugerir desactivar dragga...

#220720 de agosto de 2019por niisar3 respuestas

Reacciones 0

No se puede arrastrar el componente si hay espacio arriba/izquierda con Modo Absoluto

Dado el siguiente ejemplo de código... ''' html <div style="altura: 100px;"> Un poco de espacio arriba o a la izquierda </div> <div id="gjs"> <p style="acolchado: 25px"> Mundo Hesdllo!!</p> </div> Esto impide arrastrar y soltar elementos a la posición correcta usando el icono de arrastrar en el panel. ! imagen Consult...

pouyamiralayi

Esto es solo para el icono de arrastrar, ¿verdad? El arrastre manual está bien. Usando el icono de arrastre, parece que se reinicia la posición del elemento desde arriba.

niisar

esto es solo para el icono de arrastrar, ¿verdad? El arrastre manual está bien.usando el icono de arrastrar, parece que se reinicia la posición del elemento desde arriba. Sí, esto es solo para arrastrar iconos.

artf

Sí, el problema aquí es el objeto Event diferente según el contexto. Cuando activas el arrastre sobre el propio componente, el Evento está en el contexto del iframe (porque el elemento con el que se hace clic está en iframe), pero los boto...