<!DOCTYPE html>
<html>

<head>
<title>Scenario Mizar</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no" />


<!-- Dev -->
<!-- <script type="text/javascript" data-main="js/main" src="../src/js/require.min.js"></script> -->
<!-- <link rel="stylesheet" href="../src/css/style.css" /> -->

<!-- Prod -->
<link rel="stylesheet" href="../src/mizar/css/style.min.css" />
<!--<script type="text/javascript" charset="UTF-8" src="../src/MizarWidget.min.js"></script>-->
<script type="text/javascript" charset="UTF-8" src="../src/mizar/MizarWidget.min.js"></script>
<script type="text/javascript">

	window.onload = function(){
		var options = {
			"debug": true,
			"nameResolver": {
				"zoomFov": 0.2
			},
			"navigation": {
				"initTarget": [0,0]
			},
			"stats": {
				"visible":true
			}
		};
		var mizar = new MizarWidget("#mizarWidget-div", options);

		mizar.sky.subscribe("baseLayersReady", function(){

			// Find something better than this...
			mizar.sky.unsubscribe("baseLayersReady", this[1]);

			mizar.setCompassGui(true);
			mizar.setImageViewerGui(true);

			// Add custom survey
		    var customSurvey = {
				"type": "healpix",
				"name": "IRIS",
				"baseUrl": "http://demonstrator.telespazio.com/Alasky/IRISColor",
				"description": "IRIS color",
				"icon": "../src/mizar/css/images/star_icon.png",
				"visible": false,
				"background": true,
				"coordSystem": "GAL",
		        "attribution": "IRIS background from <img width='24' height='16' src=\"http://demonstrator.telespazio.com/mizar/css/images/cds.svg\" />",
				"numberOfLevels": 1
			};

			mizar.setCustomBackgroundSurvey(customSurvey);
			mizar.setCategoryGui(true);

			// Add custom opensearch layer
			var openSearchDesc = 	{
				"type": "DynamicOpenSearch",
				"category": "Image",
				"name": "HST",
				"serviceUrl": "http://demonstrator.telespazio.com/sitools/hst",
				"dataType": "line",
		        "description":"Hubble Space Telescope (HST) is an orbiting astronomical observatory operating from the near-infrared into the ultraviolet. Launched in 1990 and scheduled to operate through 2010, HST carries and has carried a wide variety of instruments producing imaging, spectrographic, astrometric, and photometric data through both pointed and parallel observing programs. MAST is the primary archive and distribution center for HST data, distributing science, calibration, and engineering data to HST users and the astronomical community at large. Over 100 000 observations of more than 20 000 targets are available for retrieval from the Archive.",
				"visible": false,
				"minOrder": 4,
		        "attribution":"HST data provided by <a href=\"http://hst.esac.esa.int\" target=\"_blank\"><img src=\"http://demonstrator.telespazio.com/sitools/upload/esa.svg\" width='28' height='16'/></a>"
			};
			var myOpenSearchLayer = mizar.addLayer(openSearchDesc);

			// Add custom GeoJSON layer
			var geoJsonDesc = {
				"category": "Other",
				"type": "GeoJSON",
				"name": "Herschel",
				"description": "Herschel response used for testing",
				"data": {
					"type": "JSON",
					"url": "http://demonstrator.telespazio.com/mizar/data/responseHerschel.json",
				},
				"visible": true,
				"pickable" : true
			};
			var geoJsonLayer = mizar.addLayer(geoJsonDesc);

			// Go to point of interest
			mizar.goTo("m31", function(){

				// Start search on open search layer
				var startSearch = function()
				{

					myOpenSearchLayer.subscribe("features:added", function(featureData){
						var features = featureData.features;
						// OpenSearch layer loading ended
						// Show received features
						for ( var i=0; i<featureData.features.length; i++ )
						{
							mizar.highlightObservation({feature:featureData.features[i], layer: myOpenSearchLayer});
						}
					});
					// Make open search layer visible
					myOpenSearchLayer.visible(true);
				}

				// Adjust FOV
				var fov = mizar.getCurrentFov();
				if (fov[1] <= 2) {
					// Since name resolver zoomFov is 0.2, we'll always pass here
					mizar.setZoom(1, startSearch);
				}
				else
				{
					startSearch();
				}
			});
		});
	}

</script>

</head>

<body style="background-color: white;">

<div style="display: inline-block;" id="mizarWidget-div">
</div>

</body>

</html>

