404 not found: react-360-common-ui

[Manny-Mobfish]

Description

I've tried to install the "react-360-common-ui" for a flat video. But I'm getting a "404 not found" from npm.

I've followed the instruction on your document page at: https://facebook.github.io/react-360/docs/photos-and-videos.html

Unfortunately so far without success.

C:\xampp\htdocs\webvr>npm install react-360-common-ui
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/react-360-common-ui - Not found
npm ERR! 404
npm ERR! 404  'react-360-common-ui@latest' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

• Operating System: Windows

[drubio1989]

Hey man, I have a solution for you but it's dirty. I'm sure the documentation will be updated when 2.0 comes out but here's what you can do in the meantime:

If you really want the features of the react-360-common-ui, go to the addons folder of the code and locate react-360-common-ui. Copy and paste the contents of index.js, VideoControl.react.js and VideoPlayer.react.js into your own project. So for example, you would have a src folder with the contents of those three files to import/export from. So when its all done you would have this in your index.js file:

import {VideoPlayer} from './src/VideoExtra';

export default class VideoVR extends React.Component {
    render() {
      return (
        <View style={{flex: 1}}>
          <VideoPlayer
             muted={true}
             source={{url: asset('video.mp4').uri}}
             stereo={'2D'}
             style={{
             width: 600,
             height: 400,
           }}
        />
       </View>
    );
   }
 };

That should work.

By the way, if you were interested and new to React 360, I do have a course on Udemy that goes over the fundamentals of React 360 and how to use basic features. React 360 WebVR

Here is a preview on youtube React 360 on mobile

[coderighter2]

how to implement rewind function?

[drubio1989]

The rewind function is provided by the slider in VideoPlayer

[Manny-Mobfish]

Does this only wokrs with surfaces (it looks like)? We're only using 3D Locations.