mirror of
https://github.com/wavelog/wavelog.git
synced 2026-03-22 10:24:14 +00:00
591 lines
15 KiB
JavaScript
591 lines
15 KiB
JavaScript
var clicklines = [];
|
|
var map;
|
|
var maidenhead;
|
|
var geojson;
|
|
var itugeojson;
|
|
var zonemarkers = [];
|
|
var ituzonemarkers = [];
|
|
var nightlayer;
|
|
|
|
var defaultlinecolor = 'blue';
|
|
|
|
if (isDarkModeTheme()) {
|
|
defaultlinecolor = 'red';
|
|
}
|
|
|
|
var iconsList = { 'qso': { 'color': defaultlinecolor, 'icon': 'fas fa-dot-circle', 'iconSize': [5, 5] }, 'qsoconfirm': { 'color': defaultlinecolor, 'icon': 'fas fa-dot-circle', 'iconSize': [5, 5] } };
|
|
|
|
var stationIcon = L.divIcon({ className: 'cspot_station', iconSize: [5, 5], iconAnchor: [5, 5]});
|
|
var qsoIcon = L.divIcon({ className: 'cspot_qso', iconSize: [5, 5], iconAnchor: [5, 5] }); //default (fas fa-dot-circle red)
|
|
var qsoconfirmIcon = L.divIcon({ className: 'cspot_qsoconfirm', iconSize: [5, 5], iconAnchor: [5, 5] });
|
|
var redIconImg = L.icon({ iconUrl: icon_dot_url, iconSize: [5, 5] }); // old //
|
|
|
|
function toggleCqZones(bool) {
|
|
if(!bool) {
|
|
zonemarkers.forEach(function (item) {
|
|
map.removeLayer(item);
|
|
});
|
|
if (geojson != undefined) {
|
|
map.removeLayer(geojson);
|
|
}
|
|
} else {
|
|
geojson = L.geoJson(zonestuff, {style: style}).addTo(map);
|
|
for (var i = 0; i < cqzonenames.length; i++) {
|
|
|
|
var title = '<span class="grid-text" style="cursor: default"><font style="color: \'white\'; font-size: 1.5em; font-weight: 900;">' + (Number(i)+Number(1)) + '</font></span>';
|
|
var myIcon = L.divIcon({className: 'my-div-icon', html: title});
|
|
|
|
var marker = L.marker(
|
|
[cqzonenames[i][0], cqzonenames[i][1]], {
|
|
icon: myIcon,
|
|
title: (Number(i)+Number(1)),
|
|
zIndex: 1000,
|
|
}
|
|
).addTo(map);
|
|
zonemarkers.push(marker);
|
|
}
|
|
}
|
|
}
|
|
|
|
function toggleItuZones(bool) {
|
|
if(!bool) {
|
|
ituzonemarkers.forEach(function (item) {
|
|
map.removeLayer(item);
|
|
});
|
|
if (itugeojson != undefined) {
|
|
map.removeLayer(itugeojson);
|
|
}
|
|
} else {
|
|
itugeojson = L.geoJson(ituzonestuff, {style: style}).addTo(map);
|
|
for (var i = 0; i < ituzonenames.length; i++) {
|
|
|
|
var title = '<span class="grid-text" style="cursor: default"><font style="color: \'white\'; font-size: 1.5em; font-weight: 900;">' + (Number(i)+Number(1)) + '</font></span>';
|
|
var myIcon = L.divIcon({className: 'my-div-icon', html: title});
|
|
|
|
var marker = L.marker(
|
|
[ituzonenames[i][0], ituzonenames[i][1]], {
|
|
icon: myIcon,
|
|
title: (Number(i)+Number(1)),
|
|
zIndex: 1000,
|
|
}
|
|
).addTo(map);
|
|
ituzonemarkers.push(marker);
|
|
}
|
|
}
|
|
}
|
|
|
|
function toggleNightShadow(bool) {
|
|
if(!bool) {
|
|
map.removeLayer(nightlayer);
|
|
} else {
|
|
nightlayer.addTo(map);
|
|
}
|
|
}
|
|
|
|
function style(feature) {
|
|
var bordercolor = "black";
|
|
if (isDarkModeTheme()) {
|
|
bordercolor = "white";
|
|
}
|
|
return {
|
|
fillColor: "white",
|
|
fillOpacity: 0,
|
|
opacity: 0.65,
|
|
color: bordercolor,
|
|
weight: 1,
|
|
};
|
|
}
|
|
|
|
function clearLines() {
|
|
clicklines.forEach(function (item) {
|
|
map.removeLayer(item);
|
|
});
|
|
}
|
|
|
|
function addLines() {
|
|
clicklines.forEach(function (item) {
|
|
map.addLayer(item);
|
|
});
|
|
}
|
|
|
|
function toggleFunction(bool) {
|
|
if(bool) {
|
|
addLines();
|
|
} else {
|
|
clearLines();
|
|
}
|
|
};
|
|
|
|
function toggleGridsquares(bool) {
|
|
if(!bool) {
|
|
map.removeLayer(maidenhead);
|
|
} else {
|
|
maidenhead.addTo(map);
|
|
}
|
|
};
|
|
|
|
const cqzonenames = [
|
|
[ "75", "-140" ],
|
|
[ "70", "-82.5" ],
|
|
[ "45", "-125" ],
|
|
[ "45", "-100" ],
|
|
[ "45", "-65" ],
|
|
[ "25.5", "-115" ],
|
|
[ "14.5", "-90" ],
|
|
[ "22", "-60" ],
|
|
[ "11.5", "-70" ],
|
|
[ "-5", "-100" ],
|
|
[ "-9", "-45" ],
|
|
[ "-45", "-106" ],
|
|
[ "-45", "-55" ],
|
|
[ "52", "-14" ],
|
|
[ "46", "11" ],
|
|
[ "60", "35" ],
|
|
[ "55", "65" ],
|
|
[ "70", "90" ],
|
|
[ "70", "150" ],
|
|
[ "42", "29" ],
|
|
[ "28", "53" ],
|
|
[ "6", "75" ],
|
|
[ "44", "93" ],
|
|
[ "33", "110" ],
|
|
[ "38", "134" ],
|
|
[ "16", "100" ],
|
|
[ "15", "140" ],
|
|
[ "0", "125" ],
|
|
[ "-25", "115" ],
|
|
[ "-25", "145" ],
|
|
[ "15", "-165" ],
|
|
[ "-25", "-165" ],
|
|
[ "32", "-26" ],
|
|
[ "25", "25.5" ],
|
|
[ "15", "-6" ],
|
|
[ "-5", "-6" ],
|
|
[ "6", "51" ],
|
|
[ "-45", "8" ],
|
|
[ "-25", "55"],
|
|
[ "78", "-10"],
|
|
];
|
|
|
|
const ituzonenames = [
|
|
["60","-160"],
|
|
["55","-125"],
|
|
["55","-100"],
|
|
["55","-78"],
|
|
["73","-40"],
|
|
["40","-119"],
|
|
["40","-100"],
|
|
["40","-80"],
|
|
["55","-60"],
|
|
["20","-102"],
|
|
["21","-75"],
|
|
["-3","-72"],
|
|
["-5","-45"],
|
|
["-30","-65"],
|
|
["-25","-45"],
|
|
["-50","-65"],
|
|
["61","-26"],
|
|
["70","10"],
|
|
["70","40"],
|
|
["70","62.5"],
|
|
["70","82.5"],
|
|
["70","100"],
|
|
["70","122.5"],
|
|
["70","142.5"],
|
|
["70","162.5"],
|
|
["70","180"],
|
|
["52","2"],
|
|
["45","18"],
|
|
["53","36"],
|
|
["53","62.5"],
|
|
["53","82.5"],
|
|
["53","100"],
|
|
["53","122.5"],
|
|
["53","142"],
|
|
["55","160"],
|
|
["35","-25"],
|
|
["35","0"],
|
|
["27.5","22.5"],
|
|
["27","42"],
|
|
["32","56"],
|
|
["10","75"],
|
|
["39","82.5"],
|
|
["33","100"],
|
|
["33","118"],
|
|
["33","140"],
|
|
["15","-10"],
|
|
["12.5","22"],
|
|
["5","40"],
|
|
["15","100"],
|
|
["10","120"],
|
|
["-4","150"],
|
|
["-7","17"],
|
|
["-12.5","45"],
|
|
["-2","115"],
|
|
["-20","140"],
|
|
["-20","170"],
|
|
["-30","24"],
|
|
["-25","120"],
|
|
["-40","140"],
|
|
["-40","170"],
|
|
["15","-170"],
|
|
["-15","-170"],
|
|
["-15","-135"],
|
|
["10","140"],
|
|
["10","162"],
|
|
["-23","-11"],
|
|
["-70","10"],
|
|
["-47.5","60"],
|
|
["-70","70"],
|
|
["-70","130"],
|
|
["-70","-170"],
|
|
["-70","-110"],
|
|
["-70","-050"],
|
|
["-82.5","0"],
|
|
["82.5","0"],
|
|
["40","-150"],
|
|
["15","-135"],
|
|
["-15","-95"],
|
|
["-40","-160"],
|
|
["-40","-125"],
|
|
["-40","-90"],
|
|
["50","-30"],
|
|
["25","-47.5"],
|
|
["-45","-40"],
|
|
["-45","10"],
|
|
["-25","70"],
|
|
["-25","95"],
|
|
["-50","95"],
|
|
["-54","140"],
|
|
["39","165"]
|
|
];
|
|
|
|
function loadMap(data, iconsList) {
|
|
$('#mapButton').prop("disabled", false).removeClass("running");
|
|
var osmUrl='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
|
var osmAttrib='Map data © <a href="https://openstreetmap.org">OpenStreetMap</a> contributors';
|
|
// If map is already initialized
|
|
var container = L.DomUtil.get('advancedmap');
|
|
|
|
var bounds = L.latLngBounds()
|
|
|
|
if(container != null){
|
|
container._leaflet_id = null;
|
|
container.remove();
|
|
$(".coordinates").remove();
|
|
$(".qso_manager").append('<div id="advancedmap" class="map-leaflet"></div>');
|
|
$(".qso_manager").append('<div class="coordinates d-flex">' +
|
|
'<div class="cohidden">' + lang_gen_hamradio_latitude + ' </div>' +
|
|
'<div class="cohidden col-auto text-success fw-bold" id="latDeg"></div>' +
|
|
'<div class="cohidden">' + lang_gen_hamradio_longitude + ' </div>' +
|
|
'<div class="cohidden col-auto text-success fw-bold" id="lngDeg"></div>' +
|
|
'<div class="cohidden">' + lang_gen_hamradio_gridsquare + ' </div>' +
|
|
'<div class="cohidden col-auto text-success fw-bold" id="locator"></div>' +
|
|
'<div class="cohidden">' + lang_gen_hamradio_distance + ' </div>' +
|
|
'<div class="cohidden col-auto text-success fw-bold" id="distance"></div>' +
|
|
'<div class="cohidden">' + lang_gen_hamradio_bearing + ' </div>' +
|
|
'<div class="cohidden col-auto text-success fw-bold" id="bearing"></div>' +
|
|
'</div>');
|
|
$('.cohidden').show();
|
|
}
|
|
|
|
map = new L.Map('advancedmap', {
|
|
fullscreenControl: true,
|
|
fullscreenControlOptions: {
|
|
position: 'topleft'
|
|
},
|
|
});
|
|
|
|
var osm = L.tileLayer(
|
|
osmUrl,
|
|
{
|
|
attribution: '© <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
|
|
maxZoom: 18,
|
|
zoom: 3,
|
|
minZoom: 2,
|
|
}
|
|
).addTo(map);
|
|
|
|
map.setView([30, 0], 1.5);
|
|
|
|
var redIcon = L.icon({
|
|
iconUrl: icon_dot_url,
|
|
iconSize: [10, 10], // size of the icon
|
|
});
|
|
|
|
var counter = 0;
|
|
|
|
clicklines = [];
|
|
$.each(data, function(k, v) {
|
|
counter++;
|
|
// Need to fix so that marker is placed at same place as end of line, but this only needs to be done when longitude is < -170
|
|
if (this.latlng2[1] < -170) {
|
|
this.latlng2[1] = parseFloat(this.latlng2[1])+360;
|
|
}
|
|
if (this.latlng1[1] < -170) {
|
|
this.latlng1[1] = parseFloat(this.latlng1[1])+360;
|
|
}
|
|
|
|
var popupmessage = createContentMessage(this);
|
|
var popupmessage2 = createContentMessageDx(this);
|
|
|
|
var marker = L.marker([this.latlng1[0], this.latlng1[1]], {icon: stationIcon}, {closeOnClick: false, autoClose: false}).addTo(map).bindPopup(popupmessage);
|
|
|
|
marker.on('mouseover',function(ev) {
|
|
ev.target.openPopup();
|
|
});
|
|
let lat_lng = [this.latlng1[0], this.latlng1[1]];
|
|
bounds.extend(lat_lng);
|
|
|
|
if (this.confirmed && iconsList.qsoconfirm.icon !== "0") {
|
|
var marker2 = L.marker([this.latlng2[0], this.latlng2[1]], {icon: qsoconfirmIcon},{closeOnClick: false, autoClose: false}).addTo(map).bindPopup(popupmessage2);
|
|
linecolor = iconsList.qsoconfirm.color;
|
|
} else {
|
|
var marker2 = L.marker([this.latlng2[0], this.latlng2[1]], {icon: qsoIcon},{closeOnClick: false, autoClose: false}).addTo(map).bindPopup(popupmessage2);
|
|
linecolor = iconsList.qso.color;
|
|
}
|
|
|
|
marker2.on('mouseover',function(ev) {
|
|
ev.target.openPopup();
|
|
});
|
|
|
|
lat_lng = [this.latlng2[0], this.latlng2[1]];
|
|
bounds.extend(lat_lng);
|
|
|
|
const multiplelines = [];
|
|
multiplelines.push(
|
|
new L.LatLng(this.latlng1[0], this.latlng1[1]),
|
|
new L.LatLng(this.latlng2[0], this.latlng2[1])
|
|
)
|
|
|
|
const geodesic = L.geodesic(multiplelines, {
|
|
weight: 1,
|
|
opacity: 1,
|
|
color: linecolor,
|
|
wrap: false,
|
|
steps: 100
|
|
}).addTo(map);
|
|
|
|
clicklines.push(geodesic);
|
|
});
|
|
|
|
/*Legend specific*/
|
|
var legend = L.control({ position: "topright" });
|
|
|
|
legend.onAdd = function(map) {
|
|
var div = L.DomUtil.create("div", "legend");
|
|
div.innerHTML += '<div>' + counter + " QSOs plotted</div>";
|
|
div.innerHTML += '<input type="checkbox" onclick="toggleFunction(this.checked)" ' + (typeof path_lines !== 'undefined' && path_lines ? 'checked' : '') + ' style="outline: none;"><span> Path lines</span><br>';
|
|
div.innerHTML += '<input type="checkbox" onclick="toggleGridsquares(this.checked)" ' + (typeof gridsquare_layer !== 'undefined' && gridsquare_layer ? 'checked' : '') + ' style="outline: none;"><span> Gridsquares</span><br>';
|
|
div.innerHTML += '<input type="checkbox" onclick="toggleCqZones(this.checked)" ' + (typeof cqzones_layer !== 'undefined' && cqzones_layer ? 'checked' : '') + ' style="outline: none;"><span> CQ Zones</span><br>';
|
|
div.innerHTML += '<input type="checkbox" onclick="toggleItuZones(this.checked)" ' + (typeof ituzones_layer !== 'undefined' && ituzones_layer ? 'checked' : '') + ' style="outline: none;"><span> ITU Zones</span><br>';
|
|
div.innerHTML += '<input type="checkbox" onclick="toggleNightShadow(this.checked)" ' + (typeof nightshadow_layer !== 'undefined' && nightshadow_layer ? 'checked' : '') + ' style="outline: none;"><span> Night shadow</span>';
|
|
return div;
|
|
};
|
|
|
|
legend.addTo(map);
|
|
|
|
maidenhead = L.maidenheadqrb().addTo(map);
|
|
nightlayer = L.terminator().addTo(map);
|
|
|
|
map.fitBounds(bounds);
|
|
|
|
$.each(iconsList, function (icon, data) {
|
|
$('#advancedmap' + ' .cspot_' + icon).addClass(data.icon).css("color", data.color);
|
|
});
|
|
|
|
var printer = L.easyPrint({
|
|
tileLayer: osm,
|
|
sizeModes: ['Current', 'A4Landscape', 'A4Portrait'],
|
|
filename: 'Wavelog',
|
|
exportOnly: true,
|
|
hideControlContainer: true
|
|
}).addTo(map);
|
|
|
|
map.on('mousemove', onMapMove);
|
|
|
|
if (typeof gridsquare_layer !== 'undefined') {
|
|
toggleGridsquares(gridsquare_layer);
|
|
} else {
|
|
toggleGridsquares(false);
|
|
}
|
|
|
|
if (typeof path_lines !== 'undefined') {
|
|
toggleFunction(path_lines);
|
|
} else {
|
|
toggleFunction(false);
|
|
}
|
|
|
|
if (typeof cqzones_layer !== 'undefined') {
|
|
toggleCqZones(cqzones_layer);
|
|
} else {
|
|
toggleCqZones(false);
|
|
}
|
|
|
|
if (typeof ituzones_layer !== 'undefined') {
|
|
toggleItuZones(ituzones_layer);
|
|
} else {
|
|
toggleItuZones(false);
|
|
}
|
|
|
|
if (typeof nightshadow_layer !== 'undefined') {
|
|
toggleNightShadow(nightshadow_layer);
|
|
} else {
|
|
toggleNightShadow(false);
|
|
}
|
|
}
|
|
|
|
function createContentMessage(qso) {
|
|
var table = '<table><tbody>' +
|
|
'<tr>' +
|
|
'<td>' +
|
|
'Station callsign: ' + qso.mycallsign +
|
|
"</td></tr>" +
|
|
'<tr>' +
|
|
'<td>' +
|
|
'Gridsquare: ' + qso.mygridsquare +
|
|
"</td></tr>";
|
|
return (table += "</tbody></table>");
|
|
}
|
|
|
|
function createContentMessageDx(qso) {
|
|
var table = '<table><tbody>' +
|
|
'<tr>' +
|
|
'<td>Callsign</td>' +
|
|
'<td>' + qso.callsign + '</td>' +
|
|
'</tr>' +
|
|
'<tr>' +
|
|
'<td>Date/time</td>' +
|
|
'<td>' + qso.datetime + '</td>' +
|
|
'</tr>' +
|
|
'<tr>';
|
|
if (qso.satname != "") {
|
|
table += '<td>Band</td>' +
|
|
'<td>' + qso.satname + '</td>' +
|
|
'</tr>' +
|
|
'<tr>';
|
|
} else {
|
|
table += '<td>Band</td>' +
|
|
'<td>' + qso.band + '</td>' +
|
|
'</tr>' +
|
|
'<tr>';
|
|
}
|
|
table += '<td>Mode</td>' +
|
|
'<td>' + qso.mode + '</td>' +
|
|
'</tr>' +
|
|
'<tr>';
|
|
if (qso.gridsquare != undefined) {
|
|
table += '<td>Gridsquare</td>' +
|
|
'<td>' + qso.gridsquare + '</td>' +
|
|
'</tr>';
|
|
}
|
|
if (qso.distance != undefined) {
|
|
table += '<td>Distance</td>' +
|
|
'<td>' + qso.distance + '</td>' +
|
|
'</tr>';
|
|
}
|
|
if (qso.bearing != undefined) {
|
|
table += '<td>Bearing</td>' +
|
|
'<td>' + qso.bearing + '</td>' +
|
|
'</tr>';
|
|
}
|
|
return (table += '</tbody></table>');
|
|
}
|
|
|
|
function loadMapOptions(data) {
|
|
$.ajax({
|
|
url: base_url + 'index.php/user_options/get_map_custom',
|
|
type: 'GET',
|
|
dataType: 'json',
|
|
error: function () {
|
|
},
|
|
success: function (json_mapinfo) {
|
|
if (typeof json_mapinfo.qso !== "undefined") {
|
|
iconsList = json_mapinfo;
|
|
}
|
|
loadMap(data, iconsList)
|
|
}
|
|
});
|
|
}
|
|
|
|
function mapQsos(form) {
|
|
$('#mapButton').prop("disabled", true).addClass("running");
|
|
|
|
var id_list=[];
|
|
var elements = $('#qsoList tbody input:checked');
|
|
var nElements = elements.length;
|
|
|
|
elements.each(function() {
|
|
let id = $(this).first().closest('tr').data('qsoID')
|
|
id_list.push(id);
|
|
unselectQsoID(id);
|
|
});
|
|
|
|
$("#qsoList").attr("Hidden", true);
|
|
$("#qsoList_wrapper").attr("Hidden", true);
|
|
$("#qsoList_info").attr("Hidden", true);
|
|
|
|
amap = $('#advancedmap').val();
|
|
if (amap == undefined) {
|
|
$(".qso_manager").append('<div id="advancedmap" class="map-leaflet"></div>');
|
|
}
|
|
|
|
if (id_list.length > 0) {
|
|
$.ajax({
|
|
url: base_url + 'index.php/logbookadvanced/mapSelectedQsos',
|
|
type: 'post',
|
|
data: {
|
|
ids: id_list,
|
|
de: form.de.value
|
|
},
|
|
success: function(data) {
|
|
loadMapOptions(data);
|
|
},
|
|
error: function() {
|
|
$('#mapButton').prop("disabled", false).removeClass("running");
|
|
},
|
|
});
|
|
} else {
|
|
$.ajax({
|
|
url: base_url + 'index.php/logbookadvanced/mapQsos',
|
|
type: 'post',
|
|
data: {
|
|
dateFrom: form.dateFrom.value,
|
|
dateTo: form.dateTo.value,
|
|
de: form.de.value,
|
|
dx: form.dx.value,
|
|
mode: form.mode.value,
|
|
band: form.band.value,
|
|
qslSent: form.qslSent.value,
|
|
qslReceived: form.qslReceived.value,
|
|
qslSentMethod: this.qslSentMethod.value,
|
|
qslReceivedMethod: this.qslReceivedMethod.value,
|
|
iota: form.iota.value,
|
|
dxcc: form.dxcc.value,
|
|
propmode: form.selectPropagation.value,
|
|
gridsquare: form.gridsquare.value,
|
|
state: form.state.value,
|
|
qsoresults: form.qsoResults.value,
|
|
sats: form.sats.value,
|
|
cqzone: form.cqzone.value,
|
|
lotwSent: form.lotwSent.value,
|
|
lotwReceived: form.lotwReceived.value,
|
|
eqslSent: form.eqslSent.value,
|
|
eqslReceived: form.eqslReceived.value,
|
|
qslvia: $('[name="qslviainput"]').val(),
|
|
sota: form.sota.value,
|
|
pota: form.pota.value,
|
|
operator: form.operator.value,
|
|
wwff: form.wwff.value,
|
|
qslimages: form.qslimages.value,
|
|
},
|
|
success: function(data) {
|
|
loadMapOptions(data);
|
|
},
|
|
error: function() {
|
|
$('#mapButton').prop("disabled", false).removeClass("running");
|
|
},
|
|
});
|
|
}
|
|
};
|