Usar o JavaScript para trabalhar com conteúdo ou estilo
O recurso Publicação de PDF nativo permite executar o JavaScript para manipular o conteúdo ou estilo aplicado no conteúdo antes que o PDF final seja gerado. Esse recurso oferece controle total sobre como a saída final é gerada. Por exemplo, você pode adicionar informações de avisos legais à saída PDF, que reside em outro PDF. Com o JavaScript, você pode adicionar as informações de avisos legais depois que o PDF for criado para o conteúdo base, mas antes que o PDF final seja gerado.
Para oferecer suporte à execução do JavaScript, o recurso Publicação de PDF nativo fornece as seguintes funções de retorno de chamada:
window.pdfLayout.onBeforeCreateTOC(callback): Essa função de retorno de chamada é executada antes que o sumário seja gerado.window.pdfLayout.onBeforePagination(callback): essa função de retorno de chamada é executada após a geração do sumário, mas antes de as quebras de página serem adicionadas no PDF.window.pdfLayout.onAfterPagination(callback): essa função de retorno de chamada é executada após o sumário e as quebras de página serem adicionadas no PDF.
Com base no tipo de conteúdo ou na modificação de estilo que deseja executar, você pode escolher qual função de retorno de chamada usar. Por exemplo, se você deseja adicionar conteúdo, é recomendável fazer isso antes que o índice seja gerado. Da mesma forma, se você quiser fazer algumas atualizações de estilo, elas poderão ser feitas antes ou depois da paginação.
No exemplo a seguir, a posição dos títulos das figuras é alterada de para acima das imagens para abaixo das imagens. Para isso, é necessário ativar a opção de execução de JavaScript na predefinição. Para fazer isso, execute as seguintes etapas:
- Abra a predefinição para edição.
- Vá para a guia Avançado.
- Selecione a opção Habilitar JavaScript.
- Salve a predefinição e feche.
Em seguida, crie um arquivo JavaScript com o seguinte código e salve-o na pasta Resources do seu modelo:
...
/*
* DITA only allows the figure title to be placed above images
* This JavaScript code is used to move the figure title below the image
* */
window.addEventListener('DOMContentLoaded', function () {
window.pdfLayout.onBeforeCreateTOC(function() {
var titleNodes = document.querySelectorAll('.fig > .title')
for (var i = 0; i < titleNodes.length; i++) {
var titleNode = titleNodes[i]
var figNode = titleNode.parentNode
var imageNode = figNode.querySelector('.image')
if(imageNode && imageNode.parentNode !== figNode) {
imageNode = imageNode.parentNode
}
if (figNode && imageNode && imageNode.parentNode === figNode) {
figNode.insertBefore(imageNode, titleNode)
}
}
})
});
...
window.addEventListener('DOMContentLoaded', function () deve ser chamada antes de as funções de retorno de chamada serem usadas.Em seguida, esse script deve ser chamado de um arquivo de modelo usado para gerar a saída de PDF. Para nosso exemplo, vamos adicioná-lo no modelo de índice. Verifique se a marca <script> foi adicionada em uma marca <div> predefinida dentro da marca <body>. Se você adicioná-lo na tag <head> ou fora da tag <body>, o script não será executado.
A saída gerada usando esse código e o modelo exibem o título da figura abaixo da imagem:
Adicionar uma marca d'água à saída do PDF para documentos de rascunho watermark-draft-document
Também é possível usar o JavaScript para adicionar marcas d'água condicionais. Essas marcas d'água são adicionadas ao documento quando a condição definida é atendida.
Por exemplo, você pode criar um arquivo JavaScript com o seguinte código para criar uma marca d'água na saída PDF do documento que ainda não foi aprovado. Essa marca d'água não aparecerá se você gerar o PDF para o documento no estado de documento ‘Aprovado’.
...
/*
* This file can be used to add a watermark to the PDF output
* */
window.addEventListener('DOMContentLoaded', function () {
var watermark = 'Draft'
var metaTag = document.getElementsByTagName('meta')
css = "@page {\n @left-middle {\n content: \"".concat(watermark, "\";\n z-index: 100;\n font-family: sans-serif;\n font-size: 80pt;\n font-weight: bold;\n color: gray(0, 0.3);\n text-align: center;\n transform: rotate(-54.7deg);\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n }\n}")
head = document.head || document.getElementsByTagName('head')[0], style = document.createElement('style');
style.appendChild(document.createTextNode(css));
window.pdfLayout.onBeforePagination(function () {
for (let i = 0; i < metaTag.length; i++) {
if (metaTag[i].getAttribute('name') === 'docstate' && metaTag[i].getAttribute('value') !== 'Approved') {
head.appendChild(style);
}
}
})
});
...
A saída de PDF gerada com esse código exibe uma marca d'água Rascunho na página de capa do seu documento:
