@bitech-ag/ui5.pdf v0.4.2

ui5.pdf

This library contains a number of controls. The main control is the "Viewer". With the help of this control you can integrate the PDF ad into your apps. The presentation of the PDF is done using the Mozilla PDF.js library. This library has been seamlessly integrated into the control, so there are no problems with the controls' Ui5 lifecycle.

Why another PDF viewer?

There are already several PDF-Viewer. Why do you need another?

A viewer already exists in OpenUI5. This renders the PDF into an iframe and adds a few more controls. With this type of integration you can not influence the presentation of the PDF.

Nabisoft offers another viewer in UI5Lab Nabi Mobile. This variant also uses Mozilla's PDF.js. Here is also working with an IFrame. Only here is not the PDF itself but a viewer of Mozilla included. This can also be changed and expanded. However, you are no longer moving in UI5.

And last but not least, there is the viewer from Wouter Lemaire PDF library. This also uses the PDF.js for rendering. However, he only renders a page. When switching to the next page, the next page overwrites the contents of the Canvas. In our version we have kept more of the original.

How do you integrate the viewer into my application?

With the new capabilities of UI5 Tooling, it is very easy to integrate open source libraries like this into your own applications.

With the new capabilities of UI5 Tooling, it is very easy to integrate open source bibliotics like this into your own applications. You do not need to copy files to your applications. If your app is older and does not have a Ui5.yaml file, you can create this file with UI5 Cli.

1. Insert this repository as a dependency in your Package.json.

dependencies: {
...
"bitech.ui5.pdf": "latest"
...
}

or you use the command line

npm install @bitech-ag/ui5.pdf --save

2. Extend your ui5.yaml file with

---
specVersion: "0.1"
kind: extension
type: project-shim
metadata:
  name: bitech.ui5.pdf
shims:
  configurations:
    pdfjs-dist:
      specVersion: "0.1"
      type: module
      metadata:
        name: "@bitech-ag/ui5.pdf"
      resources:
        configuration:
          paths:
            /resources/bitech/ui5/pdf: ""

Do not forget the three dashes!

3. Now you can integrate the control into your views.

<mvc:View ... xmlns:pdf="bitech.ui5.pdf">
...
<pdf:Viewer src="some.pdf" ></pdf:Viewer>
<!-- or 
<pdf:Viewer />
-->
...
</mvc:View>

How do you contribute to the project?