Skip to content

G
gl-react-native-v2
Commit 6d773a80 authored by Gaëtan Renaudeau's avatar Gaëtan Renaudeau
Browse files
Options

Fix GLImage.m, inject warnings on Image usage, expose resolveAssetSource

parent 39b2e33c
Hide whitespace changes
Inline Side-by-side
Showing with 127 additions and 83 deletions
.eslintrc deleted 100644 → 0
View file @ 39b2e33c
{
"parser": "babel-eslint",
"globals": {
"requestAnimationFrame": true
},
"rules": {
"indent": [
2,
2
],
"quotes": [
2,
"double"
],
"linebreak-style": [
2,
"unix"
],
"semi": [
2,
"always"
],
"comma-dangle": 0,
"no-var": 1,
"react/jsx-boolean-value": 1,
"react/jsx-no-undef": 1,
"react/jsx-quotes": 1,
"react/jsx-uses-react": 1,
"react/jsx-uses-vars": 1,
"react/no-danger": 1,
"react/no-did-mount-set-state": 1,
"react/no-did-update-set-state": 1,
"react/no-unknown-property": 1,
"react/react-in-jsx-scope": 1,
"react/require-extension": 1,
"react/sort-comp": 1
},
"env": {
"es6": true,
"node": true
},
"extends": "eslint:recommended",
"ecmaFeatures": {
"jsx": true,
"experimentalObjectRestSpread": true
},
"plugins": [
"react"
]
}
.eslintrc.json 0 → 100644
View file @ 6d773a80
{
"parser": "babel-eslint",
"env": {
"browser": true,
"commonjs": true,
"es6": true,
"node": true
},
"globals": {
"__DEV__": true
},
"extends": "eslint:recommended",
"installedESLint": true,
"parserOptions": {
"ecmaFeatures": {
"experimentalObjectRestSpread": true,
"jsx": true
},
"sourceType": "module"
},
"plugins": [
"react"
],
"rules": {
"indent": [
"error",
2
],
"linebreak-style": [
"error",
"unix"
],
"quotes": [
"error",
"double"
],
"semi": [
"error",
"always"
],
"no-console": [
"error",
{ "allow": ["warn", "error" ] }
],
"comma-dangle": 0,
"react/jsx-uses-react": "error",
"react/jsx-uses-vars": "error"
}
}
android/RNGL.iml
View file @ 6d773a80
......@@ -100,6 +100,7 @@
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/incremental-safeguard" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/jniLibs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/lint" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/mockable-android-23.jar" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/res" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/rs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/shaders" />
......
android/src/main/java/com/projectseptember/RNGL/GLCanvas.java
View file @ 6d773a80
......@@ -490,7 +490,17 @@ public class GLCanvas extends GLSurfaceView
textures.put(uniformName, emptyTexture);
}
else {
ReadableMap value = dataUniforms.getMap(uniformName);
ReadableMap value = null;
try {
value = dataUniforms.getMap(uniformName);
}
catch (Exception e) {
shader.runtimeException(
"texture uniform '"+uniformName+"': you cannot directly give require('./img.png') "+
"to gl-react, use resolveAssetSource(require('./img.png')) instead."
);
return null;
}
String t = value.getString("type");
if (t.equals("content")) {
int id = value.getInt("id");
......
example/android/app/app.iml
View file @ 6d773a80
......@@ -64,14 +64,6 @@
<sourceFolder url="file://$MODULE_DIR$/src/main/jni" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/rs" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/main/shaders" isTestSource="false" />
<sourceFolder url="file://$MODULE_DIR$/src/test/res" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/resources" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/assets" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/aidl" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/java" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/jni" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/rs" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/shaders" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/res" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/resources" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/assets" type="java-test-resource" />
......@@ -80,14 +72,20 @@
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/jni" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/rs" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/androidTest/shaders" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/res" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/resources" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/assets" type="java-test-resource" />
<sourceFolder url="file://$MODULE_DIR$/src/test/aidl" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/java" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/jni" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/rs" isTestSource="true" />
<sourceFolder url="file://$MODULE_DIR$/src/test/shaders" isTestSource="true" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/assets" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/blame" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/builds" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/bundles" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/classes" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/debug" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/dependency-cache" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/dex" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.android.support/appcompat-v7/23.0.1/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.android.support/recyclerview-v7/23.0.1/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.android.support/support-v4/23.1.1/jars" />
......@@ -97,7 +95,7 @@
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.facebook.fresco/imagepipeline-base/0.10.0/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.facebook.fresco/imagepipeline-okhttp3/0.10.0/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.facebook.fresco/imagepipeline/0.10.0/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.facebook.react/react-native/0.27.2/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/com.facebook.react/react-native/0.28.0-rc.0/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/exploded-aar/org.webkit/android-jsc/r174650/jars" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/incremental" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/incremental-classes" />
......@@ -107,20 +105,19 @@
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/instant-run-support" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/jniLibs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/manifests" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/pre-dexed" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/reload-dex" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/res" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/restart-dex" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/rs" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/shaders" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/symbols" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/tmp" />
<excludeFolder url="file://$MODULE_DIR$/build/intermediates/transforms" />
<excludeFolder url="file://$MODULE_DIR$/build/outputs" />
<excludeFolder url="file://$MODULE_DIR$/build/tmp" />
</content>
<orderEntry type="jdk" jdkName="Android API 23 Platform" jdkType="Android SDK" />
<orderEntry type="sourceFolder" forTests="false" />
<orderEntry type="library" exported="" name="react-native-0.28.0-rc.0" level="project" />
<orderEntry type="library" exported="" name="okio-1.8.0" level="project" />
<orderEntry type="library" exported="" name="library-2.4.0" level="project" />
<orderEntry type="library" exported="" name="imagepipeline-base-0.10.0" level="project" />
......@@ -132,7 +129,6 @@
<orderEntry type="library" exported="" name="okhttp-ws-3.2.0" level="project" />
<orderEntry type="library" exported="" name="recyclerview-v7-23.0.1" level="project" />
<orderEntry type="library" exported="" name="support-v4-23.1.1" level="project" />
<orderEntry type="library" exported="" name="react-native-0.27.2" level="project" />
<orderEntry type="library" exported="" name="android-jsc-r174650" level="project" />
<orderEntry type="library" exported="" name="okhttp-3.2.0" level="project" />
<orderEntry type="library" exported="" name="bolts-android-1.1.4" level="project" />
......
example/package.json
View file @ 6d773a80
......@@ -7,12 +7,12 @@
},
"dependencies": {
"crypto": "0.0.3",
"gl-react": "^2.2.0",
"gl-react-blur": "^1.2.2",
"gl-react": "2.2.4",
"gl-react-blur": "^1.3.0",
"gl-react-native": "file:..",
"glsl-transitions": "^2016.2.15",
"react": "^15.1.0",
"react-native": "^0.27.2",
"react-native": "^0.28.0-rc.0",
"react-native-fs": "^1.4.0",
"react-native-material-kit": "PyYoshi/react-native-material-kit#rn-0.25.1",
"react-transform-hmr": "^1.0.2",
......
example/src/AdvancedEffects/index.js
View file @ 6d773a80
import React from "react";
import {StyleSheet, View} from "react-native";
import {resolveAssetSource} from "gl-react-native";
const { width: viewportW, height: viewportH } = require("Dimensions").get("window");
import resolveAssetSource from "react-native/Libraries/Image/resolveAssetSource";
import Banner from "./Banner";
import Intro from "./Intro";
import Vignette from "./Vignette";
import Slideshow from "./Slideshow";
class AdvancedEffects extends React.Component {
constructor (props) {
......
ios/GLCanvas.m
View file @ 6d773a80
......@@ -227,6 +227,9 @@ RCT_NOT_IMPLEMENTED(-init)
[emptyTexture setPixels:nil];
textures[uniformName] = emptyTexture;
}
else if ([value isKindOfClass:[NSNumber class]]) {
RCTLogError(@"texture uniform '%@': you cannot directly give require('./img.png') to gl-react, use resolveAssetSource(require('./img.png')) instead.", uniformName);
}
else {
NSString *type = [RCTConvert NSString:value[@"type"]];
if ([type isEqualToString:@"content"]) {
......
ios/GLImage.m
View file @ 6d773a80
......@@ -5,6 +5,7 @@
#import "RCTImageLoader.h"
#import "RCTLog.h"
#import "GLTexture.h"
#import "RCTUtils.h"
@implementation GLImage
{
......@@ -70,31 +71,46 @@ RCT_NOT_IMPLEMENTED(-init)
- (void)reloadImage
{
RCTImageSource *source = _source;
if (_loading) _loading();
_loading = nil;
if (!_source) {
if (!source) {
[self clearImage];
}
else {
// Load the image (without resizing it)
_loading = [_bridge.imageLoader loadImageWithURLRequest:_source.imageURL.absoluteString
__weak GLImage *weakSelf = self;
_loading = [_bridge.imageLoader loadImageWithURLRequest:source.request
size:CGSizeZero
scale:0
clipped:YES
resizeMode:RCTResizeModeStretch
progressBlock:nil
completionBlock:^(NSError *error, UIImage *image) {
completionBlock:^(NSError *error, UIImage *loadedImage) {
GLImage *strongSelf = weakSelf;
void (^setImageBlock)(UIImage *) = ^(UIImage *image) {
if (![source isEqual:strongSelf.source]) {
// Bail out if source has changed since we started loading
return;
}
strongSelf.image = [UIImage imageWithCGImage:image.CGImage];
dispatch_async(dispatch_get_main_queue(), ^{
if (_onload) _onload();
});
};
_loading = nil;
[self clearImage];
if (error) {
NSLog(@"Image failed to load: %@", error);
} else {
// we need to copy the image because it seems the image will be altered.
// ^^^ FIXME: check if it's still the case
self.image = [UIImage imageWithCGImage:image.CGImage];
dispatch_async(dispatch_get_main_queue(), ^{
if (_onload) _onload();
});
if ([NSThread isMainThread]) {
setImageBlock(loadedImage);
} else {
RCTExecuteOnMainThread(^{
setImageBlock(loadedImage);
}, NO);
}
}
}];
}
......
package.json
View file @ 6d773a80
......@@ -19,8 +19,8 @@
"author": "Project September <tech@projectseptember.com>",
"license": "MIT",
"peerDependencies": {
"react-native": "*",
"gl-react": "^2.2.3"
"react-native": "* || 0.28.0-rc.0",
"gl-react": "^2.2.4"
},
"dependencies": {
"invariant": "2.2.0",
......
src/index.js
View file @ 6d773a80
import invariant from "invariant";
import { Shaders } from "gl-react";
import { Shaders, runtime } from "gl-react";
import isAnimated from "gl-react/src/isAnimated";
import makeSurface from "./makeSurface";
import GLCanvas from "./GLCanvas";
import {NativeModules, View, Animated} from "react-native";
import {NativeModules, View, Animated, Image} from "react-native";
import resolveAssetSource from "react-native/Libraries/Image/resolveAssetSource";
const {RNGLContext} = NativeModules;
invariant(RNGLContext,
`gl-react-native: the native module is not available.
......@@ -23,7 +25,24 @@ Shaders.setImplementation({
remove: id => RNGLContext.removeShader(id)
});
if (__DEV__) {
runtime.decorateVDOMContent = vdom => {
if (vdom && vdom.type === Image && !vdom.props.glReactUseImage) {
console.warn(
`gl-react: Found a ReactNative.Image element. This is not performant. Try one of these:
- pass-in directly the image URL in your uniforms.
- use gl-react-image which implements the same Image API directly in OpenGL. https://github.com/gre/gl-react-image
- If you need more features like padding, explicitly setting image size, you can implement your own shader.
If you still want to do this, add a glReactUseImage prop to the Image to disable this warning.
`);
}
return vdom;
};
}
module.exports = {
resolveAssetSource,
Surface: makeSurface({
View,
GLCanvas,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment