SHARE
TWEET

Untitled

a guest Sep 21st, 2019 89 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. export default class multiSurface extends React.Component {
  2.   render() {
  3.     return (
  4.       <View>
  5.      
  6.         //1.
  7.         // Pay attention here. This is the key of how this will work
  8.         // You will need to find a way to pass differentiating props to surfaceModule.info()
  9.         // to play the specific info you want. There is no need to create more surfaces/methods
  10.         <VrButton style={styles.pointOfInterest} onClick={() => surfaceModule.info(this.props.point1, point2 or point3 etc.)}>
  11.         //
  12.      
  13.           <Image source={asset(`info-${this.props.imagePoint}.png`)}
  14.             style={{
  15.               width: 100,
  16.               height: 100,
  17.             }}
  18.             />
  19.         </VrButton>
  20.       </View>
  21.     );
  22.   }
  23. };
  24.  
  25.  
  26. //2.
  27. //client.js
  28. // Pay attention here. The info will take as arguments the props that you passed from the button click
  29. //
  30.   info(pointOfInterest, vide) {
  31.     infoPanel.setAngle(
  32.       -0.5,
  33.       0,
  34.       0
  35.     );
  36.  
  37.     infoRoot = r360.renderToSurface(
  38.       r360.createRoot('InfoPanel', { //The arguments passed from the props go here just like in TourismVR }),
  39.       infoPanel,
  40.     );
  41.  
  42.     videoPanel.setAngle(
  43.       0.5,
  44.       0,
  45.       0
  46.     );
  47.  
  48.     videoRoot = r360.renderToSurface(
  49.       r360.createRoot('Video', { //The arguments passed from the props go here just like in TourismVR for the Video}),
  50.       videoPanel,
  51.       'video'
  52.     );
  53.   }
  54.  
  55.  
  56. //3. Dynamic Video and InfoPanel
  57. / Finally with the arguments that you passed in, the video and infopanel that are generated with the click of a button
  58. /  will have the info you need
  59.  
  60.  
  61. export default class Video extends React.Component {
  62.  
  63.   //
  64.   warehouse = VideoModule.createPlayer(// Youll need to dynamically pass in a player here);
  65.  
  66.   componentDidMount() {
  67.     this.warehouse.play({
  68.  
  69.       ///
  70.       source: {url: asset('./video/<dynamically show the video of choice>.mp4').uri},
  71.       //
  72.  
  73.       muted: false,
  74.       volume: 0.1
  75.     });
  76.  
  77.     Environment.setScreen(
  78.       'default', /* screen name */
  79.        ///////
  80.       '<dynamic video from the props/arguments given>', /* player unique id */
  81.        ////////
  82.       'video', /* surface name */
  83.       0, 0, 850, 500 /* relative position on the surface */
  84.     );
  85.   }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top