Skip to content

Commit

Permalink
restore zooming out feature
Browse files Browse the repository at this point in the history
  • Loading branch information
@bmatthieu3
bmatthieu3 committed Oct 11, 2024
1 parent 278bba0 commit 9b098fd
Show file tree
Hide file tree
Showing 12 changed files with 107 additions and 107 deletions.
7 changes: 4 additions & 3 deletions examples/al-adass2022.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,9 @@
import A from '../src/js/A.js';
let aladin;
A.init.then(() => {
aladin = A.aladin('#aladin-lite-div', {showSettingsControl: true, survey: "P/PanSTARRS/DR1/color-z-zg-g", showReticle: false, projection: "AIT", cooFrame: 'icrs', target: "stephan's quintet", fov: 1000, showGotoControl: false, showFrame: false, fullScreen: true, showLayersControl: true, showCooGridControl: false});
aladin.showHealpixGrid(true);
let startFov = 1000;
aladin = A.aladin('#aladin-lite-div', {showSettingsControl: true, survey: "P/PanSTARRS/DR1/color-z-zg-g", showReticle: false, projection: "AIT", cooFrame: 'icrs', target: "stephan's quintet", fov: startFov, showGotoControl: false, showFrame: false, fullScreen: true, showLayersControl: true, showCooGridControl: false});

const chft = aladin.createImageSurvey('CFHT', "CFHT deep view of NGC7331 and Stephan's quintet u+g+r", "https://cds.unistra.fr/~derriere/PR_HiPS/2022_Duc/", null, null, {imgFormat: 'png'});
const nircamJWST = aladin.createImageSurvey('Nircam', "Stephans Quintet NIRCam+MIRI", "http://alasky.cds.unistra.fr/JWST/CDS_P_JWST_Stephans-Quintet_NIRCam+MIRI/", null, null, {imgFormat: 'png', colormap: "viridis"});

Expand All @@ -21,7 +22,7 @@
aladin.getOverlayImageLayer("CFHT").toggle();
aladin.getOverlayImageLayer("Nircam").toggle();

let fov = 360;
let fov = startFov;
let rotation = 0;

setInterval(function zoom() {
Expand Down
6 changes: 3 additions & 3 deletions src/core/src/app.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -902,12 +902,12 @@ impl App {
//let fbo_view = &self.fbo_view;
//catalogs.draw(&gl, shaders, camera, colormaps, fbo_view)?;
//catalogs.draw(&gl, shaders, camera, colormaps, None, self.projection)?;
gl.blend_func_separate(
/*gl.blend_func_separate(
WebGl2RenderingContext::SRC_ALPHA,
WebGl2RenderingContext::ONE,
WebGl2RenderingContext::ONE,
WebGl2RenderingContext::ONE,
);
);*/
moc.draw(camera, projection, shaders)?;

gl.blend_func_separate(
Expand Down Expand Up @@ -1399,7 +1399,7 @@ impl App {
}

pub(crate) fn set_grid_cfg(&mut self, cfg: GridCfg) -> Result<(), JsValue> {
self.grid.set_cfg(cfg, &self.camera, &self.projection)?;
self.grid.set_cfg(cfg)?;
self.request_redraw = true;

Ok(())
Expand Down
51 changes: 32 additions & 19 deletions src/core/src/camera/viewport.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,7 +337,7 @@ impl CameraViewPort {
self.last_user_action
};

let _can_unzoom_more = match proj {
let can_unzoom_more = match proj {
ProjectionType::Tan(_)
| ProjectionType::Mer(_)
//| ProjectionType::Air(_)
Expand All @@ -351,32 +351,45 @@ impl CameraViewPort {

let aperture_start: Angle<f64> = ArcDeg(proj.aperture_start()).into();

self.aperture = aperture.min(aperture_start);
// Compute the new clip zoom factor
let a = aperture.abs();

let v0 = math::lonlat::radec_to_xyzw(-a / 2.0, Angle(0.0));
let v1 = math::lonlat::radec_to_xyzw(a / 2.0, Angle(0.0));

// Vertex in the WCS of the FOV
self.clip_zoom_factor = if self.width < self.height {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
self.clip_zoom_factor = if aperture > aperture_start {
//al_core::log(&format!("a: {:?}, as: {:?}", aperture, aperture_start));
if can_unzoom_more {
aperture.0 / aperture_start.0
} else {
1.0
}
} else {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
// Compute the new clip zoom factor
let a = aperture.abs();

let v0 = math::lonlat::radec_to_xyzw(-a / 2.0, Angle(0.0));
let v1 = math::lonlat::radec_to_xyzw(a / 2.0, Angle(0.0));

// Vertex in the WCS of the FOV
if self.width < self.height {
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
} else {
1.0
}
} else {
1.0
if let (Some(p0), Some(p1)) =
(proj.world_to_clip_space(&v0), proj.world_to_clip_space(&v1))
{
(0.5 * (p1.x - p0.x).abs()).min(1.0)
} else {
1.0
}
}
};

self.aperture = aperture.min(aperture_start);
//self.aperture = aperture;

//al_core::log(&format!("zoom factor {:?}", self.clip_zoom_factor));

//console_log(&format!("clip factor {:?}", self.aperture));

// Project this vertex into the screen
Expand Down
2 changes: 0 additions & 2 deletions src/core/src/lib.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -505,11 +505,9 @@ impl WebClient {
/// * `fov` - The field of view in degrees
#[wasm_bindgen(js_name = setFieldOfView)]
pub fn set_fov(&mut self, fov: f64) -> Result<(), JsValue> {
//let fov = fov as f32;
let fov = ArcDeg(fov).into();

self.app.set_fov(fov);
//self.projection.set_fov(&mut self.app, ArcDeg(fov).into());

Ok(())
}
Expand Down
11 changes: 1 addition & 10 deletions src/core/src/renderable/grid/mod.rs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,12 +114,7 @@ impl ProjetedGrid {
Ok(grid)
}

pub fn set_cfg(
&mut self,
new_cfg: GridCfg,
_camera: &CameraViewPort,
_projection: &ProjectionType,
) -> Result<(), JsValue> {
pub fn set_cfg(&mut self, new_cfg: GridCfg) -> Result<(), JsValue> {
let GridCfg {
color,
opacity,
Expand Down Expand Up @@ -165,10 +160,6 @@ impl ProjetedGrid {

if let Some(enabled) = enabled {
self.enabled = enabled;

/*if !self.enabled {
self.text_renderer.clear_text_canvas();
}*/
}

Ok(())
Expand Down
8 changes: 3 additions & 5 deletions src/js/DefaultActionsForContextMenu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -229,12 +229,10 @@ export let DefaultActionsForContextMenu = (function () {
},
{
label: "HiPS2FITS cutout", action(o) {
let hips2fitsUrl = 'https://alasky.cds.unistra.fr/hips-image-services/hips2fits#';
let radec = a.getRaDec();
let fov = Math.max.apply(null, a.getFov());
let hips2fitsUrl = 'https://alasky.cds.unistra.fr/hips-image-services/hips2fits?';
let hipsId = a.getBaseImageLayer().id;
let proj = a.getProjectionName();
hips2fitsUrl += 'ra=' + radec[0] + '&dec=' + radec[1] + '&fov=' + fov + '&projection=' + proj + '&hips=' + encodeURIComponent(hipsId);
let wcs = JSON.stringify(a.getViewWCS());
hips2fitsUrl += 'wcs=' + encodeURIComponent(wcs) + '&hips=' + encodeURIComponent(hipsId);
window.open(hips2fitsUrl, '_blank');
}
},
Expand Down
8 changes: 4 additions & 4 deletions src/js/ProjectionEnum.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,9 @@ export let ProjectionEnum = {
// Zenithal
TAN: {id: 1, fov: 150, label: "Tangential"}, /* Gnomonic projection */
STG: {id: 2, fov: 240, label: "Stereographic"}, /* Stereographic projection */
SIN: {id: 3, fov: 180, label: "Spheric"}, /* Orthographic */
SIN: {id: 3, fov: 1000, label: "Spheric"}, /* Orthographic */
// TODO: fix why the projection disappears at fov = 360.0
ZEA: {id: 4, fov: 359.999, label: "Zenital equal-area"}, /* Equal-area */
ZEA: {id: 4, fov: 1000, label: "Zenital equal-area"}, /* Equal-area */
//FEYE: {id: 5, fov: 190, label: "fish eye"},
//AIR: {id: 6, fov: 360, label: "airy"},
//AZP: {fov: 180},
Expand All @@ -45,10 +45,10 @@ export let ProjectionEnum = {
//CEA: {id: 11, fov: 360, label: "cylindrical equal area"},
//CYP: {id: 12, fov: 360, label: "cylindrical perspective"},
// Pseudo-cylindrical
AIT: {id: 13, fov: 360, label: "Hammer-Aïtoff"},
AIT: {id: 13, fov: 1000, label: "Hammer-Aïtoff"},
//PAR: {id: 14, fov: 360, label: "parabolic"},
//SFL: {id: 15, fov: 360, label: "sanson-flamsteed"},
MOL: {id: 16, fov: 360, label: "Mollweide"},
MOL: {id: 16, fov: 1000, label: "Mollweide"},
// Conic
//COD: {id: 17, fov: 360, label: "conic equidistant"},
// Hybrid
Expand Down
78 changes: 39 additions & 39 deletions src/js/View.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,9 @@ export let View = (function () {
// MOCs
this.mocs = [];

this.outsideFov = 0;
this.outside = false;

self.redrawClbk = this.redraw.bind(this);
// Init the WebGL context
// At this point, the view has been created so the image canvas too
Expand Down Expand Up @@ -195,8 +198,7 @@ export let View = (function () {
this.setProjection(projName)

// Then set the zoom properly once the projection is defined
this.wasm.setFieldOfView(initialFov);
this.updateZoomState();
this.setZoom(initialFov)

// Target position settings
this.viewCenter = { lon, lat }; // position of center of view
Expand Down Expand Up @@ -398,6 +400,7 @@ export let View = (function () {
this.imageCtx.canvas.style.width = this.width + "px";
this.imageCtx.canvas.style.height = this.height + "px";
this.wasm.resize(this.width, this.height);
this.setZoom(this.fov)

pixelateCanvasContext(this.imageCtx, this.aladin.options.pixelateCanvas);

Expand Down Expand Up @@ -1130,23 +1133,15 @@ export let View = (function () {

// disable text selection on IE
//Utils.on(view.aladinDiv, "selectstart", function () { return false; })
var eventCount = 0;
/*var eventCount = 0;
var eventCountStart;
var isTouchPad;
let id;
let id;*/

Utils.on(view.catalogCanvas, 'wheel', function (e) {
e.preventDefault();
e.stopPropagation();

view.wheelTriggered = true;

clearTimeout(id);
id = setTimeout(() => {
view.wheelTriggered = false;
view.zoom.stopAnimation();
}, 100);

const xymouse = Utils.relMouseCoords(e);
view.xy = xymouse
ALEvent.CANVAS_EVENT.dispatchedTo(view.aladinDiv, {
Expand Down Expand Up @@ -1178,7 +1173,7 @@ export let View = (function () {
// First detect the device
// See https://stackoverflow.com/questions/10744645/detect-touchpad-vs-mouse-in-javascript
// for detecting the use of a touchpad
view.isTouchPadDefined = isTouchPad || typeof isTouchPad !== "undefined";
/*view.isTouchPadDefined = isTouchPad || typeof isTouchPad !== "undefined";
if (!view.isTouchPadDefined) {
if (eventCount === 0) {
view.delta = 0;
Expand All @@ -1195,28 +1190,23 @@ export let View = (function () {
}
view.isTouchPadDefined = true;
}
}
}*/

// only ensure the touch pad test has been done before zooming
if (!view.isTouchPadDefined) {
/*if (!view.isTouchPadDefined) {
return false;
}
}*/

// touch pad defined
view.delta = e.deltaY || e.detail || (-e.wheelDelta);

if (isTouchPad) {
//if (isTouchPad) {
if (!view.throttledTouchPadZoom) {
//let radec;
view.throttledTouchPadZoom = () => {
/*if (!view.zoom.isZooming && !view.wheelTriggered) {
// start zooming detected
radec = view.aladin.pix2world(view.xy.x, view.xy.y);
}*/

const factor = 2.0;
let newFov = view.delta > 0 ? view.fov * factor : view.fov / factor;

// inside case
view.zoom.apply({
stop: newFov,
duration: 100
Expand All @@ -1225,22 +1215,21 @@ export let View = (function () {
}

view.throttledTouchPadZoom();
} else {
/*} else {
if (!view.throttledMouseScrollZoom) {
view.throttledMouseScrollZoom = Utils.throttle(() => {
const factor = 5
view.throttledMouseScrollZoom = () => {
const factor = 2
let newFov = view.delta > 0 ? view.fov * factor : view.fov / factor;
// standard mouse wheel zooming

view.zoom.apply({
stop: newFov,
duration: 300
duration: 100
});
}, 50);
};
}
view.throttledMouseScrollZoom()
}
}*/

return false;
});
Expand Down Expand Up @@ -1588,7 +1577,7 @@ export let View = (function () {
}

this.wasm.setFieldOfView(fov);
this.updateZoomState();
this.updateZoomState(fov);
};

View.prototype.increaseZoom = function () {
Expand All @@ -1613,9 +1602,7 @@ export let View = (function () {
this.gridCfg = {...this.gridCfg, ...options};
this.wasm.setGridOptions(this.gridCfg);

if (!this.gridCfg.enabled) {
this.mustClearCatalog = true;
}
this.mustClearCatalog = true;

ALEvent.COO_GRID_UPDATED.dispatchedTo(this.aladinDiv, this.gridCfg);

Expand All @@ -1626,12 +1613,24 @@ export let View = (function () {
return this.gridCfg;
}

View.prototype.updateZoomState = function () {
View.prototype.updateZoomState = function (fov) {
// Get the new zoom values from the backend
let fov = this.wasm.getFieldOfView();
const newFov = fov || this.wasm.getFieldOfView()

// Disable the coo grid labels if we are too unzoomed
const maxFovGridLabels = 360;
if (this.fov <= maxFovGridLabels && newFov > maxFovGridLabels) {
let gridOptions = this.getGridOptions()
if (gridOptions) {
this.originalShowLabels = gridOptions.showLabels;
this.aladin.setCooGrid({showLabels: false});
}

} else if (this.fov > maxFovGridLabels && newFov <= maxFovGridLabels) {
this.aladin.setCooGrid({showLabels:this.originalShowLabels});
}

// Save it
this.fov = fov;
this.fov = newFov;
this.computeNorder();

let fovX = this.fov;
Expand Down Expand Up @@ -1942,7 +1941,8 @@ export let View = (function () {

// Change the projection here
this.wasm.setProjection(projName);
this.updateZoomState();
let newProjFov = Math.min(this.fov, this.projection.fov);
this.setZoom(newProjFov)

const projFn = this.aladin.callbacksByEventName['projectionChanged'];
(typeof projFn === 'function') && projFn(projName);
Expand Down
Loading

0 comments on commit 9b098fd

Please sign in to comment.