¿Cómo acceder al contenido sin procesar desde un componente de tema?

Desarrollador
1

Estoy desarrollando un componente de tema donde me gustaría hacer algo similar a:

[code]
main() {
  printf("Hello World!\n");
}
[/code]

lo que produce:

main() {
  printf("Hello World!\n");
}

Estoy utilizando api.decorateCooked() para esto, pero como el contenido ya está «cocinado», se han eliminado todos los espacios «redundantes», por ejemplo, el espacio antes de printf en el ejemplo anterior.

¿Cómo puedo acceder al texto «sin cocinar» tal como lo ingresó el usuario?

Para ser claro; lo que quiero que mi componente de tema soporte es permitir que el usuario escriba algo como:

[mytag]
main() {
  printf("Hello World!\n");
}
[/mytag]

lo cual mi componente de tema entiende y reemplaza con una transformación del texto dentro de [mytag] ... [/mytag].

2

Para acceder a lo crudo, necesitarás usar un plugin.

Sin embargo, lo que puedes hacer es usar el helper wrap, de modo que tengas un div con el que trabajar.

[wrap=test]
hello world
[/wrap]

Se renderiza como:

<div class="d-wrap" data-wrap="test">
<p>hello world</p>
</div>
2 Me gusta
3

Gracias.

¿Es posible instalar un plugin personalizado en una instancia de Discourse alojada por Discourse en el plan gratuito? De todos modos, no he encontrado cómo hacerlo.

¿Sería posible implementar soporte para raw en los componentes de tema? De ser así, ¿aceptarían un PR para hacerlo?

El helper wrap no hace lo que pedí. También elimina la sangría.

4

Lamentablemente, nuestros planes gratuito, estándar y empresarial no permiten plugins personalizados. Utilizamos un clúster que aloja a muchos clientes diferentes y no contamos con un mecanismo para ejecutar un plugin solo para un cliente.

Soportar la capacidad de inyectar una extensión de markdown mediante un componente de tema es algo que he considerado en el pasado, pero no tenemos planes concretos de implementarlo. Sería extremadamente difícil de añadir.

¿Qué tal si se envuelve dos veces? Esto mantendrá toda la indentación.

[wrap=test]
```
1
  1
    3
```
[/wrap]

Quizás incluso usar algo como esto funcionará; tendrás un elemento distinto con el que trabajar:

```custom
test
```
3 Me gusta
5

¿Es extremadamente difícil también para ti, o solo para alguien como yo sin conocimientos previos de la implementación? ¿En qué radica la dificultad? ¿Sería más fácil hacer algo más sencillo que una extensión completa de Markdown, como el acceso de solo lectura a lo crudo?

Sí, esa podría ser una opción. Gracias.

6

El front-end no recibe el contenido del mensaje en formato raw. Solo recibe la versión procesada. Esto significa que las cargas útiles enviadas al cliente son más pequeñas. Además, el servidor es finalmente el responsable de la conversión de Markdown a HTML. Si hiciéramos todo esto en tiempo de ejecución en el navegador, añadiríamos muchos costos adicionales y tendríamos que preocuparnos por vectores de seguridad complejos.

2 Me gusta
7

@sam Gracias por tu ayuda. Tu sugerencia resultó bien y también ofreció una sintaxis bastante decente para el usuario:

Captura de pantalla del 2020-05-04 13-40-01
Captura de pantalla del 2020-05-04 13-40-01948×460 23.4 KB

:sunglasses:

2 Me gusta
8

Solo para aclarar, ¿sabes que si lo que realmente quieres son bloques de código, puedes envolverlos con tres comillas invertidas, verdad? No puedo determinar en qué medida tu ejemplo es una metáfora.

9

@pfaffman No sé a qué te refieres con bloques de café, pero sí sé que tres acentos graves generan un bloque de código.

No entiendo por qué mi ejemplo debería ser una metáfora. ¿Para qué? La imagen que publiqué es una captura de pantalla para mostrar lo que mi componente de tema genera para el código dado.

1 me gusta
10

Lo siento. El café y el código son casi iguales en mi teclado móvil. ¡Se equivocó cada vez que escribí esa frase!

He buscado y buscado, y no veo en tu ejemplo qué diferencia hay entre tu imagen y un bloque de código estándar.

11

El gráfico que ha añadido el componente de mi tema.

1 me gusta
12

¡Ah! ¿Así que quieres algo como el plugin de matemáticas, pero para tu lenguaje de gráficos en lugar de TeX?

13

Sí, supongo que sí. No he visto el plugin de matemáticas, pero suena similar en concepto. Es la misma función básica que la del Discourse Graphviz, pero este puede hacer cosas mucho más avanzadas, como transiciones animadas entre gráficos, y tiene un montón de opciones para controlarlo y darle estilo.

1 me gusta
14

También está Discourse Graphviz, que, creo, aún no resuelve tu problema, ya que no puedes instalar un complemento.

15

Aquí está el repositorio de GitHub si estás interesado. Todavía no está implementado oficialmente en ningún lugar porque primero necesito escribir una documentación detallada sobre cómo usarlo.

16

Entonces parece que funciona, y quizás me esté perdiendo algo, de que la solución sería enviar tus cambios como un PR y luego estaría disponible en los planes empresariales.

17

Lo siento, no entiendo a qué te refieres. Es un componente de tema y puede instalarse en cualquier instancia de Discourse a través de la interfaz web por parte de su administrador, independientemente del plan que tengan.

18

Probablemente no lo entienda. Pero parecía que lo que quieres hacer es extender el plugin de graphviz para admitir más funciones de graphviz y que tendría más sentido integrarlas en ese plugin.

Pero realmente no entiendo a qué te refieres, así que podría estar muy equivocado.

19

Ahora entiendo lo que querías decir. No, como estamos en un plan gratuito, no pudimos usar ese plugin, por lo que desarrollé un componente de tema en su lugar. Las funciones adicionales fueron como un bonus que se pudo añadir fácilmente porque se basa en una biblioteca diferente a la del plugin existente.

Los plugins y los componentes de tema son muy diferentes, así que no creo que sea posible reutilizar código entre ellos, pero supongo que alguien podría añadir la misma funcionalidad al plugin existente si le interesa.

2 Me gusta