Skip to content

Instantly share code, notes, and snippets.

@tordans
Last active May 10, 2024 15:36
Show Gist options
  • Save tordans/1c2faf42844f36c83e5e62687c7569a0 to your computer and use it in GitHub Desktop.
Save tordans/1c2faf42844f36c83e5e62687c7569a0 to your computer and use it in GitHub Desktop.
iD Editor Preset Preview Experiment
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>iD Test</title>
<link rel="stylesheet" href="dist/iD.css" />
<link
rel="icon"
type="image/png"
href="data:image/png;base64,iVBORw0KGgo="
/>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta
name="apple-mobile-web-app-status-bar-style"
content="black-translucent"
/>
<style type="text/css">
/* apply document-level styling to standalone iD only */
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
/* disable elastic page bounce upon scroll */
overflow: hidden;
}
</style>
</head>
<body>
<div id="id-container"></div>
<script>
var container = document.getElementById("id-container");
var newScript = document.createElement("script");
newScript.type = "text/javascript";
newScript.onload = checkScript;
newScript.onerror = checkScript;
var isIE11 = !!(
navigator.userAgent.match(/Trident/) &&
!navigator.userAgent.match(/MSIE/)
);
newScript.src = isIE11 ? "dist/iD.legacy.js" : "dist/iD.js";
document.getElementsByTagName("head")[0].appendChild(newScript);
function checkScript() {
if (typeof iD === "undefined" || !iD.utilDetect().support) {
container.innerHTML =
"Sorry, your browser is not currently supported. Please use Potlatch 2 to edit the map.";
container.style.padding = "20px";
} else {
var context = iD
.coreContext()
.assetPath("dist/")
.apiConnections([
{
urlroot: "https://www.openstreetmap.org",
oauth_consumer_key:
"5A043yRSEugj4DJ5TljuapfnrflWDte8jTOcWLlT",
oauth_secret:
"aB3jKq1TRsCOUrfOIZ6oQMEDmv2ptV76PA54NGLL",
},
{
urlroot: "https://api06.dev.openstreetmap.org",
oauth_consumer_key:
"zwQZFivccHkLs3a8Rq5CoS412fE5aPCXDw9DZj7R",
oauth_secret:
"aMnOOCwExO2XYtRVWJ1bI9QOdqh1cay2UgpbhA6p",
},
])
.containerNode(container);
window.context = window.id = context; // for debugging
// Full list at https://cdn.jsdelivr.net/npm/@openstreetmap/id-tagging-schema@3/dist/presets.min.json
let mypresets = {
lorem: {
icon: "temaki-school",
locationSet: {
include: ["de"],
},
fields: [
"name",
"isced/levelgnis-DE",
"operator",
"operator/type",
"address",
"grades",
"website",
],
moreFields: [
"religion",
"denomination",
"capacity",
"charge_fee",
"email",
"fax",
"fee",
"gnis/feature_id-US",
"internet_access",
"internet_access/ssid",
"level",
"phone",
"polling_station",
"wheelchair",
],
geometry: ["area", "point"],
terms: ["Grundschule"],
tags: {
"isced:level": "1",
amenity: "school",
},
name: "Grundschule, Schulgelände",
},
};
iD.fileFetcher.cache().preset_presets = mypresets;
// Full list at https://cdn.jsdelivr.net/npm/@openstreetmap/id-tagging-schema@3/dist/fields.min.json
iD.fileFetcher.cache().preset_fields = {
// For some reason, it is `gnis/feature_id` in that file, but the console tells me, it is looking for `gnis/feature_id-US`
// However, both versions do not show up in the editor. I also tried moving the field in the preset to the fields (instead of moreFields), which did not help
"gnis/feature_id-US": {
key: "gnis:feature_id",
type: "identifier",
urlFormat:
"https://geonames.usgs.gov/apex/f?p=gnispq:3:::NO::P3_FID:{value}",
pattern: "^[0-9]{1,}$",
locationSet: {
include: ["us"],
},
},
// Not right away, but after clickin on my node a second time the field is visible.
// However, it does not use the label and strings-options specified here.
"isced/levelgnis-DE": {
locationSet: {
include: ["de"],
},
key: "isced:level",
type: "combo",
label: "Ebene der Bildungseinrichtung",
placeholder: "1, 2, 3,…",
strings: {
options: {
1: "Grundschule meist bis Klasse 4",
2: "Hauptschule, Real- und Oberschulen, Gesamtschule, Gymnasium bis Klasse 10",
3: "Gymnasiale Oberstufe, Berufs(fach)schulen",
"2;3": "Gymnasium, Gesamtschule mit gymnasialer Oberstufe (Klassen 5-13)",
},
},
autoSuggestions: false,
customValues: false,
},
};
context.init();
// disable boundaries (unless we have an explicit disable_features list)
var q = iD.utilStringQs(window.location.hash);
if (!q.hasOwnProperty("disable_features")) {
context.features().disable("boundaries");
}
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment