Hercules React Native to XRE -- Scrollview cleanup and MovieFetcher example

Register
Submit a solution
The challenge is finished.

Challenge Overview

This challenge is part of a new project involving React Native.  The eventual goal is to have a way to build React Native apps for Hercule's embedded devices that communicate with the device over websockets, using the proprietary XRE messaging protocol.  They would like to see if we can build a React Native translator that sits on a server and communicates with clients, sending them XRE messages to draw the React Native components.

Basically, we are going to stream apps to a client and update the client based on actions that raise events from the client to the server.

This challenge will implement ListView and ScrollView support (as best we can) into the React-->XRE translation piece.

Requirements:


This challenge will implement fixes fpr ListView and ScrollView support for React-->XRE.  

We must support these for scrolling.  Note that having a mouse is not a production use, but the XRE receiver does support mouse buttons and the scrollwheel.  In production, the apps will only be navigated by keyboard or remote control, so keyboard-only functionality must be fully tested.

* Mouse and scrollwheel
* Keyboard / remote control

We will also add a MovieFetcher example

The list of tickets that comprise the requirements are as follows:

https://gitlab.com/hercules-react-xre/react-xre-poc/issues/29
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/30
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/31
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/32
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/33
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/34
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/35
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/36
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/37
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/38
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/39
https://gitlab.com/hercules-react-xre/react-xre-poc/issues/40

REVIEWERS - Please test both mouse AND keyboard in the XRE receiver for all submissions

MovieFetcher

Note that the MovieFetcher example may have to be tweaked a bit for the XRE integration, but if you make changes please make sure to clearly document what changed and why in the README.  The goal is to identify any potential issues that would cause compatibilty issues with "real" React Native apps.

Note that the MovieFetcher app must be navigable by the keyboard.  Right now we have support for these keys:

* left
* right
* up 
* down
* enter
* escape


Native validation

To prove out the solution, we need to ensure that a native mobile build of the test app matches what is displayed in XRE.  Please provide documentation on how to compile each example and run it in Android or iOS, and please also provide this information as part of your submission video.

Background

The server side "screens" will be implemented in React Native, using React classes. 
The goal is to make sure the React Native definition is generic, not custom to XRE.  The normal React Native development process will apply on the server.

Deployment

The README must be brought up to date with the latest changes and must clearly cover deployment to Heroku.  Submitters are required to document the Heroku deploy clearly and test this.

REVIEWERS - Please make sure to deploy each submission to Heroku and test from there.
 
Submission

Your submission should be a patch file in Git against commit hash 
ac2c75c6f138cc951fd546721f9eef654f827c25

Please make sure your updated README covers:

1.  How to deploy the server-side to Heroku (REQUIRED FOR TESTING BY REVIEWERS AND SUBMITTERS)
2.  How to configure the client XRE receiver to connect to the server and work with the different apps available

A video is required, but it only needs to cover the validation (XRE and native), not the setup.  Having the setup details only in the README is fine.

Links:


https://facebook.github.io/react-native/���
https://www.youtube.com/watch?v=hDviGU-57lU
 


Final Submission Guidelines

Please see above

ELIGIBLE EVENTS:

2017 TopCoder(R) Open

Review style

Final Review

Community Review Board

Approval

User Sign-Off

ID: 30057374