ui5-cc-pdfviewer
A UI5 custom control that renders a PDF from a base64 data URI with pdfjs-dist, so a file picked in the browser can be shown before it has been uploaded anywhere and has a URL.
A UI5 control that displays a PDF expects a file URL, which a document picked from a file uploader does not have until it has been sent somewhere. This takes the base64 data URI instead: the control is PdfViewer in the cc.pdfviewer namespace, bound through its pdfSource property, so a file chosen in the browser can be shown before anything is stored. Installation is the npm package plus two resourceRoots entries in manifest.json, one for the control and one for pdfjs-dist, which is the renderer it ships with. The README states it is a fork of lemaiwo/UI5LabLibraryPDFViewer.
Facts
Where it sits
Who is behind it
In the atlas: maintains 35, contributes to 86, wrote 25@marianfoomaintainerGregor WolfContributes to this
In the atlas: maintains 17, contributes to 59, wrote 2@gregorwolf1 contributor
Before choosing this
Signals
ActivityQuietRelease and repository quiet for 41 months
Both observable publication channels have been quiet for at least 24 full months. This may be normal for stable software; check whether its current state still fits your use.
Conditions
PracticalFunctional boundary
The case it is written for is a document that has not been uploaded; anything already served from a URL is what the framework's own PDF control takes. Passing a document as a data URI means holding it in the page as a string first, which is a different cost from streaming it from a server.
What it declares
Every artifact
- Type
- Package
- Origin
- Independently maintained
As a package
- Where it runs
- Inside its host
- Distributed through
- npm
Connections
Custom controls, wrappers and icon fonts packaged for reuse
Download
Install
npm add ui5-cc-pdfviewerDerived from the package name. No recipe recorded; the README has the configuration.
README
quoted from marianfoo/ui5-cc-pdfviewer under MIT, readUI5Lab Library PDFViewer
This is a fork of https://github.com/lemaiwo/UI5LabLibraryPDFViewer!
The PDFViewer is a custom UI5 control that enables you to view PDF's by using a base64 data uri instead of a file URL. This can be useful in case you want to preview a PDF that you want to upload without uploading it.
Demo
In folder test/pdfviewer, execute npm install and upload a PDF file. Then run npm start.
Usage
Include the library in your project
- Install Control
npm install "ui5-cc-pdfviewer"
- Configure the manifest.json
"resourceRoots": {
"cc.pdfviewer": "./thirdparty/cc/pdfviewer",
"pdfjs-dist": "./thirdparty/cc/pdfviewer/pdfjs-dist/build"
},
- Use the PDF Control
<mvc:View controllerName="pdfviewer.controller.Main"
xmlns:mvc="sap.ui.core.mvc" displayBlock="true"
xmlns="sap.m" xmlns:u="sap.ui.unified" xmlns:pdf ="cc.pdfviewer">
<Page id="page" title="{i18n>title}">
<content>
<u:FileUploader id="upload" fileType="pdf" name="upload" tooltip="Upload your image" change="onFileChange" maximumFileSize="10" sameFilenameAllowed="true"></u:FileUploader>
<Button text="Open PDF in dialog" press="onOpenPDFViewer"/>
<pdf:PdfViewer id="pdfViewer" pdfSource="{/pdfsource}" height="700px"/>
</content>
</Page>
</mvc:View>History
Others providing
Compare all 15 on the Custom controls and libraries page →- custom-controlscustom-controlsThirteen custom controls for abap2UI5, a signature pad and a scanner that reads several barcodes at once among them, each one an ABAP builder class with a single render( ) method and all of them shipped in a BSP of their own.community org, abapThirteen custom UI5 controls for abap2UI5 apps
- @abap2ui5/embed-control@abap2ui5/embed-controlA UI5 custom control that runs an abap2UI5 app inside a host UI5 app, with the abap2UI5 frontend loaded from the backend the app talks to.community org, ui5UI5 custom control that runs an abap2UI5 app inside a host app
- ui5-cc-timerbuttonui5-cc-timerbuttonA UI5 control library with TimerButton, an sap.m.Button that delays becoming enabled or visible and shows other text or an icon in the meantime, with the delay set in milliseconds.independent, ui5UI5 control library with a button that delays enabling or showing
- ui5-control-generatorui5-control-generatorA command-line generator that writes UI5 custom controls, in JavaScript or TypeScript, from the html files in a project, with control logic and renderer split into two files by default.independent, ui5Command line generator of UI5 custom controls from html
- @marianfoo/ui5-cc-dayjs@marianfoo/ui5-cc-dayjsA UI5 custom control that writes a date to the page through Day.js, with the input format, the output format and any shift of days or months set as control properties.independent, ui5UI5 custom control formatting dates with Day.js
- openui5-passwordopenui5-passwordAn OpenUI5 input control of password type that checks the typed value against length and character-class rules set as properties, and scores password strength in a separate property.independent, ui5OpenUI5 password input with strength scoring and rules
- openui5-touropenui5-tourAn OpenUI5 control library for a step-by-step guided tour inside a UI5 app, where each TourStep has a title, content, a target control from the view and a placement.independent, ui5OpenUI5 control library for guided app tours
- ui5-lib-visualizationui5-lib-visualizationA UI5 control library that wraps the C3.js charting library as ui5.viz controls (Chart, ChartSeries, ChartDataPoint, ChartAxis, ChartLine, ChartArea and Color) declared in an XML view with data binding.independent, ui5UI5 control library wrapping C3.js charts as ui5.viz controls
- UI5XUI5XAn OpenUI5 and SAPUI5 library of eight composite controls under the ui5x namespace: skeleton placeholders and a container that swaps them for content, loading wrappers for the responsive and the grid table, an accordion, a copy button, a segmented input and a chat feed.independent, ui5UI5 library of eight composite controls under the ui5x namespace
- openui5-cameraopenui5-cameraA UI5 control that renders a live camera preview from the device's camera and hands the app the picture as a base64-encoded PNG when the user taps it.independent, ui5UI5 control for live camera preview and PNG capture
- ui5-cc-chartui5-cc-chartA UI5 custom control that wraps Chart.js to render a line chart from label and value records, installed as a plain npm dependency with ui5-tooling-modules in ui5.yaml.community org, ui5UI5 custom control wrapping Chart.js for line charts
- ui5-cc-mdui5-cc-mdA UI5 custom control that renders Markdown, including GitHub-flavoured syntax, to HTML inside an XML view, taking its content from a string, a file path or a model binding.community org, ui5UI5 custom control rendering Markdown to HTML
- ui5-fontawesome-libui5-fontawesome-libA UI5 library that adds Font Awesome's regular, solid and brand icon sets to the sap-icon:// namespace, addressable from a standard Icon control, for UI5 1.120.33 or later.community org, ui5UI5 library adding Font Awesome icon sets to sap-icon://
- openui5-paginatoropenui5-paginatorA UI5 custom control that pages through large data in a table, for backends that serve pages over REST rather than OData.independent, ui5A UI5 custom control that pages through large data in a table, for backends that serve pages over REST rather than OData.
Details
Sources
Sources are graph entities: the same page may back several entries, and an unreachable source flags every row that rests on it.
Compatibility and provenance
Contributors
History in the atlas
- Read out of the marianfoo account listing. No lineage edge: the README states the fork of lemaiwo/UI5LabLibraryPDFViewer, and that repository is not in the corpus, so the fact is carried in the description rather than pointed at an id that does not resolve.
- First seen.
For your agent
- Ref
artifact:marianfoo-ui5-cc-pdfviewer- JSON
- /artifacts/marianfoo-ui5-cc-pdfviewer.json
- MCP
- Connecting an agent