Fix onLoad to be triggered when new images are loading

See https://github.com/ProjectSeptemberInc/gl-react/issues/38

Examples/AdvancedEffects/android/app/app.iml

@@ -97,8 +97,8 @@
     <orderEntry type="library" exported="" name="okio-1.6.0" level="project" />
     <orderEntry type="library" exported="" name="stetho-okhttp-1.2.0" level="project" />
     <orderEntry type="library" exported="" name="okhttp-2.5.0" level="project" />
-    <orderEntry type="library" exported="" name="stetho-1.2.0" level="project" />
     <orderEntry type="library" exported="" name="jsr305-3.0.0" level="project" />
+    <orderEntry type="library" exported="" name="stetho-1.2.0" level="project" />
     <orderEntry type="library" exported="" name="jackson-core-2.2.3" level="project" />
     <orderEntry type="library" exported="" name="fbcore-0.8.1" level="project" />
     <orderEntry type="library" exported="" name="commons-cli-1.2" level="project" />

Examples/AdvancedEffects/ios/AdvancedEffects.xcodeproj/xcshareddata/xcschemes/AdvancedEffects.xcscheme

@@ -37,10 +37,10 @@
       </BuildActionEntries>
    </BuildAction>
    <TestAction
+      buildConfiguration = "Debug"
       selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
       selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
-      shouldUseLaunchSchemeArgsEnv = "YES"
-      buildConfiguration = "Debug">
+      shouldUseLaunchSchemeArgsEnv = "YES">
       <Testables>
          <TestableReference
             skipped = "NO">
@@ -62,15 +62,18 @@
             ReferencedContainer = "container:AdvancedEffects.xcodeproj">
          </BuildableReference>
       </MacroExpansion>
+      <AdditionalOptions>
+      </AdditionalOptions>
    </TestAction>
    <LaunchAction
+      buildConfiguration = "Debug"
       selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
       selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
       launchStyle = "0"
       useCustomWorkingDirectory = "NO"
-      buildConfiguration = "Debug"
       ignoresPersistentStateOnLaunch = "NO"
       debugDocumentVersioning = "YES"
+      debugServiceExtension = "internal"
       allowLocationSimulation = "YES">
       <BuildableProductRunnable
          runnableDebuggingMode = "0">
@@ -82,14 +85,21 @@
             ReferencedContainer = "container:AdvancedEffects.xcodeproj">
          </BuildableReference>
       </BuildableProductRunnable>
+      <EnvironmentVariables>
+         <EnvironmentVariable
+            key = "NSZombieEnabled"
+            value = "YES"
+            isEnabled = "YES">
+         </EnvironmentVariable>
+      </EnvironmentVariables>
       <AdditionalOptions>
       </AdditionalOptions>
    </LaunchAction>
    <ProfileAction
+      buildConfiguration = "Release"
       shouldUseLaunchSchemeArgsEnv = "YES"
       savedToolIdentifier = ""
       useCustomWorkingDirectory = "NO"
-      buildConfiguration = "Release"
       debugDocumentVersioning = "YES">
       <BuildableProductRunnable
          runnableDebuggingMode = "0">

Examples/AdvancedEffects/src/Banner.js

