From 0357eb40dfc57e0dd39c225f759c1fbb34dd2907 Mon Sep 17 00:00:00 2001 From: Andreas <6977712+AndreasK79@users.noreply.github.com> Date: Sun, 13 Feb 2022 18:08:55 +0100 Subject: [PATCH] [QRB Calculcator] Working version, with map and path. --- application/controllers/Qrbcalc.php | 33 ++- application/models/Qrbcalc_model | 7 - application/views/interface_assets/footer.php | 50 +++++ application/views/qrbcalc/index.php | 15 +- assets/js/leaflet/L.Maidenhead.qrb.js | 189 ++++++++++++++++++ 5 files changed, 271 insertions(+), 23 deletions(-) delete mode 100644 application/models/Qrbcalc_model create mode 100644 assets/js/leaflet/L.Maidenhead.qrb.js diff --git a/application/controllers/Qrbcalc.php b/application/controllers/Qrbcalc.php index 99668860..22911641 100644 --- a/application/controllers/Qrbcalc.php +++ b/application/controllers/Qrbcalc.php @@ -1,25 +1,40 @@ load->model('user_model'); if(!$this->user_model->authorize(2)) { $this->session->set_flashdata('notice', 'You\'re not allowed to do that!'); redirect('dashboard'); } } - public function index() - { - $data['page_title'] = "QRB Calculaltor"; + public function index() { + $data['page_title'] = "QRB Calculator"; $this->load->view('qrbcalc/index', $data); } -} + + public function calculate() { + $locator1 = $this->input->post("locator1"); + $locator2 = $this->input->post("locator2"); + + if ($this->session->userdata('user_measurement_base') == NULL) { + $measurement_base = $this->config->item('measurement_base'); + } + else { + $measurement_base = $this->session->userdata('user_measurement_base'); + } + + $this->load->library('Qra'); + + $data['result'] = $this->qra->bearing($locator1, $locator2, $measurement_base); + $data['latlng1'] = $this->qra->qra2latlong($locator1); + $data['latlng2'] = $this->qra->qra2latlong($locator2); + header('Content-Type: application/json'); + echo json_encode($data); + } +} \ No newline at end of file diff --git a/application/models/Qrbcalc_model b/application/models/Qrbcalc_model deleted file mode 100644 index ade46a6d..00000000 --- a/application/models/Qrbcalc_model +++ /dev/null @@ -1,7 +0,0 @@ - \ No newline at end of file diff --git a/application/views/interface_assets/footer.php b/application/views/interface_assets/footer.php index 439dbefa..efd10f7f 100644 --- a/application/views/interface_assets/footer.php +++ b/application/views/interface_assets/footer.php @@ -5,6 +5,8 @@ + + @@ -451,6 +453,54 @@ function spawnQrbCalculator() { }); } +function calculateQrb(form) { + $.ajax({ + url: base_url+'index.php/qrbcalc/calculate', + type: 'post', + data: {'locator1': form.locator1.value, + 'locator2': form.locator2.value}, + success: function (html) { + $(".qrbResult").append(html['result']); + newpath(html['latlng1'], html['latlng2']); + } + }); +} + +function newpath(locator1, locator2) { + // If map is already initialized + var container = L.DomUtil.get('mapqrb'); + + if(container != null){ + container._leaflet_id = null; + } + + const map = L.map('mapqrb').setView([30, 0], 1.5); + + var maidenhead = L.maidenheadqrb().addTo(map); + + L.tileLayer('https://a.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', { + maxZoom: 10, + noWrap: false, + }).addTo(map); + + const multiplelines = []; + //$.each(locs, function(){ + multiplelines.push( + new L.LatLng(locator1[0], locator1[1]), + new L.LatLng(locator2[0], locator2[1]) + ) + + //}); + + const geodesic = L.geodesic(multiplelines, { + weight: 1, + opacity: 1, + color: 'red', + wrap: false, + steps: 100 + }).addTo(map); +} + // This displays the dialog with the form and it's where the resulttable is displayed function spawnLookupModal() { $.ajax({ diff --git a/application/views/qrbcalc/index.php b/application/views/qrbcalc/index.php index 24f83d76..b2619ba8 100644 --- a/application/views/qrbcalc/index.php +++ b/application/views/qrbcalc/index.php @@ -1,25 +1,26 @@ +
-
Locator 1
-
+
-
Locator 2
-
+
-
+
- +
- \ No newline at end of file + +
+
\ No newline at end of file diff --git a/assets/js/leaflet/L.Maidenhead.qrb.js b/assets/js/leaflet/L.Maidenhead.qrb.js new file mode 100644 index 00000000..97438393 --- /dev/null +++ b/assets/js/leaflet/L.Maidenhead.qrb.js @@ -0,0 +1,189 @@ +/* + * L.Maidenhead displays a Maidenhead Locator of lines on the map. + */ + +L.MaidenheadQrb = L.LayerGroup.extend({ + + + options: { + // Line and label color + color: 'rgba(255, 0, 0, 0.4)', + + // Redraw on move or moveend + redraw: 'move' + }, + + initialize: function (options) { + L.LayerGroup.prototype.initialize.call(this); + L.Util.setOptions(this, options); + + }, + + onAdd: function (map) { + this._map = map; + var grid = this.redraw(); + this._map.on('viewreset '+ this.options.redraw, function () { + grid.redraw(); + }); + + this.eachLayer(map.addLayer, map); + }, + + onRemove: function (map) { + // remove layer listeners and elements + map.off('viewreset '+ this.options.redraw, this.map); + this.eachLayer(this.removeLayer, this); + }, + + redraw: function () { + var d3 = new Array(20, 10, 10, 1, 1, 1, 1, 1, 1, 1, 1 / 24, 1 / 24, 1 / 24, 1 / 24, 1 / 24, 1 / 240, 1 / 240, 1 / 240, 1 / 240, 1 / 240 / 24, 1 / 240 / 24); + var lat_cor = new Array(0, 8, 8, 8, 8, 1.7, 6, 8, 8, 8, 1.4, 2.5, 3, 3.5, 4, 4, 3.5, 3.5, 3, 1.8, 1.6); + var bounds = map.getBounds(); + var zoom = map.getZoom(); + var unit = d3[zoom]; + var lcor = lat_cor[zoom]; + var w = bounds.getWest(); + var e = bounds.getEast(); + var n = bounds.getNorth(); + var s = bounds.getSouth(); + if (zoom==1) {var c = 2;} else {var c = 0.1;} + if (n > 85) n = 85; + if (s < -85) s = -85; + var left = Math.floor(w/(unit*2))*(unit*2); + var right = Math.ceil(e/(unit*2))*(unit*2); + var top = Math.ceil(n/unit)*unit; + var bottom = Math.floor(s/unit)*unit; + this.eachLayer(this.removeLayer, this); + + for (var lon = left; lon < right; lon += (unit*2)) { + for (var lat = bottom; lat < top; lat += unit) { + var bounds = [[lat,lon],[lat+unit,lon+(unit*2)]]; + + if (zoom < 2 || zoom > 4) { + 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})); + } + if (zoom < 3 || zoom > 5) { + this.addLayer(L.rectangle(bounds, {className: 'grid-rectangle', color: this.options.color, weight: 1, fill:false, interactive: false})); + } + + if (zoom < 3 || zoom > 5) { + this.addLayer(this._getLabel(lon+unit-(unit/lcor),lat+(unit/2)+(unit/lcor*c))); + } + + } + } + // Added this to print fields and field name, while still showing worked/confirmed gridsquares + if (zoom < 5 && zoom > 2) { + unit = 10; + var left = Math.floor(w / (unit * 2)) * (unit * 2); + var right = Math.ceil(e / (unit * 2)) * (unit * 2); + var top = Math.ceil(n / unit) * unit; + var bottom = Math.floor(s / unit) * unit; + for (var lon = left; lon < right; lon += (unit * 2)) { + for (var lat = bottom; lat < top; lat += unit) { + var bounds = [[lat, lon], [lat + unit, lon + (unit * 2)]]; + + this.addLayer(L.rectangle(bounds, { + className: 'grid-rectangle', + color: this.options.color, + weight: 1, + fill: false, + interactive: false + })); + this.addLayer(this._getLabel2(lon + unit - (unit / lcor), lat + (unit / 2) + (unit / lcor * c))); + } + } + } + return this; + }, + + _getLabel: function(lon,lat) { + var title_size = new Array(0, 10, 14, 16, 6, 13, 14, 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 = '' + this._getLocator(lon,lat) + ''; + var myIcon = L.divIcon({className: 'my-div-icon', html: title}); + var marker = L.marker([lat,lon], {icon: myIcon}, clickable=false); + return marker; + }, + + _getLocator: function(lon,lat) { + var ydiv_arr=new Array(10, 1, 1/24, 1/240, 1/240/24); + var d1 = "ABCDEFGHIJKLMNOPQR".split(""); + var d2 = "ABCDEFGHIJKLMNOPQRSTUVWX".split(""); + var d4 = new Array(0, 1, 1, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 4, 4, 4, 4, 5, 5); + var locator = ""; + var x = lon; + var y = lat; + var precision = d4[map.getZoom()]; + while (x < -180) {x += 360;} + while (x > 180) {x -=360;} + x = x + 180; + y = y + 90; + locator = locator + d1[Math.floor(x/20)] + d1[Math.floor(y/10)]; + for (var i=0; i<4; i=i+1) { + if (precision > i+1) { + rlon = x%(ydiv_arr[i]*2); + rlat = y%(ydiv_arr[i]); + if ((i%2)==0) { + locator += Math.floor(rlon/(ydiv_arr[i+1]*2)) +""+ Math.floor(rlat/(ydiv_arr[i+1])); + } else { + locator += d2[Math.floor(rlon/(ydiv_arr[i+1]*2))] +""+ d2[Math.floor(rlat/(ydiv_arr[i+1]))]; + } + } + } + return locator; + }, + + /* + Need this for the field printing, while showing worked/confirmed grids + */ + _getLabel2: function(lon,lat) { + 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 = '' + this._getLocator2(lon,lat) + ''; + var myIcon = L.divIcon({className: 'my-div-icon', html: title}); + var marker = L.marker([lat,lon], {icon: myIcon}, clickable=false); + return marker; + }, + + /* + Need this for the field printing, while showing worked/confirmed grids + */ + _getLocator2: function(lon,lat) { + var ydiv_arr=new Array(10, 1, 1/24, 1/240, 1/240/24); + var d1 = "ABCDEFGHIJKLMNOPQR".split(""); + var d2 = "ABCDEFGHIJKLMNOPQRSTUVWX".split(""); + var d4 = new Array(0, 1, 1, 1, 1, 1, 1, 2, 2, 2, 3, 3, 3, 3, 3, 4, 4, 4, 4, 5, 5); + var locator = ""; + var x = lon; + var y = lat; + var precision = d4[map.getZoom()]; + while (x < -180) {x += 360;} + while (x > 180) {x -=360;} + x = x + 180; + y = y + 90; + locator = locator + d1[Math.floor(x/20)] + d1[Math.floor(y/10)]; + for (var i=0; i<4; i=i+1) { + if (precision > i+1) { + rlon = x%(ydiv_arr[i]*2); + rlat = y%(ydiv_arr[i]); + if ((i%2)==0) { + locator += Math.floor(rlon/(ydiv_arr[i+1]*2)) +""+ Math.floor(rlat/(ydiv_arr[i+1])); + } else { + locator += d2[Math.floor(rlon/(ydiv_arr[i+1]*2))] +""+ d2[Math.floor(rlat/(ydiv_arr[i+1]))]; + } + } + } + return locator; + }, + +}); + +L.maidenheadqrb = function (options) { + return new L.MaidenheadQrb(options); +};