Exibindo alterações de código e comentários

Isso é uma questão de saber se uma funcionalidade existe (possivelmente como um plugin) ou se é um pedido de recurso caso não exista…

O que estou procurando é a capacidade de exibir algo como isso dentro das discussões do fórum Discourse:

Não apenas mostrar um trecho de código com destaque de sintaxe específico da linguagem (já temos isso ao introduzi-lo com <kbd>\``php, por exemplo, e fechá-lo com ````).

O que eu quero é poder destacar uma linha, talvez comentá-la e mostrar uma edição na linha. Essas funcionalidades são tipicamente úteis em fóruns que discutem assuntos técnicos, onde você recomenda alterações a aplicar ou aponta áreas problemáticas.

Embora nós usemos o GitHub para nosso projeto, não estou pedindo especificamente para mostrar alterações conforme elas acontecem no GitHub, mas sim algo que possa ser inserido independentemente dentro do Discourse — a imagem acima serve apenas como exemplo de como poderia ficar.

Você pode exibir diffs assim:

Uma linha normal
- linha removida
+ linha adicionada

```diff
Uma linha normal
- linha removida
+ linha adicionada
```
6 curtidas

Certo… isso parece :cool:

Existe alguma maneira de combinar isso com realce de sintaxe específico para cada linguagem?

O código fica tão sem graça sem ele, e tão ótimo com ele.

Infelizmente não — concordo que seria bom, apesar disso. Usamos o highlight.js para nossa realce de sintaxe. Parece que houve uma discussão semelhante no repositório deles no GitHub, mas decidiram que estava fora do escopo do projeto.

3 curtidas

Hmm :thinking:

Então, eles têm esse trecho no Gist. O que estão sugerindo é que as pessoas implementem isso fora do realçador de sintaxe (nesse caso, é o marked.js; imagino que o mesmo pudesse ser feito com o highlight.js).

Você acha que o Discourse poderia fazer isso? Ou, antes disso, isso faz sentido em termos de arquitetura?

Acho que a ideia geral é apenas fazer um substituir, remover as marcas de diff, enviar para o realçador de sintaxe e, depois, trabalhar nele com mais algumas substituições. Parece muito estranho, mas a verdade é que o trecho não é tão complicado assim.

1 curtida

É certamente possível, mas não acho que será fácil. Toda a realce de sintaxe ocorre em JavaScript, então pode ser manipulado usando um componente de tema.

1 curtida

Como você os fez coloridos?

Type out the code block like this:

```diff
A normal line
- removed line
+ added line
```

Specifying diff as the syntax means that you can use + and - at the beginning of lines to highlight them green and red.

3 curtidas
Uma linha normal
- linha removida
+ linha adicionada

Consegui! Obrigado @david

2 curtidas

A partir de agora, vou usar a construção diff, pois é útil.

Não vejo o Discourse implementando aquela outra sugestão do Gist. Quanto mais penso nisso, mais acredito que ela se encaixaria perfeitamente dentro do realçador de sintaxe, não fora dele.

Basicamente, com o passar dos anos, faz sentido adicionar alguns recursos aos realçadores de sintaxe, e a função básica de exibir código de forma fácil de ler se estende naturalmente para mostrar também parte da dinâmica do código.

O que mudou, onde, por quem; para o que estou apontando; qual comentário útil explica a relação do código com o local onde está sendo postado, etc.

Obrigado a todos pela participação nesta discussão.

1 curtida

Talvez uma alternativa?

<del>del</del> 
<ins>ins</ins> 

del
ins

4 curtidas