fix setImageSurvey + UI change default element position

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## 3.3.0
 
+* [fixed] multiple calls to setImageSurvey with the same survey object led to strange behaviour.
 * [perf] Display the first tile received instantly with no blending. Should enhance the slow reported in issue #88.
 * [fixed] A.on('select') (debugged from ipyaladin)  
 * [fixed] Simbad pointer in galactical frame, cone search of simbad/vizier cats/other cone search services in galactical frame and MOC creation from selection in galactical frame => there is now a new `frame` optional param to Aladin.pix2world. If not given, the coo returned are in the frame of the view.

examples/al-image-layer-by-name.html

@@ -10,8 +10,7 @@
     import A from '../src/js/A.js';
     let aladin;
     A.init.then(() => {
-        aladin = A.aladin('#aladin-lite-div', {target: 'galactic center'});
+        aladin = A.aladin('#aladin-lite-div', {survey: 'P/allWISE/color', target: 'galactic center'});
-        aladin.setImageSurvey('P/allWISE/color');
     });
 </script>
 

examples/al-perseverence.html

@@ -14,13 +14,14 @@
         // Start up Aladin Lite
         aladin = A.aladin('#aladin-lite-div', {
             fov: 360,
+            projection: 'MER',
             target: '0 0',
             fullScreen: true,
             survey: "CDS/P/Mars/Pan-Perseverance-PIA24422",
             showCooGrid: true,
             showCooGridControl: true,
         });
-        aladin.setProjection('MER');
+
   });
 </script>
 

src/css/aladin.css

@@ -448,7 +448,7 @@ canvas {
 }
 
 .aladin-input-text.aladin-dark-theme.search {
-    width: 15rem;
+    width: 14rem;
     text-shadow: 0px 0px 2px #000;
 }
 
@@ -661,7 +661,7 @@ canvas {
     overflow-y: scroll;
     scrollbar-width: none;
 
-    max-width: 30rem;
+    max-width: 20rem;
 
     font-size: 1rem;
 }
