Commit 5eae401e authored by Caillat Michel's avatar Caillat Michel
Browse files

Improves page presentation

parent 14fd0e35
......@@ -8,9 +8,9 @@ h4 {font-size: 1em; margin: 30px 0 15px 0;}
.map {
height: 512px;
width: 512px;
}
}
#loading {
#loading {
display: block;
position: absolute;
top: 0;
......@@ -24,9 +24,9 @@ h4 {font-size: 1em; margin: 30px 0 15px 0;}
background-image: url("../MnyxU.gif");
background-repeat: no-repeat;
background-position: center;
}
}
#info {
#info {
z-index: 1;
opacity: 0;
position: absolute;
......@@ -37,18 +37,18 @@ h4 {font-size: 1em; margin: 30px 0 15px 0;}
color: white;
border: 0;
transition: opacity 100ms ease-in;
}
}
.marker {
.marker {
width: 16px;
height: 16px;
border: 1px solid #088;
border-radius: 8px;
background-color: #0FF;
opacity: 0.5;
}
}
.ol-popup {
.ol-popup {
position: absolute;
background-color: white;
-webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
......@@ -60,9 +60,9 @@ h4 {font-size: 1em; margin: 30px 0 15px 0;}
left: -50px;
min-width: 150px;
font-size: 10px;
}
}
.ol-popup:after, .ol-popup:before {
.ol-popup:after, .ol-popup:before {
top: 100%;
border: solid transparent;
content: " ";
......@@ -70,83 +70,116 @@ h4 {font-size: 1em; margin: 30px 0 15px 0;}
width: 0;
position: absolute;
pointer-events: none;
}
.ol-popup:after {
}
.ol-popup:after {
border-top-color: white;
border-width: 10px;
left: 48px;
margin-left: -10px;
}
.ol-popup:before {
}
.ol-popup:before {
border-top-color: #cccccc;
border-width: 11px;
left: 48px;
margin-left: -11px;
}
.ol-popup-closer {
}
.ol-popup-closer {
text-decoration: none;
position: absolute;
top: 2px;
right: 8px;
}
.ol-popup-closer:after {
}
.ol-popup-closer:after {
content: "x";
}
}
th, td {
padding: 0px;
margin: 0px;
font-size: 16px;
height: 20px;
}
th, td {
padding: 0px;
margin: 0px;
font-size: 16px;
height: 20px;
}
.list-group{
.list-group{
flex-direction: row;
}
}
.map:-moz-full-screen {
.map:-moz-full-screen {
height: 100%;
}
.map:-webkit-full-screen {
}
.map:-webkit-full-screen {
height: 100%;
}
.map:-ms-fullscreen {
}
.map:-ms-fullscreen {
height: 100%;
}
.map:fullscreen {
}
.map:fullscreen {
height: 100%;
}
}
.samp-publish-png {
.samp-publish-png {
top: 65px;
left: .5em;
display:none;
}
}
.ol-touch .samp-publish-png {
.ol-touch .samp-publish-png {
top: 80px
}
}
.chart-container{
.chart-container{
max-width:100%;
}
.chart-container > .row{
padding-top : 0.5em;
}
/*
.chart-container > .row{
padding-top : 0.5em;
}*/
.chart-container > .row > .chart-img{
.chart-container > .row > .chart-img{
max-width : 550px;
padding-left : 5px;
padding-right : 0px;
}
}
.chart-container > .row > .chart-plot{
.chart-container > .row > .chart-plot{
max-width : 100%;
padding-left : 0;
padding-top : 5em;
/*padding-top : 5em;*/
}
.col .chart-control{
padding-left : 825px;
}
.col .chart-title{
padding-left : 750px;
margin-bottom : 2em;
}
.hidden{
.hidden{
display : none;
}
}
.highcharts-graph.zone-0 {
stroke: #f7a35c;
}
.highcharts-area.zone-0 {
fill: #f7a35c;
}
.btn-control:hover{
background-color: #dadcdd;
}
.btn-control{
width : 100px;
}
.external_mouse_position{
height : 1.5em;
}
......@@ -97,7 +97,7 @@
<div class="container chart-container">
<div class="row">
<div class="col">
<div id="external_mouse_position_1"></div>
<div id="external_mouse_position_1" class="external_mouse_position"></div>
</div>
<div class="col">
<div id="publish_spectrum"></div>
......@@ -108,15 +108,21 @@
<div id="slice" class="map" style="background-color:darkblue"></div>
</div>
<div class="col chart-plot">
<button id="zoomout">-</button>
<button id="zoomin">+</button>
<button id="zoomreset">Reset</button>
<div id="spectrum"></div>
</div>
</div>
<div class="row">
<div class="col">
<div id="external_mouse_position_2"></div>
<div class="chart-control">
<button id="zoomin" class="btn btn-default btn-control">Zoom in</button>
<button id="zoomout" class="btn btn-default btn-control">Zoom out</button>
<button id="zoomreset" class="btn btn-default btn-control">Reset</button>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div id="external_mouse_position_2" class="external_mouse_position"></div>
</div>
<div class="col">
<div id="publish_summedpixelsspectrum"></div>
......@@ -130,6 +136,13 @@
<div id="summedpixelsspectrum"></div>
</div>
</div>
<div class="row">
<div class="col">
<div class="chart-title">
<span id="chart_title"></span>
</div>
</div>
</div>
</div>
<div class="container chart-container hidden">
......@@ -208,19 +221,39 @@
<h4 class="modal-title">Send image by SAMP (Aladin)</h4>
</div>
<div class="modal-body">
<p>This link is intended to send the current Artemix image to Aladin tool, or any other tool that runs with the SAMP protocol and accepts our file png format.
</br></br>
For the transfer to work, Check that Aladin is running.</br></br>
How to launch Aladin</br>
<strong>- Aladin with command line:</strong></br>
Open a terminal and run: javaws https://aladin.u-strasbg.fr/java/nph-aladin.pl</br></br>
<strong>- Aladin online:</strong></br>
<p>
This link is intended to send the current Artemix image to Aladin tool,
or any other tool that runs with the SAMP protocol and accepts our file png format.
</p>
<p>
For the transfer to work, Check that Aladin is running.
</p>
<p>
How to launch Aladin :
</p>
<p>
<strong>- Aladin with command line:</strong>
</p>
<p>
Open a terminal and run: javaws https://aladin.u-strasbg.fr/java/nph-aladin.pl
</p>
<p>
<strong>- Aladin online:</strong>
</p>
<ul>
<li>1- Go to the Aladin <a href="https://aladin.u-strasbg.fr/java/nph-aladin.pl?frame=downloading"> website</a></li>
<li>2- Use Aladin online application or download the latest version </li></ul>
If you encounter a problem during the installation, check that you have the correct Java version compatible with Aladin, and allow the installation in your computer. Found <a href="images/enablejava.png">here</a> how to do with Mac </br></br>
In case of problems with Aladin please contact the Aladin team cds-question AT <a href="#"> unistra.fr?Subject=Aladin</a></p>
<li>2- Use Aladin online application or download the latest version </li>
</ul>
<p>
If you encounter a problem during the installation, check that you have the correct Java version compatible with Aladin,
and allow the installation on your computer.
</p>
<p>
Please look <a href="images/enablejava.png">here</a> to know how to do with MacOS.
</p>
<p>
If you encouter any problem with Aladin please contact the Aladin team AT <a href="#"> unistra.fr?Subject=Aladin</a>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
......@@ -229,8 +262,7 @@
</div>
</div>
</body>
<script>
<script>
var ENTER = function () { console.log(arguments.callee.name + ": entering."); };
var EXIT = function () { console.log(arguments.callee.name + ": exiting."); };
......@@ -306,6 +338,14 @@
return Math.round(result);
}
function jyToK(flux){
let kb = 1.380649e-23;
let sec = 4.8481368110954e-06;
let factor = 1/(2*kb*((_crval3/speedOfLight)**2)*((_bmaj*_bmin*sec*sec*Math.PI/4/Math.log(2))/1e-26));
return flux * Factor;
}
//
// A object to mark informations related to a position
// in a popup bow located close to the position passed
......@@ -359,7 +399,10 @@
//
var _updateLastClickInfos = function () {
if (_lastCoordinate == null) return;
_content.innerHTML = 'Chan#' + _lastChanIndex + '<br>' + 'x = ' + _lastCoordinate[0].toFixed(0) + ', y = ' + _lastCoordinate[1].toFixed(0) + '<br>' +
_content.innerHTML = 'Chan#' + _lastChanIndex + '<br>' + 'x = '
+ _lastCoordinate[0].toFixed(0)
+ ', y = '
+ _lastCoordinate[1].toFixed(0) + '<br>' +
'RA=' + _lastRADEC['RA'] + '<br>' +
'DEC=' + _lastRADEC['DEC'] + '<br>' +
'Value=' + Number(_lastFluxDensity).toExponential(4);
......@@ -578,7 +621,10 @@
var pixelAtPosition = ctx.getImageData(olc[0], height - olc[1], 1, 1).data;
if (pixelAtPosition) {
var data_steps_index = pixelAtPosition.slice(0, 3).join('_');
result = 'Chan#' + _sliceIndex + ", " + _raLabelFormatter.format(olc[0]) + ', ' + _decLabelFormatter.format(olc[1]) + ', ' + (_data_steps_1[data_steps_index]).toExponential(2) + " " + _bunit;
result = 'Chan#' + _sliceIndex
+ ", " + _raLabelFormatter.format(olc[0]) + ', '
+ _decLabelFormatter.format(olc[1]) + ', '
+ (_data_steps_1[data_steps_index]).toExponential(2) + " " + _bunit;
}
else {
result = "???";
......@@ -592,7 +638,11 @@
var pixelAtPosition = ctx.getImageData(olc[0], height - olc[1], 1, 1).data;
if (pixelAtPosition) {
var data_steps_index = pixelAtPosition.slice(0, 3).join('_');
result = _raLabelFormatter.format(olc[0]) + ', ' + _decLabelFormatter.format(olc[1]) + ', ' + _data_steps_2[data_steps_index].toExponential(1) + " " + summedPixelsUnit(_bunit);
result = _raLabelFormatter.format(olc[0])
+ ', '
+ _decLabelFormatter.format(olc[1]) + ', '
+ _data_steps_2[data_steps_index].toExponential(1)
+ " " + summedPixelsUnit(_bunit);
}
else {
result = "???";
......@@ -1487,6 +1537,7 @@
},
chart: {
width: 1100,
height : '45%',
animation : false,
zoomType: 'x',
panning: true,
......@@ -1579,9 +1630,22 @@
opposite: true,
title: {
text: ytitle
},
labels :{
formatter: function() {
return this.value /*+ "test"*/;
}
}
},
plotOptions: {
/*scatter:{
zones: [
{
value : 0,
className : "zone-0"
}
]
},*/
series: {
animation: {
duration : 0
......@@ -1652,6 +1716,10 @@
_averageSpectrum = averageSpectrum;
}
this.setChartTitle = function(title){
document.getElementById("chart_title").innerHTML = title;
}
this.computeSummedAverageSpectrum = function (min, max) {
var imin = Math.round((min - summedData.x[0]) / (summedData.x[1] - summedData.x[0]));
var imax = Math.round((max - summedData.x[0]) / (summedData.x[1] - summedData.x[0]));
......@@ -1751,6 +1819,7 @@
chart: {
animation: false,
width: 1100,
height : '45%',
zoomType: 'x',
panning: true,
panKey: 'shift',
......@@ -1775,7 +1844,7 @@
let imax = getCalculatedIndex(event.xAxis[0].max);
let title = getSummedSpectrumTitle(averageSpectrum, imin, imax, cdelt3prim);
this.setTitle({ text: toptitle(title, toptitle_unit, event.xAxis[0].min, event.xAxis[0].max) });
self.setChartTitle(toptitle(title, toptitle_unit, event.xAxis[0].min, event.xAxis[0].max));
return false;
}
}
......@@ -1830,6 +1899,7 @@
$.post("", { "method": "getAverageSpectrum", "relFITSFilePath": _relFITSFilePath, "iRA0": iRA0, "iRA1": iRA1, "iDEC0": iDEC0, "iDEC1": iDEC1 }).done(function (resp) {
console.log("SummedPixelsSpectrumViewer : callback of getAverageSpectrum: entering ");
var self = this;
showLoaderAction(false);
var x = JSON.parse(resp);
......@@ -1975,7 +2045,7 @@
addYAxisSeries(summedPixelsSpectrumChart);
addYAxisSeries(spectrumChart);
let title = getSummedSpectrumTitle(averageSpectrum, 0, averageSpectrum.length - 1, cdelt3prim);
summedPixelsSpectrumChart.setTitle({ text: toptitle(title, toptitle_unit, summedData.x[0], summedData.x[averageSpectrum.length - 1]) });
summedPixelsSpectrumViewer.setChartTitle(toptitle(title, toptitle_unit, summedData.x[0], summedData.x[averageSpectrum.length - 1]));
showLoaderAction(false);
console.log("SummedPixelsSpectrumViewer : callback of getAverageSpectrum: exiting ");
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment