Olá, @davidkingham
Se entendi bem o script que você escreveu, o segundo impede a abertura do menu de contexto quando você clica com o botão direito em uma imagem que foi aberta na lightbox.
O primeiro deveria fazer o mesmo quando você clica com o botão direito em qualquer imagem, por exemplo, a miniatura na postagem.
Mas não funciona, ainda consigo abrir o menu secundário e abrir a imagem completa em outra janela.
Tentei colocar isso no CSS:
img {
pointer-events: none;
}
Isso impede a abertura do menu de contexto, mas também impede que você clique na imagem para abrir a lightbox.
O que está errado?
Seria ótimo ocultar os links de download sob a lightbox.
Eu tinha esta entrada no CSS anteriormente:
.image-source-link {
display: none;
}
Mas agora também não parece funcionar, pois os links download e imagem original são mostrados de qualquer forma sob a imagem da lightbox.
ATUALIZAÇÃO:
Modifiquei o segundo script para incluir também .lightbox-wrapper, e agora parece funcionar e o menu de contexto não é exibido quando você clica com o botão direito em uma imagem em uma postagem, e ele abre corretamente a lightbox quando você clica na imagem.
<script type="text/discourse-plugin" version="0.8">
api.onPageChange((url, title) => {
$("body").on("contextmenu", ".cooked img, .mfp-img, .lightbox-wrapper", function(e) {
e.preventDefault();
});
});
</script>
Devo excluir o primeiro script que tenta fazer o mesmo em um objeto img genérico?
Se eu substituir o CSS de .img-source-link por .mfp-title, funciona, e agora os links de download não são visíveis, mas o título também é ocultado. Não entendo por que ocultar apenas os links não funciona e funciona quando você oculta toda a barra de título.
.mfp-title {
display: none;
}