ZOOM Options in Fiori Client
Question: How to bring ZOOM options?
Question: How to invoke 3rd Party Application to view document?
Answer: Using the Fiori Client built in plugin for attachments.
Below is the code snippet to achieve the functionality.
First we use a simple unified file upload from Demokit with mime type set to “png, jpg, pdf” etc.
Note: For PDF, install 3rd party app like adobe reader/office suite and you can use same code for collection component but remember to change source code to fetch file based on index for collection.
Here is sample fileuploader code used in XML view for your reference.
1. Display the document
Place the below code on change event of the unified uploader.
var oCore = sap.ui.getCore();
var oFile = oEvent.oSource.oFileUpload.files[0];
if (oFile) {
var vPath = URL.createObjectURL(oFile);
try {
if (oFile.type == "application/pdf") {
// For mime type PDF this below code invokes adobe reader
var reader = new FileReader();
reader.readAsDataURL(oFile);
reader.onload = function() {
window.open(reader.result);
};
reader.onerror = function(error) {
sap.m.MessageToast
.show("Unable to open file");
};
} else {
// For mime type JPG PNG this below code invokes gallery
window.open(vPath);
}
} catch (e) { // Error in case of any failures to be catched }2. Download from Getstream and view document
try {
window
.open(encodeURI("/sap/opu/odata/Service/AttachSet(Property1='"
+ vValue1
+ "',Property2='"
+ vValue2
+ "')/$value"));
} catch (e) { // Error in case of any failures to be catched }Note: Based on mime type gallery/in-app window or adobe reader is invoked automatically and since document in viewed in adobe reader or gallery/in-app window its easy to zoom the documents.
Screen shots of how it works.
Open Fiori Client App
Click on browse button
Choose an image for which user needs to zoom in before any operation.
Zoom options will be available since change function of fileuploader is invoked.
Now choose PDF file to invoke pdf app for zoom options.
Similarly when you need to invoke gallery/in-app window or adobe reader with Getstream. Use the download function. It automatically invokes related app based on mime type of backend.
Example of downloading pdf and opening it automatically in pdf app for zoom option/print etc..
