Commit f85cf716 authored by Adrien Pavie's avatar Adrien Pavie

Added animated=* icons, link for editing in JOSM

parent ea294765
......@@ -80,3 +80,22 @@ header span.catch {
text-align: center;
margin-top: 5px;
}
.leaflet-popup-content p.oam-feature-details img {
margin: 5px;
}
table.feature-info {
width: 100%;
border-collapse: separate;
border-spacing: 5px;
}
table.feature-info td.label {
font-weight: bold;
width: 40%;
}
table.feature-info td.value {
text-align: right;
}
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="32" width="32" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 32 32.000001">
<path d="m0 0v32h32v-32zm3 3h26v26h-26z" fill="#808080"/>
<g transform="matrix(.84615 0 0 .84615 5.1657 16.893)">
<path d="m6.9233 10.413-1.7594 1.5313-1.3033-1.5313 1.5313-11.11h1.401l1.4336 1.6942-1.3033 9.416zm1.9223-13.456-1.9223 1.6942h-1.4336l1.3033-9.1228 1.792-1.5639 1.3033 1.5313-1.0426 7.4612zm11.143-9.4812-1.7594 1.5313h-7.7544l-1.3033-1.5313 1.7268-1.5313h7.787l1.3033 1.5313zm0.48872 11.175h-1.4336l-1.4336-1.6942 1.0426-7.4612 1.792-1.5639 1.3033 1.5639-1.2707 9.1554zm-1.6617 11.762-1.7268 1.5313-1.3358-1.5313 1.3358-9.416 1.8897-1.6942h1.401l-1.5639 11.11zm-0.42356-11.436-1.7594 1.5313h-7.8195l-1.3033-1.5313 1.7594-1.5313h7.787l1.3358 1.5313z"/>
</g>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="32" width="32" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 32 32.000001">
<path d="m0 0v32h32v-32zm3 3h26v26h-26z" fill="#808080"/>
<g transform="translate(0 -.026528)">
<path d="m21.719 14.317-1.4612 1.2957-1.1303-1.2957 1.1303-7.9674 1.4612-1.2957 1.1303 1.2957-1.1303 7.9674zm-9.98 0-1.4612 1.2957-1.1303-1.2957 0.93734-6.589 1.4887-1.2957 1.1028 1.2957-0.93734 6.589zm8.0501 1.7093-1.4887 1.2957h-6.589l-1.1303-1.2957 1.4887-1.2957h6.589l1.1303 1.2957zm0.33083 9.6767-1.4612 1.2957-1.1303-1.2957 1.1303-7.9674 1.4612-1.2957 1.1303 1.2957-1.1303 7.9674z"/>
</g>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="32" width="32" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 32 32.000001">
<defs>
<marker id="a" refY="0.0" refX="0.0" overflow="visible" orient="auto">
<path d="m5.77 0l-8.65 5v-10l8.65 5z" fill-rule="evenodd" transform="scale(.2)" stroke="#000" stroke-width="1pt"/>
</marker>
</defs>
<path style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto" d="m23.778 21.468c0 1.7824-3.5844 3.2119-8.0059 3.2119s-8.0059-1.4081-8.0059-3.2119l0.0136-16.357c0-1.8014 3.7276-3.0247 7.9925-3.0247 4.2667 1e-7 7.9928 1.3839 7.9928 3.0269z" stroke="#808080" stroke-width="3" fill="none"/>
<path marker-end="url(#a)" d="m4.1932 25.29s3.3589 4.3473 12.12 4.3473c7.7384 0 10.36-3.6693 10.36-3.6693" stroke="#000" stroke-width="2.5638" fill="none"/>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="32" width="32" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 32 32.000001">
<defs>
<radialGradient id="a" gradientUnits="userSpaceOnUse" cy="1032" cx="15.58" gradientTransform="matrix(1.1083 0 0 1.1222 -1.2685 -1142)" r="13.515">
<stop stop-color="#a832e7" offset="0"/>
<stop stop-color="#99def0" offset="1"/>
</radialGradient>
</defs>
<rect style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto" fill-rule="evenodd" height="28.995" width="28.995" stroke="#7e7e7e" y="1.5023" x="1.5023" stroke-width="3.0046" fill="url(#a)"/>
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
height="32"
width="32"
version="1.1"
viewBox="0 0 32 32.000001"
id="svg2"
inkscape:version="0.91 r13725"
sodipodi:docname="animated_trivision_blades.svg">
<metadata
id="metadata23">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
</cc:Work>
</rdf:RDF>
</metadata>
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1600"
inkscape:window-height="876"
id="namedview21"
showgrid="false"
inkscape:zoom="3.6875"
inkscape:cx="8.0239086"
inkscape:cy="9.9954789"
inkscape:window-x="1920"
inkscape:window-y="552"
inkscape:window-maximized="1"
inkscape:current-layer="svg2" />
<defs
id="defs4">
<marker
id="a"
refY="0.0"
refX="0.0"
orient="auto"
overflow="visible">
<path
d="m5.77 0l-8.65 5v-10l8.65 5z"
fill-rule="evenodd"
transform="scale(.2)"
stroke="#000"
stroke-width="1pt"
id="path7" />
</marker>
</defs>
<path
d="m0 0v32h32v-32zm3 3h26v26h-26z"
id="path9"
fill="#808080" />
<g
id="g11">
<path
style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto"
d="m16.593 6.9789-3.898-2.6851 6.467-0.2938z"
fill="#303030"
id="path13" />
<path
style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto"
d="m12.5 4.5723 3.8856 2.6803v16.435l-3.886-1.931z"
fill="#adadad"
id="path15" />
<path
style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto"
d="m19.5 4.1568-2.6529 3.0463v16.52l2.653-2.301z"
fill="#747474"
id="path17" />
</g>
<path
d="m7.3579 23.446s2.6132 3.5265 8.8408 3.5265c5.6767 0 7.2019-3.5265 7.2019-3.5265"
id="path19"
marker-end="url(#a)"
stroke-width="2.3071"
stroke="#000"
fill="none" />
</svg>
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="32" width="32" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" viewBox="0 0 32 32.000001">
<defs>
<marker id="a" refY="0.0" refX="0.0" orient="auto" overflow="visible">
<path d="m5.77 0l-8.65 5v-10l8.65 5z" fill-rule="evenodd" transform="scale(.2)" stroke="#000" stroke-width="1pt"/>
</marker>
</defs>
<path d="m0 0v32h32v-32zm3 3h26v26h-26z" fill="#808080"/>
<path style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto" d="m18.995 9.849h-1.9191c1.549 0 1.8562 1.1486 1.8562 2.0771v13.214c0 1.4403-0.76489 2.2097-1.8562 2.2097h1.9191c1.3419 0 1.8562-0.74697 1.8562-2.2097v-13.214c0-1.4464-0.56133-2.0771-1.8562-2.0771z" fill="#2c2c2c"/>
<path style="color-rendering:auto;color:#000000;isolation:auto;mix-blend-mode:normal;shape-rendering:auto;solid-color:#000000;image-rendering:auto" d="m8.977 9.849h10.607c-1.549 0-1.8562 1.1486-1.8562 2.0771v13.214c0 1.4403 0.76489 2.2097 1.8562 2.2097h-10.607c-1.3419 0-1.8562-0.74697-1.8562-2.2097v-13.214c0-1.4464 0.56133-2.0771 1.8562-2.0771z" fill="#a0a0a0"/>
<path marker-end="url(#a)" d="m23.726 25.611v-15.624c0-3.0014-2.8333-4.1838-5.2586-4.1838-2.9717 0-5.4369 1.4531-5.4369 4.7475v4.1227" stroke="#000" stroke-width="2.3071" fill="none"/>
</svg>
......@@ -90,6 +90,7 @@ class Main {
img.src = "img/"+key+"_"+value+".png";
img.title = key+" = "+value;
parentNode.appendChild(img);
return true;
}
};
......@@ -115,11 +116,43 @@ class Main {
compass.title = "direction = "+value;
compass.style.transform = "rotate("+valInt+"deg)";
parentNode.appendChild(compass);
return true;
}
}
}
};
let tagsToInfo = function(tags, bindings, parentNode) {
let hasInfo = false;
for(let i in bindings) {
if(tags[i] !== undefined) {
hasInfo = true;
break;
}
}
if(hasInfo) {
let table = document.createElement("table");
table.className = "feature-info";
for(let b in bindings) {
if(tags[b] !== undefined) {
let row = table.insertRow(0);
let cell1 = row.insertCell(0);
cell1.appendChild(document.createTextNode(bindings[b]));
cell1.className = "label";
let cell2 = row.insertCell(1);
cell2.appendChild(document.createTextNode(tags[b]));
cell2.className = "value";
}
}
parentNode.appendChild(table);
return true;
}
};
/*
* Overpass layer
*/
......@@ -129,9 +162,12 @@ class Main {
let adValsIgnored = [ "no" ];
for(let i = 0; i < data.elements.length; i++) {
//~ var pos, popupContent, popup, marker,
let e = data.elements[i];
// if(e.type == "node" && e.id == 4520653299) {
// console.log(e);
// }
if(this._ids[e.id] || !e.tags.advertising || adValsIgnored.indexOf(e.tags.advertising) >= 0) { continue; }
this._ids[e.id] = true;
......@@ -150,19 +186,38 @@ class Main {
popupContent.appendChild(title);
let details = document.createElement("p");
let detailsAdded = false;
details.className = "oam-feature-details";
tagToImg("support", e.tags.support, ["ceiling", "column", "ground", "pole", "poster_box", "wall_mounted"], details);
directionTagToImg(e.tags.direction, details);
detailsAdded = tagToImg("support", e.tags.support, ["ceiling", "column", "ground", "pole", "poster_box", "wall_mounted"], details) || detailsAdded;
detailsAdded = directionTagToImg(e.tags.direction, details) || detailsAdded;
detailsAdded = tagToImg("animated", e.tags.animated, ["digital_messages", "digital_prices", "revolving", "screen", "trivision_blades", "winding_posters"], details) || detailsAdded;
let infoTableAdded = tagsToInfo(e.tags, {"sides": "# of sides", "faces": "# of sides", "operator": "Operator", "size": "Size"}, details);
if(!infoTableAdded && detailsAdded) {
details.appendChild(document.createElement("br"));
}
let linkId = document.createElement('a');
linkId.href = 'http://www.openstreetmap.org/edit?editor=id&'+e.type+'=' + e.id;
linkId.appendChild(document.createTextNode('Edit in iD'));
details.appendChild(linkId);
details.appendChild(document.createTextNode(" or "));
let linkJosm = document.createElement('a');
linkJosm.href = '#';
linkJosm.onclick = () => {
let request = new XMLHttpRequest();
request.open('GET', 'http://127.0.0.1:8111/load_object?objects=' + e.type.substring(0,1) + e.id, true);
request.send();
};
linkJosm.appendChild(document.createTextNode('in JOSM'));
details.appendChild(linkJosm);
details.appendChild(document.createElement("br"));
let link = document.createElement('a');
link.href = 'http://www.openstreetmap.org/edit?editor=id&node=' + e.id;
link.appendChild(document.createTextNode('Edit this entry in iD'));
details.appendChild(link);
popupContent.appendChild(details);
//Define popup itself
let popup = L.popup().setContent(popupContent);
let popupOptions = (infoTableAdded) ? { minWidth: 250 } : {};
let popup = L.popup(popupOptions).setContent(popupContent);
marker.bindPopup(popup);
this._map.addLayer(marker);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment