Nested animations through context in Reapp

gistfile1.txt

<ViewList animator> // passes context: { step: 0.555 }
  <View /> // extends context with { index: 0 }
  <View /> // ...
  <View>  // extends context with { index: 2 }
  
    // here's the tricky part: you can nest ViewLists, and they should pass their "new" context down to their children
    <ViewList> // reset context { step: 0 }
      <View /> // reset context { index: 0 }
    </ViewList>
  </View>
</ViewList>


Where a View has nested animations:

<View> // animates inner view
 <TitleBar> // animates slower than view
   <Button>
     <Icon animated> // animates against titlebar to stay in same place
   </Button>
 </TitleBar>
</View>

As I understand index reflects component hierarchy configuration in some way, it should be outside of observable in this case, I think. If step is the one which is dynamic (time?) it should be an observable.

@andreypopp as for you concerns with unmount, I've run into this at least in one case, but it's actually not been bad. I do have a component called AnimationLoop and you could extend that type of component to keep it's children in state, etc.

Thanks for the thoughts here. Glad I started looking into this. I'm super busy at the moment but you can see the code diff here:

https://github.com/reapp/reapp-ui/compare/observeAnimations

It needs lots of bugfixing and optimization though.