mirror of
https://github.com/wavelog/wavelog.git
synced 2026-03-22 10:24:14 +00:00
Fix colors in visitor map
This commit is contained in:
@@ -44,8 +44,8 @@ class Gridmap extends CI_Controller {
|
||||
$footerData = [];
|
||||
$footerData['scripts'] = [
|
||||
'assets/js/leaflet/geocoding.js',
|
||||
'assets/js/leaflet/L.MaidenheadColouredGridMap.js',
|
||||
'assets/js/sections/gridmap.js?',
|
||||
'assets/js/leaflet/L.MaidenheadColouredGridMap.js',
|
||||
'assets/js/sections/itumap_geojson.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/sections/itumap_geojson.js")),
|
||||
'assets/js/sections/cqmap_geojson.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/sections/cqmap_geojson.js")),
|
||||
'assets/js/bootstrap-multiselect.js?' . filemtime(realpath(__DIR__ . "/../../assets/js/bootstrap-multiselect.js")),
|
||||
|
||||
@@ -93,8 +93,8 @@ if ($lang_code != 'en' && !file_exists(FCPATH . "assets/json/datatables_language
|
||||
|
||||
<?php if ($this->uri->segment(2) == "satellites") { ?>
|
||||
|
||||
<script type="text/javascript" src="<?php echo base_url();?>assets/js/leaflet/L.MaidenheadColoured.js"></script>
|
||||
<script type="text/javascript" src="<?php echo base_url();?>assets/js/sections/gridmap.js?"></script>
|
||||
<script type="text/javascript" src="<?php echo base_url();?>assets/js/leaflet/L.MaidenheadColoured.js"></script>
|
||||
|
||||
<script>
|
||||
|
||||
|
||||
@@ -4,9 +4,16 @@
|
||||
|
||||
L.Maidenhead = L.LayerGroup.extend({
|
||||
|
||||
|
||||
options: {
|
||||
// Line and label color
|
||||
workedColor: user_map_custom?.qso?.color
|
||||
? hexToRgba(user_map_custom.qso.color, 0.5)
|
||||
: 'rgba(255, 0, 0, 0.4)',
|
||||
|
||||
confirmedColor: user_map_custom?.qsoconfirm?.color
|
||||
? hexToRgba(user_map_custom.qsoconfirm.color, 0.5)
|
||||
: 'rgba(144,238,144, 0.5)',
|
||||
|
||||
color: 'rgba(255, 0, 0, 0.4)',
|
||||
|
||||
// Redraw on move or moveend
|
||||
@@ -69,10 +76,10 @@ L.Maidenhead = L.LayerGroup.extend({
|
||||
if(grid_two.includes(locator) || grid_four.includes(locator) || grid_six.includes(locator)) {
|
||||
|
||||
if(grid_two_confirmed.includes(locator) || grid_four_confirmed.includes(locator) || grid_six_confirmed.includes(locator)) {
|
||||
var rectConfirmed = L.rectangle(bounds, {className: 'grid-rectangle grid-confirmed', color: 'rgba(144,238,144, 0.6)', weight: 1, fillOpacity: 1, fill:true, interactive: false});
|
||||
var rectConfirmed = L.rectangle(bounds, {className: 'grid-rectangle grid-confirmed', color: this.options.confirmedColor, weight: 1, fillOpacity: 1, fill:true, interactive: false});
|
||||
this.addLayer(rectConfirmed);
|
||||
} else {
|
||||
var rectWorked = L.rectangle(bounds, {className: 'grid-rectangle grid-worked', color: this.options.color, weight: 1, fillOpacity: 1, fill:true, interactive: false})
|
||||
var rectWorked = L.rectangle(bounds, {className: 'grid-rectangle grid-worked', color: this.options.workedColor, weight: 1, fillOpacity: 1, fill:true, interactive: false})
|
||||
this.addLayer(rectWorked);
|
||||
}
|
||||
// Controls text on grid on various zoom levels
|
||||
@@ -80,11 +87,11 @@ L.Maidenhead = L.LayerGroup.extend({
|
||||
this.addLayer(this._getLabel(lon+unit-(unit/lcor),lat+(unit/2)+(unit/lcor*c)));
|
||||
}
|
||||
if (zoom < 3 ) {
|
||||
this.addLayer(L.rectangle(bounds, {className: 'grid-rectangle', color: this.options.color, weight: 1, fill:false, interactive: false}));
|
||||
this.addLayer(L.rectangle(bounds, {className: 'grid-rectangle', color: this.options.workedColor, weight: 1, fill:false, interactive: false}));
|
||||
}
|
||||
} else {
|
||||
if (zoom < 3 || zoom > 5) {
|
||||
this.addLayer(L.rectangle(bounds, {className: 'grid-rectangle', color: this.options.color, weight: 1, fill:false, interactive: false}));
|
||||
this.addLayer(L.rectangle(bounds, {className: 'grid-rectangle', color: this.options.workedColor, weight: 1, fill:false, interactive: false}));
|
||||
}
|
||||
}
|
||||
if (zoom < 3 || zoom > 5) {
|
||||
@@ -106,7 +113,7 @@ L.Maidenhead = L.LayerGroup.extend({
|
||||
|
||||
this.addLayer(L.rectangle(bounds, {
|
||||
className: 'grid-rectangle',
|
||||
color: this.options.color,
|
||||
color: this.options.workedColor,
|
||||
weight: 1,
|
||||
fill: false,
|
||||
interactive: false
|
||||
@@ -125,7 +132,7 @@ L.Maidenhead = L.LayerGroup.extend({
|
||||
var title = '';
|
||||
var locator = this._getLocator(lon,lat);
|
||||
if (zoom != 4 && zoom != 3) {
|
||||
title = '<span class="grid-text" style="cursor: default;"><font style="color:'+this.options.color+'; font-size:'+size+'; font-weight: 900; ">' + locator + '</font></span>';
|
||||
title = '<span class="grid-text" style="cursor: default;"><font style="color:'+this.options.workedColor+'; font-size:'+size+'; font-weight: 900; ">' + locator + '</font></span>';
|
||||
}
|
||||
var myIcon = L.divIcon({className: 'my-div-icon', html: title});
|
||||
var marker = L.marker([lat,lon], {icon: myIcon}, clickable=false);
|
||||
@@ -175,7 +182,7 @@ L.Maidenhead = L.LayerGroup.extend({
|
||||
var title_size = new Array(0, 10, 12, 16, 20, 26, 26, 16, 24, 36, 12, 14, 20, 36, 60, 12, 20, 36, 60, 12, 24);
|
||||
var zoom = map.getZoom();
|
||||
var size = title_size[zoom]+'px';
|
||||
var title = '<span class="grid-text" style="cursor: default;"><font style="color:'+this.options.color+'; font-size:'+size+'; font-weight: 900; ">' + this._getLocator2(lon,lat) + '</font></span>';
|
||||
var title = '<span class="grid-text" style="cursor: default;"><font style="color:'+this.options.workedColor+'; font-size:'+size+'; font-weight: 900; ">' + this._getLocator2(lon,lat) + '</font></span>';
|
||||
var myIcon = L.divIcon({className: 'my-div-icon', html: title});
|
||||
var marker = L.marker([lat,lon], {icon: myIcon}, clickable=false);
|
||||
return marker;
|
||||
|
||||
@@ -1377,24 +1377,6 @@ function showToast(title, text, type = 'bg-success text-white', delay = 3000) {
|
||||
toastEl.addEventListener('hidden.bs.toast', () => toastEl.remove());
|
||||
}
|
||||
|
||||
function hexToRgba(hex, alpha = 1) {
|
||||
if (!hex) return null;
|
||||
// Remove the leading "#"
|
||||
hex = hex.replace(/^#/, '');
|
||||
|
||||
// Expand short form (#f0a → #ff00aa)
|
||||
if (hex.length === 3) {
|
||||
hex = hex.split('').map(c => c + c).join('');
|
||||
}
|
||||
|
||||
const num = parseInt(hex, 16);
|
||||
const r = (num >> 16) & 255;
|
||||
const g = (num >> 8) & 255;
|
||||
const b = num & 255;
|
||||
|
||||
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Cookie Management Utilities
|
||||
*/
|
||||
|
||||
@@ -304,6 +304,24 @@ function hideLegend() {
|
||||
$("#gridmapLegend").hide();
|
||||
}
|
||||
|
||||
function hexToRgba(hex, alpha = 1) {
|
||||
if (!hex) return null;
|
||||
// Remove the leading "#"
|
||||
hex = hex.replace(/^#/, '');
|
||||
|
||||
// Expand short form (#f0a → #ff00aa)
|
||||
if (hex.length === 3) {
|
||||
hex = hex.split('').map(c => c + c).join('');
|
||||
}
|
||||
|
||||
const num = parseInt(hex, 16);
|
||||
const r = (num >> 16) & 255;
|
||||
const g = (num >> 8) & 255;
|
||||
const b = num & 255;
|
||||
|
||||
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
||||
}
|
||||
|
||||
$(document).ready(function(){
|
||||
gridPlot(this.form, visitor);
|
||||
$(window).resize(function () {
|
||||
|
||||
Reference in New Issue
Block a user