Skip to content

Commit

Permalink
Merge pull request #7 from osmus/zlw-static
Browse files Browse the repository at this point in the history 
Import contents of static tileserver site
  • Loading branch information
@quincylvania
quincylvania authored Jul 8, 2024
2 parents 061cb5d + 0f70a77 commit 25a0792
Show file tree
Hide file tree
Showing 14 changed files with 503 additions and 0 deletions.
26 changes: 26 additions & 0 deletions .github/workflows/deploy-tileserver.yml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
name: Deploy Tile Server Static Site
on:
push:
branches:
- main
workflow_dispatch:
permissions:
contents: read
id-token: write
jobs:
deploy-preview:
runs-on: ubuntu-latest
if: >
github.event.workflow_run.event == 'pull_request' &&
github.event.workflow_run.conclusion == 'success'
steps:
- name: Deploy via S3
uses: jakejarvis/s3-sync-action@master
with:
args: --acl public-read --follow-symlinks --delete --exclude '.git/*' --exclude '.github/*'
env:
AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
AWS_REGION: ${{ secrets.AWS_REGION }}
SOURCE_DIR: "./dist"
1 change: 1 addition & 0 deletions static/data/v3.json
View file

Large diffs are not rendered by default.

Binary file added static/favicon.ico
View file
Binary file not shown.
210 changes: 210 additions & 0 deletions static/index.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,210 @@
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Regular.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Italic.ttf');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'OpenSans';
src: url('/fonts/OpenSans-Bold.ttf');
font-weight: bold;
font-style: normal;
}

