Panolens.js (Github) is a javascript library built on top of Three.JS and the goal is to create or view panoramic content ( including traditional equirectangular image or virtually created content like VR ). It aims to provide easy to use API for developers or photographers to showcase their work efficiently and smoothly.


It first creates a general 3d scene, camera, and renderer (which all can be overwritten) and provides orbit and device orientation controls. Additionally, it provides cardboard effect with built-in reticle for selection. All is done through event disptaching.

Panolens.js is still in its early stage and welcomes any contribution. :)

Panorama Match 3 Game

Traditional match 3 game is 2D, what if we can make the game expand to our physical space? Here's the match 3 game for this idea.

Panorama Reticle Event Example

Panolens.js is not only focusing on mouse or touch input, it also consider mouseless interaction. A reticle works exactly like a virtual mouse always stays at the center of the viewport. Objects (including THREE.Object3D) will be receiving hoverenter and hoverleave events when reticle enters or leaves. Finally, a timer defaults to 1500ms will trigger a click event using high-res timestamp.

Pano Theater

Pano Theater is a project to show the possibility of using Panolens.js. It utilizes tmdb api to fetch movie information and render the trailer in either normal or VR mode.

DEVELOPMENT SCALE
Individual
SKILLS USED
WebGL using ThreeJS, GLSL