Issue #554💬 RespondidoAbierto el 22 de noviembre de 2017por ryandebaReacciones 0

Evita el iluminador flotante y evita seleccionar ciertos componentes

Respuesta rápidapor artf

Evita el efecto de resaltado al volar en ciertos componentes. Los componentes ya tienen una propiedad de "resaltado" que se está usando para el estilo de contorno punteado. Estaba pensando en usar esa misma propiedad para evitar el efecto de resaltado al pasar el cursor, pero también podría ser una nueva propiedad (¿q...

Lee la respuesta completa abajo ↓

Pregunta

Hola @artf,

Me gustaría conocer vuestra opinión sobre los siguientes dos puntos antes de enviar una solicitud de tirada. Son para cumplir los requisitos de un proyecto en el que estoy trabajando actualmente, pero espero que puedan tener un lugar en el núcleo de grapesjs.

  1. Evitar el efecto de resaltado en el estacionamiento en ciertos componentes. Los componentes ya tienen una propiedad de "resaltado" que se está usando para el estilo de contorno punteado. Estaba pensando en usar esa misma propiedad para evitar el efecto de resaltado al pasar el cursor, pero también podría ser una nueva propiedad (¿quizá "hoverable" o "highlightOnHover"?). Aún no lo he probado, pero parece que podría simplemente comprobar el valor de la propiedad en SelectComponent.updateHighlighter() y devolverlo antes si el valor está configurado como falso.

  2. Evita seleccionar ciertos componentes. También me gustaría evitar por completo seleccionar ciertos componentes cuando se hacen clic. Ahora tengo un código algo complicado que añade una propiedad "seleccionable" a los componentes, y si esa propiedad está configurada como falsa cuando se activa el evento 'component:selected', entonces la desselecciono ('editor.select("")'). Preferiría que el componente no se seleccionara en primer lugar para evitar que otros oyentes 'component:selected' se ejecuten, así como para evitar el rápido destello del contorno azul y la barra de herramientas que aparece brevemente (veo que esto ocurre en Chrome... No estoy seguro sobre otros navegadores). ¿Existe alguna propiedad existente que pueda usarse para esto? Si no, ¿qué te parece si añado una propiedad "seleccionable" que podría usarse para evitar la selección de componentes?

¡Gracias por todo lo que hacéis en este proyecto, lo aprecio mucho!

Respuestas (3)

artf23 de noviembre de 2017
  1. Evita el efecto de resaltado al volar en ciertos componentes. Los componentes ya tienen una propiedad de "resaltado" que se está usando para el estilo de contorno punteado. Estaba pensando en usar esa misma propiedad para evitar el efecto de resaltado al pasar el cursor, pero también podría ser una nueva propiedad (¿quizá "hoverable" o "highlightOnHover"?). Aún no lo he probado, pero parece que podría simplemente comprobar el valor de la propiedad en SelectComponent.updateHighlighter() y devolverlo antes si el valor está configurado como falso.

'flotable' aprobado 👍 Me gustaría señalar que no se debe usar la denominación 'camelCase' en las propiedades de Model, ya que así son invaluables mediante los atributos 'data-gjs-*'. Confirma también tus opiniones sobre 'SelectComponent.updateHighlighter'

  1. Evita seleccionar ciertos componentes. También me gustaría evitar por completo seleccionar ciertos componentes cuando se hacen clic. Ahora tengo un código un poco torpe que añade una propiedad "seleccionable" a los componentes, y si esa propiedad se configura como falsa cuando se activa el evento component:selected, entonces la desselecciono (editor.select("")). Preferiría que el componente no se seleccionara en primer lugar para evitar que otros oyentes component:selected se ejecuten, así como para evitar el parpadeo rápido del contorno y barra de herramientas azul que aparece brevemente (veo que esto ocurre en Chrome... No estoy seguro sobre otros navegadores). ¿Existe alguna propiedad existente que pueda usarse para esto? Si no, ¿qué te parece si añado una propiedad "seleccionable" que podría usarse para evitar la selección de componentes?

Ya estaba pensando en añadir algo así, así que adelante.

Gracias a ti por tu ayuda :)

ryandeba23 de noviembre de 2017

¡Gracias por el feedback! He creado un par de pull requests para estos artículos, dime si quieres hablar más sobre ello.

artf23 de noviembre de 2017

Fusionados, gracias Ryan 👍

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Tutoriales relacionados

Guías detalladas sobre el mismo tema.

Todos los tutoriales →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.