body{
background-color: #fff;
color: #212121;
font-family:'OpenSans', sans-serif, Arial;
font-size: 14px;
margin:0;
background-repeat:no-repeat !important;
background-size: contain !important;
background-image: url(/images/header-map-1280px.png);
}
a{
color: #499DCE;
transition: color .2s;
}
a:hover {
color: #395D73;
}
.title {
font-weight: bold;
font-size: 32px;
text-align:center;
margin:20px 0 0 0;
position:relative;
}
.title.light:after {
content: "light";
display: block;
position: absolute;
left: 50%;
bottom: -5px;
color: #499DCE;
font-size:.8em;
}
section {
margin: 15px auto;
width: 930px;
padding: 30px 0;
}
.title img {
width: 290px;
}
.subtitle {
font-size: 20px;
font-style: italic;
font-weight:normal;
text-align:center;
margin:10px 0 10px 0;
}
.box-header {
text-align:left;
text-transform:uppercase;
border:1px solid #ededed;
margin:25px 0 0 0;
padding:12px 30px;
font-size:20px;
background:#fff;
}
.item {
background:#fff;
height: 191px;
border: 1px solid #ededed;
border-top:none;
}
.item:nth-child(odd) {
background-color:#fbfbfb;
}
.item img {
position: absolute;
display: block;
margin: 30px;
width: 128px;
height: 128px;
border: 1px solid #ccc;
}
.icon img {
position: relative;
width: 16px;
height: 16px;
display: inline;
margin: 0 3px -3px 0;
border: 0;
padding: 0;
}
.details {
float:left;
height: 128px;
padding: 20px 30px 20px 188px;
}
.details h3 {
font-size:18px;
margin-top: 25px;
}
.details p {
padding:0;
margin:18px 0;
}
.viewers {
float:right;
text-align:center;
width: 120px;
margin-top: 25px;
padding-right: 30px;
}
.btn {
display:block;
margin: 0;
line-height: 36px;
}
.btn:first-child {
position: relative;
padding: 0;
overflow: hidden;
border-radius:4px;
background-color: #499DCE;
background: linear-gradient(90deg, #5aaad8, #4a9ecf);
color: #fff;
text-decoration: none;
font-weight: bold;
}
.btn:first-child:hover {
background: #395D73;
}
footer {
width:100%;
border-top:1px solid #ededed;
text-align:center;
color:#b3b3b3;
padding-top:10px;
font-size:12px;
}
footer img {
width: 113px;
height: 31px;
}
footer .t {
display:none;
}
footer p {
margin-top:0;
}
footer a {
text-decoration: none;
}
.details h3, .identifier {
max-width: 550px;
word-break: break-all;
}

/* Responsive */
@media (max-width: 950px) {
section{
margin: 0;
width: 96%;
padding: 2%;
}
}
@media (max-width: 600px) {
.title{
margin: 25px 0 0 0;
}
.title.light:after {
font-size:.6em;
}
.title img {
width: 200px;
}
.subtitle {
font-size: 20px;
margin: 0 0 35px 0;
}
.item {
height: 245px;
}
.viewers {
float: left;
text-align: left;
width: 100%;
margin-left: 30px;
margin-top: 15px;
}
.viewers a {
display: inline-block;
vertical-align: middle;
}
.btn {
margin: 0 20px 0 0;
}
.btn:first-child {
padding: 0 20px;
}
}
59 changes: 59 additions & 0 deletions static/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>OpenMapTiles Community Vector Tile Server</title>
<link rel="stylesheet" type="text/css" href="index.css" />
<link rel="alternate" type="application/rss+xml" title="Build status" href="rss.xml" />
<script>
function toggle_xyz(id) {
var el = document.getElementById(id);
var s = el.style;
s.display = s.display == 'none' ? 'inline-block' : 'none';
el.setSelectionRange(0, el.value.length);
return false;
}
</script>
</head>
<body>
<section>
<h1 class="title">
<a href="https://github.com/ZeLonewolf/openstreetmap-americana"><img src="osm-americana-logo.png" alt="OSM Americana Logo" /></a><br/>
Community Vector Tile Server
</h1>
<h2 class="subtitle">Part of the OSM Americana project</h2>
<div style="text-align:center; margin-bottom:70px"><a href="usage.html">Usage policy and CORS white list</a></div>
<h2 class="box-header">OpenMapTiles</h2>
<div class="box">
<div class="item">
<img src="openmaptiles-logo.png" alt=" preview" />
<div class="details">
<h3></h3>
<p class="identifier">OpenMapTiles vector tiles as used by OSM Americana.
<br>Rendered on servers provided by <a href="https://openstreetmap.us/">OSMUS</a>.
<br>Zoom 13 building merge is disabled, additional languages from <a href="https://wikidata.org/">Wikidata</a>.
<br>Schema <a href="https://openmaptiles.org/">&copy; OpenMapTiles</a>, map data <a href="https://openstreetmap.org/copyright">&copy; OpenStreetMap contributors</a>.</p>
<p class="services">
services: <a href="https://dwuxtsziek7cf.cloudfront.net/planet.json">TileJSON</a> | <a href="rss.xml" class="icon"><img src="rss.png" description="RSS icon" />Build Status</a>
</p>
</div>
<div class="viewers">
<a class="btn" href="/inspect.html">Inspect</a>
</div>
</div>
</div>
</section>
<footer>
<p>
Rendering by <a href="https://github.com/onthegomap/planetiler" target="_blank">Planetiler</a>, an open-source product by <a href="https://twitter.com/msb5014" target="_blank">Mike Barry</a>.
</p>
<p>
Tiles are stored in <a href="https://protomaps.com/docs/pmtiles" target="_blank">PMTiles</a> format, a vector tile format for server-less hosting, by <a href="https://protomaps.com/" target="_blank">Protomaps</a> creator <a href="https://twitter.com/bdon" target="_blank">Brandon Liu</a>.
</p>
<p>
This page is derived from <a href="https://github.com/maptiler/tileserver-gl" target="_blank">TileServer GL (tileserver-gl-light v4.4.0)</a> – an open-source project from <a href="https://www.maptiler.com/" target="_blank">MapTiler</a>.
</p>
</footer>
</body>
</html>
62 changes: 62 additions & 0 deletions static/inspect.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Raw Vector Tile Data View</title>
<link rel="stylesheet" type="text/css" href="/maplibre-gl.css" />
<link rel="stylesheet" type="text/css" href="/maplibre-gl-inspect.css" />
<script>if (typeof Symbol !== 'undefined') { document.write('<script src="https://unpkg.com/maplibre-gl@latest/dist/maplibre-gl.js"><\/script>'); } else { document.write('<script src="/maplibre-gl-compat.js"><\/script>'); }</script>
<script>if (typeof Symbol !== 'undefined') { document.write('<script src="https://github.com/acalcutt/maplibre-gl-inspect/releases/download/v1.4.6/maplibre-gl-inspect.min.js"><\/script>'); } else { document.write('<script src="/maplibre-gl-inspect-compat.min.js"><\/script>'); }</script>
<style>
body {background:#fff;color:#333;font-family:Arial, sans-serif;}
#map {position:absolute;top:0;left:0;right:250px;bottom:0;}
h1 {position:absolute;top:5px;right:0;width:240px;margin:0;line-height:20px;font-size:20px;}
#layerList {position:absolute;top:35px;right:0;bottom:0;width:240px;overflow:auto;}
#layerList div div {width:15px;height:15px;display:inline-block;}
</style>
</head>
<body>
<h1></h1>
<div id="map"></div>
<div id="layerList"></div>
<pre id="propertyList"></pre>
<script>
var map = new maplibregl.Map({
container: 'map',
hash: true,
maplibreLogo: true,
style: {
version: 8,
sources: {
'vector_layer_': {
type: 'vector',
url: 'https://dwuxtsziek7cf.cloudfront.net/planet.json'
}
},
layers: []
}
});
map.addControl(new maplibregl.NavigationControl());
var inspect = new MaplibreInspect({
showInspectMap: true,
showInspectButton: false
});
map.addControl(inspect);
map.on('styledata', function() {
var layerList = document.getElementById('layerList');
layerList.innerHTML = '';
Object.keys(inspect.sources).forEach(function(sourceId) {
var layerIds = inspect.sources[sourceId];
layerIds.forEach(function(layerId) {
var item = document.createElement('div');
item.innerHTML = '<div style="' +
'background:' + inspect.assignLayerColor(layerId) + ';' +
'"></div> ' + layerId;
layerList.appendChild(item);
});
})
});
</script>
</body>
</html>
45 changes: 45 additions & 0 deletions static/maplibre-gl-compat.js
View file

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions static/maplibre-gl-inspect-compat.min.js
View file

Large diffs are not rendered by default.

Loading

0 comments on commit 25a0792

Please sign in to comment.