@@ -27,7 +27,9 @@ void main( void ) {
 class Banner extends React.Component {
   render () {
     const { width, height, time } = this.props;
-    return <Surface width={width} height={height} opaque={false} onLoad={() => console.log("Banner onLoad")}>
+    return <Surface width={width} height={height} opaque={false}
+      onLoad={() => console.log("Banner onLoad")}
+      onProgress={e => console.log("Banner onProgress", e.nativeEvent)}>
       <GL.Node shader={shaders.banner} uniforms={{ time: time }} />
     </Surface>;
   }

Examples/AdvancedEffects/src/Intro.js

@@ -40,7 +40,9 @@ void main() {
 class Intro extends React.Component {
   render () {
     const { time, fps, width, height } = this.props;
-    return <Surface width={width} height={height} opaque={false}>
+    return <Surface width={width} height={height} opaque={false}
+      onLoad={() => console.log("Intro onLoad")}
+      onProgress={e => console.log("Intro onProgress", e.nativeEvent)}>
       <GL.Node
         shader={shaders.drunkEffect}
         uniforms={{

Examples/AdvancedEffects/src/Vignette.js

@@ -64,6 +64,7 @@ class Vignette extends React.Component {
       onStartShouldSetResponder={() => true}
       onMoveShouldSetResponder={() => true}
       onLoad={() => console.log("Vignette onLoad")}
+      onProgress={e => console.log("Vignette onProgress", e.nativeEvent)}
       onResponderMove={this.onResponderMove}>
       <GL.Node
         shader={shaders.imageVignette}

Examples/Hearts/android/app/app.iml

@@ -65,6 +65,10 @@
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/jni" isTestSource="true" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/rs" isTestSource="true" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/assets" />
+      <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.0.1/jars" />
@@ -77,10 +81,13 @@
       <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/manifests" />
+      <excludeFolder url="file://$MODULE_DIR$/build/intermediates/pre-dexed" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/res" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/rs" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/symbols" />
+      <excludeFolder url="file://$MODULE_DIR$/build/intermediates/tmp" />
       <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" />

Examples/android/RNGL.iml

@@ -85,8 +85,8 @@
     <orderEntry type="library" exported="" name="okio-1.6.0" level="project" />
     <orderEntry type="library" exported="" name="stetho-okhttp-1.2.0" level="project" />
     <orderEntry type="library" exported="" name="okhttp-2.5.0" level="project" />
-    <orderEntry type="library" exported="" name="jsr305-3.0.0" level="project" />
     <orderEntry type="library" exported="" name="stetho-1.2.0" level="project" />
+    <orderEntry type="library" exported="" name="jsr305-3.0.0" level="project" />
     <orderEntry type="library" exported="" name="jackson-core-2.2.3" level="project" />
     <orderEntry type="library" exported="" name="fbcore-0.8.1" level="project" />
     <orderEntry type="library" exported="" name="commons-cli-1.2" level="project" />

android/RNGL.iml

 <?xml version="1.0" encoding="UTF-8"?>
-<module external.linked.project.id=":RNGL" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$/../Examples/Tests/android" external.system.id="GRADLE" external.system.module.group="Tests" external.system.module.version="unspecified" type="JAVA_MODULE" version="4">
+<module external.linked.project.id=":RNGL" external.linked.project.path="$MODULE_DIR$" external.root.project.path="$MODULE_DIR$/../Examples/Hearts/android" external.system.id="GRADLE" external.system.module.group="Hearts" external.system.module.version="unspecified" type="JAVA_MODULE" version="4">
   <component name="FacetManager">
     <facet type="android-gradle" name="Android-Gradle">
       <configuration>

android/src/main/java/com/projectseptember/RNGL/GLCanvas.java

@@ -33,10 +33,12 @@ import java.nio.FloatBuffer;
 import java.nio.IntBuffer;
 import java.util.ArrayList;
 import java.util.HashMap;
+import java.util.HashSet;
 import java.util.LinkedList;
 import java.util.List;
 import java.util.Map;
 import java.util.Queue;
+import java.util.Set;
 import java.util.concurrent.Executor;
 
 import javax.microedition.khronos.egl.EGLConfig;
@@ -47,7 +49,8 @@ public class GLCanvas extends GLSurfaceView
 
     private ReactContext reactContext;
     private RNGLContext rnglContext;
-    private boolean preloadingDone = false;
+    private boolean dirtyOnLoad = true;
+    private boolean neverRendered = true;
     private boolean deferredRendering = false;
     private GLRenderData renderData;
     private int defaultFBO;
@@ -127,11 +130,15 @@ public class GLCanvas extends GLSurfaceView
         if (contentTextures.size() != this.nbContentTextures)
             resizeUniformContentTextures(nbContentTextures);
 
-        if (!preloadingDone) {
-            glClearColor(0.0f, 0.0f, 0.0f, 0.0f);
-            glClear(GL_COLOR_BUFFER_BIT);
+        if (haveRemainingToPreload()) {
+            if (neverRendered) {
+                neverRendered = false;
+                glClearColor(0.0f, 0.0f, 0.0f, 0.0f);
+                glClear(GL_COLOR_BUFFER_BIT);
+            }
             return;
         }
+        neverRendered = false;
 
         final boolean shouldRenderNow = deferredRendering || autoRedraw || nbContentTextures == 0;
         if (nbContentTextures > 0) {
@@ -161,6 +168,15 @@ public class GLCanvas extends GLSurfaceView
         }
     }
 
+    private boolean haveRemainingToPreload() {
+        for (Uri uri: imagesToPreload) {
+            if (!preloaded.contains(uri)) {
+                return true;
+            }
+        }
+        return false;
+    }
+
     public void setNbContentTextures(int n) {
         this.nbContentTextures = n;
         requestRender();
@@ -168,7 +184,7 @@ public class GLCanvas extends GLSurfaceView
 
     public void setRenderId(int renderId) {
         if (nbContentTextures > 0) {
-            if (preloadingDone) syncContentBitmaps();
+            if (!haveRemainingToPreload()) syncContentBitmaps();
             requestRender();
         }
     }
@@ -190,25 +206,18 @@ public class GLCanvas extends GLSurfaceView
 
     public void setData (GLData data) {
         this.data = data;
-        if (preloadingDone) syncContentBitmaps();
+        if (!haveRemainingToPreload()) syncContentBitmaps();
         requestSyncData();
     }
 
 
     public void setImagesToPreload (ReadableArray imagesToPreloadRA) {
-        if (preloadingDone) return;
         List<Uri> imagesToPreload = new ArrayList<>();
         for (int i=0; i<imagesToPreloadRA.size(); i++) {
             imagesToPreload.add(resolveSrc(imagesToPreloadRA.getMap(i).getString("uri")));
         }
-        if (imagesToPreload.size() == 0) {
-            dispatchOnLoad();
-            preloadingDone = true;
-        }
-        else {
-            preloadingDone = false;
-        }
         this.imagesToPreload = imagesToPreload;
+        requestSyncData();
     }
 
     // Sync methods
@@ -231,6 +240,7 @@ public class GLCanvas extends GLSurfaceView
     public void requestSyncData () {
         execute(new Runnable() {
             public void run() {
+                // FIXME: maybe should set a flag so we don't do it twice??
                 if (!syncData())
                     requestSyncData();
             }
@@ -315,22 +325,13 @@ public class GLCanvas extends GLSurfaceView
     }
 
     private void onImageLoad (Uri loaded) {
-        if (!preloadingDone) {
-            preloaded.add(loaded);
-            int count = countPreloaded();
-            int total = imagesToPreload.size();
-            double progress = ((double) count) / ((double) total);
-            dispatchOnProgress(progress, count, total);
-            if (count == total) {
-                dispatchOnLoad();
-                preloadingDone = true;
-                requestSyncData();
-            }
-        }
-        else {
-            // Any texture image load will trigger a future re-sync of data (if no preloaded)
-            requestSyncData();
-        }
+        preloaded.add(loaded);
+        int count = countPreloaded();
+        int total = imagesToPreload.size();
+        double progress = ((double) count) / ((double) total);
+        dispatchOnProgress(progress, count, total);
+        dirtyOnLoad = true;
+        requestSyncData();
     }
 
     public Uri resolveSrc (String src) {
@@ -581,13 +582,17 @@ public class GLCanvas extends GLSurfaceView
         }
     }
 
+
+
     private boolean syncData () {
         if (data == null) return true;
         HashMap<Uri, GLImage> images = new HashMap<>();
         GLRenderData node = recSyncData(data, images);
         if (node == null) return false;
+        Set<Uri> imagesGone = diff(this.images.keySet(), images.keySet());
         renderData = node;
         this.images = images;
+        this.preloaded.removeAll(imagesGone);
         return true;
     }
 
@@ -652,6 +657,11 @@ public class GLCanvas extends GLSurfaceView
         recRender(renderData);
         glDisable(GL_BLEND);
         glBindFramebuffer(GL_FRAMEBUFFER, defaultFBO);
+
+        if (dirtyOnLoad && !haveRemainingToPreload()) {
+            dirtyOnLoad = false;
+            dispatchOnLoad();
+        }
     }
 
     private void dispatchOnCaptureFrame (String frame) {
@@ -666,7 +676,7 @@ public class GLCanvas extends GLSurfaceView
 
     private void dispatchOnProgress (double progress, int loaded, int total) {
         WritableMap event = Arguments.createMap();
-        event.putDouble("progress", progress);
+        event.putDouble("progress", Double.isNaN(progress) ? 0.0 : progress);
         event.putInt("loaded", loaded);
         event.putInt("total", total);
         ReactContext reactContext = (ReactContext)getContext();
@@ -732,4 +742,10 @@ public class GLCanvas extends GLSurfaceView
         mPointerEvents = pointerEvents;
     }
 
+    static <A> Set<A> diff(Set<A> a, Set<A> b) {
+        Set<A> d = new HashSet<>();
+        d.addAll(a);
+        d.removeAll(b);
+        return d;
+    }
 }

ios/GLCanvas.m

@@ -26,6 +26,16 @@ NSString* srcResource (id res)
   return src;
 }
 
+NSArray* diff (NSArray* a, NSArray* b) {
+  NSMutableArray *arr = [[NSMutableArray alloc] init];
+  for (NSString* k in a) {
+    if (![b containsObject:k]) {
+      [arr addObject:k];
+    }
+  }
+  return arr;
+}
+
 // For reference, see implementation of gl-shader's GLCanvas
 
 @implementation GLCanvas
@@ -47,7 +57,8 @@ NSString* srcResource (id res)
   GLint defaultFBO;
   
   NSMutableArray *_preloaded;
-  BOOL _preloadingDone;
+  BOOL _dirtyOnLoad;
+  BOOL _neverRendered;
   
   NSTimer *animationTimer;
   
@@ -61,7 +72,8 @@ NSString* srcResource (id res)
     _images = @{};
     _preloaded = [[NSMutableArray alloc] init];
     _captureFrameRequested = false;
-    _preloadingDone = false;
+    _dirtyOnLoad = true;
+    _neverRendered = true;
     self.context = [bridge.rnglContext getContext];
     self.contentScaleFactor = RCTScreenScale();
   }
@@ -80,15 +92,8 @@ RCT_NOT_IMPLEMENTED(-init)
 
 -(void)setImagesToPreload:(NSArray *)imagesToPreload
 {
-  if (_preloadingDone) return;
-  if ([imagesToPreload count] == 0) {
-    [self dispatchOnLoad];
-    _preloadingDone = true;
-  }
-  else {
-    _preloadingDone = false;
-  }
   _imagesToPreload = imagesToPreload;
+  [self requestSyncData];
 }
 
 - (void)setOpaque:(BOOL)opaque
@@ -151,7 +156,6 @@ RCT_NOT_IMPLEMENTED(-init)
 
 - (void)syncData
 {
-  [EAGLContext setCurrentContext:self.context];
   @autoreleasepool {
     
     NSDictionary *prevImages = _images;
@@ -270,6 +274,9 @@ RCT_NOT_IMPLEMENTED(-init)
     if (res != nil) {
       _renderData = traverseTree(_data);
       _images = images;
+      for (NSString *src in diff([prevImages allKeys], [images allKeys])) {
+        [_preloaded removeObject:src];
+      }
     }
   }
 }
@@ -303,6 +310,16 @@ RCT_NOT_IMPLEMENTED(-init)
   }
 }
 
+- (BOOL)haveRemainingToPreload
+{
+  for (id res in _imagesToPreload) {
+    if (![_preloaded containsObject:srcResource(res)]) {
+      return true;
+    }
+  }
+  return false;
+}
+
 
 //// Draw
 
@@ -316,11 +333,16 @@ RCT_NOT_IMPLEMENTED(-init)
   
   self.layer.opaque = _opaque;
   
-  if (!_preloadingDone) {
-    glClearColor(0.0, 0.0, 0.0, 0.0);
-    glClear(GL_COLOR_BUFFER_BIT);
+  if ([self haveRemainingToPreload]) {
+    if (_neverRendered) {
+      _neverRendered = false;
+      glClearColor(0.0, 0.0, 0.0, 0.0);
+      glClear(GL_COLOR_BUFFER_BIT);
+    }
     return;
   }
+  _neverRendered = false;
+  
   BOOL needsDeferredRendering = _nbContentTextures > 0 && !_autoRedraw;
   if (needsDeferredRendering && !_deferredRendering) {
     dispatch_async(dispatch_get_main_queue(), ^{
@@ -407,6 +429,11 @@ RCT_NOT_IMPLEMENTED(-init)
     recDraw(_renderData);
     glDisable(GL_BLEND);
     glBindFramebuffer(GL_FRAMEBUFFER, defaultFBO);
+    
+    if (_dirtyOnLoad && ![self haveRemainingToPreload]) {
+      _dirtyOnLoad = false;
+      [self dispatchOnLoad];
+    }
   }
 }
 
@@ -414,22 +441,13 @@ RCT_NOT_IMPLEMENTED(-init)
 
 - (void)onImageLoad:(NSString *)loaded
 {
-  if (!_preloadingDone) {
-    [_preloaded addObject:loaded];
-    int count = [self countPreloaded];
-    int total = (int) [_imagesToPreload count];
-    double progress = ((double) count) / ((double) total);
-    [self dispatchOnProgress:progress withLoaded:count withTotal:total];
-    if (count == total) {
-      [self dispatchOnLoad];
-      _preloadingDone = true;
-      [self requestSyncData];
-    }
-  }
-  else {
-    // Any texture image load will trigger a future re-sync of data (if no preloaded)
-    [self requestSyncData];
-  }
+  [_preloaded addObject:loaded];
+  int count = [self countPreloaded];
+  int total = (int) [_imagesToPreload count];
+  double progress = ((double) count) / ((double) total);
+  [self dispatchOnProgress:progress withLoaded:count withTotal:total];
+  _dirtyOnLoad = true;
+  [self requestSyncData];
 }
 
 - (int)countPreloaded