Home Explore Help
Sign In
patrick
/
osmfixer
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

changes

Patrick Brosi 4 years ago
parent
3f5fe9de50
commit
aa09a79e20
2 changed files with 55 additions and 12 deletions
Split View Show Diff Stats
  1. 5 0
      web/index.html
  2. 50 12
      web/script.js

+ 5 - 0
web/index.html
View File 

@@ -135,6 +135,11 @@
135 135 
     font-weight: bold;
136 136 
 }
137 137
138 
+.grouplink {
139 
+    cursor: pointer;
140 
+    text-decoration: underline
141 
+}
142 
+
138 143 
     </style>
139 144 
 </head>
140 145 
 <body>

+ 50 - 12
web/script.js
View File 

@@ -31,8 +31,8 @@ function marker(stat, z) {
31 31 
 }
32 32
33 33 
 function poly(group, z) {
34 
-    if (group.new) return L.polygon(group.poly, {color: "blue", smoothFactor : 0.4})
35 
-    return L.polygon(group.poly, {color: '#85f385', smoothFactor : 1})
34 
+    if (group.new) return L.polygon(group.poly, {color: "blue", smoothFactor : 0.4, fillOpacity:0.2})
35 
+    return L.polygon(group.poly, {color: '#85f385', smoothFactor : 1, fillOpacity:0.2})
36 36 
 }
