mirror of
https://github.com/wavelog/wavelog.git
synced 2026-03-22 10:24:14 +00:00
1113 lines
32 KiB
JavaScript
1113 lines
32 KiB
JavaScript
totalSatQsos();
|
|
totalQsosPerYear();
|
|
|
|
var activeTab='totalQsosPerYear()';
|
|
|
|
// Preset functionality
|
|
function applyPreset(preset) {
|
|
const dateFrom = document.getElementById('dateFrom');
|
|
const dateTo = document.getElementById('dateTo');
|
|
const today = new Date();
|
|
|
|
// Format date as YYYY-MM-DD
|
|
function formatDate(date) {
|
|
const year = date.getUTCFullYear();
|
|
const month = String(date.getUTCMonth() + 1).padStart(2, '0');
|
|
const day = String(date.getUTCDate()).padStart(2, '0');
|
|
return `${year}-${month}-${day}`;
|
|
}
|
|
|
|
switch(preset) {
|
|
case 'today':
|
|
dateFrom.value = formatDate(today);
|
|
dateTo.value = formatDate(today);
|
|
break;
|
|
|
|
case 'yesterday':
|
|
const yesterday = new Date(today);
|
|
yesterday.setDate(yesterday.getUTCDate() - 1);
|
|
dateFrom.value = formatDate(yesterday);
|
|
dateTo.value = formatDate(yesterday);
|
|
break;
|
|
|
|
case 'last7days':
|
|
const sevenDaysAgo = new Date(today);
|
|
sevenDaysAgo.setDate(sevenDaysAgo.getUTCDate() - 7);
|
|
dateFrom.value = formatDate(sevenDaysAgo);
|
|
dateTo.value = formatDate(today);
|
|
break;
|
|
|
|
case 'last30days':
|
|
const thirtyDaysAgo = new Date(today);
|
|
thirtyDaysAgo.setDate(thirtyDaysAgo.getUTCDate() - 30);
|
|
dateFrom.value = formatDate(thirtyDaysAgo);
|
|
dateTo.value = formatDate(today);
|
|
break;
|
|
|
|
case 'thismonth':
|
|
const firstDayOfMonth = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), 1));
|
|
dateFrom.value = formatDate(firstDayOfMonth);
|
|
dateTo.value = formatDate(today);
|
|
break;
|
|
|
|
case 'lastmonth':
|
|
const firstDayOfLastMonth = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth() - 1, 1));
|
|
const lastDayOfLastMonth = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), 0));
|
|
dateFrom.value = formatDate(firstDayOfLastMonth);
|
|
dateTo.value = formatDate(lastDayOfLastMonth);
|
|
break;
|
|
|
|
case 'thisyear':
|
|
const firstDayOfYear = new Date(Date.UTC(today.getUTCFullYear(), 0, 1));
|
|
dateFrom.value = formatDate(firstDayOfYear);
|
|
dateTo.value = formatDate(today);
|
|
break;
|
|
|
|
case 'lastyear':
|
|
const lastYear = today.getUTCFullYear() - 1;
|
|
const firstDayOfLastYear = new Date(Date.UTC(lastYear, 0, 1));
|
|
const lastDayOfLastYear = new Date(Date.UTC(lastYear, 11, 31));
|
|
dateFrom.value = formatDate(firstDayOfLastYear);
|
|
dateTo.value = formatDate(lastDayOfLastYear);
|
|
break;
|
|
|
|
case 'alltime':
|
|
dateFrom.value = '';
|
|
dateTo.value = '';
|
|
break;
|
|
}
|
|
// Trigger refresh after applying preset
|
|
eval(activeTab);
|
|
}
|
|
|
|
// Reset dates function
|
|
function resetDates() {
|
|
const dateFrom = document.getElementById('dateFrom');
|
|
const dateTo = document.getElementById('dateTo');
|
|
dateFrom.value = '';
|
|
dateTo.value = '';
|
|
// Trigger refresh after resetting
|
|
eval(activeTab);
|
|
}
|
|
|
|
$("a[href='#satellite']").on('shown.bs.tab', function(e) {
|
|
totalSatQsos();
|
|
activeTab='totalSatQsos()';
|
|
$(".sattable").DataTable().columns.adjust();
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#sattab']").on('shown.bs.tab', function(e) {
|
|
activeTab='totalSatQsos()';
|
|
totalSatQsos();
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#home']").on('shown.bs.tab', function(e) {
|
|
activeTab='totalQsosPerYear()';
|
|
totalQsosPerYear();
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#yearstab']").on('shown.bs.tab', function(e) {
|
|
activeTab='totalQsosPerYear()';
|
|
totalQsosPerYear();
|
|
$("#dateFilterContainer").hide();
|
|
});
|
|
|
|
$("a[href='#monthstab']").on('shown.bs.tab', function(e) {
|
|
activeTab='totalQsosPerMonth()';
|
|
totalQsosPerMonth();
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#bandtab']").on('shown.bs.tab', function(e) {
|
|
totalBandQsos();
|
|
activeTab='totalBandQsos()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#modetab']").on('shown.bs.tab', function(e) {
|
|
totalModeQsos();
|
|
activeTab='totalModeQsos()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#qsotab']").on('shown.bs.tab', function(e) {
|
|
totalQsos();
|
|
activeTab='totalQsos()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#operatorstab']").on('shown.bs.tab', function(e) {
|
|
totalOperatorQsos();
|
|
activeTab='totalOperatorQsos()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#satqsostab']").on('shown.bs.tab', function(e) {
|
|
totalSatQsosC();
|
|
activeTab='totalSatQsosC()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#uniquetab']").on('shown.bs.tab', function(e) {
|
|
uniqueCallsigns();
|
|
activeTab='uniqueCallsigns()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#satuniquetab']").on('shown.bs.tab', function(e) {
|
|
uniqueSatCallsigns();
|
|
activeTab='uniqueSatCallsigns()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("a[href='#satuniquegridtab']").on('shown.bs.tab', function(e) {
|
|
uniqueSatGrids();
|
|
activeTab='uniqueSatGrids()';
|
|
$("#dateFilterContainer").show();
|
|
});
|
|
|
|
$("#dateFrom, #dateTo").on('change', function(e) {
|
|
eval(activeTab);
|
|
});
|
|
|
|
function uniqueSatGrids() {
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_unique_sat_grids',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".satuniquegrid").html('');
|
|
if (data.length > 0) {
|
|
$(".satuniquegrid").html(data);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function uniqueSatCallsigns() {
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_unique_sat_callsigns',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".satunique").html('');
|
|
if (data.length > 0) {
|
|
$(".satunique").html(data);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function uniqueCallsigns() {
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_unique_callsigns',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".unique").html('');
|
|
if (data.length > 0) {
|
|
$(".unique").html(data);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalQsos() {
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_total_qsos',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".qsos").html('');
|
|
if (data.length > 0) {
|
|
$(".qsos").html(data);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalSatQsosC() {
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_total_sat_qsos',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".satqsos").html('');
|
|
if (data.length > 0) {
|
|
$(".satqsos").html(data);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalQsosPerYear() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_year',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
if (data.length > 0) {
|
|
$(".years").html('');
|
|
$(".years").append('<h2>' + lang_statistics_years + '</h2><div id="yearContainer"></div><div id="yearTable"></div>');
|
|
$("#yearContainer").append("<canvas id=\"yearChart\" width=\"400\" height=\"100\"></canvas>");
|
|
|
|
// appending table to hold the data
|
|
$("#yearTable").append('<table style="width:100%" class="yeartable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + lang_statistics_year +'</td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
|
|
var labels = [];
|
|
var dataQso = [];
|
|
|
|
var $myTable = $('.yeartable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
|
|
var $row = $('<tr></tr>');
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(row.year);
|
|
var $content = $('<td></td>').html(row.total);
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
$.each(data, function () {
|
|
labels.push(this.year);
|
|
dataQso.push(this.total);
|
|
});
|
|
|
|
labels.reverse();
|
|
dataQso.reverse();
|
|
|
|
var ctx = document.getElementById("yearChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
type: 'bar',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: decodeHtml(lang_statistics_number_of_qso_worked_each_year),
|
|
data: dataQso,
|
|
backgroundColor: 'rgba(54, 162, 235, 0.2)',
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
borderWidth: 2,
|
|
color: color
|
|
}]
|
|
},
|
|
options: {
|
|
scales: {
|
|
y: {
|
|
ticks: {
|
|
beginAtZero: true,
|
|
color: color
|
|
}
|
|
},
|
|
x: {
|
|
ticks: {
|
|
color: color
|
|
}
|
|
}
|
|
},
|
|
plugins: {
|
|
legend: {
|
|
labels: {
|
|
color: color
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
});
|
|
$('.yeartable').DataTable({
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "320px",
|
|
"scrollCollapse": true,
|
|
"paging": false,
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
bFilter: false,
|
|
bInfo: false
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalQsosPerMonth() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_year_month',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
if (data.length > 0) {
|
|
$(".months").html('');
|
|
$(".months").append('<h2>' + lang_statistics_months + '</h2><div id="monthContainer"></div><div id="monthTable"></div>');
|
|
$("#monthContainer").append("<canvas id=\"monthChart\" width=\"400\" height=\"100\"></canvas>");
|
|
|
|
// appending table to hold the data
|
|
$("#monthTable").append('<table style="width:100%" class="monthtable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + decodeHtml(lang_statistics_month) +'</td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
|
|
var labels = [];
|
|
var dataQso = [];
|
|
|
|
var $myTable = $('.monthtable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
var $row = $('<tr></tr>');
|
|
|
|
// Convert month number to string with leading zero
|
|
var monthKey = row.month.toString().padStart(2, '0');
|
|
var monthName = decodeHtml(monthNames[monthKey] || monthKey);
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(monthName);
|
|
var $content = $('<td></td>').html(row.total);
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
$.each(data, function () {
|
|
var monthKey = this.month.toString().padStart(2, '0');
|
|
var monthName = decodeHtml(monthNames[monthKey] || monthKey);
|
|
labels.push(monthName);
|
|
dataQso.push(this.total);
|
|
});
|
|
|
|
var ctx = document.getElementById("monthChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
type: 'bar',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: decodeHtml(lang_statistics_number_of_qso_worked_each_month),
|
|
data: dataQso,
|
|
backgroundColor: 'rgba(54, 162, 235, 0.2)',
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
borderWidth: 2,
|
|
color: color
|
|
}]
|
|
},
|
|
options: {
|
|
scales: {
|
|
y: {
|
|
ticks: {
|
|
beginAtZero: true,
|
|
color: color
|
|
}
|
|
},
|
|
x: {
|
|
ticks: {
|
|
color: color
|
|
}
|
|
}
|
|
},
|
|
plugins: {
|
|
legend: {
|
|
labels: {
|
|
color: color
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
});
|
|
$('.monthtable').DataTable({
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "320px",
|
|
"scrollCollapse": true,
|
|
"paging": false,
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
bFilter: false,
|
|
bInfo: false
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalModeQsos() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_mode',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
if (data.length > 0) {
|
|
$(".mode").html('');
|
|
var labels = [];
|
|
var dataQso = [];
|
|
|
|
$.each(data, function () {
|
|
labels.push(this.mode.toUpperCase());
|
|
dataQso.push(this.total);
|
|
});
|
|
|
|
if (dataQso[0] === null && dataQso[1] === null && dataQso[2] === null && dataQso[3] === null) return;
|
|
|
|
$(".mode").append('<br /><div style="display: flex;" id="modeContainer"><h2>' + lang_statistics_modes + '</h2><div style="flex: 1;"><canvas id="modeChart" width="500" height="500"></canvas></div><div style="flex: 1;" id="modeTable"></div></div><br />');
|
|
|
|
// appending table to hold the data
|
|
$("#modeTable").append('<table style="width:100%" class=\"modetable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + lang_gen_hamradio_mode + ' </td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
|
|
|
|
var $myTable = $('.modetable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
|
|
var $row = $('<tr></tr>');
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(row.mode.toUpperCase());
|
|
var $content = $('<td></td>').html(row.total);
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
const COLORS = ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"]
|
|
|
|
var ctx = document.getElementById("modeChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
type: 'pie',
|
|
plugins: [ChartPieChartOutlabels],
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: 'Number of QSO\'s worked',
|
|
data: dataQso,
|
|
backgroundColor: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"],
|
|
borderWidth: 1,
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
}]
|
|
},
|
|
|
|
options: {
|
|
layout: {
|
|
padding: 100
|
|
},
|
|
title: {
|
|
color: color,
|
|
fullSize: true,
|
|
},
|
|
responsive: false,
|
|
maintainAspectRatio: false,
|
|
plugins: {
|
|
legend: {
|
|
display: false,
|
|
labels: {
|
|
boxWidth: 15,
|
|
color: color,
|
|
font: {
|
|
size: 14,
|
|
}
|
|
},
|
|
position: 'right',
|
|
align: "middle"
|
|
},
|
|
outlabels: {
|
|
backgroundColor: COLORS,
|
|
borderColor: COLORS,
|
|
borderRadius: 2, // Border radius of Label
|
|
borderWidth: 2, // Thickness of border
|
|
color: 'white',
|
|
stretch: 45,
|
|
padding: 0,
|
|
font: {
|
|
resizable: true,
|
|
minSize: 15,
|
|
maxSize: 25,
|
|
family: Chart.defaults.font.family,
|
|
size: Chart.defaults.font.size,
|
|
style: Chart.defaults.font.style,
|
|
lineHeight: Chart.defaults.font.lineHeight,
|
|
},
|
|
zoomOutPercentage: 100,
|
|
textAlign: 'start',
|
|
backgroundColor: COLORS,
|
|
}
|
|
|
|
}
|
|
}
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalBandQsos() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_band',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
if (data.length > 0) {
|
|
$(".band").html('');
|
|
$(".band").append('<br /><div style="display: flex;" id="bandContainer"><h2>' + lang_statistics_bands + '</h2><div style="flex: 1;"><canvas id="bandChart" width="500" height="500"></canvas></div><div style="flex: 1;" id="bandTable"></div></div><br />');
|
|
|
|
// appending table to hold the data
|
|
$("#bandTable").append('<table style="width:100%" class="bandtable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + lang_gen_hamradio_band + '</td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
var labels = [];
|
|
var dataQso = [];
|
|
var totalQso = Number(0);
|
|
|
|
var $myTable = $('.bandtable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
|
|
var $row = $('<tr></tr>');
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(row.band);
|
|
var $content = $('<td></td>').html(row.count);
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
$.each(data, function () {
|
|
labels.push(this.band);
|
|
dataQso.push(this.count);
|
|
totalQso = Number(totalQso) + Number(this.count);
|
|
});
|
|
|
|
const COLORS = ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"]
|
|
var ctx = document.getElementById("bandChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
plugins: [ChartPieChartOutlabels],
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: 'Number of QSO\'s worked',
|
|
data: dataQso,
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
backgroundColor: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"],
|
|
borderWidth: 1,
|
|
}]
|
|
},
|
|
options: {
|
|
layout: {
|
|
padding: 100
|
|
},
|
|
title: {
|
|
fontColor: color,
|
|
fullSize: true,
|
|
},
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
plugins: {
|
|
legend: {
|
|
display: false,
|
|
labels: {
|
|
boxWidth: 15,
|
|
color: color,
|
|
font: {
|
|
size: 14,
|
|
}
|
|
},
|
|
position: 'right',
|
|
align: "middle"
|
|
},
|
|
outlabels: {
|
|
display: function(context) { // Hide labels with low percentage
|
|
return ((context.dataset.data[context.dataIndex] / totalQso * 100) > 1)
|
|
},
|
|
backgroundColor: COLORS,
|
|
borderColor: COLORS,
|
|
borderRadius: 2, // Border radius of Label
|
|
borderWidth: 2, // Thickness of border
|
|
color: 'white',
|
|
stretch: 10,
|
|
padding: 0,
|
|
font: {
|
|
resizable: true,
|
|
minSize: 12,
|
|
maxSize: 25,
|
|
family: Chart.defaults.font.family,
|
|
size: Chart.defaults.font.size,
|
|
style: Chart.defaults.font.style,
|
|
lineHeight: Chart.defaults.font.lineHeight,
|
|
},
|
|
zoomOutPercentage: 100,
|
|
textAlign: 'start',
|
|
backgroundColor: COLORS,
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
$('.bandtable').DataTable({
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "330px",
|
|
"scrollCollapse": true,
|
|
"paging": false,
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
bFilter: false,
|
|
bInfo: false,
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalOperatorQsos() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_operators',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
if (data.length > 0) {
|
|
$(".operators").html('');
|
|
$(".operators").append('<br /><div style="display: flex;" id="operatorContainer"><h2>' + lang_statistics_operators + '</h2><div style="flex: 1;"><canvas id="operatorChart" width="500" height="500"></canvas></div><div style="flex: 1;" id="operatorTable"></div></div><br />');
|
|
|
|
// appending table to hold the data
|
|
$("#operatorTable").append('<table style="width:100%" class="operatorTable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + lang_gen_hamradio_operator + '</td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
var labels = [];
|
|
var dataQso = [];
|
|
var totalQso = Number(0);
|
|
|
|
var $myTable = $('.operatorTable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
|
|
var $row = $('<tr></tr>');
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(row.operator);
|
|
var $content = $('<td></td>').html(row.count);
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
$.each(data, function () {
|
|
labels.push(this.operator);
|
|
dataQso.push(this.count);
|
|
totalQso = Number(totalQso) + Number(this.count);
|
|
});
|
|
|
|
const COLORS = ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"]
|
|
var ctx = document.getElementById("operatorChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
plugins: [ChartPieChartOutlabels],
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: 'Number of QSO\'s worked',
|
|
data: dataQso,
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
backgroundColor: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"],
|
|
borderWidth: 1,
|
|
}]
|
|
},
|
|
options: {
|
|
layout: {
|
|
padding: 100
|
|
},
|
|
title: {
|
|
fontColor: color,
|
|
fullSize: true,
|
|
},
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
plugins: {
|
|
legend: {
|
|
display: false,
|
|
labels: {
|
|
boxWidth: 15,
|
|
color: color,
|
|
font: {
|
|
size: 14,
|
|
}
|
|
},
|
|
position: 'right',
|
|
align: "middle"
|
|
},
|
|
outlabels: {
|
|
display: function(context) { // Hide labels with low percentage
|
|
return ((context.dataset.data[context.dataIndex] / totalQso * 100) > 1)
|
|
},
|
|
backgroundColor: COLORS,
|
|
borderColor: COLORS,
|
|
borderRadius: 2, // Border radius of Label
|
|
borderWidth: 2, // Thickness of border
|
|
color: 'white',
|
|
stretch: 10,
|
|
padding: 0,
|
|
font: {
|
|
resizable: true,
|
|
minSize: 12,
|
|
maxSize: 25,
|
|
family: Chart.defaults.font.family,
|
|
size: Chart.defaults.font.size,
|
|
style: Chart.defaults.font.style,
|
|
lineHeight: Chart.defaults.font.lineHeight,
|
|
},
|
|
zoomOutPercentage: 100,
|
|
textAlign: 'start',
|
|
backgroundColor: COLORS,
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
$('.operatorTable').DataTable({
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "400px",
|
|
"scrollCollapse": true,
|
|
"paging": false,
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
bFilter: false,
|
|
bInfo: false,
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function totalSatQsos() {
|
|
// using this to change color of legend and label according to background color
|
|
var color = ifDarkModeThemeReturn('white', 'grey');
|
|
|
|
$.ajax({
|
|
url: base_url+'index.php/statistics/get_sat',
|
|
type: 'post',
|
|
data: { dateFrom: $('#dateFrom').val(), dateTo: $('#dateTo').val() },
|
|
success: function (data) {
|
|
$(".satsummary").html('');
|
|
if (data.length > 0) {
|
|
$(".satsummary").append('<br /><div style="display: flex;" id="satContainer"><div style="flex: 1;"><canvas id="satChart" width="500" height="500"></canvas></div><div style="flex: 1;" id="satTable"></div></div><br />');
|
|
|
|
// appending table to hold the data
|
|
$("#satTable").append('<table style="width:100%" class="sattable table table-sm table-bordered table-hover table-striped table-condensed text-center"><thead>' +
|
|
'<tr>' +
|
|
'<td>#</td>' +
|
|
'<td>' + lang_gen_satellite + '</td>' +
|
|
'<td>' + lang_statistics_number_of_qso_worked + ' </td>' +
|
|
'</tr>' +
|
|
'</thead>' +
|
|
'<tbody></tbody></table>');
|
|
|
|
$('.tabs').removeAttr('hidden');
|
|
|
|
var labels = [];
|
|
var dataQso = [];
|
|
var totalQso = Number(0);
|
|
|
|
var $myTable = $('.sattable');
|
|
var i = 1;
|
|
|
|
// building the rows in the table
|
|
var rowElements = data.map(function (row) {
|
|
|
|
var $row = $('<tr></tr>');
|
|
|
|
var $iterator = $('<td></td>').html(i++);
|
|
var $type = $('<td></td>').html(row.sat);
|
|
var $content = '<td><a href="javascript:displaySatQsos(\''+row.sat+'\')">'+row.count+'</a></td>';
|
|
|
|
$row.append($iterator, $type, $content);
|
|
|
|
return $row;
|
|
});
|
|
|
|
// finally inserting the rows
|
|
$myTable.append(rowElements);
|
|
|
|
$.each(data, function () {
|
|
labels.push(this.sat);
|
|
dataQso.push(this.count);
|
|
totalQso = Number(totalQso) + Number(this.count);
|
|
});
|
|
|
|
const COLORS = ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"]
|
|
var ctx = document.getElementById("satChart").getContext('2d');
|
|
var myChart = new Chart(ctx, {
|
|
plugins: [ChartPieChartOutlabels],
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
borderColor: 'rgba(54, 162, 235, 1)',
|
|
label: 'Number of QSO\'s worked',
|
|
data: dataQso,
|
|
backgroundColor: ["#3366cc", "#dc3912", "#ff9900", "#109618", "#990099", "#0099c6", "#dd4477", "#66aa00", "#b82e2e", "#316395", "#994499"],
|
|
borderWidth: 1,
|
|
labels: labels,
|
|
}]
|
|
},
|
|
|
|
options: {
|
|
layout: {
|
|
padding: 100
|
|
},
|
|
title: {
|
|
fontColor: color,
|
|
fullSize: true,
|
|
},
|
|
responsive: false,
|
|
maintainAspectRatio: true,
|
|
plugins: {
|
|
legend: {
|
|
display: false,
|
|
labels: {
|
|
boxWidth: 15,
|
|
color: color,
|
|
font: {
|
|
size: 14,
|
|
}
|
|
},
|
|
position: 'right',
|
|
align: "middle"
|
|
},
|
|
outlabels: {
|
|
display: function(context) { // Hide labels with low percentage
|
|
return ((context.dataset.data[context.dataIndex] / totalQso * 100) > 1)
|
|
},
|
|
backgroundColor: COLORS,
|
|
borderColor: COLORS,
|
|
borderRadius: 2, // Border radius of Label
|
|
borderWidth: 2, // Thickness of border
|
|
color: 'white',
|
|
stretch: 10,
|
|
padding: 0,
|
|
font: {
|
|
resizable: true,
|
|
minSize: 12,
|
|
maxSize: 25,
|
|
family: Chart.defaults.font.family,
|
|
size: Chart.defaults.font.size,
|
|
style: Chart.defaults.font.style,
|
|
lineHeight: Chart.defaults.font.lineHeight,
|
|
},
|
|
zoomOutPercentage: 100,
|
|
textAlign: 'start',
|
|
backgroundColor: COLORS,
|
|
}
|
|
}
|
|
}
|
|
});
|
|
|
|
// using this to change color of csv-button if dark mode is chosen
|
|
var background = $('body').css("background-color");
|
|
|
|
if (background != ('rgb(255, 255, 255)')) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
|
|
$('.sattable').DataTable({
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "330px",
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
"ScrollCollapse": true,
|
|
"paging": false,
|
|
bFilter: false,
|
|
bInfo: false,
|
|
});
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
var modalloading=false;
|
|
function displaySatQsos(sat,mode) {
|
|
if (!(modalloading)) {
|
|
var ajax_data = ({
|
|
'Sat': sat,
|
|
'Mode': mode,
|
|
'dateFrom': $("#dateFrom").val(),
|
|
'dateTo': $("#dateTo").val(),
|
|
})
|
|
modalloading=true;
|
|
$.ajax({
|
|
url: base_url + 'index.php/statistics/sat_qsos_ajax',
|
|
type: 'post',
|
|
data: ajax_data,
|
|
success: function (html) {
|
|
var dialog = new BootstrapDialog({
|
|
title: lang_general_word_qso_data,
|
|
cssClass: 'qso-dialog',
|
|
size: BootstrapDialog.SIZE_WIDE,
|
|
nl2br: false,
|
|
message: html,
|
|
onshown: function(dialog) {
|
|
modalloading=false;
|
|
$('[data-bs-toggle="tooltip"]').tooltip();
|
|
$('.displaycontactstable').DataTable({
|
|
"pageLength": 25,
|
|
responsive: false,
|
|
ordering: false,
|
|
"scrollY": "550px",
|
|
"scrollCollapse": true,
|
|
"paging": false,
|
|
"scrollX": true,
|
|
"language": {
|
|
url: getDataTablesLanguageUrl(),
|
|
},
|
|
dom: 'Bfrtip',
|
|
buttons: [
|
|
'csv'
|
|
]
|
|
});
|
|
// change color of csv-button if dark mode is chosen
|
|
if (isDarkModeTheme()) {
|
|
$(".buttons-csv").css("color", "white");
|
|
}
|
|
$('.table-responsive .dropdown-toggle').off('mouseenter').on('mouseenter', function () {
|
|
showQsoActionsMenu($(this).closest('.dropdown'));
|
|
});
|
|
},
|
|
buttons: [{
|
|
label: lang_admin_close,
|
|
action: function(dialogItself) {
|
|
dialogItself.close();
|
|
}
|
|
}]
|
|
});
|
|
dialog.realize();
|
|
$("body").append(dialog.getModal());
|
|
dialog.open();
|
|
},
|
|
error: function(e) {
|
|
modalloading=false;
|
|
}
|
|
});
|
|
}
|
|
}
|