Skip to content

Commit 93cd485

Browse files
prushforthprushforth
authored
Merge branch 'master' into clientTile
2 parents 16c07f6 + 882365f commit 93cd485

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

65 files changed

+394
-87
lines changed

‎.github/actions/sync-repo/Dockerfile

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
FROM alpine
2+
3+
RUN apk update && \
4+
apk upgrade && \
5+
apk add git
6+
7+
ADD entrypoint.sh /entrypoint.sh
8+
9+
ENTRYPOINT [ "/entrypoint.sh" ]

‎.github/actions/sync-repo/action.yml

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
name: 'sync-repo'
2+
description: 'Used for pushing a copy of a folder to another repository'
3+
inputs:
4+
source_folder:
5+
description: 'Source folder from the origin directory'
6+
required: true
7+
destination_repo:
8+
description: 'Destination repository'
9+
required: true
10+
destination_folder:
11+
description: 'Directory to push the folder contents to'
12+
required: false
13+
user_email:
14+
description: 'Email for the git commit'
15+
required: true
16+
user_name:
17+
description: 'GitHub username for the commit'
18+
required: true
19+
destination_branch:
20+
description: 'branch to push folder to, defaults to master'
21+
required: false
22+
commit_msg:
23+
description: 'The commit message'
24+
required: false
25+
runs:
26+
using: 'docker'
27+
image: 'Dockerfile'
28+
args:
29+
- ${{ inputs.source_folder }}
30+
- ${{ inputs.destination_repo }}
31+
- ${{ inputs.destination_folder }}
32+
- ${{ inputs.user_email }}
33+
- ${{ inputs.user_name }}
34+
- ${{ inputs.destination_branch }}
35+
- ${{ inputs.commit_msg }}
36+
branding:
37+
icon: 'git-commit'
38+
color: 'green'

‎.github/actions/sync-repo/entrypoint.sh

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
#!/bin/sh
2+
3+
set -e
4+
set -x
5+
6+
if [ -z "$INPUT_SOURCE_FOLDER" ]
7+
then
8+
INPUT_SOURCE_FOLDER=dist
9+
fi
10+
11+
if [ -z "$INPUT_DESTINATION_BRANCH" ]
12+
then
13+
INPUT_DESTINATION_BRANCH=master
14+
fi
15+
16+
if [ -z "$INPUT_COMMIT_MSG" ]
17+
then
18+
INPUT_COMMIT_MSG="Update $INPUT_DESTINATION_FOLDER."
19+
fi
20+
21+
CLONE_DIR=$(mktemp -d)
22+
23+
echo "Cloning destination git repository"
24+
git config --global user.email "$INPUT_USER_EMAIL"
25+
git config --global user.name "$INPUT_USER_NAME"
26+
git clone --single-branch --branch $INPUT_DESTINATION_BRANCH "https://$API_TOKEN_GITHUB@github.com/$INPUT_DESTINATION_REPO.git" "$CLONE_DIR"
27+
28+
echo "Copying contents to git repo"
29+
cp -rf $INPUT_SOURCE_FOLDER/. $CLONE_DIR/$INPUT_DESTINATION_FOLDER/
30+
cd "$CLONE_DIR"
31+
32+
echo "Adding git commit"
33+
git add .
34+
if git status | grep -q "Changes to be committed"
35+
then
36+
git commit --message "$INPUT_COMMIT_MSG"
37+
echo "Pushing git commit"
38+
git push origin $INPUT_DESTINATION_BRANCH
39+
else
40+
echo "No changes detected"
41+
fi

‎.github/workflows/ci-testing.yml

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
name: Continuous Testing
2+
3+
on: [push, pull_request]
4+
5+
jobs:
6+
build:
7+
8+
runs-on: ubuntu-latest
9+
10+
steps:
11+
- uses: actions/checkout@v2
12+
- name: Use Node.js
13+
uses: actions/setup-node@v1
14+
with:
15+
node-version: '12.x'
16+
- run: npm install
17+
- run: npm install -g grunt-cli
18+
- run: grunt clean copy rollup
19+
- run: npm test
20+
env:
21+
CI: true

