Skip to content

Commit

Permalink
[BUILD]
Browse files Browse the repository at this point in the history
  • Loading branch information
@Viglino
Viglino committed Jun 19, 2024
1 parent f5e7a09 commit a893c9f
Show file tree
Hide file tree
Showing 4 changed files with 185 additions and 20 deletions.
37 changes: 27 additions & 10 deletions dist/ol-ext.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4037,13 +4037,16 @@ ul.ol-legend li div {
}

/* GPS */
.ol-searchgps input.search {
.ol-searchgps input.search,
.ol-searchcoord input.search {
display: none;
}
.ol-control.ol-searchgps > button:first-child {
.ol-control.ol-searchgps > button:first-child,
.ol-control.ol-searchcoord > button:first-child {
background-image: none;
}
.ol-control.ol-searchgps > button:first-child:before {
.ol-control.ol-searchgps > button:first-child:before,
.ol-control.ol-searchcoord > button:first-child:before {
content: "x/y";
position: unset;
display: block;
Expand All @@ -4054,15 +4057,20 @@ ul.ol-legend li div {
width: auto;
height: auto;
}
.ol-control.ol-searchgps > button:first-child:after {
.ol-control.ol-searchgps > button:first-child:after,
.ol-control.ol-searchcoord > button:first-child:after {
content: unset;
}
.ol-control.ol-searchgps .ol-latitude,
.ol-control.ol-searchgps .ol-longitude {
.ol-control.ol-searchgps .ol-longitude,
.ol-control.ol-searchcoord .ol-latitude,
.ol-control.ol-searchcoord .ol-longitude {
clear: both;
}
.ol-control.ol-searchgps .ol-latitude label,
.ol-control.ol-searchgps .ol-longitude label {
.ol-control.ol-searchgps .ol-longitude label,
.ol-control.ol-searchcoord .ol-latitude label,
.ol-control.ol-searchcoord .ol-longitude label {
width: 5.5em;
display: inline-block;
text-align: right;
Expand All @@ -4072,6 +4080,11 @@ ul.ol-legend li div {
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.ol-control.ol-searchcoord .ol-latitude label,
.ol-control.ol-searchcoord .ol-longitude label {
width: 2em;
margin: 0;
}
.ol-control.ol-searchgps .ol-latitude input,
.ol-control.ol-searchgps .ol-longitude input {
max-width: 10em;
Expand Down Expand Up @@ -4102,17 +4115,20 @@ ul.ol-legend li div {
width: .5em;
text-align: left;
}
.ol-searchgps.ol-control.ol-collapsed button.ol-geoloc {
.ol-searchgps.ol-control.ol-collapsed button.ol-geoloc,
.ol-searchcoord.ol-control.ol-collapsed button.ol-geoloc {
display: none;
}
.ol-searchgps button.ol-geoloc {
.ol-searchgps button.ol-geoloc,
.ol-searchcoord button.ol-geoloc {
top: 0;
float: right;
margin-right: 3px;
background-image: none;
position: relative;
}
.ol-searchgps button.ol-geoloc:before {
.ol-searchgps button.ol-geoloc:before,
.ol-searchcoord button.ol-geoloc:before {
content:"";
position: absolute;
left: 50%;
Expand All @@ -4124,7 +4140,8 @@ ul.ol-legend li div {
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
.ol-searchgps button.ol-geoloc:after {
.ol-searchgps button.ol-geoloc:after,
.ol-searchcoord button.ol-geoloc:after {
content:"";
position: absolute;
left: 50%;
Expand Down
164 changes: 156 additions & 8 deletions dist/ol-ext.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15562,6 +15562,154 @@ ol.control.SearchBAN = class olcontrolSearchBAN extends ol.control.SearchPhoton
}
}

/* Copyright (c) 2019 Jean-Marc VIGLINO,
released under the CeCILL-B license (French BSD license)
(http://www.cecill.info/licences/Licence_CeCILL-B_V1-en.txt).
*/
/**
* Search on GPS coordinate.
*
* @constructor
* @extends {ol.control.Search}
* @fires select
* @param {Object=} Control options.
* @param {ol/proj/ProjectionLike} options.projection
* @param {string} [options.className] control class name
* @param {Element | string | undefined} [options.target] Specify a target if you want the control to be rendered outside of the map's viewport.
* @param {string | undefined} [options.label="search"] Text label to use for the search button, default "search"
* @param {string | undefined} [options.labelGPS="Locate with GPS"] placeholder, default "Locate with GPS"
* @param {number | undefined} [options.typing=300] a delay on each typing to start searching (ms), default 300.
* @param {integer | undefined} [options.minLength=1] minimum length to start searching, default 1
* @param {integer | undefined} [options.maxItems=10] maximum number of items to display in the autocomplete list, default 10
*/
ol.control.SearchCoordinates = class olcontrolSearchCoordinates extends ol.control.Search {
constructor(options) {
options = options || {};
options.className = (options.className || '') + ' ol-searchcoord';
options.placeholder = options.placeholder || 'x,y';
super(options);
// Projection
this.projection_ = options.projection || 'EPSG:3857'
// Geolocation
this.geolocation = new ol.Geolocation({
projection: "EPSG:4326",
trackingOptions: {
maximumAge: 10000,
enableHighAccuracy: true,
timeout: 600000
}
});
ol.ext.element.create('BUTTON', {
className: 'ol-geoloc',
title: options.labelGPS || 'Locate with GPS',
parent: this.element,
click: function () {
this.geolocation.setTracking(true);
}.bind(this)
});
this._createForm();
// Move list to the end
var ul = this.element.querySelector("ul.autocomplete");
this.element.appendChild(ul);
}
/** Set the projection
*
*/
setProjection(proj) {
if (this.projection_ !== proj) {
this.projection_ = proj;
this.clearHistory();
this.element.querySelectorAll('INPUT[type="number"]').forEach(function(i) {
i.value = '';
})
}
}
/** Create input form
* @private
*/
_createForm() {
// Value has change
var onchange = function (e) {
if (lon.value || lat.value) {
this._input.value = lon.value + ',' + lat.value;
} else {
this._input.value = '';
}
// Center on coords
this.search();
}.bind(this);
function createInput(className) {
var input = ol.ext.element.create('INPUT', {
className: className,
type: 'number',
step: 'any',
lang: 'en',
parent: div,
on: {
'change keyup': onchange
}
});
return input;
}
// X
var div = ol.ext.element.create('DIV', {
className: 'ol-longitude',
parent: this.element
});
ol.ext.element.create('LABEL', {
html: 'X',
parent: div
});
var lon = createInput('ol-decimal');
// Y
div = ol.ext.element.create('DIV', {
className: 'ol-latitude',
parent: this.element
});
ol.ext.element.create('LABEL', {
html: 'Y',
parent: div
});
var lat = createInput('ol-decimal');
// Focus on open
if (this.button) {
this.button.addEventListener("click", function () {
lon.focus();
});
}
// Change value on click
this.on('select', function (e) {
lon.value = e.search.gps[0];
lat.value = e.search.gps[1];
}.bind(this));
// Change value on geolocation
this.geolocation.on('change', function () {
this.geolocation.setTracking(false);
var coord = this.geolocation.getPosition();
coord = ol.proj.transform(coord, 'EPSG:4326', this.projection_)
console.log(coord)
lon.value = coord[0];
lat.value = coord[1];
this._triggerCustomEvent('keyup', lon);
}.bind(this));
}
/** Autocomplete function
* @param {string} s search string
* @return {Array<any>|false} an array of search solutions
* @api
*/
autocomplete(s) {
var result = [];
var c = s.split(',');
c[0] = Number(c[0]);
c[1] = Number(c[1]);
//
var coord = ol.proj.transform([c[0], c[1]], this.projection_, this.getMap().getView().getProjection());
result.push({ gps: c, coordinate: coord, name: s });
return result;
}
}

/* Copyright (c) 2017 Jean-Marc VIGLINO,
released under the CeCILL-B license (French BSD license)
(http://www.cecill.info/licences/Licence_CeCILL-B_V1-en.txt).
Expand Down Expand Up @@ -15760,13 +15908,13 @@ ol.control.SearchFeature = class olcontrolSearchFeature extends ol.control.Searc
* @extends {ol.control.Search}
* @fires select
* @param {Object=} Control options.
* @param {string} options.className control class name
* @param {Element | string | undefined} options.target Specify a target if you want the control to be rendered outside of the map's viewport.
* @param {string | undefined} options.label Text label to use for the search button, default "search"
* @param {string | undefined} options.placeholder placeholder, default "Search..."
* @param {number | undefined} options.typing a delay on each typing to start searching (ms), default 300.
* @param {integer | undefined} options.minLength minimum length to start searching, default 1
* @param {integer | undefined} options.maxItems maximum number of items to display in the autocomplete list, default 10
* @param {string} [options.className] control class name
* @param {Element | string | undefined} [options.target] Specify a target if you want the control to be rendered outside of the map's viewport.
* @param {string | undefined} [options.label=search] Text label to use for the search button, default "search"
* @param {string | undefined} [options.labelGPS="Locate with GPS"] placeholder, default "Locate with GPS"
* @param {number | undefined} [options.typing=300] a delay on each typing to start searching (ms), default 300.
* @param {integer | undefined} [options.minLength=1] minimum length to start searching, default 1
* @param {integer | undefined} [options.maxItems=10] maximum number of items to display in the autocomplete list, default 10
*/
ol.control.SearchGPS = class olcontrolSearchGPS extends ol.control.Search {
constructor(options) {
Expand All @@ -15785,7 +15933,7 @@ ol.control.SearchGPS = class olcontrolSearchGPS extends ol.control.Search {
});
ol.ext.element.create('BUTTON', {
className: 'ol-geoloc',
title: 'Locate with GPS',
title: options.labelGPS || 'Locate with GPS',
parent: this.element,
click: function () {
this.geolocation.setTracking(true);
Expand Down
2 changes: 1 addition & 1 deletion dist/ol-ext.min.css
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/ol-ext.min.js
View file

Large diffs are not rendered by default.

0 comments on commit a893c9f

Please sign in to comment.