Pdf.js: Escreva um exemplo para o visualizador de página única

Criado em 24 set. 2017  ·  8Comentários  ·  Fonte: mozilla/pdf.js

Na solicitação pull # 8724, um visualizador de página única foi implementado. Seria bom ter um exemplo de componentes na pasta examples que demonstrasse como usar este visualizador.

1-other 5-good-beginner-bug

Comentários muito úteis

Na pasta de componentes, pageviewer.js é um exemplo que usa pdf_page_view.js para exibir arquivos PDF normalmente. Preciso criar um exemplo como singlepageviewer.js que usa pdf_single_page_viewer.js.

Considerando que PDFSinglePageViewer implementa a mesma interface de PDFViewer , baseando o novo exemplo em https://github.com/mozilla/pdf.js/blob/master/examples/components/simpleviewer.js seria um ponto de partida muito mais apropriado.

Todos 8 comentários

Oi! Eu gostaria de abordar esse problema. Esta é a primeira vez que resolvo um problema no Github, então adoraria se você pudesse me ajudar a descobrir como começar.
Já tenho uma cópia local em execução com o servidor gulp.

Existem exemplos de componentes na pasta https://github.com/mozilla/pdf.js/tree/master/examples/components . O objetivo deste patch é adicionar um exemplo que usa PDFSinglePageViewer . Como os outros exemplos lá, ele pode simplesmente carregar o arquivo PDF Tracemonkey padrão.

Obrigado! Vou tentar trabalhar nisso.

Então, estou ficando um pouco confuso aqui. Isso é o que eu entendi:
Na pasta de componentes, pageviewer.js é um exemplo que usa pdf_page_view.js para exibir arquivos PDF normalmente. Preciso criar um exemplo como singlepageviewer.js que usa pdf_single_page_viewer.js.

Estou no caminho certo até agora?

Então, basicamente, é isso que preciso editar do arquivo pageviewer.js para que ele use o visualizador de página única?

return pdfDocument.getPage(PAGE_TO_VIEW).then(function (pdfPage) {
    // Creating the page view with default parameters.
    var pdfPageView = new PDFJS.PDFPageView({
      container: container,
      id: PAGE_TO_VIEW,
      scale: SCALE,
      defaultViewport: pdfPage.getViewport(SCALE),
      // We can enable text/annotations layers, if needed
      textLayerFactory: new PDFJS.DefaultTextLayerFactory(),
      annotationLayerFactory: new PDFJS.DefaultAnnotationLayerFactory()
    });
    // Associates the actual page with the view, and drawing it
    pdfPageView.setPdfPage(pdfPage);
    return pdfPageView.draw();
  });

Aqui está o que singlepageviewer.js contém como a parte editada:

return pdfDocument.getPage(PAGE_TO_VIEW).then(function (pdfPage) {
    // Creating the page view with default parameters.
    var pdfSinglePageView = new PDFJS.PDFSinglePageViewer({
      container: container,
      id: PAGE_TO_VIEW,
      scale: SCALE,
      defaultViewport: pdfPage.getViewport(SCALE),
      // We can enable text/annotations layers, if needed
      textLayerFactory: new PDFJS.DefaultTextLayerFactory(),
      annotationLayerFactory: new PDFJS.DefaultAnnotationLayerFactory()
    });
    // Associates the actual page with the view, and drawing it
    pdfSinglePageView.setPdfPage(pdfPage);
    return pdfSinglePageView.draw();
  });

Minha abordagem até agora está fazendo sentido?

Muito obrigado pelo seu tempo!

Repostagem do comentário com a formatação adequada.

Na pasta de componentes, pageviewer.js é um exemplo que usa pdf_page_view.js para exibir arquivos PDF normalmente. Preciso criar um exemplo como singlepageviewer.js que usa pdf_single_page_viewer.js.

Considerando que PDFSinglePageViewer implementa a mesma interface de PDFViewer , baseando o novo exemplo em https://github.com/mozilla/pdf.js/blob/master/examples/components/simpleviewer.js seria um ponto de partida muito mais apropriado.

Obrigado por esse conselho!
Enviei uma solicitação de pull https://github.com/mozilla/pdf.js/pull/8989. Reveja-o e informe-me se for necessário fazer alguma alteração.

Editar:
Não sei se estou faltando alguma coisa aqui, mas nenhum dos exemplos de componentes exibe nada no navegador em http://localhost:8888/examples/components/{anyfile}.html . O console mostra os seguintes erros:

singlepageviewer.html:38 GET http://localhost:8888/node_modules/pdfjs-dist/web/pdf_viewer.css net::ERR_ABORTED
singlepageviewer.html:40 GET http://localhost:8888/node_modules/pdfjs-dist/build/pdf.js net::ERR_ABORTED
singlepageviewer.html:41 GET http://localhost:8888/node_modules/pdfjs-dist/web/pdf_single_page_viewer.js net::ERR_ABORTED
singlepageviewer.js:18 Uncaught ReferenceError: PDFJS is not defined
    at singlepageviewer.js:18

Não sei se estou faltando alguma coisa aqui, mas nenhum dos exemplos de componentes exibe nada no navegador em http: // localhost : 8888 / examples / components / {anyfile} .html. O console mostra os seguintes erros:

Conforme mencionado nos arquivos *.js dos exemplos, veja, por exemplo, aqui , você executou gulp dist-install ?

Entendi, obrigado!
Aqui está a solicitação de pull incluindo todas as suas alterações revisadas e de acordo com o wiki Contributing and Squashing Commits: https://github.com/mozilla/pdf.js/pull/8990
Muito obrigado pelo seu tempo!

Esta página foi útil?
0 / 5 - 0 avaliações