From 02ce67ace3c3f33415299d11143fafcdf443f09f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABtan=20Renaudeau?= Date: Wed, 2 Dec 2015 22:15:29 +0100 Subject: [PATCH] adapt code to depeds on gl-react not anymore gl-react-core --- Examples/AdvancedEffects/package.json | 2 +- Examples/AdvancedEffects/src/Banner.js | 2 +- Examples/AdvancedEffects/src/Intro.js | 2 +- Examples/AdvancedEffects/src/Slideshow.js | 2 +- Examples/AdvancedEffects/src/Transition.js | 2 +- Examples/AdvancedEffects/src/Vignette.js | 2 +- Examples/AdvancedEffects/src/index.js | 2 +- Examples/Simple/package.json | 2 +- Examples/Simple/src/AnimatedHelloGL.js | 2 +- Examples/Simple/src/Blur.js | 4 +- Examples/Simple/src/Blur1D.js | 4 +- Examples/Simple/src/HelloGL.js | 4 +- Examples/Simple/src/HueRotate.js | 4 +- Examples/Simple/src/OneFingerResponse.js | 2 +- Examples/Simple/src/PieProgress.js | 4 +- Examples/Simple/src/Saturation.js | 4 +- Examples/Simple/src/index.js | 2 +- Examples/Tests/package.json | 2 +- Examples/Tests/src/Add.js | 4 +- Examples/Tests/src/Blur.js | 4 +- Examples/Tests/src/Blur1D.js | 4 +- Examples/Tests/src/Copy.js | 4 +- Examples/Tests/src/Display2.js | 4 +- Examples/Tests/src/HelloGL.js | 4 +- Examples/Tests/src/Layer.js | 4 +- Examples/Tests/src/Multiply.js | 4 +- .../Tests/src/TransparentNonPremultiplied.js | 4 +- Examples/Tests/src/index.js | 2 +- Examples/build.sh | 6 +-- README.md | 46 ++----------------- ios/GLData.h | 2 +- package.json | 2 +- src/Shaders.js | 2 +- src/Surface.js | 2 +- src/index.js | 2 +- 35 files changed, 53 insertions(+), 95 deletions(-) diff --git a/Examples/AdvancedEffects/package.json b/Examples/AdvancedEffects/package.json index bb1bfcd..1e69318 100644 --- a/Examples/AdvancedEffects/package.json +++ b/Examples/AdvancedEffects/package.json @@ -7,7 +7,7 @@ }, "dependencies": { "gl-react-native": "file:../..", - "gl-react-core": "file:../../../gl-react-core", + "gl-react": "file:../../../gl-react", "glsl-transitions": "^2015.11.8", "react-native": "^0.14.2" } diff --git a/Examples/AdvancedEffects/src/Banner.js b/Examples/AdvancedEffects/src/Banner.js index 7e8edc7..e8bbe7f 100644 --- a/Examples/AdvancedEffects/src/Banner.js +++ b/Examples/AdvancedEffects/src/Banner.js @@ -1,5 +1,5 @@ const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const shaders = GL.Shaders.create({ banner: { diff --git a/Examples/AdvancedEffects/src/Intro.js b/Examples/AdvancedEffects/src/Intro.js index e5d6991..6628298 100644 --- a/Examples/AdvancedEffects/src/Intro.js +++ b/Examples/AdvancedEffects/src/Intro.js @@ -3,7 +3,7 @@ const { View, Text, } = React; -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const shaders = GL.Shaders.create({ diff --git a/Examples/AdvancedEffects/src/Slideshow.js b/Examples/AdvancedEffects/src/Slideshow.js index 22ee0d0..5ed9223 100644 --- a/Examples/AdvancedEffects/src/Slideshow.js +++ b/Examples/AdvancedEffects/src/Slideshow.js @@ -1,6 +1,6 @@ const React = require("react-native"); const { View, Text, StyleSheet } = React; -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const TransitionGenerator = require("./TransitionGenerator"); const Transition = require("./Transition"); diff --git a/Examples/AdvancedEffects/src/Transition.js b/Examples/AdvancedEffects/src/Transition.js index 29f1dab..dd89ad5 100644 --- a/Examples/AdvancedEffects/src/Transition.js +++ b/Examples/AdvancedEffects/src/Transition.js @@ -1,5 +1,5 @@ const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); module.exports = GL.createComponent( ({ width, height, shader, progress, from, to, uniforms }) => { diff --git a/Examples/AdvancedEffects/src/Vignette.js b/Examples/AdvancedEffects/src/Vignette.js index d8bebf0..fd9c669 100644 --- a/Examples/AdvancedEffects/src/Vignette.js +++ b/Examples/AdvancedEffects/src/Vignette.js @@ -1,5 +1,5 @@ const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const shaders = GL.Shaders.create({ diff --git a/Examples/AdvancedEffects/src/index.js b/Examples/AdvancedEffects/src/index.js index d9bae7f..9b8b63e 100644 --- a/Examples/AdvancedEffects/src/index.js +++ b/Examples/AdvancedEffects/src/index.js @@ -1,4 +1,4 @@ -require("gl-react-core/react-native"); +require("gl-react/react-native"); const React = require("react-native"); const { StyleSheet, diff --git a/Examples/Simple/package.json b/Examples/Simple/package.json index 0131ad8..a1b1043 100644 --- a/Examples/Simple/package.json +++ b/Examples/Simple/package.json @@ -7,7 +7,7 @@ }, "dependencies": { "gl-react-native": "file:../..", - "gl-react-core": "file:../../../gl-react-core", + "gl-react": "file:../../../gl-react", "react-native": "^0.14.2", "react-native-material-kit": "^0.2.2" } diff --git a/Examples/Simple/src/AnimatedHelloGL.js b/Examples/Simple/src/AnimatedHelloGL.js index bbb4425..c87b0d7 100644 --- a/Examples/Simple/src/AnimatedHelloGL.js +++ b/Examples/Simple/src/AnimatedHelloGL.js @@ -1,5 +1,5 @@ const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const shaders = GL.Shaders.create({ diff --git a/Examples/Simple/src/Blur.js b/Examples/Simple/src/Blur.js index aa0d88f..26a5d3c 100644 --- a/Examples/Simple/src/Blur.js +++ b/Examples/Simple/src/Blur.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const Blur1D = require("./Blur1D"); module.exports = GL.createComponent(({ width, height, factor, children }) => diff --git a/Examples/Simple/src/Blur1D.js b/Examples/Simple/src/Blur1D.js index fe2514e..feb2f21 100644 --- a/Examples/Simple/src/Blur1D.js +++ b/Examples/Simple/src/Blur1D.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ blur1D: { diff --git a/Examples/Simple/src/HelloGL.js b/Examples/Simple/src/HelloGL.js index 66bb819..fc08b51 100644 --- a/Examples/Simple/src/HelloGL.js +++ b/Examples/Simple/src/HelloGL.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ helloGL: { diff --git a/Examples/Simple/src/HueRotate.js b/Examples/Simple/src/HueRotate.js index 7a799fa..d520d5f 100644 --- a/Examples/Simple/src/HueRotate.js +++ b/Examples/Simple/src/HueRotate.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ hueRotate: { diff --git a/Examples/Simple/src/OneFingerResponse.js b/Examples/Simple/src/OneFingerResponse.js index b1f3e6d..0841cec 100644 --- a/Examples/Simple/src/OneFingerResponse.js +++ b/Examples/Simple/src/OneFingerResponse.js @@ -1,5 +1,5 @@ const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); const {Surface} = require("gl-react-native"); const shaders = GL.Shaders.create({ diff --git a/Examples/Simple/src/PieProgress.js b/Examples/Simple/src/PieProgress.js index f8037e6..012c459 100644 --- a/Examples/Simple/src/PieProgress.js +++ b/Examples/Simple/src/PieProgress.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ pieProgress: { diff --git a/Examples/Simple/src/Saturation.js b/Examples/Simple/src/Saturation.js index 086b8ff..c8088ab 100644 --- a/Examples/Simple/src/Saturation.js +++ b/Examples/Simple/src/Saturation.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ saturation: { diff --git a/Examples/Simple/src/index.js b/Examples/Simple/src/index.js index 8a0c360..7e80680 100644 --- a/Examples/Simple/src/index.js +++ b/Examples/Simple/src/index.js @@ -1,4 +1,4 @@ -require("gl-react-core/react-native"); +require("gl-react/react-native"); const React = require("react-native"); const { diff --git a/Examples/Tests/package.json b/Examples/Tests/package.json index dc88e9e..7cd494b 100644 --- a/Examples/Tests/package.json +++ b/Examples/Tests/package.json @@ -7,7 +7,7 @@ }, "dependencies": { "gl-react-native": "file:../..", - "gl-react-core": "file:../../../gl-react-core", + "gl-react": "file:../../../gl-react", "react-native": "^0.14.2" }, "devDependencies": { diff --git a/Examples/Tests/src/Add.js b/Examples/Tests/src/Add.js index 2bc1758..cbb560c 100644 --- a/Examples/Tests/src/Add.js +++ b/Examples/Tests/src/Add.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ add: { diff --git a/Examples/Tests/src/Blur.js b/Examples/Tests/src/Blur.js index acf495b..d10b83b 100644 --- a/Examples/Tests/src/Blur.js +++ b/Examples/Tests/src/Blur.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const { PropTypes } = React; diff --git a/Examples/Tests/src/Blur1D.js b/Examples/Tests/src/Blur1D.js index f200e07..df5067f 100644 --- a/Examples/Tests/src/Blur1D.js +++ b/Examples/Tests/src/Blur1D.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const { PropTypes diff --git a/Examples/Tests/src/Copy.js b/Examples/Tests/src/Copy.js index e6d7ced..c49efeb 100644 --- a/Examples/Tests/src/Copy.js +++ b/Examples/Tests/src/Copy.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ Copy: { diff --git a/Examples/Tests/src/Display2.js b/Examples/Tests/src/Display2.js index 724a5d4..6aac82f 100644 --- a/Examples/Tests/src/Display2.js +++ b/Examples/Tests/src/Display2.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ display2: { diff --git a/Examples/Tests/src/HelloGL.js b/Examples/Tests/src/HelloGL.js index 339ab4b..e72df0e 100644 --- a/Examples/Tests/src/HelloGL.js +++ b/Examples/Tests/src/HelloGL.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ helloGL: { diff --git a/Examples/Tests/src/Layer.js b/Examples/Tests/src/Layer.js index d6134f7..30752f5 100644 --- a/Examples/Tests/src/Layer.js +++ b/Examples/Tests/src/Layer.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ layer: { diff --git a/Examples/Tests/src/Multiply.js b/Examples/Tests/src/Multiply.js index 7120195..e4cef55 100644 --- a/Examples/Tests/src/Multiply.js +++ b/Examples/Tests/src/Multiply.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ multiply: { diff --git a/Examples/Tests/src/TransparentNonPremultiplied.js b/Examples/Tests/src/TransparentNonPremultiplied.js index c20d997..df8d7c3 100644 --- a/Examples/Tests/src/TransparentNonPremultiplied.js +++ b/Examples/Tests/src/TransparentNonPremultiplied.js @@ -1,5 +1,5 @@ -const React = require("react-native"); -const GL = require("gl-react-core"); +const GL = require("gl-react"); +const React = GL.React; const shaders = GL.Shaders.create({ TransparentNonPremultiplied: { diff --git a/Examples/Tests/src/index.js b/Examples/Tests/src/index.js index a7063ec..ff197d0 100644 --- a/Examples/Tests/src/index.js +++ b/Examples/Tests/src/index.js @@ -1,4 +1,4 @@ -require("gl-react-core/react-native"); +require("gl-react/react-native"); const React = require("react-native"); const { Text, diff --git a/Examples/build.sh b/Examples/build.sh index 3746580..4d63d31 100755 --- a/Examples/build.sh +++ b/Examples/build.sh @@ -1,9 +1,7 @@ for ex in */; do cd $ex; - #rm -rf node_modules; - #npm i; - npm i gl-react-native; - react-native bundle --minify; + rm -rf node_modules; + npm i; cd ..; done; diff --git a/README.md b/README.md index 6b51637..118ee68 100644 --- a/README.md +++ b/README.md @@ -4,42 +4,13 @@ OpenGL bindings for react-native to implement complex effects over images and components, in the descriptive VDOM paradigm. -More technically, `gl-react-native` allows you to write a [fragment shader](https://www.opengl.org/wiki/Fragment_Shader) that covers a View. The shader can render: generated graphics/demos, effects on top of images, effects over any UI content... anything you can imagine! - -**`gl-react-native` is directly inspired from our other project, [`gl-react`](http://github.com/ProjectSeptemberInc/gl-react) and implements the same API (so you can write "universal" code).** +**`gl-react-native` is an implementation of `gl-react` for React Native. Please [read the main gl-react README](https://github.com/ProjectSeptemberInc/gl-react/) for more information.** [![](https://github.com/ProjectSeptemberInc/gl-react-native/raw/master/docs/simple.gif)](./Examples/Simple)[![](https://github.com/ProjectSeptemberInc/gl-react-native/raw/master/docs/advancedeffects.gif)](./Examples/AdvancedEffects) -### HelloGL Gist - -```js -const React = require("react-native"); -const GL = require("gl-react-native"); - -const shaders = GL.Shaders.create({ - helloGL: { - frag: ` -precision highp float; -varying vec2 uv; -void main () { - gl_FragColor = vec4(uv.x, uv.y, 0.5, 1.0); -}` - } -}); - -class HelloGL extends GL.Component { - render () { - const { width, height } = this.props; - return ; - } -} -``` +## Documentation -![](https://github.com/ProjectSeptemberInc/gl-react-native/raw/master/docs/hellogl.jpg) +[**Gitbook**](http://projectseptemberinc.gitbooks.io/gl-react/content/) ## Installation @@ -54,14 +25,3 @@ npm i --save gl-react-native **Configure your React Native Application:** ![](https://github.com/ProjectSeptemberInc/gl-react-native/raw/master/docs/install-steps.png) - - -## Influence / Credits - -- [stack.gl](http://stack.gl/) approach -- [GLSL.io](http://glsl.io/) and [Diaporama](https://github.com/gre/diaporama) -- Source code of [React Native](https://github.com/facebook/react-native) - -## Documentation - -[**Gitbook**](http://projectseptemberinc.gitbooks.io/gl-react/content/) diff --git a/ios/GLData.h b/ios/GLData.h index 610261f..4523918 100644 --- a/ios/GLData.h +++ b/ios/GLData.h @@ -1,6 +1,6 @@ #import -// Data format of gl-react-core +// Data format of gl-react @interface GLData: NSObject diff --git a/package.json b/package.json index b3c8227..faf5279 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "license": "MIT", "peerDependencies": { "react-native": ">=0.13.0 <0.16.0", - "gl-react-core": "*" + "gl-react": "*" }, "dependencies": { "invariant": "2.2.0" diff --git a/src/Shaders.js b/src/Shaders.js index 62c46d8..6b30f8a 100644 --- a/src/Shaders.js +++ b/src/Shaders.js @@ -1,4 +1,4 @@ -const {createShaders} = require("gl-react-core"); +const {createShaders} = require("gl-react"); const { NativeModules: { RNGLContext } } = require("react-native"); module.exports = createShaders(function (id, shader) { diff --git a/src/Surface.js b/src/Surface.js index 0fa17f6..2141b2c 100644 --- a/src/Surface.js +++ b/src/Surface.js @@ -1,4 +1,4 @@ -const {createSurface} = require("gl-react-core"); +const {createSurface} = require("gl-react"); const React = require("react-native"); const GLCanvas = require("./GLCanvas"); diff --git a/src/index.js b/src/index.js index 5f62211..b4aa06d 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,4 @@ -const { Shaders } = require("gl-react-core"); +const { Shaders } = require("gl-react"); const Surface = require("./Surface"); const { NativeModules: { RNGLContext } } = require("react-native"); -- 2.26.2