Merge pull request #76 from PSPDFKit/simone/feature/image-document

Image document support

Author: simoarpe

android/src/main/java/com/pspdfkit/react/PSPDFKitModule.java

@@ -68,6 +68,23 @@ public void present(@NonNull String document, @NonNull ReadableMap configuration
         }
     }
 
+    @ReactMethod
+    public void presentImage(@NonNull String imageDocument, @NonNull ReadableMap configuration) {
+        if (getCurrentActivity() != null) {
+            if (resumedActivity == null) {
+                // We register an activity lifecycle callback so we can get notified of the current activity.
+                getCurrentActivity().getApplication().registerActivityLifecycleCallbacks(this);
+            }
+            ConfigurationAdapter configurationAdapter = new ConfigurationAdapter(getCurrentActivity(), configuration);
+            // This is an edge case where file scheme is missing.
+            if (Uri.parse(imageDocument).getScheme() == null) {
+                imageDocument = FILE_SCHEME + imageDocument;
+            }
+
+            PdfActivity.showImage(getCurrentActivity(), Uri.parse(imageDocument), configurationAdapter.build());
+        }
+    }
+
     @ReactMethod
     public synchronized void setPageIndex(final int pageIndex, final boolean animated) {
         if (resumedActivity instanceof PdfActivity) {

samples/Catalog/Catalog.android.js

@@ -31,11 +31,19 @@ import { YellowBox } from 'react-native'
 YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated'])
 
 var PSPDFKit = NativeModules.PSPDFKit;
+var RNFS = require('react-native-fs');
 
 const pspdfkitColor = "#267AD4";
 const pspdfkitColorAlpha = "#267AD450";
 
 const DOCUMENT = "file:///sdcard/Annual Report.pdf";
+const IMAGE_DOCUMENT = "file:///sdcard/android.png";
+const CONFIGURATION_IMAGE_DOCUMENT = {
+  showPageNumberOverlay: false,
+  showPageLabels: false,
+  showThumbnailBar: "none"
+};
+
 const CONFIGURATION = {
   startPage: 3,
   scrollContinuously: false,
@@ -57,10 +65,23 @@ var examples = [
   },
   {
     name: "Open local document",
-    description: "Opens document from external storage directory.",
+    description: "Open document from external storage directory.",
+    action: () => {
+      requestExternalStoragePermission(function() {
+        extractFromAssetsIfMissing("Annual Report.pdf", function() {
+          PSPDFKit.present(DOCUMENT, {});
+        });
+      });
+    }
+  },
+  {
+    name: "Open local image document",
+    description: "Open image image document from external storage directory.",
     action: () => {
       requestExternalStoragePermission(function() {
-        PSPDFKit.present(DOCUMENT, {});
+        extractFromAssetsIfMissing("android.png", function() {
+          PSPDFKit.presentImage(IMAGE_DOCUMENT, CONFIGURATION_IMAGE_DOCUMENT);
+        });
       });
     }
   },
@@ -101,6 +122,39 @@ var examples = [
   }
 ];
 
+function extractFromAssetsIfMissing(assetFile, callback) {
+  RNFS.exists("/sdcard/" + assetFile).then((exist) => {
+    if (exist) {
+      console.log(assetFile + " exists in the external storage directory.");
+      callback();
+    } else {
+      console.log(assetFile + " does not exist, extracting it from assets folder to the external storage directory.");
+      RNFS.existsAssets(assetFile).then((exist) => {
+        // Check if the file is present in the assets folder.
+        if(exist) {
+          // File exists so it can be extracted to the external storage directory.
+          RNFS.copyFileAssets(assetFile, "/sdcard/" + assetFile).then(() => {
+            // File copied successfully from assets folder to external storage directory.
+            callback();
+          })
+          .catch((error) => {
+            console.log(error);
+          });
+        } else {
+          // File does not exist, it should never happen.
+          throw new Error(assetFile + " couldn't be extracted as it was not found in the project assets folder.");
+        }
+      })
+      .catch((error) => {
+        console.log(error);
+      });
+    }
+  })
+  .catch((error) => {
+    console.log(error);
+  });
+}
+
 async function requestExternalStoragePermission(callback) {
   try {
     const granted = await PermissionsAndroid.request(

samples/Catalog/android/app/build.gradle

@@ -128,14 +128,15 @@ android {
             }
         }
     }
-    sourceSets { main { assets.srcDirs = ['src/main/assets', '../../../PDFs'] } }
+    sourceSets { main { assets.srcDirs = ['src/main/assets', '../../../PDFs' , '../../../Images'] } }
 }
 
 dependencies {
     compile fileTree(include: ['*.jar'], dir: 'libs')
     compile 'com.facebook.react:react-native:+'
     // From node_modules
     compile project(':react-native-pspdfkit')
+    compile project(':react-native-fs')
 }
 
 // Run this once to be able to run the application with BUCK

samples/Catalog/android/app/src/main/java/com/pspdfkit/react/catalog/MainApplication.java

@@ -16,6 +16,7 @@
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import com.rnfs.RNFSPackage;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
 import com.facebook.react.shell.MainReactPackage;
@@ -37,6 +38,7 @@ public boolean getUseDeveloperSupport() {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new MainReactPackage(),
+          new RNFSPackage(),
           new PSPDFKitPackage()
       );
     }

samples/Catalog/android/settings.gradle

@@ -1,4 +1,6 @@
 rootProject.name = 'Catalog'
+include ':react-native-fs'
+project(':react-native-fs').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fs/android')
 
 include ':app'
 

samples/Catalog/package.json

@@ -1,14 +1,14 @@
 {
   "name": "Catalog",
-  "version": "1.10.0",
+  "version": "1.11.0",
   "private": true,
   "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start"
   },
   "dependencies": {
     "react": "16.3.1",
     "react-native": "0.55.4",
-    "react-native-fs": "2.9.0",
+    "react-native-fs": "2.10.14",
     "react-native-pspdfkit": "file:../../",
     "react-native-windows": "0.51.0-rc.0",
     "react-navigation": "^1.0.3",