@@ -1133,8 +1133,8 @@ canvas {
 
 .aladin-fov {
     position: absolute;
-    top: 0.4rem;
+    bottom: 0.4rem;
-    left: 25rem;
+    left: 0.4rem;
 
     font-family: monospace;
 
@@ -1149,7 +1149,8 @@ canvas {
 
     position: absolute;
     bottom: 0;
-    right: 90px;
+    left: 50%;
+    transform: translate(-50%, 0);
 }
 
 .aladin-status-bar.aladin-dark-theme {
@@ -1165,14 +1166,13 @@ canvas {
     position: absolute;
     bottom: 2.8rem;
     margin: 0rem 0.4rem;
-    max-width: 100%;
+    max-width: calc(100% - 0.8rem);
     line-height: 1rem;
-
 }
 
 .aladin-share-control {
     position: absolute;
-    bottom: 0.4rem;
+    top: 12.6rem;
     left: 0.4rem;
 }
 

src/js/Aladin.js

@@ -403,9 +403,11 @@ export let Aladin = (function () {
         if (options.showFullscreenControl) {
             this.addUI(new FullScreenActionButton(self))
         }
+
+        this._applyMediaQueriesUI();
     }
 
-    /*Aladin.prototype._applyMediaQueriesUI = function() {
+    Aladin.prototype._applyMediaQueriesUI = function() {
         const applyMediaQuery = function(maxWidth, matchingCallback, unmatchingCallback) {
             function mqFunction(x) {
                 if (x.matches) { // If media query matches
@@ -428,6 +430,7 @@ export let Aladin = (function () {
 
         let self = this;
 
+
         applyMediaQuery('48rem', () => {
             if (self.projBtn) {
                 self.projBtn.update({verbosity: 'reduced'})
@@ -438,7 +441,7 @@ export let Aladin = (function () {
                 self.projBtn.update({verbosity: 'full'})
             }
         })
-    }*/
+    }
 
     /**** CONSTANTS ****/
     Aladin.VERSION = version;

src/js/ImageSurvey.js

@@ -190,6 +190,12 @@ export let ImageSurvey = (function () {
                 let isCDSId = false;
                 try {
                     properties = await HiPSProperties.fetchFromUrl(self.url)
+                        /*.catch((e) => {
+                            // try with the proxy
+                            url = Utils.handleCORSNotSameOrigin(url).href;
+
+                            return HiPSProperties.fetchFromUrl(url);
+                        })*/
                         .catch(async (e) => {
                             // url not valid so we try with the id
                             try {
@@ -818,6 +824,81 @@ export let ImageSurvey = (function () {
             tileSize: 512,
             cooFrame: 'equatorial'
         },
+        Galex_NUV: {
+            creatorDid: "ivo://CDS/P/GALEXGR6_7/NUV",
+            id: "P/GALEXGR6_7/NUV",
+            name: "GALEXGR6_7 NUV",
+            url: "http://alasky.cds.unistra.fr/GALEX/GALEXGR6_7_NUV/",
+            maxOrder: 8,
+            imgFormat: 'png',
+            tileSize: 512,
+            cooFrame: 'equatorial'
+        },
+        IRIS_color: {
+            creatorDid: "ivo://CDS/P/IRIS/color",
+            id: "P/IRIS/color",
+            name: "IRIS colored",
+            url: "https://alasky.cds.unistra.fr/IRISColor",
+            maxOrder: 3,
+            tileSize: 256,
+            imgFormat: 'jpeg',
+            cooFrame: 'galactic'
+        },
+        Mellinger_color: {
+            creatorDid: "ivo://CDS/P/Mellinger/color",
+            id: "P/Mellinger/color",
+            name: "Mellinger colored",
+            url: "https://alasky.cds.unistra.fr/MellingerRGB",
+            maxOrder: 4,
+            tileSize: 512,
+            imgFormat: 'jpeg',
+            cooFrame: 'galactic'
+        },
+        SDSS9_color: {
+            creatorDid: "ivo://CDS/P/SDSS9/color",
+            id: "P/SDSS9/color",
+            name: "SDSS9 colored",
+            url: "https://alasky.cds.unistra.fr/SDSS/DR9/color",
+            maxOrder: 10,
+            tileSize: 512,
+            imgFormat: 'jpeg',
+            cooFrame: 'equatorial'
+        },
+        SPITZER_color: {
+            creatorDid: "ivo://CDS/P/SPITZER/color",
+            id: "P/SPITZER/color",
+            name: "IRAC color I1,I2,I4 - (GLIMPSE, SAGE, SAGE-SMC, SINGS)",
+            url: "http://alasky.cds.unistra.fr/Spitzer/SpitzerI1I2I4color/",
+            maxOrder: 9,
+            tileSize: 512,
+            imgFormat: 'jpeg',
+            cooFrame: 'galactic'
+        },
+        allWISE_color: {
+            creatorDid: "ivo://CDS/P/allWISE/color",
+            id: "P/allWISE/color",
+            name: "AllWISE color",
+            url: "https://alasky.cds.unistra.fr/AllWISE/RGB-W4-W2-W1/",
+            maxOrder: 8,
+            tileSize: 512,
+            imgFormat: 'jpeg',
+            cooFrame: 'equatorial'
+        },
+        /*SDSS9_g: {
+            creatorDid: "ivo://CDS/P/SDSS9/g",
+            id: "P/SDSS9/g",
+            name: "SDSS9 band-g",
+            url: "https://alasky.cds.unistra.fr/SDSS/DR9/band-g",
+            maxOrder: 10,
+            tileSize: 512,
+            numBitsPerPixel: 16,
+            imgFormat: 'fits',
+            cooFrame: 'equatorial',
+            minCut: 0,
+            maxCut: 1.8,
+            stretch: 'linear',
+            colormap: "redtemperature",
+        }*/
         /*
         {
             id: "P/Finkbeiner",
@@ -833,13 +914,7 @@ export let ImageSurvey = (function () {
                 imgFormat: "fits",
             }
         },
-        {
+        
-            id: "P/GALEXGR6_7/NUV",
-            name: "GALEXGR6_7 NUV",
-            url: "http://alasky.cds.unistra.fr/GALEX/GALEXGR6_7_NUV/",
-            maxOrder: 8,
-            subtype: "survey",
-        },
         {
             id: "P/IRIS/color",
             name: "IRIS colored",

src/js/View.js

@@ -1561,20 +1561,12 @@ export let View = (function () {
         // Check whether this layer already exist
         const idxOverlayLayer = this.overlayLayers.findIndex(overlayLayer => overlayLayer == layerName);
         if (idxOverlayLayer == -1) {
+            // it does not exist so we add it to the stack
             this.overlayLayers.push(layerName);
         }
 
-        // Find the toppest layer
-        //const toppestLayer = this.overlayLayers[this.overlayLayers.length - 1];
-        //this.selectedLayer = toppestLayer;
-
-        // Remove the existant layer if there is one
-        let existantImageLayer = this.imageLayers.get(layerName);
-        if (existantImageLayer) {
-            existantImageLayer.added = false;
-        }
-
         this.imageLayers.set(layerName, imageLayer);
+
         ALEvent.HIPS_LAYER_ADDED.dispatchedTo(this.aladinDiv, { layer: imageLayer });
     }
 
@@ -1711,6 +1703,8 @@ export let View = (function () {
 
         // Get the survey to remove to dissociate it from the view
         imageLayer.added = false;
+        // Delete it
+        this.imageLayers.delete(layer);
 
         const idxOverlaidLayer = this.overlayLayers.findIndex(overlaidLayer => overlaidLayer == layer);
         if (idxOverlaidLayer == -1) {
@@ -1718,17 +1712,13 @@ export let View = (function () {
             return;
         }
 
-        // Delete it
-        this.imageLayers.delete(layer);
-
         // Remove it from the layer stack
         this.overlayLayers.splice(idxOverlaidLayer, 1);
 
         if (this.overlayLayers.length === 0) {
             this.empty = true;
         } else if (this.selectedLayer === layer) {
-            // find the toppest layer
+            // If the layer removed was selected then we select the base layer
-            //const toppestLayer = this.overlayLayers[this.overlayLayers.length - 1];
             this.selectedLayer = 'base';
         }
 
@@ -1738,9 +1728,8 @@ export let View = (function () {
         const noMoreLayersToWaitFor = this.promises.length === 0;
         if (noMoreLayersToWaitFor && this.empty) {
             // no promises to launch!
-            const idxServiceUrl = Math.round(Math.random());
+            const dssId = Aladin.DEFAULT_OPTIONS.survey;
-            const dssUrl = Aladin.DEFAULT_OPTIONS.surveyUrl[idxServiceUrl]
+            this.aladin.setBaseImageLayer(dssId);
-            this.aladin.setBaseImageLayer(dssUrl);
         }
     };
 

src/js/gui/Button/Projection.js

@@ -52,7 +52,8 @@ import { ALEvent } from "../../events/ALEvent";
                 url: projectionIconUrl,
             },
             classList: ['aladin-projection-control'],
-            content: [options.verbosity === 'full' ? ProjectionEnum[projectionName].label : ''],
+            //content: [options.verbosity === 'full' ? ProjectionEnum[projectionName].label : projectionName],
+            content: projectionName,
             tooltip: {content: 'Change the view projection', position: {direction: 'bottom left'}},
             cssStyle: {
                 cursor: 'pointer',
@@ -74,8 +75,8 @@ import { ALEvent } from "../../events/ALEvent";
 
         ALEvent.PROJECTION_CHANGED.listenedBy(aladin.aladinDiv, function (e) {
             let projName = aladin.getProjectionName();
-            let content = self.options.verbosity === 'full' ? ProjectionEnum[projName].label : '';
+            //let content = self.options.verbosity === 'full' ? ProjectionEnum[projName].label : projName;
-
+            let content = projName;
             self.update({content})
         });
     }
@@ -97,7 +98,8 @@ import { ALEvent } from "../../events/ALEvent";
                     aladin.setProjection(key)
 
                     let ctxMenu = self._buildLayout(aladin);
-                    self.update({ctxMenu, content: self.options.verbosity === 'full' ? proj.label : ''});
+                    //self.update({ctxMenu, content: self.options.verbosity === 'full' ? proj.label : key});
+                    self.update({ctxMenu});
                 }
             })
         }
@@ -108,11 +110,11 @@ import { ALEvent } from "../../events/ALEvent";
     update(options) {
         super.update(options);
 
-        if (options.verbosity) {
+        /*if (options.verbosity) {
             let ctxMenu = this._buildLayout();
             let projName = this.aladin.getProjectionName();
-            let label = options.verbosity === 'full' ? ProjectionEnum[projName].label : '';
+            let label = options.verbosity === 'full' ? ProjectionEnum[projName].label : projName;
             super.update({ctxMenu, content: label});
-        }
+        }*/
     }
 }

src/js/gui/FoV.js

@@ -82,7 +82,7 @@ export class FoV extends DOMElement {
             '<div class="aladin-monospace-text"></div>'])
         }
 
-        let el = Layout.horizontal({layout, tooltip: { content: 'FoV', position: {direction: "bottom"}}});
+        let el = Layout.horizontal({layout, tooltip: { content: 'FoV', position: {direction: "top"}}});
         el.tooltip.addClass('aladin-fov');
         el.tooltip.addClass('aladin-dark-theme')
 

src/js/gui/Location.js

@@ -197,7 +197,7 @@ export class Location extends DOMElement {
         }, aladin)
     };
 
-    static prec = 7;
+    static prec = 6;
 
     update(options, aladin) {
         let self = this;

src/js/gui/Widgets/Box.js

@@ -86,7 +86,7 @@ export class Box extends DOMElement {
                         size: "small",
                         monochrome: true,
                     },
-                    tooltip: {content: 'Drag the window to move it',  position: {direction: 'right'}},
+                    tooltip: {content: 'Drag the window to move it',  position: {direction: 'top'}},
                     cssStyle: {
                         cursor: 'move',
                     },