Skip to content

Commit

Permalink
enhance doc, ui (tooltip new delay time param)
Browse files Browse the repository at this point in the history
  • Loading branch information
@bmatthieu3
bmatthieu3 committed Mar 15, 2024
1 parent a421453 commit 2c50214
Show file tree
Hide file tree
Showing 19 changed files with 245 additions and 141 deletions.
2 changes: 2 additions & 0 deletions assets/icons/jupyter.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions assets/icons/link.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
76 changes: 47 additions & 29 deletions src/css/aladin.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -451,7 +451,7 @@ canvas {
text-shadow: 0px 0px 2px #000;
}

.aladin-input-text.aladin-dark-theme.search:focus {
.aladin-input-text.aladin-dark-theme.search:focus, .aladin-input-text.aladin-dark-theme.search:hover {
background-image: url(../../assets/icons/search-white.svg);
background-size: 1.8rem;
background-repeat: no-repeat;
Expand All @@ -469,10 +469,6 @@ canvas {
box-shadow:inset 0px 0px 0px 1px #f00;

border: 1px solid red;
}

.aladin-dark-theme {
color: white;
}

.aladin-cancelBtn {
Expand Down Expand Up @@ -725,8 +721,6 @@ canvas {
.aladin-context-sub-menu,
.aladin-context-menu {
position: absolute;
background: #fff;
color: #000;

font-family: monospace;
width: max-content;
Expand All @@ -753,10 +747,9 @@ canvas {
padding: 0.2rem 0.4rem;
position: relative;

color: lightgray;
background-color: black;

box-shadow:inset 1px 1px 0px 0px #fff;

background-color: rgba(0, 0, 0, 0.7);
}

.aladin-context-menu .aladin-context-menu-item:first-of-type {
Expand Down Expand Up @@ -969,6 +962,10 @@ canvas {
border-radius: 0.5rem;
}

.aladin-dark-theme {
color: white;
}

/* *********************************************** */

/* Tooltip */
Expand All @@ -984,11 +981,13 @@ canvas {

.aladin-tooltip-container .aladin-tooltip {
pointer-events: none;
cursor: default;
visibility: hidden;
background-color: black;
background-color: white;
color: black;

width: max-content;
color: #fff;

text-align: center;
padding: 4px;
border-radius: 2px;
Expand All @@ -1003,6 +1002,13 @@ canvas {

/*font-family: Verdana, Geneva, Tahoma, sans-serif;*/
font-size: 0.9rem;

transition-delay: 300ms;
}

.aladin-tooltip-container .aladin-tooltip.aladin-dark-theme {
background-color: #333;
color: white;
}

/* Show the tooltip text when you mouse over the tooltip container */
Expand Down Expand Up @@ -1062,35 +1068,42 @@ canvas {
cursor: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4gEIEwUMBS20MQAAApRJREFUWEfdV7GO2zAMfXY7x1luzOFwDeB/KHCAB87eumvqmI/JWhTwF3TIrMFAv8JbgWyHG3IpOjbpcKJC02KipECHclIU+j2KfKRlAABRUyFYak3UgKiZiXUJAIt1d1ysu2PYn53DsPCucpbkRE3JAdxKTtQgWo6zJAfGGbAwLuEV7OB9/yrXIbqZ9/0+rMuhdb+RYfWmm+fged8fihzyoXXxlNcYB2KRxwwA6SzI9Crgd973B/5/u3IF8FYSw98M5D2QR86kRE3pfX+AMqKm8iEQoqYaWrfj/4bW7QgokMhCeSs5KeVrDM4K29C6Y6oE0YGEUlndocVGyg/rGZDXBQpr0kmjLiAlOOvk3vf7RJZM5Q+te2W/7coVEq+wnC1yCZYyS3B8MMYF3vBKK9Jz5PWmm8sab1eu4N9D63aaHEAsH88SzmQpnSHsHDmnWvlXIoiJ4JTviY8FRUJ8ZAiOEiJbLpcjARM1M0twpmjZOeGQrXYm1/7yMLz/eH8fnyus6XXOtmLgWBrKtdMguNKYPPystIausn9egsVDfI674KxS6003F/sX357AdOBwcADwWD9EjBKJubxYd0cml4RhP5IPrduFk04GjiZXMyZiRHKdAU3OWeB2lLNAk+tpl9IHY0zSlBo4OgsaTJpFzs+F0pxKYEXK73Nd8+3KFfWmG71qGfgSeQqPN0fvdlZrSvmUoXaJJ7EiocArZaS6tgzA+5RQe3gumUl5gPLXzy+6pEQNzDuhvFKx1ZuuEuTxliwmY/KuoHxGhzGv5QDw9PTx7senz88aLHUpJeOu8OHb17u+//4CTMm97/eFVQK5vqR8y6xOyipByjn3+0C3moUH4O++D1UX3PR9eJWzJCf6Tz5O/wDUeIfTLPlbywAAAABJRU5ErkJggg==') 15 15, auto;
}

/* Aladin Lite pre-defined UI features */
/**
* Aladin Lite pre-defined UI features.
*
* User may need to overwrite those classes if they want
* change their position. They can also add media query on them.
*
*/

.aladin-stack-control {
position: absolute;
top: 3rem;
left: 0;
left: 0.4rem;
}

.aladin-settings-control {
position: absolute;
top: 5.4rem;
left: 0;
left: 0.4rem;
}

.aladin-simbadPointer-control {
position: absolute;
top: 7.8rem;
left: 0;
left: 0.4rem;
}

.aladin-grid-control {
position: absolute;
top: 10.2rem;
left: 0;
left: 0.4rem;
}

.aladin-cooFrame {
position: absolute;
top: 0;
left: 0;
top: 0.4rem;
left: 0.4rem;

font-family: monospace;

Expand All @@ -1103,8 +1116,8 @@ canvas {

.aladin-location {
position: absolute;
top: 0;
left: 7rem;
top: 0.4rem;
left: 7.15rem;
font-family: monospace;

color: white;
Expand All @@ -1116,7 +1129,7 @@ canvas {

.aladin-fov {
position: absolute;
top: 0;
top: 0.4rem;
left: 25rem;

font-family: monospace;
Expand All @@ -1143,21 +1156,28 @@ canvas {
background-color: black;
}

.aladin-table {
position: absolute;
bottom: 2.8rem;
margin: 0rem 0.4rem;
max-width: 100%;
}

.aladin-share-control {
position: absolute;
bottom: 0;
left: 0;
bottom: 0.4rem;
left: 0.4rem;
}

.aladin-fullScreen-control {
position: absolute;
top: 0;
right: 0;
top: 0.4rem;
right: 0.4rem;
}

.aladin-projection-control {
position: absolute;
top: 0;
top: 0.4rem;
right: 3rem;
}

Expand All @@ -1173,8 +1193,6 @@ canvas {
background: #fff;
}



/* Media query */
/*@media screen and (max-width: 31rem) {
.aladin-projection-control {
Expand Down
80 changes: 56 additions & 24 deletions src/js/DefaultActionsForContextMenu.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,9 @@
import { GenericPointer } from "./GenericPointer.js";
import A from "./A.js";
import { CatalogQueryBox } from "./gui/Box/CatalogQueryBox.js";
import cameraIconUrl from '../../assets/icons/camera.svg'
import targetIconUrl from '../../assets/icons/target.svg';
import uploadIconUrl from '../../assets/icons/upload.svg';

export let DefaultActionsForContextMenu = (function () {

Expand All @@ -45,31 +48,38 @@ export let DefaultActionsForContextMenu = (function () {
return [
{
label: "Copy position", action(o) {
var r = document.createRange();
r.selectNode(o.target);
window.getSelection().removeAllRanges();
window.getSelection().addRange(r);
let statusBarMsg;
try {
let successful = document.execCommand('copy');
statusBarMsg = successful ? 'Position copied!' : 'Position could not be copied!';
} catch (err) {
statusBarMsg = 'Oops, unable to copy to clipboard';
}

if (a.statusBar) {
a.statusBar.appendMessage({
message: statusBarMsg,
duration: 2000,
type: 'info'
let msg;
navigator.clipboard.writeText(o.target.innerText)
.then(() => {
msg = 'successful'
if (aladinInstance.statusBar) {
aladinInstance.statusBar.appendMessage({
message: 'Reticle location saved!',
duration: 2000,
type: 'info'
})
}
})
.catch((e) => {
msg = 'unsuccessful'
console.info('Oops, unable to copy', e);
})
.finally(() => {
console.info('Copying text command was ' + msg);
})
}

window.getSelection().removeAllRanges();
}
},
{
label: "Take snapshot", action(o) { a.exportAsPNG(); }
label: {
icon: {
tooltip: {content: 'Download a PNG image file of the view', position: {direction: 'top'}},
monochrome: true,
url: cameraIconUrl,
size: 'small',
},
content: 'Take a snapshot'
},
action(o) { a.exportAsPNG(); }
},
{
label: "Add",
Expand Down Expand Up @@ -99,7 +109,16 @@ export let DefaultActionsForContextMenu = (function () {
]
},
{
label: "Load local file",
label: {
icon: {
monochrome: true,
url: uploadIconUrl,
cssStyle: {
cursor: 'help',
}
},
content: "Load a local file"
},
subMenu: [
{
label: 'FITS image', action(o) {
Expand Down Expand Up @@ -167,8 +186,21 @@ export let DefaultActionsForContextMenu = (function () {
]
},
{
label: "What is this?", action(o) {
GenericPointer(a.view, o);
label: {
icon: {
tooltip: {content: 'Use Sesame, our name resolver!', position: {direction: 'top'}},
monochrome: true,
url: targetIconUrl,
size: 'small',
},
content: 'What is this?'
},

action(o, ctxMenu) {
GenericPointer(a.view, {
x: parseInt(ctxMenu.element().style.left),
y: parseInt(ctxMenu.element().style.top)
});
}
},
{
Expand Down
7 changes: 6 additions & 1 deletion src/js/GenericPointer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,12 @@ import { Utils } from './Utils';

// allow to call either Simbad or Planetary features Pointers
export let GenericPointer = function (view, e) {
const xymouse = Utils.relMouseCoords(e);
let xymouse;
if (e.x && e.y) {
xymouse = e;
} else {
xymouse = Utils.relMouseCoords(e);
}

let radec = view.aladin.pix2world(xymouse.x, xymouse.y, 'icrs');
if (radec) {
Expand Down
5 changes: 0 additions & 5 deletions src/js/MeasurementTable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,11 +81,6 @@ export let MeasurementTable = (function() {
this.table = new Tabs({
aladin: this.aladin,
layout,
cssStyle: {
position: 'absolute',
bottom: '2.4rem',
maxWidth: '100%',
}
}, this.aladin.aladinDiv);
};

Expand Down
14 changes: 7 additions & 7 deletions src/js/ProjectionEnum.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,25 +29,25 @@
*****************************************************************************/
export let ProjectionEnum = {
// Zenithal
TAN: {id: 1, fov: 150, label: "gnomonic"}, /* Gnomonic projection */
STG: {id: 2, fov: 360, label: "stereographic"}, /* Stereographic projection */
SIN: {id: 3, fov: 180, label: "orthographic"}, /* Orthographic */
ZEA: {id: 4, fov: 360, label: "zenital equal-area"}, /* Equal-area */
TAN: {id: 1, fov: 150, label: "Tangential"}, /* Gnomonic projection */
STG: {id: 2, fov: 360, label: "Stereographic"}, /* Stereographic projection */
SIN: {id: 3, fov: 180, label: "Spheric"}, /* Orthographic */
ZEA: {id: 4, fov: 360, label: "Zenital equal-area"}, /* Equal-area */
//FEYE: {id: 5, fov: 190, label: "fish eye"},
//AIR: {id: 6, fov: 360, label: "airy"},
//AZP: {fov: 180},
//ARC: {id: 7, fov: 360, label: "zenital equidistant"},
//NCP: {id: 8, fov: 180, label: "north celestial pole"},
// Cylindrical
MER: {id: 9, fov: 360, label: "mercator"},
MER: {id: 9, fov: 360, label: "Mercator"},
//CAR: {id: 10, fov: 360, label: "plate carrée"},
//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-aitoff"},
AIT: {id: 13, fov: 360, 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: 360, label: "Mollweide"},
// Conic
//COD: {id: 17, fov: 360, label: "conic equidistant"},
// Hybrid
Expand Down
6 changes: 3 additions & 3 deletions src/js/gui/Box/StatusBarBox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -122,12 +122,12 @@ export class StatusBarBox extends Box {
position: {
direction: "top",
},
hoverable: true,
delayShowUpTime: '500ms',
cssStyle: {
border: "1px solid white",
fontSize: 'xx-small',
fontSize: 'x-small',
maxWidth: "200px",
"overflow-wrap": "break-word",
"pointer-events": "auto",
}
},
});
Expand Down
Loading

0 comments on commit 2c50214

Please sign in to comment.