‎.github/workflows/sync.yml

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
name: Sync Repositories
2+
3+
on:
4+
push:
5+
branches:
6+
- master
7+
8+
jobs:
9+
build:
10+
if: github.repository == 'Maps4HTML/Web-Map-Custom-Element'
11+
runs-on: ubuntu-latest
12+
13+
steps:
14+
- uses: actions/checkout@v2
15+
- name: Use Node.js
16+
uses: actions/setup-node@v1
17+
with:
18+
node-version: '12.x'
19+
- run: npm install
20+
- run: npm install -g grunt-cli
21+
- run: grunt clean copy rollup
22+
- name: Pushes to requirements repo
23+
uses: ./.github/actions/sync-repo
24+
env:
25+
API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
26+
with:
27+
source_folder: 'dist'
28+
destination_repo: 'Maps4HTML/UCR-MapML-Matrix'
29+
destination_folder: 'dist'
30+
user_email: [email protected]
31+
user_name: 'ahmadayubi'
32+
commit_msg: 'Sync MapML Build'
33+
destination_branch: main

‎README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
# <mapml-viewer> custom element
22

33
![Build Status](https://api.travis-ci.com/Maps4HTML/Web-Map-Custom-Element.svg?branch=master)
4+
![Continuous Testing](https://github.com/Maps4HTML/Web-Map-Custom-Element/workflows/Continuous%20Testing/badge.svg)
45

56
The `<mapml-viewer>` custom element is a prototype implementation of the
67
[`<map>` media element](https://maps4html.org/MapML/spec/#web-maps)

‎debug/cbmt-test.mapml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<mapml>
1+
<mapml xmlns="https://www.w3.org/1999/xhtml/">
22
<head>
33
<title>Canada Base Map - Transportation (CBMT)</title>
44
<meta http-equiv="Content-Type" content="text/mapml;projection=CBMTILE" />

‎demo/CustomProjection.html

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width,initial-scale=1">
6+
<title>custom-projection.html</title>
7+
<script type="module" src="../dist/mapml-viewer.js"></script>
8+
<!--
9+
To define a custom projection, the user needs to supply a projection definition
10+
in a json template literal, per the customProjectionDefinition variable below.
11+
12+
It is anticipated that the format of the custom projection definition,
13+
will be something based on a future json-based schema that is agreed to
14+
as a web standard itself. There is an initiative underway to develop
15+
such a format in the OGC CRS standards working group (R. Lott, pers. comm.
16+
Jan 2021).
17+
18+
The custiom projection definition is then passed to the browser
19+
"GeoReferencing API", which in the code below is 'polyfilled' by the
20+
mapml-viewer.defineCustomProjection method. In the native version of this
21+
API, we envisage an actual global window object member method, probably
22+
not a method on the actual element (map or whatever, [which implies that
23+
the result is scoped to the element instance, which is not the intention
24+
here]). The reason we've implemented defineCustomProjection on the
25+
mapml-viewer polyfill element is so that it has access to the module-level
26+
"M" variable which is available across all instances of the element,
27+
i.e. global to the module code at least.
28+
29+
In the native implementation, we imagine that window.defineCustomProjection
30+
will define the projection globally, so that map elements,(in this case
31+
represented by the polyfill mapml-viewer, but natively tbd) will be able
32+
to use the projection attribute with the custom projection definition
33+
"projection" member value (which will be returned by the defineCustomProjection
34+
method if successful). In the polyfill below, because of the module-scoped
35+
M variable, we were forced to not use the projection attribute, but to pass
36+
the projection value to the element via the mapml-viewer.projection property,
37+
a small inconvenience.
38+
-->
39+
<script type="module">
40+
let customProjectionDefinition = `
41+
{
42+
"projection": "BNG",
43+
"proj4string" : "+proj=tmerc +lat_0=49 +lon_0=-2 +k=0.999601 +x_0=400000 +y_0=-100000 +ellps=airy +towgs84=446.448,-125.157,542.060,0.1502,0.2470,0.8421,-20.4894 +datum=OSGB36 +units=m +no_defs",
44+
"code" : "EPSG:27700",
45+
"origin" : [-238375,1376256],
46+
"resolutions" : [896,448,224,112,56,28,14,7,3.5,1.75,0.875,0.4375,0.21875,0.109375],
47+
"bounds" : [[-238375,0],[900000,1376256]],
48+
"tilesize" : 256
49+
}`;
50+
let map = document.querySelector("mapml-viewer");
51+
let cProjection = map.defineCustomProjection(customProjectionDefinition);
52+
map.projection = cProjection;
53+
</script>
54+
<style>
55+
html,
56+
body {
57+
height: 100%;
58+
}
59+
* {
60+
margin: 0;
61+
padding: 0;
62+
}
63+
64+
/* Specifying the `:defined` selector is recommended to style the map
65+
element, such that styles don't apply when fallback content is in use
66+
(e.g. when scripting is disabled or when custom/built-in elements isn't
67+
supported in the browser). */
68+
mapml-viewer:defined {
69+
/* Responsive map. */
70+
max-width: 100%;
71+
72+
/* Full viewport. */
73+
width: 100%;
74+
height: 100%;
75+
76+
/* Remove default (native-like) border. */
77+
/* border: none; */
78+
}
79+
80+
/* Pre-style to avoid FOUC of inline layer- and fallback content. */
81+
mapml-viewer:not(:defined) > * {
82+
display: none;
83+
}
84+
/* Ensure inline layer content is hidden if custom/built-in elements isn't
85+
supported, or if javascript is disabled. This needs to be defined separately
86+
from the above, because the `:not(:defined)` selector invalidates the entire
87+
declaration in browsers that do not support it. */
88+
layer- {
89+
display: none;
90+
}
91+
</style>
92+
<noscript>
93+
<style>
94+
/* Ensure fallback content (children of the map element) is displayed if
95+
custom/built-in elements is supported but javascript is disabled. */
96+
mapml-viewer:not(:defined) > :not(layer-) {
97+
display: initial;
98+
}
99+
</style>
100+
</noscript>
101+
</head>
102+
<body>
103+
<!-- when using -->
104+
<mapml-viewer zoom="4" lat="51.507222" lon="-0.1275" controls>
105+
<layer- label="OS Roads tile map in BNG custom projection" checked>
106+
<meta name="projection" content="BNG">
107+
<extent units="BNG">
108+
<input name="z" type="zoom" min="0" max="9"/>
109+
<input name="y" type="location" units="tilematrix" axis="row" />
110+
<input name="x" type="location" units="tilematrix" axis="column"/>
111+
<link rel="tile" tref="https://api.os.uk/maps/raster/v1/wmts?key=TtPU7xWvj7AmV6uePZRYWFXuKVHzRTq7&tileMatrixSet=EPSG:27700&version=1.0.0&style=default&layer=Road_27700&service=WMTS&request=GetTile&tileCol={x}&tileRow={y}&tileMatrix={z}">
112+
</extent>
113+
</layer->
114+
<!-- if these layers work, they are located near Glasgow, and demonstrate
115+
the intention that a custom projection should be unremarkable and work
116+
like its standard-defined counterparts. -->
117+
<layer- label="BNG Geology WMS as TILES on top of OS Roads map">
118+
<meta name="projection" content="BNG">
119+
<extent units="BNG">
120+
<input name="z" type="zoom" min="0" max="9"/>
121+
<input name="y" type="location" units="tilematrix" axis="row" />
122+
<input name="x" type="location" units="tilematrix" axis="column"/>
123+
<link rel="tile" tref="https://api.os.uk/maps/raster/v1/wmts?key=TtPU7xWvj7AmV6uePZRYWFXuKVHzRTq7&tileMatrixSet=EPSG:27700&version=1.0.0&style=default&layer=Road_27700&service=WMTS&request=GetTile&tileCol={x}&tileRow={y}&tileMatrix={z}">
124+
<input name="xmin" type="location" units="tilematrix" position="top-left" axis="easting" min="240755" max="261199" />
125+
<input name="ymin" type="location" units="tilematrix" position="bottom-left" axis="northing" min="628735" max="658452" />
126+
<input name="xmax" type="location" units="tilematrix" position="top-right" axis="easting" min="240755" max="261199" />
127+
<input name="ymax" type="location" units="tilematrix" position="top-left" axis="northing" min="628735" max="658452" />
128+
<input name="ixmin" type="location" units="pcrs" position="top-left" axis="easting" min="240755" max="261199" />
129+
<input name="iymin" type="location" units="pcrs" position="bottom-left" axis="northing" min="628735" max="658452" />
130+
<input name="ixmax" type="location" units="pcrs" position="top-right" axis="easting" min="240755" max="261199" />
131+
<input name="iymax" type="location" units="pcrs" position="top-left" axis="northing" min="628735" max="658452" />
132+
<link rel="tile" tref="https://map.bgs.ac.uk/arcgis/services/BGS_Detailed_Geology/MapServer/WMSServer?version=1.3.0&request=GetMap&layers=BGS.50k.Superficial.deposits&STYLES=default&format=image/png&crs=epsg:27700&BBOX={xmin},{ymin},{xmax},{ymax}&WIDTH=256&HEIGHT=256&z={z}">
133+
<!-- <link rel="tile" tref="http://ogc.bgs.ac.uk/cgi-bin/BGS_1GE_Geology/wms?version=1.3.0&request=GetMap&layers=GBR_Kilmarnock_BGS_50k_ShrinkSwell&format=image/png&crs=epsg:27700&BBOX={xmin},{ymin},{xmax},{ymax}&WIDTH=256&HEIGHT=256&z={z}">-->
134+
<input name="i" type="location" units="map" axis="i">
135+
<input name="j" type="location" units="map" axis="j">
136+
<input name="wd" type="width"/>
137+
<input name="hg" type="height"/>
138+
<link rel="query" tref="https://map.bgs.ac.uk/arcgis/services/BGS_Detailed_Geology/MapServer/WMSServer?version=1.3.0&request=GetFeatureInfo&i={i}&j={j}&radius=0&query_layers=BGS.50k.Superficial.deposits&info_format=text/html&layers=BGS.50k.Superficial.deposits&STYLES=default&format=image/png&crs=epsg:27700&BBOX={ixmin},{iymin},{ixmax},{iymax}&WIDTH={wd}&HEIGHT={hg}&z={z}">
139+
140+
</extent>
141+
142+
</layer->
143+
<layer- label="BNG WMS" >
144+
<meta name="projection" content="BNG">
145+
<meta name="extent" content="xmin=54224.000100,ymin=5192.999900,xmax=655627.000000,ymax=1220319.000000">
146+
<extent units="BNG">
147+
<input name="xmin" type="location" rel="map" position="top-left" axis="easting" units="pcrs" min="240755" max="261199" />
148+
<input name="ymin" type="location" rel="map" position="bottom-left" axis="northing" units="pcrs" min="628735" max="658452" />
149+
<input name="xmax" type="location" rel="map" position="top-right" axis="easting" units="pcrs" min="240755" max="261199" />
150+
<input name="ymax" type="location" rel="map" position="top-left" axis="northing" units="pcrs" min="628735" max="658452" />
151+
<input name="w" type="width" min="1" max="10000" />
152+
<input name="h" type="height" min="1" max="10000" />
153+
<link rel="image" tref="http://ogc.bgs.ac.uk/cgi-bin/BGS_1GE_Geology/wms?version=1.3.0&request=GetMap&layers=GBR_Kilmarnock_BGS_50k_ShrinkSwell&format=image/png&crs=epsg:27700&BBOX={xmin},{ymin},{xmax},{ymax}&WIDTH={w}&HEIGHT={h}">
154+
</extent>
155+
</layer->
156+
</mapml-viewer>
157+
</body>
158+
</html>

‎src/mapml-viewer.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -209,6 +209,7 @@ export class MapViewer extends HTMLElement {
209209
// See https://github.com/Maps4HTML/MapML-Leaflet-Client/issues/24
210210
fadeAnimation: true
211211
});
212+
this._addToHistory();
212213
// the attribution control is not optional
213214
this._attributionControl = this._map.attributionControl.setPrefix('<a href="https://www.w3.org/community/maps4html/" title="W3C Maps for HTML Community Group">Maps4HTML</a> | <a href="https://leafletjs.com" title="A JS library for interactive maps">Leaflet</a>');
214215

‎src/mapml/handlers/ContextMenu.js

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -279,7 +279,7 @@ export var ContextMenu = L.Handler.extend({
279279
_copyGCRS: function(e){
280280
let mapEl = this.options.mapEl,
281281
click = this.contextMenu._clickEvent;
282-
this.contextMenu._copyData(`z:${mapEl.zoom}, lon :${click.latlng.lng}, lat:${click.latlng.lat}`);
282+
this.contextMenu._copyData(`z:${mapEl.zoom}, lon :${click.latlng.lng.toFixed(6)}, lat:${click.latlng.lat.toFixed(6)}`);
283283
},
284284

285285
_copyTCRS: function(e){
@@ -294,7 +294,7 @@ export var ContextMenu = L.Handler.extend({
294294
click = this.contextMenu._clickEvent,
295295
point = mapEl._map.project(click.latlng),
296296
tileSize = mapEl._map.options.crs.options.crs.tile.bounds.max.x;
297-
this.contextMenu._copyData(`z:${mapEl.zoom}, column:${point.x/tileSize}, row:${point.y/tileSize}`);
297+
this.contextMenu._copyData(`z:${mapEl.zoom}, column:${Math.trunc(point.x/tileSize)}, row:${Math.trunc(point.y/tileSize)}`);
298298
},
299299

300300
_copyPCRS: function(e){
@@ -303,7 +303,7 @@ export var ContextMenu = L.Handler.extend({
303303
point = mapEl._map.project(click.latlng),
304304
scale = mapEl._map.options.crs.scale(+mapEl.zoom),
305305
pcrs = mapEl._map.options.crs.transformation.untransform(point,scale);
306-
this.contextMenu._copyData(`z:${mapEl.zoom}, easting:${pcrs.x}, northing:${pcrs.y}`);
306+
this.contextMenu._copyData(`z:${mapEl.zoom}, easting:${pcrs.x.toFixed(2)}, northing:${pcrs.y.toFixed(2)}`);
307307
},
308308

309309
_copyTile: function(e){
@@ -315,13 +315,13 @@ export var ContextMenu = L.Handler.extend({
315315
if(pointX < 0) pointX+= tileSize;
316316
if(pointY < 0) pointY+= tileSize;
317317

318-
this.contextMenu._copyData(`z:${mapEl.zoom}, i:${Math.round(pointX)}, j:${Math.round(pointY)}`);
318+
this.contextMenu._copyData(`z:${mapEl.zoom}, i:${Math.trunc(pointX)}, j:${Math.trunc(pointY)}`);
319319
},
320320

321321
_copyMap: function(e){
322322
let mapEl = this.options.mapEl,
323323
click = this.contextMenu._clickEvent;
324-
this.contextMenu._copyData(`z:${mapEl.zoom}, i:${click.containerPoint.x}, j:${click.containerPoint.y}`);
324+
this.contextMenu._copyData(`z:${mapEl.zoom}, i:${Math.trunc(click.containerPoint.x)}, j:${Math.trunc(click.containerPoint.y)}`);
325325
},
326326

327327
_copyAllCoords: function(e){
@@ -333,12 +333,12 @@ export var ContextMenu = L.Handler.extend({
333333
scale = mapEl._map.options.crs.scale(+mapEl.zoom),
334334
pcrs = mapEl._map.options.crs.transformation.untransform(point,scale);
335335
let allData = `z:${mapEl.zoom}\n`;
336-
allData += `tile: i:${Math.round(pointX)}, j:${Math.round(pointY)}\n`;
337-
allData += `tilematrix: column:${point.x/tileSize}, row:${point.y/tileSize}\n`;
338-
allData += `map: i:${click.containerPoint.x}, j:${click.containerPoint.y}\n`;
339-
allData += `tcrs: x:${point.x}, y:${point.y}\n`;
340-
allData += `pcrs: easting:${pcrs.x}, northing:${pcrs.y}\n`;
341-
allData += `gcrs: lon :${click.latlng.lng}, lat:${click.latlng.lat}`;
336+
allData += `tile: i:${Math.trunc(pointX)}, j:${Math.trunc(pointY)}\n`;
337+
allData += `tilematrix: column:${Math.trunc(point.x/tileSize)}, row:${Math.trunc(point.y/tileSize)}\n`;
338+
allData += `map: i:${Math.trunc(click.containerPoint.x)}, j:${Math.trunc(click.containerPoint.y)}\n`;
339+
allData += `tcrs: x:${Math.trunc(point.x)}, y:${Math.trunc(point.y)}\n`;
340+
allData += `pcrs: easting:${pcrs.x.toFixed(2)}, northing:${pcrs.y.toFixed(2)}\n`;
341+
allData += `gcrs: lon :${click.latlng.lng.toFixed(6)}, lat:${click.latlng.lat.toFixed(6)}`;
342342
this.contextMenu._copyData(allData);
343343
},
344344

0 commit comments

Comments
 (0)