cds-astro · HeosFx · Oct 18, 2023 · Oct 18, 2023 · Oct 19, 2023 · Oct 19, 2023
diff --git a/examples/al-vr.html b/examples/al-vr.html
@@ -0,0 +1,113 @@
+<!doctype html>
+<html>
+<head>
+</head>
+<script type="importmap">
+    {
+      "imports": {
+        "three": "https://unpkg.com/three@0.157.0/build/three.module.js",
+        "three/addons/": "https://unpkg.com/three@0.157.0/examples/jsm/"
+      }
+    }
+</script>
+<body>
+
+    <div id="aladin-lite-div" style="width: 1024px; height: 768px"></div>
+
+    <script type="module">
+        import A from '../src/js/A.js';
+        import * as THREE from 'three';
+
+        let aladin;
+        A.init.then(() => {
+            aladin = A.aladin(
+                '#aladin-lite-div',
+                {
+                    survey: 'P/DSS2/color', // set a survey
+                    projection: 'TAN', // set a projection
+                    fov: 70, // initial field of view in degrees
+                    target: '338.98958 33.96', // initial target
+                    cooFrame: 'equatorial', // set galactic frame
+                    showCooGrid: true, // set the grid
+                    fullScreen: true,
+                    vr: {animation: animate.bind(renderer)},
+                }
+            );
+
+            //aladin.setOverlayImageLayer("https://alasky.cds.unistra.fr/JWST/CDS_P_JWST_Stephans-Quintet_NIRCam+MIRI")
+            initScene(aladin.view.imageCanvas);
+            aladin.setRenderer(renderer);
+        });
+
+        let renderer = null;
+        let scene = null;
+        let camera = null;
+        let cubeMesh = null;
+        // let controls = null;
+
+        /**
+         * Initializes a 3D scene, camera, and renderer for virtual reality (VR).
+         *
+         * @param {HTMLCanvasElement} canvas - The HTML canvas element to render the
+         * 3D scene
+         */
+        function initScene(canvas) {
+            scene = new THREE.Scene();
+
+            camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1, 1000);
+            scene.add(camera);
+
+            renderer = new THREE.WebGLRenderer({canvas: canvas, context: canvas.getContext('webgl2', {xrCompatible: true})}); // NOTE Une différence ici
+            renderer.setPixelRatio(window.devicePixelRatio);
+            renderer.setSize(window.innerWidth, window.innerHeight);
+            renderer.xr.enabled = true;
+            // renderer.xr.setReferenceSpaceType('local');
+            renderer.autoClear = false;
+
+            const light = new THREE.PointLight(0xffffff, 10);
+            light.position.set(0, 2, 1);
+            scene.add(light);
+
+            const planeGeometry = new THREE.PlaneGeometry(10, 10);
+            const planeMaterial = new THREE.MeshPhongMaterial({ color: 0xff00ff });
+            const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial);
+            planeMesh.position.set(0, -1, 0);
+            planeMesh.rotation.x = -Math.PI / 2;
+            scene.add(planeMesh);
+
+            const cubeGeometry = new THREE.BoxGeometry(1, 1, 1);
+            const cubeMaterial = new THREE.MeshPhongMaterial({ color: 0x00ff00 });
+            cubeMesh = new THREE.Mesh(cubeGeometry, cubeMaterial);
+            cubeMesh.position.set(0, 0, -2);
+            scene.add(cubeMesh);
+        }
+
+        /**
+         * Function to animate the 3D scene and rendering it.
+         */
+        function animate() {
+            cubeMesh.rotation.x += 0.001;
+            cubeMesh.rotation.y += 0.001;
+
+            renderer.render( scene, camera );
+        }
+
+        // /**
+        //  * Initializes a WebGL2 context and handles potential errors.
+        //  */
+        // function initWebGL2() {
+        //     // canvas = aladin.view.imageCanvas;
+        //     canvas = document.getElementById(aladin.view.imageCanvas);
+        //     // gl = canvas.getContext("webgl2", { alpha: true });
+        //     gl = canvas.getContext('webgl2');
+        //     if (!gl) { // If the gl didn't create properly
+        //         alert('This browser doesn\'t support WebGL2');
+        //         return;
+        //     }
+
+        // }
+
+    </script>
+
+</body>
+</html>
diff --git a/src/core/al-core/src/object/vertex_array_object.rs b/src/core/al-core/src/object/vertex_array_object.rs
@@ -9,8 +9,8 @@ pub mod vao {
     use crate::object::element_array_buffer::ElementArrayBuffer;
 
     use crate::webgl_ctx::WebGlContext;
-    use std::collections::HashMap;
     use crate::Abort;
+    use std::collections::HashMap;
 
     pub struct VertexArrayObject {
         array_buffer: HashMap<&'static str, ArrayBuffer>,
@@ -88,7 +88,10 @@ pub mod vao {
         }*/
 
         pub fn num_elements(&self) -> usize {
-            self.element_array_buffer.as_ref().unwrap_abort().num_elements()
+            self.element_array_buffer
+                .as_ref()
+                .unwrap_abort()
+                .num_elements()
         }
 
         pub fn num_instances(&self) -> i32 {
@@ -155,6 +158,7 @@ pub mod vao {
 
         pub fn unbind(&self) {
             self.vao.gl.bind_vertex_array(None);
+            self._shader.unbind(&self.vao.gl);
         }
     }
 
@@ -170,8 +174,9 @@ pub mod vao {
     }
 
     impl<'a, 'b> ShaderVertexArrayObjectBoundRef<'a, 'b> {
-        pub fn draw_arrays(&self, mode: u32, byte_offset: i32, size: i32) {
+        pub fn draw_arrays(&self, mode: u32, byte_offset: i32, size: i32) -> &Self {
             self.vao.gl.draw_arrays(mode, byte_offset, size);
+            self
         }
 
         pub fn draw_elements_with_i32(
@@ -180,30 +185,33 @@ pub mod vao {
             num_elements: Option<i32>,
             type_: u32,
             byte_offset: i32,
-        ) {
+        ) -> &Self {
             let num_elements = num_elements.unwrap_or(self.vao.num_elements() as i32);
             self.vao
                 .gl
                 .draw_elements_with_i32(mode, num_elements, type_, byte_offset);
+            self
         }
 
         pub fn draw_elements_instanced_with_i32(
             &self,
             mode: u32,
             offset_element_idx: i32,
             num_instances: i32,
-        ) {
+        ) -> &Self {
             self.vao.gl.draw_elements_instanced_with_i32(
                 mode,
                 self.vao.num_elements() as i32,
                 WebGl2RenderingContext::UNSIGNED_SHORT,
                 offset_element_idx,
                 num_instances,
             );
+            self
         }
 
         pub fn unbind(&self) {
             self.vao.gl.bind_vertex_array(None);
+            self._shader.unbind(&self.vao.gl);
         }
     }
 
@@ -444,7 +452,10 @@ pub mod vao {
         }*/
 
         pub fn num_elements(&self) -> usize {
-            self.element_array_buffer.as_ref().unwrap_abort().num_elements()
+            self.element_array_buffer
+                .as_ref()
+                .unwrap_abort()
+                .num_elements()
         }
 
         pub fn num_instances(&self) -> i32 {
@@ -511,7 +522,8 @@ pub mod vao {
         }
 
         pub fn unbind(&self) {
-            //self.vao.gl.bind_vertex_array(None);
+            self.vao.gl.bind_vertex_array(None);
+            self._shader.unbind(&self.vao.gl);
         }
     }
 
@@ -528,13 +540,15 @@ pub mod vao {
     }
     use crate::object::array_buffer::VertexBufferObject;
     impl<'a, 'b> ShaderVertexArrayObjectBoundRef<'a, 'b> {
-        pub fn draw_arrays(&self, mode: u32, byte_offset: i32, size: i32) {
+        pub fn draw_arrays(&self, mode: u32, byte_offset: i32, size: i32) -> &Self {
             for (attr, buf) in self.vao.array_buffer.iter() {
                 buf.bind();
                 buf.set_vertex_attrib_pointer_by_name::<f32>(self.shader, attr);
             }
 
             self.vao.gl.draw_arrays(mode, byte_offset, size);
+
+            self
         }
 
         pub fn draw_elements_with_i32(
@@ -543,7 +557,7 @@ pub mod vao {
             num_elements: Option<i32>,
             type_: u32,
             byte_offset: i32,
-        ) {
+        ) -> &Self {
             for (attr, buf) in self.vao.array_buffer.iter() {
                 buf.bind();
                 buf.set_vertex_attrib_pointer_by_name::<f32>(self.shader, attr);
@@ -555,14 +569,15 @@ pub mod vao {
             self.vao
                 .gl
                 .draw_elements_with_i32(mode, num_elements, type_, byte_offset);
+            self
         }
 
         pub fn draw_elements_instanced_with_i32(
             &self,
             mode: u32,
             offset_element_idx: i32,
             num_instances: i32,
-        ) {
+        ) -> &Self {
             for (attr, buf) in self.vao.array_buffer.iter() {
                 buf.bind();
                 buf.set_vertex_attrib_pointer_by_name::<f32>(self.shader, attr);
@@ -587,10 +602,12 @@ pub mod vao {
                     offset_element_idx,
                     num_instances,
                 );
+            self
         }
 
         pub fn unbind(&self) {
-            //self.vao.gl.bind_vertex_array(None);
+            self.vao.gl.bind_vertex_array(None);
+            self.shader.unbind(&self.vao.gl);
         }
     }
 
@@ -716,6 +733,9 @@ pub mod vao {
 
         pub fn unbind(&self) {
             //self.vao.gl.bind_vertex_array(None);
+
+            self.vao.gl.bind_vertex_array(None);
+            self.shader.unbind(&self.vao.gl);
         }
     }
 

diff --git a/src/core/src/app.rs b/src/core/src/app.rs
@@ -875,7 +875,7 @@ impl App {
                 &self.colormaps,
                 &self.projection,
             )?;
-
+            /*
             // Draw the catalog
             //let fbo_view = &self.fbo_view;
             //catalogs.draw(&gl, shaders, camera, colormaps, fbo_view)?;
@@ -903,7 +903,7 @@ impl App {
             self.line_renderer.draw(&self.camera)?;
             //let dpi  = self.camera.get_dpi();
             //ui.draw(&gl, dpi)?;
-
+            */
             // Reset the flags about the user action
             self.camera.reset();
 

diff --git a/src/core/src/renderable/hips/mod.rs b/src/core/src/renderable/hips/mod.rs
@@ -1047,7 +1047,8 @@ impl HiPS {
                         Some(self.num_idx as i32),
                         WebGl2RenderingContext::UNSIGNED_SHORT,
                         0,
-                    );
+                    )
+                    .unbind();
             }
 
             Ok(())

diff --git a/src/core/src/renderable/hips/raytracing.rs b/src/core/src/renderable/hips/raytracing.rs
@@ -225,7 +225,8 @@ impl RayTracer {
                 None,
                 WebGl2RenderingContext::UNSIGNED_SHORT,
                 0,
-            );
+            )
+            .unbind();
         #[cfg(feature = "webgl2")]
         shader
             .attach_uniform("position_tex", &self.position_tex)
@@ -236,6 +237,7 @@ impl RayTracer {
                 WebGl2RenderingContext::UNSIGNED_SHORT,
                 0,
             )
+            .unbind();
     }
 
     pub fn is_rendering(&self, camera: &CameraViewPort) -> bool {

diff --git a/src/core/src/renderable/image/mod.rs b/src/core/src/renderable/image/mod.rs
@@ -612,7 +612,8 @@ impl Image {
                         Some(num_indices),
                         WebGl2RenderingContext::UNSIGNED_SHORT,
                         ((off_indices as usize) * std::mem::size_of::<u16>()) as i32,
-                    );
+                    )
+                    .unbind();
 
                 off_indices += self.num_indices[idx];
             }

diff --git a/src/core/src/renderable/mod.rs b/src/core/src/renderable/mod.rs
@@ -259,7 +259,8 @@ impl Layers {
                     None,
                     WebGl2RenderingContext::UNSIGNED_SHORT,
                     0,
-                );
+                )
+                .unbind();
         }
 
         // The first layer must be paint independently of its alpha channel

diff --git a/src/js/Aladin.js b/src/js/Aladin.js
@@ -50,6 +50,7 @@ import { ContextMenu } from "./gui/ContextMenu.js";
 import { ALEvent } from "./events/ALEvent.js";
 import { Color } from './Color.js';
 import { ImageFITS } from "./ImageFITS.js";
+import { VRButton } from "./VRButton.js";
 import { DefaultActionsForContextMenu } from "./DefaultActionsForContextMenu.js";
 import A from "./A.js";
 
@@ -458,7 +459,8 @@ export let Aladin = (function () {
             //this.discoverytree = new DiscoveryTree(this);
         //}
 
-        this.view.redraw();
+        // [ ] That might pose problems
+        //this.view.redraw();
 
         // go to full screen ?
         if (options.fullScreen) {
@@ -471,6 +473,11 @@ export let Aladin = (function () {
             this.contextMenu = new ContextMenu(this);
             this.contextMenu.attachTo(this.view.catalogCanvas, DefaultActionsForContextMenu.getDefaultActions(this));
         }
+
+        // initialize the VR button
+        if (options.vr) {
+            this.aladinDiv.appendChild(VRButton.createButton(this.view));
+        }
     };
 
     /**** CONSTANTS ****/
@@ -671,6 +678,11 @@ export let Aladin = (function () {
         });
     };
 
+    // @API
+    Aladin.prototype.setRenderer = function(renderer) {
+        this.options.vr.renderer = renderer;
+    }
+
     Aladin.prototype.setFrame = function (frameName) {
         if (!frameName) {
             return;
-Original file line number
+Diff line change
@@ Expand Up / @@ -1047,7 +1047,8 @@ impl HiPS { @@
                             Some(self.num_idx as i32),
                             WebGl2RenderingContext::UNSIGNED_SHORT,
 ,
-                        );
+                        )
+                        .unbind();
                 }
                 Ok(())
@@ Expand Down @@