Copiar componente de tema do Codeblocks

[justin (Justin DiRose)]

Este componente de tema está agora obsoleto em favor de Copiar conteúdo de blocos de código para a área de transferência, um recurso central do Discourse.

Pré-visualizar no Criador de Temas
Repositório Git: https://github.com/discourse/discourse-copy-codeblocks
Como instalar um Tema ou Componente de Tema?

Este componente de tema adiciona um botão de copiar aos blocos de código dentro de posts do Discourse — perfeito para comunidades que compartilham exemplos de código ou artigos de base de conhecimento que exigem a cópia de texto.

No desktop, o botão de copiar aparece ao passar o mouse sobre o bloco.

No mobile, o botão de copiar é sempre exibido, mas empurra o código dentro do bloco para baixo, evitando que a primeira linha de código fique obscurecida se for muito longa.

Observe que isso funciona apenas para blocos de código gerados por ```, e não para blocos de código em linha.

Este é um bloco de código.
Copie este texto.

Este é um bloco de código em linha. A cópia não funciona aqui.

Muito obrigado a @j.jaffeux, que realizou a maior parte do desenvolvimento inicial deste recurso.

[Falco]

Qual é a diferença entre isso e https://meta.discourse.org/t/copy-option-for-code-blocks-in-discourse/60961?u=falco?

[j.jaffeux (Joffrey Jaffeux)]

Várias coisas:

• não incorpora uma biblioteca completa de área de transferência
• não depende do jQuery
• não vaza ouvintes de eventos
• não depende de múltiplos eventos
• usa padrões de codificação atualizados
• não tem o bug de aspas
• …

Não tenho certeza se isso está funcionando corretamente também em dispositivos móveis.

[xrav3nz]

Maravilha!!

Curioso se estamos abertos a substituir o texto localizado “copiar”/“copiado” por ícones? Talvez o ícone de copiar para “copiar” e o ícone de marca de verificação para “copiado”?

[justin (Justin DiRose)]

Estou aberto a adicionar uma configuração ao componente. A razão pela qual optei por usar texto localizado é que fica claro o que está acontecendo, além de o texto poder ter uma altura menor e ainda ser legível. A estética parecia se adequar melhor ao caso de uso.

[codinghorror (Jeff Atwood)]

@j.jaffeux

Várias coisas:

Parece que deveríamos remover ou descontinuar um ou outro e consolidar o esforço?

[sam (Sam Saffron)]

Minor: o atraso copiado é muito rápido no meu iPhone. O texto deve dizer ‘copiado’ por cerca de 3 segundos antes de voltar ao normal.

Fica bem mesmo

[justin (Justin DiRose)]

Modificado aqui:

https://github.com/discourse/discourse-copy-codeblocks/commit/d1af36a4a5197dab4ca1dd62a05930088882de45

Também corrigimos alguns bugs com versões mais antigas do Discourse que não têm @ember/runloop e Promise da biblioteca rsvp disponíveis. (Obrigado a @jomaxro pelos relatórios sobre isso)

[pfaffman (Jay Pfaffman)]

Desculpe, mas um não é o suficiente desta vez.

Maravilhoso! Isso é incrível. Isso, combinado com Placeholder Forms, é realmente legal.

O que acabei de fazer com isso

Replacing A Failed Hard Drive In A Software RAID1 Array

sfdisk -d /dev/=gooddev= | sfdisk /dev/=newdev=
mdadm --manage /dev/md1 --add /dev/=newdev=
mdadm --detail /dev/md1

Veja funcionando!

while true; do mdadm --detail /dev/md1|grep "Rebuild Status" ; sleep 10;done

Obtenha o tempo de ligado para todas as unidades

for x in a b c d ; do smartctl -a /dev/sd$x|grep Power_On; done

[codinghorror (Jeff Atwood)]

Eu adoro muito isso! Mas será que o botão de copiar pode aparecer apenas ao tocar no mobile? Estou um pouco chateado com a perda consistente de espaço na tela no mobile, uma linha extra para cada bloco de código:

Mas, pensando bem, percebo que:

• blocos de código não são tão comuns
• como é opt-in, você só ativaria em sites onde copiar blocos de código é realmente uma atividade comum também

… dito isso.. as chances de qualquer bloco de código ser copiado no mobile são minúsculas, então sinto que a proporção entre interface e uso está desequilibrada aqui, e preferiria algo que apareça apenas ao tocar no mobile?

Não é urgente.

[j.jaffeux (Joffrey Jaffeux)]

Sim, pedido totalmente justo Eu também compartilho dessa preocupação, vamos encontrar uma solução.

[codinghorror (Jeff Atwood)]

Até mesmo isso seria preferível no mobile, acho. O alinhamento está deslocado, mas você capta a ideia:

(Mesmo que sobreponha texto, etc., não tenho certeza se isso torna mais difícil ou mais fácil do que a exibição ao tocar? )

[justin (Justin DiRose)]

Tínhamos isso originalmente, mas ele sobrepujava o texto sem que fosse possível vê-lo. Gosto da ideia de torná-lo visível ao tocar. Vou investigar isso.

[codinghorror (Jeff Atwood)]

@justin

o texto foi sobreposto sem que fosse possível vê-lo

No celular, esse é um compromisso muito melhor, sem dúvida. No laptop, desktop ou tablet, o espaço adicional consumido é 100% aceitável.

[lcestou (Lutechi)]

Olá,

Adoraria usar isso, mas assim que ativei para meu tema Grey Amber, meu site ficou lento e, às vezes, sem resposta, até que eu o desativei.

Alguém já experimentou esse comportamento, ou será que isso pode sobrecarregar tanto o VPS quando está ativado?

O site é composto em 99,9% por linhas de código simples, e eu esperava convertê-las para blocos de código, então não deveria estar tentando buscar nada para converter código existente. Ou está?

Preciso dar algum tempo para que se normalize? Ele continuava derrubando o site temporariamente e, às vezes, quando uma página carregava, aparecia um erro com a mensagem de “tente novamente” do Discourse.

Obrigado desde já.

[codinghorror (Jeff Atwood)]

Uau, isso parece ser realmente um bug sério!

[riking (Kane York)]

Bug menor: o texto “copiar” pode aparecer em uma citação. (Muito menos grave que o post anterior.)

@pfaffman

copiar

while true; do mdadm --detail /dev/md1|grep "Rebuild Status" ; sleep 10;done

Obter o tempo de energia para todas as unidades

copiar

for x in a b c d ; do smartctl -a /dev/sd$x|grep Power_On; done

O button.copy-cmd precisa ser excluído da citação. Aplicar user-select: none no CSS corrige o Ctrl-C, mas não a funcionalidade de citação.

[j.jaffeux (Joffrey Jaffeux)]

Você tem um link para o seu site? Parece muito estranho que um tema possa causar isso. Quantos blocos de código você tem em uma página?

[j.jaffeux (Joffrey Jaffeux)]

Então, fiz várias alterações aqui. Considerando que nossos problemas eram:

• espaço na tela em dispositivos móveis
• bug de copiar texto em citações
• e tivemos solicitações para usar um ícone em vez de texto

A solução óbvia que resolve tudo isso… foi usar um ícone.

No mobile, agora é aceitável deixá-lo à direita, já que ocupa menos espaço e podemos apenas adicionar algum espaçamento para o texto:

Único incômodo menor: em linhas PRIMEIRAS longas, ele ficará oculto atrás do botão. Acho que é aceitável, já que você pode rolar a página:

E no Desktop, funcionará como antes, sem o bug de citação:

Quanto ao possível bug de desempenho, testei uma página com dezenas de blocos de código e não encontrei nenhum problema. Então, precisarei de uma reprodução antes de poder fazer qualquer coisa @lcestou, por favor.

Teste o novo bloco de código aqui:

rsync -a file.txt file_backup.txt
rsync -a /var/www/public_html/ /var/www/public_html_backup/

[justin (Justin DiRose)]

Essa funcionalidade agora está no núcleo do Discourse

Como resultado, este componente do tema está agora OBSOLETO. Ele continuará funcionando para versões mais antigas do Discourse, mas não receberá mais atualizações.

Atualizei a postagem original para refletir essa informação.