This is the third THETA 360 tutorial on A-Frame. The tutorials were made for the RICOH THETA Developers SF Bay Area Meetup Group as a way to quickly help beginners get a taste of A-Frame.
Previous Tutorials
These tutorials leverage the Building an Advanced Scene guide of the A-Frame documentation.
Click on the link below:
https://codetricity.github.io/360gallery/
You must run a local web server or load the code up onto GitHub Pages. The files will not work if you open them directly in a browser. The demo is intended to be used in a headset. You can test it on a desktop and simulate the experience.
Move your head to place the black ring over the menu. It will turn green. After a few seconds, it will move to the image that the menu points to.
If you are using a mouse, you can move the ring onto the menu square and then click anywhere on the screen.
There's a simple Python script to take pictures from your local computer using a simple GUI that is mockup of a mobile phone. The script will move the pictures from the camera and store them in /img/. If you want to use this function, you'll need to edit index.html. It's commented.
The controller requires
- Python 2.7 (or around there)
- Python Pygame library
- Python requests library (for HTTP requests)
If you integrate it into a web server, the easiest way to save the pictures into /var/www/ is to run the controller as root. I'm storing my git repo in /var/www for the demo.
