const MONTHS = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"];
const MONTHS_SHORT = ["Jan", "Feb", "Mar", "Apr", "Mei", "Jun", "Jul", "Agu", "Sep", "Okt", "Nov", "Des"];

var map;
var mapview;

var cur_active_layer;

var layer_pdie;
var layer_pcht_das;
var layer_hth_das_info;
var layer_hth_das_view;
var layer_spi_ps3m;
var layer_spi_as1m;
var layer_spi_as3m;
var layer_pch_prob_1m;
var layer_pch_prob_2m;
var layer_pch_prob_3m;
var layer_pch_prob_das;
var layer_pem;
var layer_pea;
var layer_titikstationmatahari;
var layer_analisiscurahhujan;
var layer_analisissifathujan;

var source_pdie;
var source_pcht_das;
var source_hth_das_info;
var source_hth_das_view;
var source_spi_ps3m;
var source_spi_as1m;
var source_spi_as3m;
var source_pch_prob_1m;
var source_pch_prob_2m;
var source_pch_prob_3m;
var source_pch_prob_das;
var source_pem;
var source_pea;
var source_titikstationmatahari;
var source_analisiscurahhujan;
var source_analisissifathujan;

var maptitle_pdie;
var maptitle_pcht_das;
var maptitle_hth;
var maptitle_spi_ps3m;
var maptitle_spi_as1m;
var maptitle_spi_as3m;
var maptitle_pch_prob_1m;
var maptitle_pch_prob_2m;
var maptitle_pch_prob_3m;
var maptitle_pch_prob_das;
var maptitle_pem;
var maptitle_pea;
var maptitle_titikstationmatahari;
var maptitle_analisiscurahhujan;
var maptitle_analisissifathujan;

var legend_pdie = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pdie,0", "Tidak ada peringatan"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pdie,1", "Waspada"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pdie,2", "Siaga"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pdie,3", "Awas"]
];

var legend_pcht_das = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pcht_das,0", "Tidak ada peringatan"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pcht_das,1", "Waspada"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pcht_das,2", "Siaga"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pcht_das,3", "Awas"]
];

var legend_hth_das_view = [
	["1 - 5", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das1,0", "Sangat Pendek (Very Short)"],
	["6 - 10", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das2,0", "Pendek (Short)"],
	["11 - 20", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das3,0", "Menengah (Moderate)"],
	["21 - 30", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das4,0", "Panjang (Long)"],
	["31 - 60", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das5,0", "Sangat Panjang (Very Long)"],
	["> 60", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das6,0", "Extrem Panjang (Extremely Long)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=hth_das0,0", "Masih ada hujan s/d updating (No Drought)"]
];

var legend_spi = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,0", "Sangat Kering (Extremely Dry)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,1", "Kering (Severly Dry)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,2", "Agak Kering (Moderately Dry)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,3", "Normal (Near Normal)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,4", "Agak Basah (Moderately Wet)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,5", "Basah (Very Wet)"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=spi_as1m,6", "Sangat Basah (Extremely Wet)"]
];

var legend_pch_prob = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,0", "< 10%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,1", "10% - 20%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,2", "20% - 30%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,3", "30% - 40%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,4", "40% - 50%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,5", "50% - 60%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,6", "60% - 70%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,7", "70% - 80%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,8", "80% - 90%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob,9", "> 90%"]
];

var legend_pch_prob_das = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,0", "< 10%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,1", "10% - 20%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,2", "20% - 30%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,3", "30% - 40%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,4", "40% - 50%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,5", "50% - 60%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,6", "60% - 70%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,7", "70% - 80%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,8", "80% - 90%"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pch_prob_das,9", "> 90%"]
];

var legend_pem = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,0", "0 - 1 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,1", "1 - 2 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,2", "2 - 3 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,3", "3 - 4 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,4", "4 - 5 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,5", "5 - 6 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,6", "6 - 7 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,7", "7 - 8 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,8", "8 - 9 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,9", "9 - 10 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,10", "10 - 11 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,11", "11 - 12 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,12", "12 - 13 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pem,13", "13 - 14 kwh/m<sup>2</sup>"]
];

var legend_pea = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,0", "0 - 1 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,1", "1 - 2 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,2", "2 - 3 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,3", "3 - 4 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,4", "4 - 5 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,5", "5 - 6 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,6", "6 - 7 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,7", "7 - 8 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,8", "8 - 9 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,9", "9 - 10 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,10", "10 - 11 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,11", "11 - 12 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,12", "12 - 13 kwh/m<sup>2</sup>"],
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=pea,13", "13 - 14 kwh/m<sup>2</sup>"]
];

var legend_titikstationmatahari = [
	["", "https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg&mode=legendicon&icon=titikstationmatahari,0", "Titik Stasiun Pemantau Energi Matahari"],
];

var legend_analisiscurahhujan = [];

var legend_analisissifathujan = [];

var infodetails;

