[F] Add imgFormat prop to surveys

- Updates to explorer and tours to make use of imgFormat - Update to tours to hardcode survey to use - Tours use fov of survey as max zoom out level when animating between pois
lsst-epo · Jul 8, 2024 · 889676e · 889676e
1 parent 4e24b51
commit 889676e
Show file tree

Hide file tree

Showing 7 changed files with 20 additions and 8 deletions.
diff --git a/components/AladinForTours/index.js b/components/AladinForTours/index.js
@@ -9,6 +9,7 @@ export default function Aladin({
   tourTitle,
   poi,
   fovRange,
+  initialFov,
   options,
   onClick,
 }) {
@@ -35,7 +36,7 @@ export default function Aladin({
     const { astroObject, fov } = poi;
     if (!astroObject || astroObject?.length < 1) return;
     const { ra, dec } = astroObject[0];
-    aladin.zoomToFoV(100, 0.5, () => {
+    aladin.zoomToFoV(initialFov, 0.5, () => {
       aladin.animateToRaDec(ra, dec, 1.8, () => {
         aladin.zoomToFoV(fov, 0.5, () => {
           const [aladinWidthDegrees, aladinHeightDegrees] = aladin.getFov();
@@ -82,6 +83,7 @@ Aladin.propTypes = {
   survey: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   tourTitle: PropTypes.string,
   poi: PropTypes.object,
+  initialFov: PropTypes.number,
   fovRange: PropTypes.array,
   options: PropTypes.object,
   onClick: PropTypes.func,

diff --git a/components/Pois/index.js b/components/Pois/index.js
@@ -10,6 +10,7 @@ export default function Pois({
   selector,
   options,
   survey,
+  imgFormat,
   fov,
   fovRange,
   poi,
@@ -28,8 +29,9 @@ export default function Pois({
   useAladin(
     selector,
     survey,
+    imgFormat,
     fov,
-    "267.0208333333 -24.7800000000",
+    "04 08 15.873 -34 35 56.46",
     options,
     setAladins
   );
@@ -39,6 +41,7 @@ export default function Pois({
       <AladinForTours
         tourTitle={tourTitle}
         poi={poi}
+        initialFov={fov}
         {...{ selector, survey, fovRange, options }}
       />
     </AladinGlobalProvider>
@@ -53,6 +56,7 @@ Pois.propTypes = {
   options: PropTypes.object,
   poi: PropTypes.object,
   tourTitle: PropTypes.string,
+  imgFormat: PropTypes.string,
 };
 
 Pois.defaultProps = {

diff --git a/components/explorer/index.js b/components/explorer/index.js
@@ -16,6 +16,7 @@ export default function Explorer({
   fov,
   fovRange,
   target,
+  imgFormat,
 }) {
   const [settings, setSettings] = useState({
     showCatalogs: true,
@@ -28,14 +29,14 @@ export default function Explorer({
   const [aladins, setAladins] = useState(null);
   const [filters, setFilters] = useState(defaultFilters);
 
-  useAladin(selector, survey, fov, target, options, setAladins);
+  useAladin(selector, survey, imgFormat, fov, target, options, setAladins);
 
   return (
     <ExplorerProvider value={{ settings, setSettings }}>
       <AladinGlobalProvider value={aladins}>
         <FiltersProvider value={{ setFilters, filters }}>
           <Aladin
-            {...{ target, selector, survey, fov, fovRange, options }}
+            {...{ target, selector, survey, fov, fovRange, options, imgFormat }}
             catalogs={catalogs}
           />
         </FiltersProvider>
@@ -49,6 +50,7 @@ Explorer.propTypes = {
   survey: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   catalogs: PropTypes.array,
   target: PropTypes.string,
+  imgFormat: PropTypes.string,
   fov: PropTypes.number,
   fovRange: PropTypes.array,
   options: PropTypes.object,

diff --git a/hooks/useAladin.js b/hooks/useAladin.js
@@ -4,6 +4,7 @@ import { waitForGlobal } from "@/helpers";
 export default function useAladin(
   selector,
   survey,
+  imgFormat,
   fov,
   target,
   options,
@@ -26,7 +27,7 @@ export default function useAladin(
             survey,
             "equatorial",
             11,
-            { imgFormat: "png" }
+            { imgFormat }
           )
         );
         setAladins({

diff --git a/lib/api/fragments/survey.js b/lib/api/fragments/survey.js
@@ -6,5 +6,6 @@ fragment surveyFragment on surveys_survey_Entry {
     fov
     target
     path
+    imgFormat
   }
 `;
diff --git a/pages/explorer/index.js b/pages/explorer/index.js
@@ -14,7 +14,7 @@ const ExplorerPage = () => {
 
   const { catalogs, surveys } = data;
   const sortedCats = sortCats(catalogs);
-  const { fov, fovMin, fovMax, path, target } = surveys[0];
+  const { fov, fovMin, fovMax, path, target, imgFormat } = surveys[0];
 
   function sortCats(cats) {
     if (!cats) return null;
@@ -47,6 +47,7 @@ const ExplorerPage = () => {
       fov={+fov || 60}
       fovRange={[fovMin, fovMax] || [2, 90]}
       target={target || "267.0208333333 -24.7800000000"}
+      imgFormat={imgFormat}
     />
   );
 };

diff --git a/pages/tours/[tour]/tour.js b/pages/tours/[tour]/tour.js
@@ -51,8 +51,9 @@ const PoiPage = ({ tour }) => {
       ) : (
         <Pois
           selector="#aladin-lite-div"
-          survey="http://alasky.u-strasbg.fr/DSS/DSSColor"
-          fov={100}
+          survey="https://storage.googleapis.com/hips-data/dm-hips/color_riz"
+          imgFormat="png"
+          fov={10}
           fovRange={[0.03, 180]}
           poi={tour?.tourPois[+poi - 1]}
           tourTitle={tour.title}