diff --git a/.gitignore b/.gitignore index eb36a796..c736c47a 100644 --- a/.gitignore +++ b/.gitignore @@ -6,3 +6,5 @@ Examples/VideoPlayer/VideoPlayer.xcodeproj/project.xcworkspace/**/* Examples/VideoPlayer/VideoPlayer.xcodeproj/xcuserdata/**/* npm-debug.log .DS_Store +build/ +.gradle/ diff --git a/Examples/VideoPlayer/.flowconfig b/Examples/VideoPlayer/.flowconfig new file mode 100644 index 00000000..8eadd339 --- /dev/null +++ b/Examples/VideoPlayer/.flowconfig @@ -0,0 +1,63 @@ +[ignore] + +# We fork some components by platform. +.*/*.web.js +.*/*.android.js + +# Some modules have their own node_modules with overlap +.*/node_modules/node-haste/.* + +# Ugh +.*/node_modules/babel.* +.*/node_modules/babylon.* +.*/node_modules/invariant.* + +# Ignore react and fbjs where there are overlaps, but don't ignore +# anything that react-native relies on +.*/node_modules/fbjs-haste/.*/__tests__/.* +.*/node_modules/fbjs-haste/__forks__/Map.js +.*/node_modules/fbjs-haste/__forks__/Promise.js +.*/node_modules/fbjs-haste/__forks__/fetch.js +.*/node_modules/fbjs-haste/core/ExecutionEnvironment.js +.*/node_modules/fbjs-haste/core/isEmpty.js +.*/node_modules/fbjs-haste/crypto/crc32.js +.*/node_modules/fbjs-haste/stubs/ErrorUtils.js +.*/node_modules/react-haste/React.js +.*/node_modules/react-haste/renderers/dom/ReactDOM.js +.*/node_modules/react-haste/renderers/shared/event/eventPlugins/ResponderEventPlugin.js + +# Ignore commoner tests +.*/node_modules/commoner/test/.* + +# See https://github.com/facebook/flow/issues/442 +.*/react-tools/node_modules/commoner/lib/reader.js + +# Ignore jest +.*/node_modules/jest-cli/.* + +# Ignore Website +.*/website/.* + +[include] + +[libs] +node_modules/react-native/Libraries/react-native/react-native-interface.js + +[options] +module.system=haste + +munge_underscores=true + +module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub' +module.name_mapper='^[./a-zA-Z0-9$_-]+\.png$' -> 'RelativeImageStub' + +suppress_type=$FlowIssue +suppress_type=$FlowFixMe +suppress_type=$FixMe + +suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(>=0\\.\\(1[0-8]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\) +suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(>=0\\.\\(1[0-8]\\|[0-9]\\).[0-9]\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)? #[0-9]+ +suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy + +[version] +0.18.1 diff --git a/Examples/VideoPlayer/.watchmanconfig b/Examples/VideoPlayer/.watchmanconfig new file mode 100644 index 00000000..9e26dfee --- /dev/null +++ b/Examples/VideoPlayer/.watchmanconfig @@ -0,0 +1 @@ +{} \ No newline at end of file diff --git a/Examples/VideoPlayer/android/app/build.gradle b/Examples/VideoPlayer/android/app/build.gradle new file mode 100644 index 00000000..1c09ff66 --- /dev/null +++ b/Examples/VideoPlayer/android/app/build.gradle @@ -0,0 +1,79 @@ +apply plugin: "com.android.application" + +/** + * The react.gradle file registers two tasks: bundleDebugJsAndAssets and bundleReleaseJsAndAssets. + * These basically call `react-native bundle` with the correct arguments during the Android build + * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the + * bundle directly from the development server. Below you can see all the possible configurations + * and their defaults. If you decide to add a configuration block, make sure to add it before the + * `apply from: "react.gradle"` line. + * + * project.ext.react = [ + * // the name of the generated asset file containing your JS bundle + * bundleAssetName: "index.android.bundle", + * + * // the entry file for bundle generation + * entryFile: "index.android.js", + * + * // whether to bundle JS and assets in debug mode + * bundleInDebug: false, + * + * // whether to bundle JS and assets in release mode + * bundleInRelease: true, + * + * // the root of your project, i.e. where "package.json" lives + * root: "../../", + * + * // where to put the JS bundle asset in debug mode + * jsBundleDirDebug: "$buildDir/intermediates/assets/debug", + * + * // where to put the JS bundle asset in release mode + * jsBundleDirRelease: "$buildDir/intermediates/assets/release", + * + * // where to put drawable resources / React Native assets, e.g. the ones you use via + * // require('./image.png')), in debug mode + * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", + * + * // where to put drawable resources / React Native assets, e.g. the ones you use via + * // require('./image.png')), in release mode + * resourcesDirRelease: "$buildDir/intermediates/res/merged/release", + * + * // by default the gradle tasks are skipped if none of the JS files or assets change; this means + * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to + * // date; if you have any other folders that you want to ignore for performance reasons (gradle + * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ + * // for example, you might want to remove it from here. + * inputExcludes: ["android/**", "ios/**"] + * ] + */ + +apply from: "react.gradle" + +android { + compileSdkVersion 23 + buildToolsVersion "23.0.1" + + defaultConfig { + applicationId "com.videoplayer" + minSdkVersion 16 + targetSdkVersion 22 + versionCode 1 + versionName "1.0" + ndk { + abiFilters "armeabi-v7a", "x86" + } + } + buildTypes { + release { + minifyEnabled false // Set this to true to enable Proguard + proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" + } + } +} + +dependencies { + compile fileTree(dir: "libs", include: ["*.jar"]) + compile "com.android.support:appcompat-v7:23.0.1" + compile "com.facebook.react:react-native:0.16.+" + compile project(':RCTVideo') +} diff --git a/Examples/VideoPlayer/android/app/proguard-rules.pro b/Examples/VideoPlayer/android/app/proguard-rules.pro new file mode 100644 index 00000000..ffa8c9f6 --- /dev/null +++ b/Examples/VideoPlayer/android/app/proguard-rules.pro @@ -0,0 +1,60 @@ +# Add project specific ProGuard rules here. +# By default, the flags in this file are appended to flags specified +# in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt +# You can edit the include path and order by changing the proguardFiles +# directive in build.gradle. +# +# For more details, see +# http://developer.android.com/guide/developing/tools/proguard.html + +# Add any project specific keep options here: + +# If your project uses WebView with JS, uncomment the following +# and specify the fully qualified class name to the JavaScript interface +# class: +#-keepclassmembers class fqcn.of.javascript.interface.for.webview { +# public *; +#} + +# Disabling obfuscation is useful if you collect stack traces from production crashes +# (unless you are using a system that supports de-obfuscate the stack traces). +-dontobfuscate + +# React Native + +# Keep our interfaces so they can be used by other ProGuard rules. +# See http://sourceforge.net/p/proguard/bugs/466/ +-keep,allowobfuscation @interface com.facebook.proguard.annotations.DoNotStrip +-keep,allowobfuscation @interface com.facebook.proguard.annotations.KeepGettersAndSetters + +# Do not strip any method/class that is annotated with @DoNotStrip +-keep @com.facebook.proguard.annotations.DoNotStrip class * +-keepclassmembers class * { + @com.facebook.proguard.annotations.DoNotStrip *; +} + +-keepclassmembers @com.facebook.proguard.annotations.KeepGettersAndSetters class * { + void set*(***); + *** get*(); +} + +-keep class * extends com.facebook.react.bridge.JavaScriptModule { *; } +-keep class * extends com.facebook.react.bridge.NativeModule { *; } +-keepclassmembers class * { @com.facebook.react.uimanager.UIProp ; } +-keepclassmembers class * { @com.facebook.react.uimanager.ReactProp ; } +-keepclassmembers class * { @com.facebook.react.uimanager.ReactPropGroup ; } + +# okhttp + +-keepattributes Signature +-keepattributes *Annotation* +-keep class com.squareup.okhttp.** { *; } +-keep interface com.squareup.okhttp.** { *; } +-dontwarn com.squareup.okhttp.** + +# okio + +-keep class sun.misc.Unsafe { *; } +-dontwarn java.nio.file.* +-dontwarn org.codehaus.mojo.animal_sniffer.IgnoreJRERequirement +-dontwarn okio.** diff --git a/Examples/VideoPlayer/android/app/react.gradle b/Examples/VideoPlayer/android/app/react.gradle new file mode 100644 index 00000000..1e08b00f --- /dev/null +++ b/Examples/VideoPlayer/android/app/react.gradle @@ -0,0 +1,87 @@ +import org.apache.tools.ant.taskdefs.condition.Os + +def config = project.hasProperty("react") ? project.react : []; + +def bundleAssetName = config.bundleAssetName ?: "index.android.bundle" +def entryFile = config.entryFile ?: "index.android.js" + +// because elvis operator +def elvisFile(thing) { + return thing ? file(thing) : null; +} + +def reactRoot = elvisFile(config.root) ?: file("../../") +def jsBundleDirDebug = elvisFile(config.jsBundleDirDebug) ?: + file("$buildDir/intermediates/assets/debug") +def jsBundleDirRelease = elvisFile(config.jsBundleDirRelease) ?: + file("$buildDir/intermediates/assets/release") +def resourcesDirDebug = elvisFile(config.resourcesDirDebug) ?: + file("$buildDir/intermediates/res/merged/debug") +def resourcesDirRelease = elvisFile(config.resourcesDirRelease) ?: + file("$buildDir/intermediates/res/merged/release") +def inputExcludes = config.inputExcludes ?: ["android/**", "ios/**"] + +def jsBundleFileDebug = file("$jsBundleDirDebug/$bundleAssetName") +def jsBundleFileRelease = file("$jsBundleDirRelease/$bundleAssetName") + +task bundleDebugJsAndAssets(type: Exec) { + // create dirs if they are not there (e.g. the "clean" task just ran) + doFirst { + jsBundleDirDebug.mkdirs() + resourcesDirDebug.mkdirs() + } + + // set up inputs and outputs so gradle can cache the result + inputs.files fileTree(dir: reactRoot, excludes: inputExcludes) + outputs.dir jsBundleDirDebug + outputs.dir resourcesDirDebug + + // set up the call to the react-native cli + workingDir reactRoot + if (Os.isFamily(Os.FAMILY_WINDOWS)) { + commandLine "cmd", "/c", "react-native", "bundle", "--platform", "android", "--dev", "true", "--entry-file", + entryFile, "--bundle-output", jsBundleFileDebug, "--assets-dest", resourcesDirDebug + } else { + commandLine "react-native", "bundle", "--platform", "android", "--dev", "true", "--entry-file", + entryFile, "--bundle-output", jsBundleFileDebug, "--assets-dest", resourcesDirDebug + } + + enabled config.bundleInDebug ?: false +} + +task bundleReleaseJsAndAssets(type: Exec) { + // create dirs if they are not there (e.g. the "clean" task just ran) + doFirst { + jsBundleDirRelease.mkdirs() + resourcesDirRelease.mkdirs() + } + + // set up inputs and outputs so gradle can cache the result + inputs.files fileTree(dir: reactRoot, excludes: inputExcludes) + outputs.dir jsBundleDirRelease + outputs.dir resourcesDirRelease + + // set up the call to the react-native cli + workingDir reactRoot + if (Os.isFamily(Os.FAMILY_WINDOWS)) { + commandLine "cmd","/c", "react-native", "bundle", "--platform", "android", "--dev", "false", "--entry-file", + entryFile, "--bundle-output", jsBundleFileRelease, "--assets-dest", resourcesDirRelease + } else { + commandLine "react-native", "bundle", "--platform", "android", "--dev", "false", "--entry-file", + entryFile, "--bundle-output", jsBundleFileRelease, "--assets-dest", resourcesDirRelease + } + + enabled config.bundleInRelease ?: true +} + +gradle.projectsEvaluated { + // hook bundleDebugJsAndAssets into the android build process + bundleDebugJsAndAssets.dependsOn mergeDebugResources + bundleDebugJsAndAssets.dependsOn mergeDebugAssets + processDebugResources.dependsOn bundleDebugJsAndAssets + + // hook bundleReleaseJsAndAssets into the android build process + bundleReleaseJsAndAssets.dependsOn mergeReleaseResources + bundleReleaseJsAndAssets.dependsOn mergeReleaseAssets + processReleaseResources.dependsOn bundleReleaseJsAndAssets +} diff --git a/Examples/VideoPlayer/android/app/src/main/AndroidManifest.xml b/Examples/VideoPlayer/android/app/src/main/AndroidManifest.xml new file mode 100644 index 00000000..3d5f5155 --- /dev/null +++ b/Examples/VideoPlayer/android/app/src/main/AndroidManifest.xml @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + diff --git a/Examples/VideoPlayer/android/app/src/main/java/com/videoplayer/MainActivity.java b/Examples/VideoPlayer/android/app/src/main/java/com/videoplayer/MainActivity.java new file mode 100644 index 00000000..bb84c0e5 --- /dev/null +++ b/Examples/VideoPlayer/android/app/src/main/java/com/videoplayer/MainActivity.java @@ -0,0 +1,80 @@ +package com.videoplayer; + +import android.app.Activity; +import android.os.Bundle; +import android.view.KeyEvent; + +import com.brentvatne.react.ReactVideoPackage; +import com.facebook.react.LifecycleState; +import com.facebook.react.ReactInstanceManager; +import com.facebook.react.ReactRootView; +import com.facebook.react.modules.core.DefaultHardwareBackBtnHandler; +import com.facebook.react.shell.MainReactPackage; +import com.facebook.soloader.SoLoader; + +public class MainActivity extends Activity implements DefaultHardwareBackBtnHandler { + + private ReactInstanceManager mReactInstanceManager; + private ReactRootView mReactRootView; + + @Override + protected void onCreate(Bundle savedInstanceState) { + super.onCreate(savedInstanceState); + mReactRootView = new ReactRootView(this); + + mReactInstanceManager = ReactInstanceManager.builder() + .setApplication(getApplication()) + .setBundleAssetName("index.android.bundle") + .setJSMainModuleName("index.android") + .addPackage(new MainReactPackage()) + .addPackage(new ReactVideoPackage()) + .setUseDeveloperSupport(BuildConfig.DEBUG) + .setInitialLifecycleState(LifecycleState.RESUMED) + .build(); + + mReactRootView.startReactApplication(mReactInstanceManager, "VideoPlayer", null); + + setContentView(mReactRootView); + } + + @Override + public boolean onKeyUp(int keyCode, KeyEvent event) { + if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) { + mReactInstanceManager.showDevOptionsDialog(); + return true; + } + return super.onKeyUp(keyCode, event); + } + + @Override + public void onBackPressed() { + if (mReactInstanceManager != null) { + mReactInstanceManager.onBackPressed(); + } else { + super.onBackPressed(); + } + } + + @Override + public void invokeDefaultOnBackPressed() { + super.onBackPressed(); + } + + @Override + protected void onPause() { + super.onPause(); + + if (mReactInstanceManager != null) { + mReactInstanceManager.onPause(); + } + } + + @Override + protected void onResume() { + super.onResume(); + + if (mReactInstanceManager != null) { + mReactInstanceManager.onResume(this, this); + } + } +} diff --git a/Examples/VideoPlayer/android/app/src/main/res/mipmap-hdpi/ic_launcher.png b/Examples/VideoPlayer/android/app/src/main/res/mipmap-hdpi/ic_launcher.png new file mode 100644 index 00000000..cde69bcc Binary files /dev/null and b/Examples/VideoPlayer/android/app/src/main/res/mipmap-hdpi/ic_launcher.png differ diff --git a/Examples/VideoPlayer/android/app/src/main/res/mipmap-mdpi/ic_launcher.png b/Examples/VideoPlayer/android/app/src/main/res/mipmap-mdpi/ic_launcher.png new file mode 100644 index 00000000..c133a0cb Binary files /dev/null and b/Examples/VideoPlayer/android/app/src/main/res/mipmap-mdpi/ic_launcher.png differ diff --git a/Examples/VideoPlayer/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png b/Examples/VideoPlayer/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png new file mode 100644 index 00000000..bfa42f0e Binary files /dev/null and b/Examples/VideoPlayer/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png differ diff --git a/Examples/VideoPlayer/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png b/Examples/VideoPlayer/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png new file mode 100644 index 00000000..324e72cd Binary files /dev/null and b/Examples/VideoPlayer/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png differ diff --git a/Examples/VideoPlayer/android/app/src/main/res/raw/broadchurch.mp4 b/Examples/VideoPlayer/android/app/src/main/res/raw/broadchurch.mp4 new file mode 100644 index 00000000..7a7a4949 Binary files /dev/null and b/Examples/VideoPlayer/android/app/src/main/res/raw/broadchurch.mp4 differ diff --git a/Examples/VideoPlayer/android/app/src/main/res/values/strings.xml b/Examples/VideoPlayer/android/app/src/main/res/values/strings.xml new file mode 100644 index 00000000..4ec996b5 --- /dev/null +++ b/Examples/VideoPlayer/android/app/src/main/res/values/strings.xml @@ -0,0 +1,3 @@ + + VideoPlayer + diff --git a/Examples/VideoPlayer/android/app/src/main/res/values/styles.xml b/Examples/VideoPlayer/android/app/src/main/res/values/styles.xml new file mode 100644 index 00000000..319eb0ca --- /dev/null +++ b/Examples/VideoPlayer/android/app/src/main/res/values/styles.xml @@ -0,0 +1,8 @@ + + + + + + diff --git a/Examples/VideoPlayer/android/build.gradle b/Examples/VideoPlayer/android/build.gradle new file mode 100644 index 00000000..ccdfc4e3 --- /dev/null +++ b/Examples/VideoPlayer/android/build.gradle @@ -0,0 +1,20 @@ +// Top-level build file where you can add configuration options common to all sub-projects/modules. + +buildscript { + repositories { + jcenter() + } + dependencies { + classpath 'com.android.tools.build:gradle:1.3.1' + + // NOTE: Do not place your application dependencies here; they belong + // in the individual module build.gradle files + } +} + +allprojects { + repositories { + mavenLocal() + jcenter() + } +} diff --git a/Examples/VideoPlayer/android/gradle.properties b/Examples/VideoPlayer/android/gradle.properties new file mode 100644 index 00000000..1fd964e9 --- /dev/null +++ b/Examples/VideoPlayer/android/gradle.properties @@ -0,0 +1,20 @@ +# Project-wide Gradle settings. + +# IDE (e.g. Android Studio) users: +# Gradle settings configured through the IDE *will override* +# any settings specified in this file. + +# For more details on how to configure your build environment visit +# http://www.gradle.org/docs/current/userguide/build_environment.html + +# Specifies the JVM arguments used for the daemon process. +# The setting is particularly useful for tweaking memory settings. +# Default value: -Xmx10248m -XX:MaxPermSize=256m +# org.gradle.jvmargs=-Xmx2048m -XX:MaxPermSize=512m -XX:+HeapDumpOnOutOfMemoryError -Dfile.encoding=UTF-8 + +# When configured, Gradle will run in incubating parallel mode. +# This option should only be used with decoupled projects. More details, visit +# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects +# org.gradle.parallel=true + +android.useDeprecatedNdk=true diff --git a/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.jar b/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.jar new file mode 100644 index 00000000..b5166dad Binary files /dev/null and b/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.jar differ diff --git a/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.properties b/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.properties new file mode 100644 index 00000000..b9fbfaba --- /dev/null +++ b/Examples/VideoPlayer/android/gradle/wrapper/gradle-wrapper.properties @@ -0,0 +1,5 @@ +distributionBase=GRADLE_USER_HOME +distributionPath=wrapper/dists +zipStoreBase=GRADLE_USER_HOME +zipStorePath=wrapper/dists +distributionUrl=https\://services.gradle.org/distributions/gradle-2.4-all.zip diff --git a/Examples/VideoPlayer/android/gradlew b/Examples/VideoPlayer/android/gradlew new file mode 100755 index 00000000..91a7e269 --- /dev/null +++ b/Examples/VideoPlayer/android/gradlew @@ -0,0 +1,164 @@ +#!/usr/bin/env bash + +############################################################################## +## +## Gradle start up script for UN*X +## +############################################################################## + +# Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. +DEFAULT_JVM_OPTS="" + +APP_NAME="Gradle" +APP_BASE_NAME=`basename "$0"` + +# Use the maximum available, or set MAX_FD != -1 to use that value. +MAX_FD="maximum" + +warn ( ) { + echo "$*" +} + +die ( ) { + echo + echo "$*" + echo + exit 1 +} + +# OS specific support (must be 'true' or 'false'). +cygwin=false +msys=false +darwin=false +case "`uname`" in + CYGWIN* ) + cygwin=true + ;; + Darwin* ) + darwin=true + ;; + MINGW* ) + msys=true + ;; +esac + +# For Cygwin, ensure paths are in UNIX format before anything is touched. +if $cygwin ; then + [ -n "$JAVA_HOME" ] && JAVA_HOME=`cygpath --unix "$JAVA_HOME"` +fi + +# Attempt to set APP_HOME +# Resolve links: $0 may be a link +PRG="$0" +# Need this for relative symlinks. +while [ -h "$PRG" ] ; do + ls=`ls -ld "$PRG"` + link=`expr "$ls" : '.*-> \(.*\)$'` + if expr "$link" : '/.*' > /dev/null; then + PRG="$link" + else + PRG=`dirname "$PRG"`"/$link" + fi +done +SAVED="`pwd`" +cd "`dirname \"$PRG\"`/" >&- +APP_HOME="`pwd -P`" +cd "$SAVED" >&- + +CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar + +# Determine the Java command to use to start the JVM. +if [ -n "$JAVA_HOME" ] ; then + if [ -x "$JAVA_HOME/jre/sh/java" ] ; then + # IBM's JDK on AIX uses strange locations for the executables + JAVACMD="$JAVA_HOME/jre/sh/java" + else + JAVACMD="$JAVA_HOME/bin/java" + fi + if [ ! -x "$JAVACMD" ] ; then + die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME + +Please set the JAVA_HOME variable in your environment to match the +location of your Java installation." + fi +else + JAVACMD="java" + which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. + +Please set the JAVA_HOME variable in your environment to match the +location of your Java installation." +fi + +# Increase the maximum file descriptors if we can. +if [ "$cygwin" = "false" -a "$darwin" = "false" ] ; then + MAX_FD_LIMIT=`ulimit -H -n` + if [ $? -eq 0 ] ; then + if [ "$MAX_FD" = "maximum" -o "$MAX_FD" = "max" ] ; then + MAX_FD="$MAX_FD_LIMIT" + fi + ulimit -n $MAX_FD + if [ $? -ne 0 ] ; then + warn "Could not set maximum file descriptor limit: $MAX_FD" + fi + else + warn "Could not query maximum file descriptor limit: $MAX_FD_LIMIT" + fi +fi + +# For Darwin, add options to specify how the application appears in the dock +if $darwin; then + GRADLE_OPTS="$GRADLE_OPTS \"-Xdock:name=$APP_NAME\" \"-Xdock:icon=$APP_HOME/media/gradle.icns\"" +fi + +# For Cygwin, switch paths to Windows format before running java +if $cygwin ; then + APP_HOME=`cygpath --path --mixed "$APP_HOME"` + CLASSPATH=`cygpath --path --mixed "$CLASSPATH"` + + # We build the pattern for arguments to be converted via cygpath + ROOTDIRSRAW=`find -L / -maxdepth 1 -mindepth 1 -type d 2>/dev/null` + SEP="" + for dir in $ROOTDIRSRAW ; do + ROOTDIRS="$ROOTDIRS$SEP$dir" + SEP="|" + done + OURCYGPATTERN="(^($ROOTDIRS))" + # Add a user-defined pattern to the cygpath arguments + if [ "$GRADLE_CYGPATTERN" != "" ] ; then + OURCYGPATTERN="$OURCYGPATTERN|($GRADLE_CYGPATTERN)" + fi + # Now convert the arguments - kludge to limit ourselves to /bin/sh + i=0 + for arg in "$@" ; do + CHECK=`echo "$arg"|egrep -c "$OURCYGPATTERN" -` + CHECK2=`echo "$arg"|egrep -c "^-"` ### Determine if an option + + if [ $CHECK -ne 0 ] && [ $CHECK2 -eq 0 ] ; then ### Added a condition + eval `echo args$i`=`cygpath --path --ignore --mixed "$arg"` + else + eval `echo args$i`="\"$arg\"" + fi + i=$((i+1)) + done + case $i in + (0) set -- ;; + (1) set -- "$args0" ;; + (2) set -- "$args0" "$args1" ;; + (3) set -- "$args0" "$args1" "$args2" ;; + (4) set -- "$args0" "$args1" "$args2" "$args3" ;; + (5) set -- "$args0" "$args1" "$args2" "$args3" "$args4" ;; + (6) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" ;; + (7) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" ;; + (8) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" ;; + (9) set -- "$args0" "$args1" "$args2" "$args3" "$args4" "$args5" "$args6" "$args7" "$args8" ;; + esac +fi + +# Split up the JVM_OPTS And GRADLE_OPTS values into an array, following the shell quoting and substitution rules +function splitJvmOpts() { + JVM_OPTS=("$@") +} +eval splitJvmOpts $DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS +JVM_OPTS[${#JVM_OPTS[*]}]="-Dorg.gradle.appname=$APP_BASE_NAME" + +exec "$JAVACMD" "${JVM_OPTS[@]}" -classpath "$CLASSPATH" org.gradle.wrapper.GradleWrapperMain "$@" diff --git a/Examples/VideoPlayer/android/gradlew.bat b/Examples/VideoPlayer/android/gradlew.bat new file mode 100644 index 00000000..8a0b282a --- /dev/null +++ b/Examples/VideoPlayer/android/gradlew.bat @@ -0,0 +1,90 @@ +@if "%DEBUG%" == "" @echo off +@rem ########################################################################## +@rem +@rem Gradle startup script for Windows +@rem +@rem ########################################################################## + +@rem Set local scope for the variables with windows NT shell +if "%OS%"=="Windows_NT" setlocal + +@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. +set DEFAULT_JVM_OPTS= + +set DIRNAME=%~dp0 +if "%DIRNAME%" == "" set DIRNAME=. +set APP_BASE_NAME=%~n0 +set APP_HOME=%DIRNAME% + +@rem Find java.exe +if defined JAVA_HOME goto findJavaFromJavaHome + +set JAVA_EXE=java.exe +%JAVA_EXE% -version >NUL 2>&1 +if "%ERRORLEVEL%" == "0" goto init + +echo. +echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. +echo. +echo Please set the JAVA_HOME variable in your environment to match the +echo location of your Java installation. + +goto fail + +:findJavaFromJavaHome +set JAVA_HOME=%JAVA_HOME:"=% +set JAVA_EXE=%JAVA_HOME%/bin/java.exe + +if exist "%JAVA_EXE%" goto init + +echo. +echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% +echo. +echo Please set the JAVA_HOME variable in your environment to match the +echo location of your Java installation. + +goto fail + +:init +@rem Get command-line arguments, handling Windowz variants + +if not "%OS%" == "Windows_NT" goto win9xME_args +if "%@eval[2+2]" == "4" goto 4NT_args + +:win9xME_args +@rem Slurp the command line arguments. +set CMD_LINE_ARGS= +set _SKIP=2 + +:win9xME_args_slurp +if "x%~1" == "x" goto execute + +set CMD_LINE_ARGS=%* +goto execute + +:4NT_args +@rem Get arguments from the 4NT Shell from JP Software +set CMD_LINE_ARGS=%$ + +:execute +@rem Setup the command line + +set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar + +@rem Execute Gradle +"%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %CMD_LINE_ARGS% + +:end +@rem End local scope for the variables with windows NT shell +if "%ERRORLEVEL%"=="0" goto mainEnd + +:fail +rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of +rem the _cmd.exe /c_ return code! +if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 +exit /b 1 + +:mainEnd +if "%OS%"=="Windows_NT" endlocal + +:omega diff --git a/Examples/VideoPlayer/android/settings.gradle b/Examples/VideoPlayer/android/settings.gradle new file mode 100644 index 00000000..4c6aa278 --- /dev/null +++ b/Examples/VideoPlayer/android/settings.gradle @@ -0,0 +1,5 @@ +rootProject.name = 'VideoPlayer' + +include ':app' +include ':RCTVideo', ':app' +project(':RCTVideo').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android') diff --git a/Examples/VideoPlayer/iOS/AppDelegate.m b/Examples/VideoPlayer/iOS/AppDelegate.m index 3f7fb409..74dbce6d 100644 --- a/Examples/VideoPlayer/iOS/AppDelegate.m +++ b/Examples/VideoPlayer/iOS/AppDelegate.m @@ -26,7 +26,7 @@ // // To run on device, change `localhost` to the IP address of your computer, and make sure your computer and // iOS device are on the same Wi-Fi network. - jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle"]; + jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"]; // OPTION 2 // Load from pre-bundled file on disk. To re-generate the static bundle, run @@ -38,6 +38,7 @@ RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"VideoPlayer" + initialProperties: nil launchOptions:launchOptions]; self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds]; diff --git a/Examples/VideoPlayer/iOS/Info.plist b/Examples/VideoPlayer/iOS/Info.plist index c6d2494c..e4b8e7c8 100644 --- a/Examples/VideoPlayer/iOS/Info.plist +++ b/Examples/VideoPlayer/iOS/Info.plist @@ -20,8 +20,15 @@ ???? CFBundleVersion 1 + LSApplicationCategoryType + LSRequiresIPhoneOS + NSAppTransportSecurity + + NSAllowsArbitraryLoads + + UILaunchStoryboardName LaunchScreen UIRequiredDeviceCapabilities diff --git a/Examples/VideoPlayer/index.android.js b/Examples/VideoPlayer/index.android.js new file mode 100644 index 00000000..c2533f28 --- /dev/null +++ b/Examples/VideoPlayer/index.android.js @@ -0,0 +1,203 @@ +'use strict'; + +var React = require('react-native'); +var { + AppRegistry, + StyleSheet, + Text, + View, + TouchableOpacity, +} = React; + +var Video = require('react-native-video'); + +var VideoPlayer = React.createClass({ + getInitialState() { + return { + rate: 1, + volume: 1, + muted: false, + resizeMode: 'contain', + duration: 0.0, + currentTime: 0.0, + } + }, + + onLoad(data) { + this.setState({duration: data.duration}); + }, + + onProgress(data) { + this.setState({currentTime: data.currentTime}); + }, + + getCurrentTimePercentage() { + if (this.state.currentTime > 0) { + return parseFloat(this.state.currentTime) / parseFloat(this.state.duration); + } else { + return 0; + } + }, + + renderRateControl(rate) { + var isSelected = (this.state.rate == rate); + + return ( + { this.setState({rate: rate}) }}> + + {rate}x + + + ) + }, + + renderResizeModeControl(resizeMode) { + var isSelected = (this.state.resizeMode == resizeMode); + + return ( + { this.setState({resizeMode: resizeMode}) }}> + + {resizeMode} + + + ) + }, + + renderVolumeControl(volume) { + var isSelected = (this.state.volume == volume); + + return ( + { this.setState({volume: volume}) }}> + + {volume * 100}% + + + ) + }, + + render() { + var flexCompleted = this.getCurrentTimePercentage() * 100; + var flexRemaining = (1 - this.getCurrentTimePercentage()) * 100; + + return ( + + {this.setState({paused: !this.state.paused})}}> + + + + + + {this.renderRateControl(0.25)} + {this.renderRateControl(0.5)} + {this.renderRateControl(1.0)} + {this.renderRateControl(1.5)} + {this.renderRateControl(2.0)} + + + + {this.renderVolumeControl(0.5)} + {this.renderVolumeControl(1)} + {this.renderVolumeControl(1.5)} + + + + {this.renderResizeModeControl('cover')} + {this.renderResizeModeControl('contain')} + {this.renderResizeModeControl('stretch')} + + + + + + + + + + + + ); + } +}); + + +var styles = StyleSheet.create({ + container: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + backgroundColor: 'black', + }, + fullScreen: { + position: 'absolute', + top: 0, + left: 0, + bottom: 0, + right: 0, + }, + controls: { + backgroundColor: "transparent", + borderRadius: 5, + position: 'absolute', + bottom: 20, + left: 20, + right: 20, + }, + progress: { + flex: 1, + flexDirection: 'row', + borderRadius: 3, + overflow: 'hidden', + }, + innerProgressCompleted: { + height: 20, + backgroundColor: '#cccccc', + }, + innerProgressRemaining: { + height: 20, + backgroundColor: '#2C2C2C', + }, + generalControls: { + flex: 1, + flexDirection: 'row', + borderRadius: 4, + overflow: 'hidden', + paddingBottom: 10, + }, + rateControl: { + flex: 1, + flexDirection: 'row', + justifyContent: 'center', + }, + volumeControl: { + flex: 1, + flexDirection: 'row', + justifyContent: 'center', + }, + resizeModeControl: { + flex: 1, + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'center', + }, + controlOption: { + alignSelf: 'center', + fontSize: 11, + color: "white", + paddingLeft: 2, + paddingRight: 2, + lineHeight: 12, + }, +}); + +AppRegistry.registerComponent('VideoPlayer', () => VideoPlayer); diff --git a/Examples/VideoPlayer/index.ios.js b/Examples/VideoPlayer/index.ios.js index 662c676e..c77f53d5 100644 --- a/Examples/VideoPlayer/index.ios.js +++ b/Examples/VideoPlayer/index.ios.js @@ -1,7 +1,3 @@ -/** - * Sample React Native App - * https://github.com/facebook/react-native - */ 'use strict'; var React = require('react-native'); diff --git a/Examples/VideoPlayer/package.json b/Examples/VideoPlayer/package.json index 8afbe365..2d097498 100644 --- a/Examples/VideoPlayer/package.json +++ b/Examples/VideoPlayer/package.json @@ -6,7 +6,7 @@ "start": "node_modules/react-native/packager/packager.sh" }, "dependencies": { - "react-native": "^0.10.0-rc", - "react-native-video": "^0.6.0" + "react-native": "^0.16.0", + "react-native-video": "brentvatne/react-native-video#feature/android-support" } } diff --git a/README.md b/README.md index ceb32f22..4996d34e 100644 --- a/README.md +++ b/README.md @@ -7,15 +7,47 @@ Requires react-native >= 0.4.4 ### Add it to your project -1. Run `npm install react-native-video --save` -2. Open your project in XCode, right click on `Libraries` and click `Add Files to "Your Project Name"` +Run `npm install react-native-video --save` + +#### iOS + +1. Open your project in XCode, right click on `Libraries` and click `Add Files to "Your Project Name"` * ![Screenshot](http://url.brentvatne.ca/jQp8.png) ![Screenshot](http://url.brentvatne.ca/1gqUD.png) (use the RCTVideo project rather than the one pictured in screenshot). -3. Add `libRTCVideo.a` to `Build Phases -> Link Binary With Libraries` +2. Add `libRTCVideo.a` to `Build Phases -> Link Binary With Libraries` ![(Screenshot)](http://url.brentvatne.ca/g9Wp.png). -4. Add `.mp4` video file to project and to `Build Phases -> Copy Bundle Resources` -5. Whenever you want to use it within React code now you can: `var Video = +3. Add `.mp4` video file to project and to `Build Phases -> Copy Bundle Resources` +4. Whenever you want to use it within React code now you can: `var Video = require('react-native-video');` +#### Android + +Make the following additions to the given files. + +**android/settings.gradle** +``` +include ':RCTVideo', ':app' +project(':RCTVideo').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android') +``` + +**android/app/build.gradle** +``` +dependencies { + ... + compile project(':RCTVideo') +} +``` + +**MainActivity.java** + +On top, where imports are: +```java +import com.brentvatne.react.ReactVideoPackage; +``` + +Under `.addPackage(new MainReactPackage())`: +```java +.addPackage(new ReactVideoPackage()) +``` ## Usage @@ -48,6 +80,7 @@ var styles = Stylesheet.create({ }, }); ``` + ## Static Methods `seek(seconds)` diff --git a/Video.android.js b/Video.android.js deleted file mode 100644 index 50209c90..00000000 --- a/Video.android.js +++ /dev/null @@ -1,9 +0,0 @@ -'use strict'; - -var Video = { - test: function() { - console.warn("Not yet implemented for Android."); - } -}; - -module.exports = Video; diff --git a/Video.ios.js b/Video.ios.js deleted file mode 100644 index 4e716931..00000000 --- a/Video.ios.js +++ /dev/null @@ -1,109 +0,0 @@ -var React = require('react-native'); -var { StyleSheet, requireNativeComponent, PropTypes, NativeModules, } = React; - -var VideoResizeMode = require('./VideoResizeMode'); -var { extend } = require('lodash'); - -var VIDEO_REF = 'video'; - -var Video = React.createClass({ - propTypes: { - /* Native only */ - src: PropTypes.object, - seek: PropTypes.number, - - /* Wrapper component */ - source: PropTypes.object, - resizeMode: PropTypes.string, - repeat: PropTypes.bool, - paused: PropTypes.bool, - muted: PropTypes.bool, - volume: PropTypes.number, - rate: PropTypes.number, - onLoadStart: PropTypes.func, - onLoad: PropTypes.func, - onError: PropTypes.func, - onProgress: PropTypes.func, - onEnd: PropTypes.func, - }, - - setNativeProps(props) { - this.refs[VIDEO_REF].setNativeProps(props); - }, - - _onLoadStart(event) { - this.props.onLoadStart && this.props.onLoadStart(event.nativeEvent); - }, - - _onLoad(event) { - this.props.onLoad && this.props.onLoad(event.nativeEvent); - }, - - _onError(event) { - this.props.onError && this.props.onError(event.nativeEvent); - }, - - _onProgress(event) { - this.props.onProgress && this.props.onProgress(event.nativeEvent); - }, - - _onSeek(event) { - this.props.onSeek && this.props.onSeek(event.nativeEvent); - }, - - seek(time) { - this.setNativeProps({seek: parseFloat(time)}); - }, - - _onEnd(event) { - this.props.onEnd && this.props.onEnd(event.nativeEvent); - }, - - render() { - var style = [styles.base, this.props.style]; - var source = this.props.source; - var uri = source.uri; - if (uri && uri.match(/^\//)) { - uri = 'file://' + uri; - } - var isNetwork = !!(uri && uri.match(/^https?:/)); - var isAsset = !!(uri && uri.match(/^(assets-library|file):/)); - - var resizeMode; - if (this.props.resizeMode === VideoResizeMode.stretch) { - resizeMode = NativeModules.VideoManager.ScaleToFill; - } else if (this.props.resizeMode === VideoResizeMode.contain) { - resizeMode = NativeModules.VideoManager.ScaleAspectFit; - } else if (this.props.resizeMode === VideoResizeMode.cover) { - resizeMode = NativeModules.VideoManager.ScaleAspectFill; - } else { - resizeMode = NativeModules.VideoManager.ScaleNone; - } - - var nativeProps = extend({}, this.props, { - style, - resizeMode: resizeMode, - src: { - uri: uri, - isNetwork, - isAsset, - type: source.type || 'mp4' - }, - onVideoLoad: this._onLoad, - onVideoProgress: this._onProgress, - onVideoEnd: this._onEnd, - }); - - return ; - }, -}); - -var RCTVideo = requireNativeComponent('RCTVideo', Video); - -var styles = StyleSheet.create({ - base: { - overflow: 'hidden', - }, -}); - -module.exports = Video; diff --git a/Video.js b/Video.js new file mode 100644 index 00000000..77323549 --- /dev/null +++ b/Video.js @@ -0,0 +1,153 @@ +const React = require('react-native'); +const { + Component, + StyleSheet, + requireNativeComponent, + PropTypes, + NativeModules, + View, +} = React; + +const VideoResizeMode = require('./VideoResizeMode'); + +const styles = StyleSheet.create({ + base: { + overflow: 'hidden', + }, +}); + +class Video extends Component { + + constructor(props, context) { + super(props, context); + this.seek = this.seek.bind(this); + this._onLoadStart = this._onLoadStart.bind(this); + this._onLoad = this._onLoad.bind(this); + this._onError = this._onError.bind(this); + this._onProgress = this._onProgress.bind(this); + this._onSeek = this._onSeek.bind(this); + this._onEnd = this._onEnd.bind(this); + } + + setNativeProps(nativeProps) { + this._root.setNativeProps(nativeProps); + } + + seek(time) { + this.setNativeProps({ seek: parseFloat(time) }); + } + + _onLoadStart(event) { + this.props.onLoadStart && this.props.onLoadStart(event.nativeEvent); + } + + _onLoad(event) { + this.props.onLoad && this.props.onLoad(event.nativeEvent); + } + + _onError(event) { + this.props.onError && this.props.onError(event.nativeEvent); + } + + _onProgress(event) { + this.props.onProgress && this.props.onProgress(event.nativeEvent); + } + + _onSeek(event) { + this.props.onSeek && this.props.onSeek(event.nativeEvent); + } + + _onEnd(event) { + this.props.onEnd && this.props.onEnd(event.nativeEvent); + } + + render() { + const { + style, + source, + ref, + resizeMode, + } = this.props; + + let uri = source.uri; + if (uri && uri.match(/^\//)) { + uri = 'file://' + uri; + } + + const isNetwork = !!(uri && uri.match(/^https?:/)); + const isAsset = !!(uri && uri.match(/^(assets-library|file):/)); + + let nativeResizeMode; + if (resizeMode === VideoResizeMode.stretch) { + nativeResizeMode = NativeModules.UIManager.RCTVideo.Constants.ScaleToFill; + } else if (resizeMode === VideoResizeMode.contain) { + nativeResizeMode = NativeModules.UIManager.RCTVideo.Constants.ScaleAspectFit; + } else if (resizeMode === VideoResizeMode.cover) { + nativeResizeMode = NativeModules.UIManager.RCTVideo.Constants.ScaleAspectFill; + } else { + nativeResizeMode = NativeModules.UIManager.RCTVideo.Constants.ScaleNone; + } + + const nativeProps = Object.assign({}, this.props); + Object.assign(nativeProps, { + style: [styles.base, style], + resizeMode: nativeResizeMode, + src: { + uri: uri, + isNetwork, + isAsset, + type: source.type || 'mp4', + }, + onVideoLoadStart: this._onLoadStart, + onVideoLoad: this._onLoad, + onVideoError: this._onError, + onVideoProgress: this._onProgress, + onVideoSeek: this._onSeek, + onVideoEnd: this._onEnd, + }); + + return ( + this._root = component } + {...nativeProps} /> + ); + } +} + +Video.propTypes = { + /* Native only */ + src: PropTypes.object, + seek: PropTypes.number, + + /* Wrapper component */ + source: PropTypes.object, + resizeMode: PropTypes.string, + repeat: PropTypes.bool, + paused: PropTypes.bool, + muted: PropTypes.bool, + volume: PropTypes.number, + rate: PropTypes.number, + onLoadStart: PropTypes.func, + onLoad: PropTypes.func, + onError: PropTypes.func, + onProgress: PropTypes.func, + onSeek: PropTypes.func, + onEnd: PropTypes.func, + + /* Required by react-native */ + scaleX: React.PropTypes.number, + scaleY: React.PropTypes.number, + translateX: React.PropTypes.number, + translateY: React.PropTypes.number, + rotation: React.PropTypes.number, + ...View.propTypes, +}; + +const RCTVideo = requireNativeComponent('RCTVideo', Video, { + nativeOnly: { + src: true, + seek: true, + }, +}); + +module.exports = Video; diff --git a/android/RCTVideo.iml b/android/RCTVideo.iml new file mode 100644 index 00000000..389b183f --- /dev/null +++ b/android/RCTVideo.iml @@ -0,0 +1,111 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/android/build.gradle b/android/build.gradle new file mode 100644 index 00000000..955ad774 --- /dev/null +++ b/android/build.gradle @@ -0,0 +1,21 @@ +apply plugin: 'com.android.library' + +android { + compileSdkVersion 23 + buildToolsVersion "23.0.1" + + defaultConfig { + minSdkVersion 16 + targetSdkVersion 22 + versionCode 1 + versionName "1.0" + ndk { + abiFilters "armeabi-v7a", "x86" + } + } +} + +dependencies { + compile 'com.facebook.react:react-native:0.13.+' + compile 'com.yqritc:android-scalablevideoview:1.0.1' +} diff --git a/android/src/main/AndroidManifest.xml b/android/src/main/AndroidManifest.xml new file mode 100644 index 00000000..646df099 --- /dev/null +++ b/android/src/main/AndroidManifest.xml @@ -0,0 +1,3 @@ + + diff --git a/android/src/main/java/com/brentvatne/react/ReactVideoPackage.java b/android/src/main/java/com/brentvatne/react/ReactVideoPackage.java new file mode 100644 index 00000000..22c48a00 --- /dev/null +++ b/android/src/main/java/com/brentvatne/react/ReactVideoPackage.java @@ -0,0 +1,30 @@ +package com.brentvatne.react; + +import android.app.Activity; +import com.facebook.react.ReactPackage; +import com.facebook.react.bridge.JavaScriptModule; +import com.facebook.react.bridge.NativeModule; +import com.facebook.react.bridge.ReactApplicationContext; +import com.facebook.react.uimanager.ViewManager; + +import java.util.Arrays; +import java.util.Collections; +import java.util.List; + +public class ReactVideoPackage implements ReactPackage { + + @Override + public List createNativeModules(ReactApplicationContext reactContext) { + return Collections.emptyList(); + } + + @Override + public List> createJSModules() { + return Collections.emptyList(); + } + + @Override + public List createViewManagers(ReactApplicationContext reactContext) { + return Arrays.asList(new ReactVideoViewManager()); + } +} diff --git a/android/src/main/java/com/brentvatne/react/ReactVideoView.java b/android/src/main/java/com/brentvatne/react/ReactVideoView.java new file mode 100644 index 00000000..0f9a923d --- /dev/null +++ b/android/src/main/java/com/brentvatne/react/ReactVideoView.java @@ -0,0 +1,286 @@ +package com.brentvatne.react; + +import android.media.MediaPlayer; +import android.os.Handler; +import android.util.Log; +import com.facebook.react.bridge.Arguments; +import com.facebook.react.bridge.WritableMap; +import com.facebook.react.uimanager.ThemedReactContext; +import com.facebook.react.uimanager.events.RCTEventEmitter; +import com.yqritc.scalablevideoview.ScalableType; +import com.yqritc.scalablevideoview.ScalableVideoView; + +public class ReactVideoView extends ScalableVideoView implements MediaPlayer.OnPreparedListener, MediaPlayer + .OnErrorListener, MediaPlayer.OnBufferingUpdateListener, MediaPlayer.OnCompletionListener { + + public enum Events { + EVENT_LOAD_START("onVideoLoadStart"), + EVENT_LOAD("onVideoLoad"), + EVENT_ERROR("onVideoError"), + EVENT_PROGRESS("onVideoProgress"), + EVENT_SEEK("onVideoSeek"), + EVENT_END("onVideoEnd"); + + private final String mName; + + Events(final String name) { + mName = name; + } + + @Override + public String toString() { + return mName; + } + } + + public static final String EVENT_PROP_FAST_FORWARD = "canPlayFastForward"; + public static final String EVENT_PROP_SLOW_FORWARD = "canPlaySlowForward"; + public static final String EVENT_PROP_SLOW_REVERSE = "canPlaySlowReverse"; + public static final String EVENT_PROP_REVERSE = "canPlayReverse"; + public static final String EVENT_PROP_STEP_FORWARD = "canStepForward"; + public static final String EVENT_PROP_STEP_BACKWARD = "canStepBackward"; + + public static final String EVENT_PROP_DURATION = "duration"; + public static final String EVENT_PROP_PLAYABLE_DURATION = "playableDuration"; + public static final String EVENT_PROP_CURRENT_TIME = "currentTime"; + public static final String EVENT_PROP_SEEK_TIME = "seekTime"; + + public static final String EVENT_PROP_ERROR = "error"; + public static final String EVENT_PROP_WHAT = "what"; + public static final String EVENT_PROP_EXTRA = "extra"; + + private ThemedReactContext mThemedReactContext; + private RCTEventEmitter mEventEmitter; + + private Handler mProgressUpdateHandler = new Handler(); + private Runnable mProgressUpdateRunnable = null; + + private String mSrcUriString = null; + private String mSrcType = "mp4"; + private boolean mSrcIsNetwork = false; + private ScalableType mResizeMode = ScalableType.LEFT_TOP; + private boolean mRepeat = false; + private boolean mPaused = false; + private boolean mMuted = false; + private float mVolume = 1.0f; + private float mRate = 1.0f; + + private boolean mMediaPlayerValid = false; // True if mMediaPlayer is in prepared, started, or paused state. + private int mVideoDuration = 0; + private int mVideoBufferedDuration = 0; + + public ReactVideoView(ThemedReactContext themedReactContext) { + super(themedReactContext); + + mThemedReactContext = themedReactContext; + mEventEmitter = themedReactContext.getJSModule(RCTEventEmitter.class); + + initializeMediaPlayerIfNeeded(); + setSurfaceTextureListener(this); + + mProgressUpdateRunnable = new Runnable() { + @Override + public void run() { + + if (mMediaPlayerValid) { + WritableMap event = Arguments.createMap(); + event.putDouble(EVENT_PROP_CURRENT_TIME, mMediaPlayer.getCurrentPosition() / 1000.0); + event.putDouble(EVENT_PROP_PLAYABLE_DURATION, mVideoBufferedDuration / 1000.0); //TODO:mBufferUpdateRunnable + mEventEmitter.receiveEvent(getId(), Events.EVENT_PROGRESS.toString(), event); + } + mProgressUpdateHandler.postDelayed(mProgressUpdateRunnable, 250); + } + }; + mProgressUpdateHandler.post(mProgressUpdateRunnable); + } + + private void initializeMediaPlayerIfNeeded() { + if (mMediaPlayer == null) { + mMediaPlayerValid = false; + mMediaPlayer = new MediaPlayer(); + mMediaPlayer.setScreenOnWhilePlaying(true); + mMediaPlayer.setOnVideoSizeChangedListener(this); + mMediaPlayer.setOnErrorListener(this); + mMediaPlayer.setOnPreparedListener(this); + mMediaPlayer.setOnBufferingUpdateListener(this); + mMediaPlayer.setOnCompletionListener(this); + } + } + + public void setSrc(final String uriString, final String type, final boolean isNetwork) { + mSrcUriString = uriString; + mSrcType = type; + mSrcIsNetwork = isNetwork; + + mMediaPlayerValid = false; + mVideoDuration = 0; + mVideoBufferedDuration = 0; + + initializeMediaPlayerIfNeeded(); + mMediaPlayer.reset(); + + try { + if (isNetwork) { + setDataSource(uriString); + } else { + setRawData(mThemedReactContext.getResources().getIdentifier( + uriString, + "raw", + mThemedReactContext.getPackageName() + )); + } + } catch (Exception e) { + e.printStackTrace(); + return; + } + + WritableMap src = Arguments.createMap(); + src.putString(ReactVideoViewManager.PROP_SRC_URI, uriString); + src.putString(ReactVideoViewManager.PROP_SRC_TYPE, type); + src.putBoolean(ReactVideoViewManager.PROP_SRC_IS_NETWORK, isNetwork); + WritableMap event = Arguments.createMap(); + event.putMap(ReactVideoViewManager.PROP_SRC, src); + mEventEmitter.receiveEvent(getId(), Events.EVENT_LOAD_START.toString(), event); + + prepareAsync(this); + } + + public void setResizeModeModifier(final ScalableType resizeMode) { + mResizeMode = resizeMode; + + if (mMediaPlayerValid) { + setScalableType(resizeMode); + invalidate(); + } + } + + public void setRepeatModifier(final boolean repeat) { + mRepeat = repeat; + + if (mMediaPlayerValid) { + setLooping(repeat); + } + } + + public void setPausedModifier(final boolean paused) { + mPaused = paused; + + if (!mMediaPlayerValid) { + return; + } + + if (mPaused) { + if (mMediaPlayer.isPlaying()) { + pause(); + } + } else { + if (!mMediaPlayer.isPlaying()) { + start(); + } + } + } + + public void setMutedModifier(final boolean muted) { + mMuted = muted; + + if (!mMediaPlayerValid) { + return; + } + + if (mMuted) { + setVolume(0, 0); + } else { + setVolume(mVolume, mVolume); + } + } + + public void setVolumeModifier(final float volume) { + mVolume = volume; + setMutedModifier(mMuted); + } + + public void setRateModifier(final float rate) { + mRate = rate; + + if (mMediaPlayerValid) { + // TODO: Implement this. + Log.e(ReactVideoViewManager.REACT_CLASS, "Setting playback rate is not yet supported on Android"); + } + } + + public void applyModifiers() { + setResizeModeModifier(mResizeMode); + setRepeatModifier(mRepeat); + setPausedModifier(mPaused); + setMutedModifier(mMuted); +// setRateModifier(mRate); + } + + @Override + public void onPrepared(MediaPlayer mp) { + mMediaPlayerValid = true; + mVideoDuration = mp.getDuration(); + + WritableMap event = Arguments.createMap(); + event.putDouble(EVENT_PROP_DURATION, mVideoDuration / 1000.0); + event.putDouble(EVENT_PROP_CURRENT_TIME, mp.getCurrentPosition() / 1000.0); + // TODO: Actually check if you can. + event.putBoolean(EVENT_PROP_FAST_FORWARD, true); + event.putBoolean(EVENT_PROP_SLOW_FORWARD, true); + event.putBoolean(EVENT_PROP_SLOW_REVERSE, true); + event.putBoolean(EVENT_PROP_REVERSE, true); + event.putBoolean(EVENT_PROP_FAST_FORWARD, true); + event.putBoolean(EVENT_PROP_STEP_BACKWARD, true); + event.putBoolean(EVENT_PROP_STEP_FORWARD, true); + mEventEmitter.receiveEvent(getId(), Events.EVENT_LOAD.toString(), event); + + applyModifiers(); + } + + @Override + public boolean onError(MediaPlayer mp, int what, int extra) { + WritableMap error = Arguments.createMap(); + error.putInt(EVENT_PROP_WHAT, what); + error.putInt(EVENT_PROP_EXTRA, extra); + WritableMap event = Arguments.createMap(); + event.putMap(EVENT_PROP_ERROR, error); + mEventEmitter.receiveEvent(getId(), Events.EVENT_ERROR.toString(), event); + return true; + } + + @Override + public void onBufferingUpdate(MediaPlayer mp, int percent) { + mVideoBufferedDuration = (int) Math.round((double) (mVideoDuration * percent) / 100.0); + } + + @Override + public void seekTo(int msec) { + + if (mMediaPlayerValid) { + WritableMap event = Arguments.createMap(); + event.putDouble(EVENT_PROP_CURRENT_TIME, getCurrentPosition() / 1000.0); + event.putDouble(EVENT_PROP_SEEK_TIME, msec / 1000.0); + mEventEmitter.receiveEvent(getId(), Events.EVENT_SEEK.toString(), event); + + super.seekTo(msec); + } + } + + @Override + public void onCompletion(MediaPlayer mp) { + mMediaPlayerValid = false; + mEventEmitter.receiveEvent(getId(), Events.EVENT_END.toString(), null); + } + + @Override + protected void onDetachedFromWindow() { + mMediaPlayerValid = false; + super.onDetachedFromWindow(); + } + + @Override + protected void onAttachedToWindow() { + super.onAttachedToWindow(); + setSrc(mSrcUriString, mSrcType, mSrcIsNetwork); + } +} diff --git a/android/src/main/java/com/brentvatne/react/ReactVideoViewManager.java b/android/src/main/java/com/brentvatne/react/ReactVideoViewManager.java new file mode 100644 index 00000000..3ec693da --- /dev/null +++ b/android/src/main/java/com/brentvatne/react/ReactVideoViewManager.java @@ -0,0 +1,107 @@ +package com.brentvatne.react; + +import com.brentvatne.react.ReactVideoView.Events; +import com.facebook.react.bridge.Arguments; +import com.facebook.react.bridge.ReadableMap; +import com.facebook.react.bridge.WritableMap; +import com.facebook.react.common.MapBuilder; +import com.facebook.react.uimanager.ReactProp; +import com.facebook.react.uimanager.SimpleViewManager; +import com.facebook.react.uimanager.ThemedReactContext; +import com.facebook.react.uimanager.events.RCTEventEmitter; +import com.yqritc.scalablevideoview.ScalableType; + +import javax.annotation.Nullable; +import java.util.Map; + +public class ReactVideoViewManager extends SimpleViewManager { + + public static final String REACT_CLASS = "RCTVideo"; + + public static final String PROP_SRC = "src"; + public static final String PROP_SRC_URI = "uri"; + public static final String PROP_SRC_TYPE = "type"; + public static final String PROP_SRC_IS_NETWORK = "isNetwork"; + public static final String PROP_RESIZE_MODE = "resizeMode"; + public static final String PROP_REPEAT = "repeat"; + public static final String PROP_PAUSED = "paused"; + public static final String PROP_MUTED = "muted"; + public static final String PROP_VOLUME = "volume"; + public static final String PROP_SEEK = "seek"; + public static final String PROP_RATE = "rate"; + + @Override + public String getName() { + return REACT_CLASS; + } + + @Override + protected ReactVideoView createViewInstance(ThemedReactContext themedReactContext) { + return new ReactVideoView(themedReactContext); + } + + @Override + @Nullable + public Map getExportedCustomDirectEventTypeConstants() { + MapBuilder.Builder builder = MapBuilder.builder(); + for (Events event : Events.values()) { + builder.put(event.toString(), MapBuilder.of("registrationName", event.toString())); + } + return builder.build(); + } + + @Override + @Nullable + public Map getExportedViewConstants() { + return MapBuilder.of( + "ScaleNone", Integer.toString(ScalableType.LEFT_TOP.ordinal()), + "ScaleToFill", Integer.toString(ScalableType.FIT_XY.ordinal()), + "ScaleAspectFit", Integer.toString(ScalableType.FIT_CENTER.ordinal()), + "ScaleAspectFill", Integer.toString(ScalableType.CENTER_CROP.ordinal()) + ); + } + + @ReactProp(name = PROP_SRC) + public void setSrc(final ReactVideoView videoView, @Nullable ReadableMap src) { + videoView.setSrc( + src.getString(PROP_SRC_URI), + src.getString(PROP_SRC_TYPE), + src.getBoolean(PROP_SRC_IS_NETWORK) + ); + } + + @ReactProp(name = PROP_RESIZE_MODE) + public void setResizeMode(final ReactVideoView videoView, final String resizeModeOrdinalString) { + videoView.setResizeModeModifier(ScalableType.values()[Integer.parseInt(resizeModeOrdinalString)]); + } + + @ReactProp(name = PROP_REPEAT, defaultBoolean = false) + public void setRepeat(final ReactVideoView videoView, final boolean repeat) { + videoView.setRepeatModifier(repeat); + } + + @ReactProp(name = PROP_PAUSED, defaultBoolean = false) + public void setPaused(final ReactVideoView videoView, final boolean paused) { + videoView.setPausedModifier(paused); + } + + @ReactProp(name = PROP_MUTED, defaultBoolean = false) + public void setMuted(final ReactVideoView videoView, final boolean muted) { + videoView.setMutedModifier(muted); + } + + @ReactProp(name = PROP_VOLUME, defaultFloat = 1.0f) + public void setVolume(final ReactVideoView videoView, final float volume) { + videoView.setVolumeModifier(volume); + } + + @ReactProp(name = PROP_SEEK) + public void setSeek(final ReactVideoView videoView, final float seek) { + videoView.seekTo(Math.round(seek * 1000.0f)); + } + + @ReactProp(name = PROP_RATE) + public void setRate(final ReactVideoView videoView, final float rate) { + videoView.setRateModifier(rate); + } +} diff --git a/android/src/main/res/values/styles.xml b/android/src/main/res/values/styles.xml new file mode 100644 index 00000000..319eb0ca --- /dev/null +++ b/android/src/main/res/values/styles.xml @@ -0,0 +1,8 @@ + + + + + + diff --git a/package.json b/package.json index d62bfcbc..8dd18d0a 100644 --- a/package.json +++ b/package.json @@ -2,17 +2,23 @@ "name": "react-native-video", "version": "0.6.1", "description": "A