$(function(){
	
	infodetails = new ol.Overlay({
		element: document.getElementById('infodetails'),
		autoPan: true,
		autoPanAnimation: {
			duration: 250,
		},
	});
	
	mapview = new ol.View({
		center: ol.proj.fromLonLat([118.1661992, -2.2070457]),
		zoom: 5,
		constrainResolution: true
	});
	
	//init ol
	map = new ol.Map({
		target: 'mapcontainer',
		layers: [
			new ol.layer.Tile({
				source: new ol.source.OSM()
			})
		],
		view: mapview,
		overlays: [infodetails],
		interactions: ol.interaction.defaults({mouseWheelZoom:false})
	});
	
	source_pdie = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pdie = new ol.layer.Image({source:source_pdie, visible:false});
	map.addLayer(layer_pdie);
	
	source_pcht_das = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pcht_das = new ol.layer.Image({source:source_pcht_das, visible:false});
	map.addLayer(layer_pcht_das);
	
	source_hth_das_info = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_hth_das_info = new ol.layer.Image({source:source_hth_das_info, visible:false});
	map.addLayer(layer_hth_das_info);
	
	source_hth_das_view = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_hth_das_view = new ol.layer.Image({source:source_hth_das_view, visible:false});
	map.addLayer(layer_hth_das_view);
	
	source_spi_ps3m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_spi_ps3m = new ol.layer.Image({source:source_spi_ps3m, visible:false});
	map.addLayer(layer_spi_ps3m);
	
	source_spi_as1m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_spi_as1m = new ol.layer.Image({source:source_spi_as1m, visible:false});
	map.addLayer(layer_spi_as1m);
	
	source_spi_as3m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_spi_as3m = new ol.layer.Image({source:source_spi_as3m, visible:false});
	map.addLayer(layer_spi_as3m);
	
	source_pch_prob_1m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pch_prob_1m = new ol.layer.Image({source:source_pch_prob_1m, visible:false});
	map.addLayer(layer_pch_prob_1m);
	
	source_pch_prob_2m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pch_prob_2m = new ol.layer.Image({source:source_pch_prob_2m, visible:false});
	map.addLayer(layer_pch_prob_2m);
	
	source_pch_prob_3m = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pch_prob_3m = new ol.layer.Image({source:source_pch_prob_3m, visible:false});
	map.addLayer(layer_pch_prob_3m);
	
	source_pch_prob_das = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pch_prob_das = new ol.layer.Image({source:source_pch_prob_das, visible:false});
	map.addLayer(layer_pch_prob_das);
	
	source_pem = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pem = new ol.layer.Image({source:source_pem, visible:false});
	map.addLayer(layer_pem);
	
	source_pea = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_pea = new ol.layer.Image({source:source_pea, visible:false});
	map.addLayer(layer_pea);
	
	source_titikstationmatahari = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_titikstationmatahari = new ol.layer.Image({source:source_titikstationmatahari, visible:false});
	map.addLayer(layer_titikstationmatahari);

	source_analisiscurahhujan = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_analisiscurahhujan = new ol.layer.Image({source:source_analisiscurahhujan, visible:false});
	map.addLayer(layer_analisiscurahhujan);

	source_analisissifathujan = new ol.source.ImageWMS({url: 'https://cews.bmkg.go.id/cgi-bin/mapserv?map=bmkg'});
	layer_analisissifathujan = new ol.layer.Image({source:source_analisissifathujan, visible:false});
	map.addLayer(layer_analisissifathujan);

	//init layer switcher
	
	$(".layerswitcher .toggle").click(function(){
		if($(this).parent().attr("state")=="opened"){
			$(this).siblings(".content").hide();
			$(this).children("button").children("i").removeClass("fa-times");
			$(this).children("button").children("i").addClass("fa-layer-group");
			$(this).parent().attr("state","closed");
		}else{
			$(this).siblings(".content").show();
			$(this).children("button").children("i").removeClass("fa-layer-group");
			$(this).children("button").children("i").addClass("fa-times");
			$(this).parent().attr("state","opened");
		}
	});
	
	$(".layerswitcher .content input[name^='optlayer']").change(function(){
		var date1 = $(this).siblings("select").children("option:selected").attr("date1") || $(this).attr("date1") || "";
		var date2 = $(this).siblings("select").children("option:selected").attr("date2") || $(this).attr("date2") || "";
		var num1 = $(this).siblings("select").children("option:selected").attr("num1") || $(this).attr("num1") || "";
		var num2 = $(this).siblings("select").children("option:selected").attr("num2") || $(this).attr("num2") || "";
		
		switchLayer({
			layername:$(this).val(),
			date1:date1,
			date2:date2,
			num1:num1,
			num2:num2
		});
	});
	
	$(".layerswitcher .content select").change(function(){
		if($(this).siblings("input").is(":checked")){//hanya jika layer aktif
			var date1 = $(this).children("option:selected").attr("date1");
			var date2 = $(this).children("option:selected").attr("date2");
			var num1 = $(this).children("option:selected").attr("num1");
			var num2 = $(this).children("option:selected").attr("num2");
			
			switchLayer({
				layername:$(this).siblings("input").val(),
				date1:date1,
				date2:date2,
				num1:num1,
				num2:num2
			});
		}
	});
	
	//init default layer
	
		
	$(".layerswitcher .content input[value='pdie']").prop('checked', true);
	switchLayer({
		layername:"pdie",
		date1:"2024-09-01",
		num1:"1"
	});
	
		
	/*
	$(".layerswitcher .content input[value='hth']").prop('checked', true);
	switchLayer({
		layername:"hth",
		date1:"",
		num1:""
	});
	*/
	
	//init info details
	
	map.on('singleclick', function (e) {
		var viewResolution = mapview.getResolution();
		
		var alllayers = [
			{
				layercode: "pdie",
				url: source_pdie.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Peringatan Dini Kekeringan Meteorologis (PDKM)"
			},
			{
				layercode: "pcht_das",
				url: source_pcht_das.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Peringatan Dini Curah Hujan Tinggi (PDCHT)"
			},	
			{
				layercode: "hth",
				url: source_hth_das_info.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Hari Tanpa Hujan"
			},	
			{
				layercode: "spi_ps3m",
				url: source_spi_ps3m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "SPI (Prakiraan 3 Bulan)"
			},	
			{
				layercode: "spi_as1m",
				url: source_spi_as1m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "SPI (Analisa 1 Bulan)"
			},	
			{
				layercode: "spi_as3m",
				url: source_spi_as3m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "SPI (Analisa 3 Bulan)"
			},	
			{
				layercode: "pch_prob_1m",
				url: source_pch_prob_1m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Prakiraan Curah Hujan Bulanan (1 Bulan)"
			},	
			{
				layercode: "pch_prob_2m",
				url: source_pch_prob_2m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Prakiraan Curah Hujan Bulanan (2 Bulan)"
			},	
			{
				layercode: "pch_prob_3m",
				url: source_pch_prob_3m.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Prakiraan Curah Hujan Bulanan (3 Bulan)"
			},
			{
				layercode: "pch_prob_das",
				url: source_pch_prob_das.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Prakiraan Curah Hujan Dasarian"
			},	
			/*{
				layercode: "pem",
				url: source_pem.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "XXXXXX"
			},	
			{
				layercode: "pea",
				url: source_pea.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "XXXXXX"
			},
			{
				layercode: "titikstationmatahari",
				url: source_titikstationmatahari.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "XXXXXX"
			}*/
			{
				layercode: "analisiscurahhujan",
				url: source_analisiscurahhujan.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Analisis Curah Hujan Bulanan"
			},
			{
				layercode: "analisissifathujan",
				url: source_analisissifathujan.getFeatureInfoUrl(e.coordinate, viewResolution, 'EPSG:3857', {'INFO_FORMAT': 'text/html'}),
				layertitle: "Analisis Sifat Hujan Bulanan"
			}
		];

		$("#infodetails-content").html("");

		var hasinfo = false;
		var processedlayer = 0;

		var totallayertoprocess = $("input[name^='optlayer']:checked").length;

		for(var i=0;i < alllayers.length;i++){

			if($("input[value='"+alllayers[i].layercode+"']").is(":checked")){

				var url = alllayers[i].url;

				fetch(url).then(async function (response) {
					if (!response.ok) {
						throw Error(response.statusText);
					}
					
					return {
						html: await response.text(),
						title: this.title
					};
				}.bind({
					title: alllayers[i].layertitle
				})).then(function (obj) {

					processedlayer++;

					var htmltrim = obj.html.trim();
					if(htmltrim){
						if(htmltrim.substring(0, 5) == "<tabl"){
							$("#infodetails-content").append("<div><div style='background-color: rgba(85, 164, 246, 1);color: white;padding: 5px;text-align: center;'><b>"+obj.title+"</b></div>"+obj.html+"</div>");
							hasinfo = true;
						}
					}

					if(processedlayer == totallayertoprocess){
						if(hasinfo){
							infodetails.setPosition(e.coordinate);
						}else{
							infodetails.setPosition(undefined);
						}
					}

				}).catch(function(e){
					processedlayer++;

					if(processedlayer == totallayertoprocess){
						if(hasinfo){
							infodetails.setPosition(e.coordinate);
						}else{
							infodetails.setPosition(undefined);
						}
					}
				});

			}
		}
		
	});


	//print out

	$("#mapprint").click(function(){
		$("#mdlprintout").modal("show");
	});

	// opacity control

	$(".slctransparant").val(1);

	$(".slctransparant").change(function(){
		switch($(this).attr("layercode")){
			case "pdie":
				layer_pdie.setOpacity(Number($(this).val()));
				break;
			case "pcht_das":
				layer_pcht_das.setOpacity(Number($(this).val()));
				break;
			case "hth":
				layer_hth_das_info.setOpacity(Number($(this).val()));
				layer_hth_das_view.setOpacity(Number($(this).val()));
				break;
			case "spi_ps3m":
				layer_spi_ps3m.setOpacity(Number($(this).val()));
				break;
			case "spi_as1m":
				layer_spi_as1m.setOpacity(Number($(this).val()));
				break;
			case "spi_as3m":
				layer_spi_as3m.setOpacity(Number($(this).val()));
				break;
			case "pch_prob_1m":
				layer_pch_prob_1m.setOpacity(Number($(this).val()));
				break;
			case "pch_prob_2m":
				layer_pch_prob_2m.setOpacity(Number($(this).val()));
				break;
			case "pch_prob_3m":
				layer_pch_prob_3m.setOpacity(Number($(this).val()));
				break;
			case "pch_prob_das":
				layer_pch_prob_das.setOpacity(Number($(this).val()));
				break;
			case "analisiscurahhujan":
				layer_analisiscurahhujan.setOpacity(Number($(this).val()));
				break;
			case "analisissifathujan":
				layer_analisissifathujan.setOpacity(Number($(this).val()));
				break;
		}
	});

	//ambil area awas untuk pdie

	
	$.post("areacoverage.php?req=getareacoverage", {
		layername:"pdie",
		legendindex:3,
		date1:"2024-09-01",
		date2: null,
		num1:"1"
	},function(data){
		if(jQuery.isEmptyObject(data)){
			$("#areaawas-pdie").html("<div class='p-2'>Wilayah tidak ditemukan</div>");
		}else{
			var html="";
			for(var i=0;i<data.length;i++){
				html+="<div class='item'>";
				html+="<div class='title'>"+data[i].prov+"</div>";
				html+="<div class='content'>";
				
				for(var j=0;j<data[i].kabkot.length;j++){
				
					html+="<div>"+data[i].kabkot[j]+"</div>";
				
				}
				
				html+="</div>";
				html+="</div>";
			}
			
			$("#areaawas-pdie").html(html);
		}
	});

	//ambil area awas untuk pcht_das

	
	$.post("areacoverage.php?req=getareacoverage", {
		layername:"pcht_das",
		legendindex:3,
		date1:"2024-09-01",
		date2: null,
		num1:"1"
	},function(data){
		if(jQuery.isEmptyObject(data)){
			$("#areaawas-pcht_das").html("<div class='p-2'>Wilayah tidak ditemukan</div>");
		}else{
			var html="";
			for(var i=0;i<data.length;i++){
				html+="<div class='item'>";
				html+="<div class='title'>"+data[i].prov+"</div>";
				html+="<div class='content'>";
				
				for(var j=0;j<data[i].kabkot.length;j++){
				
					html+="<div>"+data[i].kabkot[j]+"</div>";
				
				}
				
				html+="</div>";
				html+="</div>";
			}
			
			$("#areaawas-pcht_das").html(html);
		}
	});

});



function switchLayer(obj){
	
	var layername = obj.layername || "";
	var date1 = obj.date1 || "";
	var date2 = obj.date2 || "";
	var num1 = obj.num1 || "";
	var num2 = obj.num2 || "";
	
	cur_active_layer = layername;
	
	var odate1 = date1.substring(8,10);
	
	var omonth1_m2 = MONTHS[(parseInt(date1.substring(5,7))-3) < 0?(parseInt(date1.substring(5,7))-3+12):(parseInt(date1.substring(5,7))-3)];
	var omonth1_m1 = MONTHS[(parseInt(date1.substring(5,7))-2) < 0?(parseInt(date1.substring(5,7))-2+12):(parseInt(date1.substring(5,7))-2)];
	var omonth1 = MONTHS[parseInt(date1.substring(5,7))-1];
	var omonth1_p1 = MONTHS[(parseInt(date1.substring(5,7))) > 11?(parseInt(date1.substring(5,7))-12):(parseInt(date1.substring(5,7)))];
	var omonth1_p2 = MONTHS[(parseInt(date1.substring(5,7))+1) > 11?(parseInt(date1.substring(5,7))+1-12):(parseInt(date1.substring(5,7))+1)];

	var omonth1_short = MONTHS_SHORT[parseInt(date1.substring(5,7))-1];

	var oyear1 = date1.substring(0,4);
	
	var odate2 = date2.substring(8,10);
	
	var omonth2_m2 = MONTHS[(parseInt(date2.substring(5,7))-3) < 0?(parseInt(date2.substring(5,7))-3+12):(parseInt(date2.substring(5,7))-3)];
	var omonth2_m1 = MONTHS[(parseInt(date2.substring(5,7))-2) < 0?(parseInt(date2.substring(5,7))-2+12):(parseInt(date2.substring(5,7))-2)];
	var omonth2 = MONTHS[parseInt(date2.substring(5,7))-1];
	var omonth2_p1 = MONTHS[(parseInt(date2.substring(5,7))) > 11?(parseInt(date2.substring(5,7))-12):(parseInt(date2.substring(5,7)))];
	var omonth2_p2 = MONTHS[(parseInt(date2.substring(5,7))+1) > 11?(parseInt(date2.substring(5,7))+1-12):(parseInt(date2.substring(5,7))+1)];

	var oyear2 = date2.substring(0,4);
	
	layer_pdie.setVisible($("input[value='pdie']").is(":checked"));
	layer_pcht_das.setVisible($("input[value='pcht_das']").is(":checked"));
	layer_hth_das_info.setVisible($("input[value='hth']").is(":checked"));
	layer_hth_das_view.setVisible($("input[value='hth']").is(":checked"));
	layer_spi_ps3m.setVisible($("input[value='spi_ps3m']").is(":checked"));
	layer_spi_as1m.setVisible($("input[value='spi_as1m']").is(":checked"));
	layer_spi_as3m.setVisible($("input[value='spi_as3m']").is(":checked"));
	layer_pch_prob_1m.setVisible($("input[value='pch_prob_1m']").is(":checked"));
	layer_pch_prob_2m.setVisible($("input[value='pch_prob_2m']").is(":checked"));
	layer_pch_prob_3m.setVisible($("input[value='pch_prob_3m']").is(":checked"));
	layer_pch_prob_das.setVisible($("input[value='pch_prob_das']").is(":checked"));
	layer_pem.setVisible($("input[value='pem']").is(":checked"));
	layer_titikstationmatahari.setVisible($("input[value='titikstationmatahari']").is(":checked"));
	layer_pea.setVisible($("input[value='pea']").is(":checked"));
	layer_analisiscurahhujan.setVisible($("input[value='analisiscurahhujan']").is(":checked"));
	layer_analisissifathujan.setVisible($("input[value='analisissifathujan']").is(":checked"));
	
	setLegend(layername, date1, date2, num1);

	var maptitle = [];

	if($("input[value='pdie']").is(":checked")){
		

		if(layername == "pdie"){
			maptitle_pdie = "PERINGATAN DINI KEKERINGAN METEOROLOGIS<BR />BERLAKU DASARIAN "+romawi(num1)+" "+omonth1.toUpperCase()+" "+oyear1;

			layer_pdie.getSource().updateParams({
				'LAYERS': 'pdie,prov,kabkot', 
				'date': date1,
				'num': num1
			});
		}
		
		maptitle.push(maptitle_pdie);
		
		$("#maplegend_pdie").show();
	}else{
		$("#maplegend_pdie").hide();
	}

	if($("input[value='pcht_das']").is(":checked")){
		

		if(layername == "pcht_das"){
			maptitle_pcht_das = "PERINGATAN DINI CURAH HUJAN TINGGI<BR />BERLAKU DASARIAN "+romawi(num1)+" "+omonth1.toUpperCase()+" "+oyear1;

			layer_pcht_das.getSource().updateParams({
				'LAYERS': 'pcht_das,prov,kabkot', 
				'date': date1,
				'num': num1
			});
		}

		maptitle.push(maptitle_pcht_das);

		$("#maplegend_pcht_das").show();
	}else{
		$("#maplegend_pcht_das").hide();
	}

	if($("input[value='hth']").is(":checked")){

		if(layername == "hth"){
			maptitle_hth = "MONITORING HARI TANPA HUJAN BERTURUT-TURUT<BR />PEMUTAKHIRAN DASARIAN "+romawi(num1)+" "+omonth1.toUpperCase()+" "+oyear1;

			layer_hth_das_info.getSource().updateParams({
				'LAYERS': 'kabkot,prov,hth_das_info',
				'date': date1
			});
			
			layer_hth_das_view.getSource().updateParams({
				'LAYERS': 'kabkot,prov,hth_das0,hth_das1,hth_das2,hth_das3,hth_das4,hth_das5,hth_das6',
				'date': date1
			});

			$("#mdlprintout a.indonesia").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-Indonesia.jpg");
			$("#mdlprintout a.balinusa").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-BaliNustra.jpg");
			$("#mdlprintout a.jawa").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-Jawa.jpg");
			$("#mdlprintout a.kalimantan").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-Kalimantan.jpg");
			$("#mdlprintout a.malukupapua").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-MalukuPapua.jpg");
			$("#mdlprintout a.sulawesi").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-Sulawesi.jpg");
			$("#mdlprintout a.sumatera").attr("href", "ftp/HTH_jpg/Das "+num1+" "+omonth1_short+" "+oyear1+"/PetaMonitoringHariTanpaHujan-Sumatera.jpg");

		}
		
		maptitle.push(maptitle_hth);

		$("#mapprint").show();


		$("#maplegend_hth").show();
	}else{
		$("#maplegend_hth").hide();

		$("#mapprint").hide();
	}

	if($("input[value='spi_ps3m']").is(":checked")){
		
		
		if(layername == "spi_ps3m"){
			maptitle_spi_ps3m = "PRAKIRAAN INDEKS PRESIPITASI TERSTANDARISASI (SPI) 3 BULANAN<BR />"+omonth1.toUpperCase()+" - "+omonth1_p2.toUpperCase()+" "+oyear1;

			layer_spi_ps3m.getSource().updateParams({
				'LAYERS': 'spi_ps3m,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_spi_ps3m);

		
		$("#maplegend_spi_ps3m").show();
	}else{
		$("#maplegend_spi_ps3m").hide();
	}

	if($("input[value='spi_as1m']").is(":checked")){
		
		
		if(layername == "spi_as1m"){
			maptitle_spi_as1m = "INDEKS PRESIPITASI TERSTANDARISASI (SPI) 1 BULANAN<BR />"+omonth1.toUpperCase()+" "+oyear1;

			layer_spi_as1m.getSource().updateParams({
				'LAYERS': 'spi_as1m,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_spi_as1m);

		
		$("#maplegend_spi_as1m").show();
	}else{
		$("#maplegend_spi_as1m").hide();
	}

	if($("input[value='spi_as3m']").is(":checked")){
		
		
		if(layername == "spi_as3m"){
			maptitle_spi_as3m = "INDEKS PRESIPITASI TERSTANDARISASI (SPI) 3 BULANAN<BR />"+omonth1_m2.toUpperCase()+" - "+omonth1.toUpperCase()+" "+oyear1;

			layer_spi_as3m.getSource().updateParams({
				'LAYERS': 'spi_as3m,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_spi_as3m);

		
		$("#maplegend_spi_as3m").show();
	}else{
		$("#maplegend_spi_as3m").hide();
	}

	if($("input[value='pch_prob_1m']").is(":checked")){
		
		
		if(layername == "pch_prob_1m"){
			maptitle_pch_prob_1m = "PETA PRAKIRAAN CURAH HUJAN<BR />"+omonth1.toUpperCase()+" "+oyear1+"<BR />PELUANG HUJAN &lt; 20MM";

			layer_pch_prob_1m.getSource().updateParams({
				'LAYERS': 'pch_prob,prov,kabkot', 
				'date1': date1,
				'date2': date2,
			});
		}
		
		maptitle.push(maptitle_pch_prob_1m);

		
		$("#maplegend_pch_prob_1m").show();
	}else{
		$("#maplegend_pch_prob_1m").hide();
	}

	if($("input[value='pch_prob_2m']").is(":checked")){
		
		
		if(layername == "pch_prob_2m"){
			maptitle_pch_prob_2m = "PETA PRAKIRAAN CURAH HUJAN<BR />"+omonth1.toUpperCase()+" "+oyear1+"<BR />PELUANG HUJAN &lt; 20MM";

			layer_pch_prob_2m.getSource().updateParams({
				'LAYERS': 'pch_prob,prov,kabkot', 
				'date1': date1,
				'date2': date2,
			});
		}
		
		maptitle.push(maptitle_pch_prob_2m);

		
		$("#maplegend_pch_prob_2m").show();
	}else{
		$("#maplegend_pch_prob_2m").hide();
	}

	if($("input[value='pch_prob_3m']").is(":checked")){
		
		
		if(layername == "pch_prob_3m"){
			maptitle_pch_prob_3m = "PETA PRAKIRAAN CURAH HUJAN<BR />"+omonth1.toUpperCase()+" "+oyear1+"<BR />PELUANG HUJAN &lt; 20MM";

			layer_pch_prob_3m.getSource().updateParams({
				'LAYERS': 'pch_prob,prov,kabkot', 
				'date1': date1,
				'date2': date2,
			});
		}
		
		maptitle.push(maptitle_pch_prob_3m);

		
		$("#maplegend_pch_prob_3m").show();
	}else{
		$("#maplegend_pch_prob_3m").hide();
	}

	if($("input[value='pch_prob_das']").is(":checked")){
		
		
		if(layername == "pch_prob_das"){
			maptitle_pch_prob_das = "PETA PRAKIRAAN CURAH HUJAN<BR />DASARIAN "+romawi(num1)+" "+omonth1.toUpperCase()+" "+oyear1+"<BR />PELUANG HUJAN &lt; 20 MM<BR /><span style=\"font-size:0.8em;\">UPDATE "+odate2+" "+omonth2.toUpperCase()+" "+oyear2+"</span>";

			layer_pch_prob_das.getSource().updateParams({
				'LAYERS': 'pch_prob_das,prov,kabkot', 
				'date1': date1,
				'date2': date2,
				'num': num1,
			});
		}
		
		maptitle.push(maptitle_pch_prob_das);

		
		$("#maplegend_pch_prob_das").show();
	}else{
		$("#maplegend_pch_prob_das").hide();
	}

	if($("input[value='pem']").is(":checked")){
		
		
		if(layername == "pem"){
			maptitle_pem = "PETA SEBARAN POTENSI ENERGI MATAHARI<BR />PERIODE 5 TAHUN";

			layer_pem.getSource().updateParams({
				'LAYERS': 'pem,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_pem);

		
		$("#maplegend_pem").show();
	}else{
		$("#maplegend_pem").hide();
	}

	if($("input[value='titikstationmatahari']").is(":checked")){
		
		
		if(layername == "titikstationmatahari"){
			maptitle_titikstationmatahari = "PETA SEBARAN TITIK STASIUN PEMANTAU<br />ENERGI MATAHARI";

			layer_titikstationmatahari.getSource().updateParams({
				'LAYERS': 'titikstationmatahari,prov,kabkot'
			});
		}
		
		maptitle.push(maptitle_titikstationmatahari);

		
		$("#maplegend_titikstationmatahari").show();
	}else{
		$("#maplegend_titikstationmatahari").hide();
	}

	if($("input[value='pea']").is(":checked")){
		
		
		if(layername == "pea"){
			maptitle_pea = "PETA SEBARAN POTENSI ENERGI ANGIN<BR />PERIODE 5 TAHUN";

			layer_pea.getSource().updateParams({
				'LAYERS': 'pea,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_pea);

		
		$("#maplegend_pea").show();
	}else{
		$("#maplegend_pea").hide();
	}

	if($("input[value='analisiscurahhujan']").is(":checked")){
		
		
		if(layername == "analisiscurahhujan"){
			maptitle_analisiscurahhujan = "Analisis Curah Hujan Bulanan";

			layer_analisiscurahhujan.getSource().updateParams({
				'LAYERS': 'analisiscurahhujan,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_analisiscurahhujan);

		
		$("#maplegend_analisiscurahhujan").show();
	}else{
		$("#maplegend_analisiscurahhujan").hide();
	}

	if($("input[value='analisissifathujan']").is(":checked")){
		
		
		if(layername == "analisissifathujan"){
			maptitle_analisissifathujan = "Analisis Sifat Hujan Bulanan";

			layer_analisissifathujan.getSource().updateParams({
				'LAYERS': 'analisissifathujan,prov,kabkot', 
				'date': date1
			});
		}
		
		maptitle.push(maptitle_analisissifathujan);

		
		$("#maplegend_analisissifathujan").show();
	}else{
		$("#maplegend_analisissifathujan").hide();
	}


	if(maptitle.length > 0){
		$("#maptitle").show();
		$("#maptitle").html(maptitle.join(", "));
		$("#legendcontainer").show();
	}else{
		$("#maptitle").hide();
		$("#legendcontainer").hide();
	}
	
	
	
	infodetails.setPosition(undefined);


}


function setLegend(layername, date1, date2, num1){
	
	var legendsetting;
	
	switch(layername){
		case "pdie":
			legendsetting = legend_pdie;
			$("#mapannotation").hide();
			legendtext = "Peringatan Dini Iklim";
			break;
		case "pcht_das":
			legendsetting = legend_pcht_das;
			$("#mapannotation").hide();
			legendtext = "Peringatan Dini Curah Hujan Tinggi";
			break;
		case "hth":
			legendsetting = legend_hth_das_view;
			$("#mapannotation").hide();
			legendtext = "Hari Tanpa Hujan";
			break;
		case "spi_ps3m":
			legendsetting = legend_spi;
			$("#mapannotation").hide();
			legendtext = "SPI Prakiraan 3 Bulan";
			break;
		case "spi_as1m":
			legendsetting = legend_spi;
			$("#mapannotation").hide();
			legendtext = "SPI Analisa 1 Bulan";
			break;
		case "spi_as3m":
			legendsetting = legend_spi;
			$("#mapannotation").hide();
			legendtext = "SPI Analisa 3 Bulan";
			break;
		case "pch_prob_1m":
			legendsetting = legend_pch_prob;
			$("#mapannotation").hide();
			legendtext = "Prakiraan Curah Hujan Bulanan (1 Bulan)";
			break;
		case "pch_prob_2m":
			legendsetting = legend_pch_prob;
			$("#mapannotation").hide();
			legendtext = "Prakiraan Curah Hujan Bulanan (2 Bulan)";
			break;
		case "pch_prob_3m":
			legendsetting = legend_pch_prob;
			$("#mapannotation").hide();
			legendtext = "Prakiraan Curah Hujan Bulanan (3 Bulan)";
			break;
		case "pch_prob_das":
			legendsetting = legend_pch_prob_das;
			$("#mapannotation").hide();
			legendtext = "Prakiraan Curah Hujan Dasarian";
			break;
		case "pem":
			legendsetting = legend_pem;
			$("#mapannotation").html("Disclaimer: Data dari tahun 2011-2019");
			$("#mapannotation").show();
			legendtext = "XXXXXXX";
			break;
		case "pea":
			legendsetting = legend_pea;
			$("#mapannotation").html("Disclaimer: Data dari tahun 2011-2019");
			$("#mapannotation").show();
			legendtext = "XXXXXXX";
			break;
		case "titikstationmatahari":
			legendsetting = legend_titikstationmatahari;
			$("#mapannotation").hide();
			legendtext = "XXXXXXX";
			break;
		case "analisiscurahhujan":
			legendsetting = legend_analisiscurahhujan;
			$("#mapannotation").hide();
			legendtext = "XXXXXXX";
			break;
		case "analisissifathujan":
			legendsetting = legend_analisissifathujan;
			$("#mapannotation").hide();
			legendtext = "XXXXXXX";
			break;
	}
	
	var html="<table>";

	if(layername=="hth"){
		html+="<tr><th colspan='3'>"+legendtext+"</th></tr>";
	}else{
		html+="<tr><th colspan='2'>"+legendtext+"</th></tr>";
	}
	
	for(var i=0;i<legendsetting.length;i++){
		
		if(layername=="hth"){
			html+="<tr class='trlegend' layername='"+layername+"' legendindex='"+i+"'><td class='first-td'>"+legendsetting[i][0]+"</td><td><img src=\""+legendsetting[i][1]+"\" /></td><td>"+legendsetting[i][2]+"</td></tr>";
		}else{
			html+="<tr class='trlegend' layername='"+layername+"' legendindex='"+i+"'><td><img src=\""+legendsetting[i][1]+"\" /></td><td>"+legendsetting[i][2]+"</td></tr>";
		}
		
	}
	
	html+="</table>";
	
	$("#areacoverage").hide();
	$('#areaawas').show();
	
	$("#maplegend tr").unbind();
	
	$("#maplegend_"+layername).html(html);
	
	if(layername!="titikstationmatahari"){
		$("#maplegend_"+layername+" tr.trlegend").unbind().click(function(){
			$("#areaawas").hide();
			setAreaCoverage($(this).attr("layername"), $(this).attr("legendindex"), date1, date2, num1);
		});
	}
}

function setAreaCoverage(layername, legendindex, date1, date2, num1){
	$("#mapannotation").hide();
	$("#areacoverage").show();
	$("#areacoverage-content").html("<i>Loading...</i>");
	
	$.post("areacoverage.php?req=getareacoverage", {
		layername:layername,
		legendindex:legendindex,
		date1:date1,
		date2:date2,
		num1:num1
	},function(data){
		if(jQuery.isEmptyObject(data)){
			$("#areacoverage-content").html("Wilayah tidak ditemukan");
		}else{
			var html="";
			for(var i=0;i<data.length;i++){
				html+="<div class='item'>";
				html+="<div class='title'>"+data[i].prov+"</div>";
				html+="<div class='content'>";
				
				for(var j=0;j<data[i].kabkot.length;j++){
				
					html+="<div>"+data[i].kabkot[j]+"</div>";
				
				}
				
				html+="</div>";
				html+="</div>";
			}
			
			$("#areacoverage-content").html(html);
		}
	});
}

function showSubInfo(selector){

	$("#mdlsubinfo .modal-body").html("");

	var data = selector.attr("data");
	var target = selector.attr("target");
	
	var title = "";
	var src = "";

	switch(data){
		case "riwayatpenyinaran":
			title = "Riwayat Penyinaran Matahari";
			src = "ftp/Isi_dari_titik_energi_matahari/LPM/" + target +".png";
			break;
		case "potensienergi":
			title = "Potensi Energi Matahari";
			src = "ftp/Isi_dari_titik_energi_matahari/Potensi Energi Matahari/" + target +".png";
			break;
		case "tutupanawan":
			title = "Persentase Tutupan Awan";
			src = "ftp/Isi_dari_titik_energi_matahari/grafik awan/" + target +".png";
			break;
		case "suhu":
			title = "Suhu Diurnal";
			src = "ftp/Isi_dari_titik_energi_matahari/Suhu/" + target +".png";
			break;
		case "wind":
			title = "Wind Rose";
			src = "ftp/Isi_dari_titik_energi_matahari/Angin/" + target +".png";
			break;
		case "beneningan":
			title = "Indeks Kebeningan";
			src = "ftp/Isi_dari_titik_energi_matahari/Indeks Kebeningan/" + target +".png";
			break;
	}

	$("#mdlsubinfo").modal("show");
	$("#mdlsubinfo .modal-title").html(title);
	$("#mdlsubinfo .modal-body").html("<a data-bs-toggle='tooltip' title='Klik untuk buka di tab baru' href='"+src+"' target='blank' style='cursor:pointer'><img class=\"w-100\" src=\"" + src + "\" /></a>");
}

function romawi(num){
	switch(Number(num)){
		case 1:
			return "I";
		case 2:
			return "II";
		case 3:
			return "III";
		case 4:
			return "IV";
		case 5:
			return "V";
	}
}