37 37
38 38 
 function sugArr(sug, z) {
 
@@ -54,9 +54,9 @@ function renderStat(stat, ll) {
54 54 
     suggD.setAttribute("id", "sugg")
55 55
56 56 
     if (stat.attrs.name) {
57 
-        content.innerHTML = "OSM node <a target='_blank' href='https://www.openstreetmap.org/node/" + stat.osmid + "'>" + stat.osmid + "</a><br>(<b>" + stat.attrs.name + "</b>)";
57 
+        content.innerHTML = "Node <a onmouseover='nodeHl( " + stat.id + ")' onmouseout='nodeUnHl( " + stat.id + ")' target='_blank' href='https://www.openstreetmap.org/node/" + stat.osmid + "'>" + stat.osmid + "</a> (<b>\"" + stat.attrs.name + "\"</b>)";
58 58 
     } else {
59 
-        content.innerHTML = "OSM node <a target='_blank' href='https://www.openstreetmap.org/node/" + stat.osmid + "'>" + stat.osmid + "</a>";
59 
+        content.innerHTML = "Node <a onmouseover='nodeHl( " + stat.id + ")' onmouseout='nodeUnHl( " + stat.id + ")' target='_blank' href='https://www.openstreetmap.org/node/" + stat.osmid + "'>" + stat.osmid + "</a>";
60 60 
     }
61 61
62 62 
     content.appendChild(attrTbl);
 
@@ -85,7 +85,7 @@ function renderStat(stat, ll) {
85 85 
         var info = document.createElement('div');
86 86
87 87 
         if (err.other_osmid != stat.osmid) {
88 
-            info.innerHTML = "Does not match node <a target=\"_blank\" href=\"https://www.openstreetmap.org/node/" + err.other_osmid + "\">" + err.other_osmid + "</a>";
88 
+            info.innerHTML = "Does not match node <a onmouseover='nodeHl( " + err.other + ")' onmouseout='nodeUnHl( " + err.other + ")' target=\"_blank\" href=\"https://www.openstreetmap.org/node/" + err.other_osmid + "\">" + err.other_osmid + "</a>";
89 89 
         } else {
90 90 
             info.innerHTML = "Does not match '" + err.other_attr[0] + "' = '" + err.other_attr[1];
91 91 
         }
 
@@ -103,15 +103,15 @@ function renderStat(stat, ll) {
103 103 
         var suggDiv = document.createElement('div');
104 104
105 105 
         if (sugg.type == 1) {
106 
-            suggDiv.innerHTML = "&bull; Move node into a new relation (internal id=" + sugg.target_gid + ")";
106 
+            suggDiv.innerHTML = "&bull; Move node into a <span class='grouplink' onmouseover='groupHl( " + sugg.target_gid + ")' onmouseout='groupUnHl( " + sugg.target_gid + ")'>new relation</span>";
107 107 
         } else if (sugg.type == 2) {
108 
-            suggDiv.innerHTML = "&bull; Move node into existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.target_osm_rel_id + "\" target=\"_blank\">" + sugg.target_osm_rel_id + "</a>.";
108 
+            suggDiv.innerHTML = "&bull; Move node into existing relation <a onmouseover='groupHl( " + sugg.target_gid + ")' onmouseout='groupUnHl( " + sugg.target_gid + ")' href=\"https://www.openstreetmap.org/relation/" + sugg.target_osm_rel_id + "\" target=\"_blank\">" + sugg.target_osm_rel_id + "</a>.";
109 109 
         } else if (sugg.type == 3) {
110 
-            suggDiv.innerHTML = "&bull; Move node from existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a> into new relation (internal id=" + sugg.target_gid + ")";
110 
+            suggDiv.innerHTML = "&bull; Move node from existing relation <a onmouseover='groupHl( " + sugg.target_gid + ")' onmouseout='groupUnHl( " + sugg.target_gid + ")' href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a> into new relation (internal id=" + sugg.target_gid + ")";
111 111 
         } else if (sugg.type == 4) {
112 
-            suggDiv.innerHTML = "&bull; Move node from existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a> into existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.target_osm_rel_id + "\" target=\"_blank\">" + sugg.target_osm_rel_id + "</a>.";
112 
+            suggDiv.innerHTML = "&bull; Move node from existing relation <a onmouseover='groupHl( " + sugg.target_gid + ")' onmouseout='groupUnHl( " + sugg.target_gid + ")' href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a> into existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.target_osm_rel_id + "\" target=\"_blank\">" + sugg.target_osm_rel_id + "</a>.";
113 113 
         } else if (sugg.type == 5) {
114 
-            suggDiv.innerHTML = "&bull; Move node out of existing relation <a href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a>!";
114 
+            suggDiv.innerHTML = "&bull; Move node out of existing relation <a onmouseover='groupHl( " + sugg.target_gid + ")' onmouseout='groupUnHl( " + sugg.target_gid + ")' href=\"https://www.openstreetmap.org/relation/" + sugg.orig_osm_rel_id + "\" target=\"_blank\">" + sugg.orig_osm_rel_id + "</a>!";
115 115 
         }
116 116
117 117 
         suggD.appendChild(suggDiv);
 
@@ -141,6 +141,38 @@ function openStat(id, ll) {
141 141 
     xmlhttp.send();
142 142 
 }
143 143
144 
+function groupHl(id) {
145 
+    if (!document.groupIdx[id]) return;
146 
+    document.groupIdx[id].setStyle({
147 
+        'weight': 6,
148 
+        'fillOpacity':0.5
149 
+});
150 
+}
151 
+
152 
+function groupUnHl(id) {
153 
+    if (!document.groupIdx[id]) return;
154 
+        document.groupIdx[id].setStyle({
155 
+        'weight': 3,
156 
+        'fillOpacity':0.2
157 
+});
158 
+}
159 
+
160 
+function nodeHl(id) {
161 
+    if (!document.nodeIdx[id]) return;
162 
+    document.nodeIdx[id].setStyle({
163 
+        'weight': 5,
164 
+        'color' : "#eecc00"
165 
+});
166 
+}
167 
+
168 
+function nodeUnHl(id) {
169 
+    if (!document.nodeIdx[id]) return;
170 
+        document.nodeIdx[id].setStyle({
171 
+        'weight': 1,
172 
+        'color' : "black"
173 
+});
174 
+}
175 
+
144 176 
 var map = L.map('map', {
145 177 
   renderer: L.canvas()
146 178 
 }).setView([47.9965, 7.8469], 13);
 
@@ -192,18 +224,24 @@ function render() {
192 224
193 225 
                 layer.clearLayers();
194 226 
                 labelLayer.clearLayers();
227 
+                document.groupIdx = {};
228 
+                document.nodeIdx = {};
195 229
196 230 
                 var stations = [];
197 231 
                 var labels = [];
198 232 
                 for (var i = 0; i < content.stats.length; i++) {
199 233 
                     stat = content.stats[i];
200 
-                    stations.push(marker(stat, map.getZoom()));
234 
+                    var ndMarker = marker(stat, map.getZoom());
235 
+                    stations.push(ndMarker);
236 
+                    document.nodeIdx[stat.id] = ndMarker;
201 237 
                 }
202 238
203 239 
                 var groups = [];
204 240 
                 for (var i = 0; i < content.groups.length; i++) {
205 241 
                     group = content.groups[i];
206 
-                    groups.push(poly(group, map.getZoom()));
242 
+                    var groupPoly = poly(group, map.getZoom());
243 
+                    groups.push(groupPoly);
244 
+                    document.groupIdx[group.id] = groupPoly;
207 245 
                 }
208 246
209 247 
                 var suggs = [];