1/*Autor: MSc Philip Lungershausen, ARmob, Email: [email protected]*/ 2var map, omniscale, resetBtn, toggleBtn, apk; 3var hits = [], marked = [], saved = [], clickedstart = [], clickedstartmarker = [], located = [], locationmarker = [], foundaddress = [], foundaddressmarker = [], coords = [], coordsWGS = [], coordsURL = [], fids = [], codelist = []; 4var count = 0, click = 0, locate = 0, address = 0, save = 0, menuOpened = 0; 5if (!sessionStorage.hasOwnProperty("coords")) { 6 sessionStorage.setObj("coords", coords); 7 sessionStorage.setObj("coordsWGS", coordsWGS); 8 sessionStorage.setObj("coordsURL", coordsURL); 9 sessionStorage.setObj("fids", fids); 10 sessionStorage.setObj("codelist", codelist); 11 sessionStorage.setItem("save", save); 12} 13var bboxUTM32 = new OpenLayers.Bounds(-999669.1, 3932282.86, 2278007.03, 9437501.55); 14var sort = false; 15var storeClosed = false; 16var $j = jQuery.noConflict(); 17var path = "data/", urlpath = "url(data/"; 18var icon = new OpenLayers.Icon(path+'css/icons/location.svg', size); 19var travelmode = "driving"; 20var rgBlind = false; 21var size = new OpenLayers.Size(40,60); 22var userAgent = navigator.userAgent.toLowerCase(); 23var isAndroidChrome = /chrome/.test(userAgent) && /android/.test(userAgent); 24var isIOSChrome = /crios/.test(userAgent); 25var isIOSChromeOrSafari = /crios/.test(userAgent) || (/safari/.test(userAgent) && /mobile/.test(userAgent)); 26var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream; 27var isMobile = (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) || /android/.test(userAgent); 28var previousOrientation = window.orientation; 29var checkOrientation = function(){ 30 if(window.orientation !== previousOrientation){ 31 previousOrientation = window.orientation; 32 location.reload(); 33 } 34}; 35var viewHeight = window.innerHeight; 36var addressBar = true; 37var stopDialog = false; 38var openSign = (window.innerHeight > window.innerWidth) ? '∨' : '❯'; 39var closeSign = (window.innerHeight > window.innerWidth) ? '∧' : '❮'; 40var iconSize = new OpenLayers.Size(71.2, 93.6); 41var iconPath = path+'css/icons/destination.svg'; 42if (window.innerWidth <= 414 || window.innerHeight <= 414) { 43 iconSize = new OpenLayers.Size(45, 59); 44 iconPath = path+'css/icons/destination2.svg'; 45} else if (window.innerWidth > 414 && window.innerWidth <= 1900){ 46 iconSize = new OpenLayers.Size(50, 65.6); 47 iconPath = path+'css/icons/destination3.svg'; 48} 49var utm32 = new Proj4js.Proj('EPSG:25832'); 50var wgs84 = new Proj4js.Proj('EPSG:4326'); 51const viewport = document.querySelector("meta[name=viewport]"); 52const apiKey = 'argo-routenplaner-d1a67063'; 53const host = 'https://maps.omniscale.net/v2/' + apiKey + '/style.default/map'; 54const c = document.getElementById("content"); 55const p = document.getElementById("privacy-mobile"); 56const divAll = document.getElementById("divAll"); 57const mapDiv = document.getElementById("map"); 58const barMin = document.getElementById("minimizeStations"); 59const bar = document.getElementById("stations"); 60const stationsBar = document.getElementById("stationsBar"); 61const codesMin = document.getElementById("minimizeCodes"); 62const codes = document.getElementById("codes"); 63const codesBar = document.getElementById("codesBar"); 64const hcMenu = document.getElementById("handicap_menu"); 65const logo = document.getElementById("argo-small"); 66const fontSize = Number(window.getComputedStyle(document.body).getPropertyValue('font-size').match(/\d+/)[0]); 67$j("#rgbReset").on("click", resetColor); 68$j("#access").on("click", showAccess); 69if (window.innerWidth <= 414 || window.innerHeight <= 414) { 70 size = new OpenLayers.Size(24, 36); 71 } else if (window.innerWidth > 414 && window.innerWidth <= 1024){ 72 size = new OpenLayers.Size(32,48); 73 } 74 75 76function loadMap(){ 77 /*Festlegung des Sprachcodes*/ 78 OpenLayers.Lang.setCode(document.documentElement.lang); 79 apk = "&key=6635bb4664e44a7d94383fffd9c8891d&pretty=1&no_annotations=1&language="+document.documentElement.lang; 80 barMin.setAttribute('title', OpenLayers.i18n('MinStations')); 81 codesMin.setAttribute('title', OpenLayers.i18n('MinCodes')); 82 $j(hcMenu).css("display", "none"); 83 $j("#resetBtn").attr('title', OpenLayers.i18n('Reset')); 84 $j('body').translate({lang: document.documentElement.lang, t: dictionary()}); 85 map = new OpenLayers.Map( 86 'map', 87 { 88 projection: 'EPSG:25832', 89 // maxResolution: 30000, 90 units: 'm', 91 fractionalZoom: true, 92 maxExtent: bboxUTM32, 93 restrictedExtent: bboxUTM32 94 } 95 ); 96 var attribution = '<a class="attribution" href="http://openlayers.org/two/" target="_blank">OpenLayers</a> | © 2019 · <a class="attribution" href="https://maps.omniscale.com/" target="_blank">Omniscale</a> ' + 97 '· '+OpenLayers.i18n('MapData')+': <a class="attribution" href="https://www.openstreetmap.org/copyright" target="_blank">OpenStreetMap</a>'; 98 omniscale = new OpenLayers.Layer.WMS('Omniscale WMS', host, 99 {layers: 'osm'}, {attribution: attribution} 100 ); 101 omniscale.displayInLayerSwitcher = false; 102 map.addLayer(omniscale); 103 loadLayers(); 104 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 105 var panel = new OpenLayers.Control.Panel({ 106 autoActivate: true 107 });
108 initButtons(); 109 panel.addControls([routeBtn, searchBtn, hcBtn, infoBtn]); 110 switcher = new OpenLayers.Control.LayerSwitcher(); 111 legend = new OpenLayers.Control.TextButtonPanel(); 112 // nav = new OpenLayers.Control.PanPanel(); 113 map.addControls([switcher, panel, legend, locateBtn, ovBtn]); 114 $j('.OvButton').click(centerMap); 115 $j('.GeolocateButton').click(getPosition); 116 coords = sessionStorage.getObj("coords"); 117 coordsWGS = sessionStorage.getObj("coordsWGS"); 118 coordsURL = sessionStorage.getObj("coordsURL"); 119 fids = sessionStorage.getObj("fids"); 120 codelist = sessionStorage.getObj("codelist"); 121 save = sessionStorage.getObj("save"); 122 for (el of coords){ 123 var markers = new OpenLayers.Layer.Markers(); 124 markers.displayInLayerSwitcher = false; 125 markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(el.x, el.y), new OpenLayers.Icon(iconPath, iconSize))); 126 saved.push(markers); 127 } 128 saved.forEach(element => map.addLayer(element)); 129 $j('.ui-button-icon.ui-icon.ui-icon-trash').attr('title', OpenLayers.i18n('DeleteCoord')); 130 stationsBar.innerHTML = ""; 131 for(var i = 0; i < coords.length; i++){ 132 stationsBar.innerHTML += '<div class="station" onclick="openPopup(\''+fids[i]+'\')" id="'+fids[i]+'">'+(i+1)+' '+ OpenLayers.i18n(fids[i])+'<div style="float:right"> | <span title="'+OpenLayers.i18n('DeleteCoord')+'"onclick="removeCoord(\''+fids[i]+'\')"class="ui-button-icon ui-icon ui-icon-trash" style="cursor: pointer"></span></div></div>'; 133 } 134 if (coords.length > 0) bar.style.display = "block"; 135 codesBar.innerHTML = ""; 136 codelist.forEach(el => { 137 codesBar.innerHTML += (isAndroidChrome || isIOSChromeOrSafari) ? '<div class="code"><div class="codeDate">'+el.date+'</div><div style="float:right"><input class="codeInput" readonly="readonly" style="width:'+el.calc+';margin-left:1em" id='+el.code+' type="text" value='+el.code+' name="code"><button class="ui-button ui-button-small ui-corner-all ui-widget"type="button" title="'+OpenLayers.i18n('RoutecodeHover')+'" href="" onclick="copytoclipboard(\''+el.code+'\');return false"><span class="ui-button-icon ui-icon ui-icon-copy"></span></button><a class="ui-button ui-button-small ui-corner-all ui-widget"type="button" title="'+OpenLayers.i18n('RoutecodeMail')+'" href="mailto:?subject='+OpenLayers.i18n('RoutecodeMailSbj',{'date': el.date})+'&body='+OpenLayers.i18n('RoutecodeMailMsg',{'code':el.code})+'" ><span class="ui-button-icon ui-icon ui-icon-mail-closed"></span></a><button class="ui-button ui-button-small ui-corner-all ui-widget"type="button" title="'+OpenLayers.i18n('RoutecodeShare')+'" href="" onclick="shareCode(\''+el.date+'\',\''+el.code+'\');return false"><span class="ui-button-icon ui-icon ui-icon-share"></span></button></div></div>' : '<div class="code"><div class="codeDate">'+el.date+'</div><div style="float:right"><input class="codeInput" readonly="readonly" style="width:'+el.calc+';margin-left:1em" id='+el.code+' type="text" value='+el.code+' name="code"><button class="ui-button ui-button-small ui-corner-all ui-widget"type="button" title="'+OpenLayers.i18n('RoutecodeHover')+'" href="" onclick="copytoclipboard(\''+el.code+'\');return false"><span class="ui-button-icon ui-icon ui-icon-copy"></span></button><a class="ui-button ui-button-small ui-corner-all ui-widget"type="button" title="'+OpenLayers.i18n('RoutecodeMail')+'" href="mailto:?subject='+OpenLayers.i18n('RoutecodeMailSbj',{'date': el.date})+'&body='+OpenLayers.i18n('RoutecodeMailMsg',{'code':el.code})+'" ><span class="ui-button-icon ui-icon ui-icon-mail-closed"></span></a></div></div>'; 138 }) 139 if (codelist.length > 0) codes.style.display = "block"; 140 // /*Verschiedene Startansichten je nach BildschirmgröÃe und Verhältnis */ 141 if (window.innerWidth >= 993) { 142 switcher.maximizeControl(); 143 } 144 145 window.addEventListener("orientationchange", checkOrientation, false); 146 147 var content = $j(c).width(); 148 if (content < 130) { 149 logo.style.display = "none"; 150 } 151 // console.log(window.innerWidth,window.innerHeight); 152 divAll.addEventListener('drag', function() { 153 mapDiv.style.height = "calc(75vh - 17px)"; 154 // loadMap(); 155 }); 156 } 157 if (window.innerWidth <= 1024 && (isAndroidChrome || isIOSChromeOrSafari)) { 158 // if (window.innerHeight > window.innerWidth) { 159 // window.onscroll = function(ev) { 160 // if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) { 161 // mapDiv.style.height = "calc(75vh - 17px)"; 162 // addressBar = false; 163 // } 164 // }; 165 // $j(window).on('resize', function() { 166 // var viewHeightOld = viewHeight; 167 // viewHeight = window.innerHeight; 168 // mapDiv.style.height = (viewHeight > viewHeightOld) ? "calc(75vh - 17px)" : "64vh"; 169 // addressBar = (viewHeight > viewHeightOld) ? false : true; 170 // }); 171 // } else { 172 // $j(window).on('resize', function() {mapDiv.style.height = "100vh"}); 173 // } 174 expandMobileContent(); 175 } 176 177function loadLayers(){ 178 burgen = new OpenLayers.Layer.Text( OpenLayers.i18n("Castles",{'url': urlpath}), {location: path+"burgen.txt"} ); 179 gräber = new OpenLayers.Layer.Text( OpenLayers.i18n("Graves",{'url': urlpath}), {location: path+"gräber.txt"} ); 180 tempel = new OpenLayers.Layer.Text( OpenLayers.i18n("Temples",{'url': urlpath}), {location: path+"tempel.txt"} ); 181 villen = new OpenLayers.Layer.Text( OpenLayers.i18n("Villas",{'url': urlpath}), {location: path+"villen.txt"} ); 182 sonst = new OpenLayers.Layer.Text( OpenLayers.i18n("Other",{'url': urlpath}), {location: path+"sonstige.txt"} ); 183 layers = [burgen, gräber, tempel, villen, sonst]; 184 map.addLayers(layers); 185} 186 187/*----------------------DEFINITION BUTTONS-------------------------------*/ 188function initButtons(){ 189 190 infoBtn = new OpenLayers.Control.Button({/*Button zum Aufruf der Anleitung*/ 191 displayClass: 'InfoButton', 192 title: OpenLayers.i18n('Help'), 193 trigger: function () { 194 loadContent('instruction'); 195 if (iOS || /android/.test(userAgent)) { 196 (window.innerWidth <= 1024) ? expandMobileContent(true) : expandContent(); 197 if (count > 0) { 198 map.removeLayer(marked[count-1]); 199 marked = []; 200 count = 0; 201 } 202 } 203 } 204 }) 205 206 ovBtn = new OpenLayers.Control.Button({/*Button zum Sprung zurück auf Ãbersicht*/ 207 displayClass: 'OvButton', 208 title: OpenLayers.i18n('Overview') 209 }) 210 211 fsBtn = new OpenLayers.Control.Button({/*Button zum Starten und Beenden des Vollbildmodus*/ 212 displayClass: 'FullscreenButton', 213 title: OpenLayers.i18n('Fullscreen'), 214 trigger: function enterFullscreen() { 215 var isInFullScreen = (document.fullscreenElement && document.fullscreenElement !== null) || 216 (document.webkitFullscreenElement && document.webkitFullscreenElement !== null) || 217 (document.mozFullScreenElement && document.mozFullScreenElement !== null) || 218 (document.msFullscreenElement && document.msFullscreenElement !== null); 219 var button = document.getElementsByClassName("FullscreenButtonItemInactive olButton"); 220 if (!isInFullScreen) { 221 if(mapDiv.requestFullScreen) { 222 mapDiv.requestFullScreen(); 223 } else if(mapDiv.webkitRequestFullScreen ) { 224 mapDiv.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); 225 } else if(mapDiv.mozRequestFullScreen) { 226 mapDiv.mozRequestFullScreen(); 227 } else if(mapDiv.msRequestFullscreen) { 228 mapDiv.msRequestFullscreen(); 229 } 230 button[0].style.backgroundImage = urlpath+"css/icons/kleiner.svg)"; 231 button[0].onmouseover = function(){button[0].style.backgroundImage = urlpath+"css/icons/kleiner_hover.svg)"}; 232 button[0].onmouseout = function(){button[0].style.backgroundImage = urlpath+"css/icons/kleiner.svg)"}; 233 } else { 234 if (document.exitFullscreen) { 235 document.exitFullscreen(); 236 } else if (document.webkitExitFullscreen) { 237 document.webkitExitFullscreen(); 238 } else if (document.mozCancelFullScreen) { 239 document.mozCancelFullScreen(); 240 } else if (document.msExitFullscreen) { 241 document.msExitFullscreen(); 242 } 243 button[0].style.backgroundImage = urlpath+"css/icons/groesser.svg)"; 244 button[0].onmouseover = function(){button[0].style.backgroundImage = urlpath+"css/icons/groesser_hover.svg)"}; 245 button[0].onmouseout = function(){button[0].style.backgroundImage = urlpath+"css/icons/groesser.svg)"}; 246 } 247 } 248 249 }) 250 251 searchBtn = new OpenLayers.Control.Button({/*Button zum Starten der Suchfunktion*/ 252 displayClass: 'SearchButton', 253 title: OpenLayers.i18n('Search'), 254 trigger: function() { 255 searchform(); 256 } 257 }) 258 259 refreshBtn = new OpenLayers.Control.Button({/*Button zum Refreshen der Map*/ 260 displayClass: 'RefreshButton', 261 title: OpenLayers.i18n('RefreshMap'), 262 trigger: function() { 263 confirmRefresh();
264 } 265 }) 266 267 hcBtn = new OpenLayers.Control.Button({/*Button zum Ãffnen des barrieremenus*/ 268 displayClass: 'HandicapButton', 269 title: OpenLayers.i18n('HandicapOptions'), 270 trigger: function() { 271 openHcMenu(); 272 } 273 }) 274 275 locateBtn = new OpenLayers.Control.Button({ 276 displayClass: 'GeolocateButton', 277 title: OpenLayers.i18n('Geolocate') 278 }) 279 280 routeBtn = new OpenLayers.Control.Button({/*Button zum Start der Routingfunktion*/ 281 displayClass: 'RoutingButton', 282 title: OpenLayers.i18n('Routing'), 283 trigger: function () { 284 285 if (getSelectedMarker().length == 0 && coords.length < 1){ 286 287 alert2(OpenLayers.i18n('NoSelectRoute')); 288 289 } else { 290 291 routeMenu(OpenLayers.i18n('Routemenu'), false); 292 } 293 294 } 295 296 }) 297} 298 299/*----------------------DEFINITION FUNKTIONEN-------------------------------*/ 300 function centerMap() { 301 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 302 for (let i = 0; i < layers.length; i++) { 303 var layer = layers[i]; 304 for (let j = 0; j < layer.features.length; j++) { 305 if (layer.features[j].popup != null) { 306 layer.features[j].layer.map.removePopup(layer.features[j].popup); 307 } 308 } 309 } 310 if (count > 0) { 311 map.removeLayer(marked[count-1]); 312 marked = []; 313 count = 0; 314 } 315 } 316 317 function getPosition() { 318 if (navigator.geolocation) { 319 320 var loc = { 321 get_latlong: function(callback) { 322 var self = this, 323 update_loc = function(position) { 324 self.latitude = position.coords.latitude; 325 self.longitude = position.coords.longitude; 326 327 callback(self); 328 }; 329 show_error = function(error) { 330 (error.code == error.PERMISSION_DENIED) ? alert2(OpenLayers.i18n("Denied")) : alert2(OpenLayers.i18n("Unavailable")); 331 }; 332 333 navigator.geolocation.getCurrentPosition(update_loc, show_error); 334 } 335 }; 336 loc.get_latlong(function(loc) { 337 locate++; 338 var lonLat = new OpenLayers.LonLat(loc.longitude, loc.latitude) 339 .transform(new OpenLayers.Projection('EPSG:4326'), 340 map.getProjectionObject()); 341 var d = new Date(); 342 var timestamp = d.toLocaleTimeString(document.documentElement.lang); 343 var markers_loc = new OpenLayers.Layer.Markers(OpenLayers.i18n('Position',{'time': timestamp,'url': urlpath})); 344 located.push(markers_loc); 345 locationmarker.push(new OpenLayers.Marker(lonLat, icon)); 346 markers_loc.addMarker(locationmarker[locate-1]); 347 if (locate > 1) { 348 markers_loc.removeMarker(locationmarker[locate-2]); 349 map.removeLayer(located[locate-2]); 350 } 351 map.addLayer(located[locate-1]); 352 map.setCenter(lonLat, 14); 353 var features = [], featSort = [], distArr = []; 354 for (let layer of layers) { 355 for (let feature of layer.features) { 356 feature.dist = (euclideanDistance(lonLat.lon, lonLat.lat, feature.lonlat.lon, feature.lonlat.lat)); 357 if (feature.dist <= 50000) { 358 features.push(feature); 359 distArr.push(feature.dist); 360 } 361 } 362 } 363 distArr.sort(compareNumbers); 364 for (let i = 0; i < distArr.length; i++){ 365 for (let j = 0; j < features.length; j++) { 366 if (features[j].dist == distArr[i]) featSort.push(features[j]); 367 } 368 } 369 var buttons = []; 370 if (featSort.length > 5) featSort.length = 5; 371 for (let i=0; i < featSort.length; i++){ 372 let feature = featSort[i]; 373 var button = { 374 class: "onefit270", 375 text: OpenLayers.i18n(feature.id)+" ("+(feature.dist/1000).toFixed(2)+" km)", 376 click: function () { 377 div.remove(); 378 showResults(feature); 379 $j(this).dialog("close"); 380 } 381 } 382 buttons.push(button); 383 } 384 buttons.push({ 385 class: "onefit110", 386 text: "OK", 387 click: function () { 388 $j(this).dialog("close"); 389 div.remove(); 390 map.render("map"); 391 } 392 }); 393 var div = $j('<div>'); 394 (features.length >
394 0) ? div.html(OpenLayers.i18n('CloseObjects')) : div.html(OpenLayers.i18n('NoObjects')); 395 div.dialog({ 396 close: function( event, ui ) { 397 hits = []; 398 }, 399 closeText: OpenLayers.i18n('CloseText'), 400 autoOpen: true, 401 modal: true, 402 draggable: false, 403 resizable: false, 404 title: OpenLayers.i18n('Title_info'), 405 buttons: buttons 406 }); 407 }); 408 } else { 409 alert2(OpenLayers.i18n('NotSupported')); 410 } 411 } 412 413 function getSelectedMarker() {/*Getter für LonLat-Koordinaten des selektierten Markers*/ 414 var selected = []; 415 for (let i = 0; i < layers.length; i++) { 416 if (layers[i].selectedFeature){ 417 selected[0] = new OpenLayers.LonLat(layers[i].selectedFeature.lonlat.lon, layers[i].selectedFeature.lonlat.lat); 418 selected[1] = layers[i].selectedFeature.id; 419 } 420 } 421 return selected; 422 } 423 424 function destroySelected() {/*Löscht letzte Selektion*/ 425 426 for (let i = 0; i < layers.length; i++) { 427 if (layers[i].selectedFeature){ 428 layers[i].selectedFeature = null; 429 } 430 } 431 432 } 433 434 function getNameAndLoc(title){/*Getter für Orts und Denkmalnamen*/ 435 var name_loc = title.split(", "); 436 return name_loc; 437 } 438 439 function searchform() {/*Dialog für Objektsuche mit integriertem Autofill*/ 440 var div = $j('<form>'+OpenLayers.i18n('SearchMsg')+'<br><br><input id="name" class="codeInput" type="text" style="width:270px; padding-left: 1em; text-align: left;" placeholder="'+OpenLayers.i18n('Placeholder')+'" name="name"><br></form>'); 441 var uniqueTags = []; 442 var availableTags = []; 443 for (let i = 0; i < layers.length; i++) { 444 var layer = layers[i]; 445 for (let j = 0; j < layer.features.length; j++) { 446 tags = getNameAndLoc(OpenLayers.i18n(layer.features[j].data.ID)); 447 availableTags.push(tags[0], tags[1]); 448 } 449 } 450 $j.each(availableTags, function(i, el){ 451 if($j.inArray(el, uniqueTags) === -1) uniqueTags.push(el); 452 }); 453 454 div.keypress(function(e) { 455 if (e.keyCode == $j.ui.keyCode.ENTER) { 456 var input = $j('#name').val(); 457 searchmonument(e, input); 458 $j(this).dialog("close"); 459 div.remove(); 460 } 461 }); 462 div.dialog({ 463 open: function(){ 464 // viewport.setAttribute("content", "height=" + viewheight + "px, width=" + viewwidth + "px, initial-scale=1.0"); 465 $j("#name").autocomplete({source:uniqueTags}); 466 $j("#name").focus(); 467 if (window.innerWidth <= 414) { 468 logo.style.display = "none"; 469 p.style.display = "none"; 470 } 471 }, 472 close: function() { 473 if (window.innerWidth <= 414) { 474 logo.style.display = "block"; 475 p.style.display = "block"; 476 } 477 div.remove(); 478 // if (window.innerWidth <= 1024){ 479 // (window.innerHeight > window.innerWidth) ? restoreLayout("portrait") : restoreLayout("landscape"); 480 // } 481 }, 482 closeText: OpenLayers.i18n('CloseText'), 483 autoOpen: true, 484 modal: true, 485 draggable: false, 486 resizable: false, 487 title: OpenLayers.i18n('Title_input'), 488 position: { my : "top-80%"}, 489 buttons: [{ 490 class: "onefit110", 491 text: "OK", 492 click: function (e) {
493 var input = $j('#name').val(); 494 searchmonument(e, input); 495 $j(this).dialog("close"); 496 } 497 }, 498 { 499 class: "onefit110", 500 text: OpenLayers.i18n('Abort'), 501 click: function () { 502 $j(this).dialog("close"); 503 } 504 } 505 ] 506 }); 507 } 508 509 function searchfsm(e){/*Suchfunktion für Fullscreenmodus*/ 510 var input = prompt(OpenLayers.i18n('SearchMsg'), OpenLayers.i18n('Placeholder')); 511 searchmonument(e, input); 512 } 513 514 function routeMenu(message, hideFirst) {/*Optionsdialog zur Startpunktauswahl Routingbutton*/ 515 var title = (coords.length <= 1) ? OpenLayers.i18n('TitleRoute1_2') : OpenLayers.i18n('TitleRoute1_3'); 516 var div = $j('<div>'); 517 div.html(message); 518 div.dialog({ 519 closeText: OpenLayers.i18n('CloseText'), 520 autoOpen: true, 521 modal: true, 522 draggable: false, 523 resizable: false, 524 minWidth: (window.innerWidth <= 414) ? window.innerWidth : 414, 525 title: title, 526 buttons: [{ 527 class: "onefit200", 528 disabled: hideFirst, 529 // icon: "ui-icon-signal-diag", 530 text: OpenLayers.i18n('Geolocation'), 531 click: function () { 532 $j(this).dialog("close"); 533 div.remove(); 534 routeGeolocate(); 535 } 536 }, 537 { 538 class: "onefit200", 539 // icon: "ui-icon-search", 540 text: OpenLayers.i18n('SearchAddress'), 541 click: function () { 542 $j(this).dialog("close"); 543 div.remove(); 544 routeAddress(); 545 } 546 }, 547 { 548 class: "onefit200", 549 // icon: "ui-icon-pin-s", 550 text: OpenLayers.i18n('SetPoint'), 551 click: function () { 552 $j(this).dialog("close"); 553 div.remove(); 554 alert2(OpenLayers.i18n("Click"), true); 555 var click = new OpenLayers.Control.Click(); 556 map.addControl(click); 557 click.activate(); 558 } 559 } 560 ] 561 }); 562 if (window.innerWidth > 1024 && coords.length >= 1) div.dialog( "option", "position", { my: "left top", at: "right top", of: $j(bar) } ); 563 $j(".ui-dialog-buttonpane").append( 564 '<br><fieldset style="border: 0"><div class="w3-center" style="margin-bottom: 0.5em">'+OpenLayers.i18n('Travel')+'</div><input type="radio" class="means" name="radio-1" id="radio-1" value="driving"><label class="checkLabel" for="radio-1">'+OpenLayers.i18n('Car')+'</label><input type="radio" class="means" name="radio-1" id="radio-2" value="bicycling"><label class="checkLabel" for="radio-2">'+OpenLayers.i18n('Bicycle')+'</label><input type="radio" class="means" name="radio-1" id="radio-3" value="walking"><label class="checkLabel" for="radio-3">'+OpenLayers.i18n('Foot')+'</label></fieldset>' 565 ); 566 $j('.means').on("change", changeMeans); 567 } 568 569 function changeMeans(e){ 570 travelmode = e.target.value; 571 } 572 573 function routeAddress() {/*Dialog mit Suchformular für Adresssuche*/ 574 575 var div = $j('<form>'+OpenLayers.i18n('SearchAddressMsg')+'<br><br><input id="name" class="codeInput" type="text" style="width:245px; padding-left: 1em; text-align: left" placeholder="'+OpenLayers.i18n('PlaceholderAddress')+'" name="address"><br></form>'); 576 div.keypress(function(e) { 577 if (e.keyCode == $j.ui.keyCode.ENTER) {
578 var input = $j('input[name="address"]').val(); 579 geocoderRoute(input); 580 $j(this).dialog("close"); 581 div.remove(); 582 } 583 }); 584 div.dialog({ 585 open: function(){ 586 if (window.innerWidth <= 414) logo.style.display = "none"; 587 $j("#name").focus(); 588 }, 589 close: function() { 590 logo.style.display = "block"; 591 div.remove(); 592 }, 593 closeText: OpenLayers.i18n('CloseText'), 594 autoOpen: true, 595 modal: true, 596 draggable: false, 597 resizable: false, 598 minWidth: (window.innerWidth <= 414) ? window.innerWidth : 414, 599 title: OpenLayers.i18n('Title_input'), 600 buttons: [{ 601 class: "onefit110", 602 text: "OK", 603 click: function (e) { 604 var input = $j('input[name="address"]').val(); 605 geocoderRoute(input); 606 $j(this).dialog("close"); 607 } 608 }, 609 { 610 class: "onefit110", 611 text: OpenLayers.i18n('Abort'), 612 click: function () { 613 $j(this).dialog("close"); 614 } 615 } 616 ] 617 }); 618 if (window.innerWidth > 1024 && coords.length >= 1) { 619 div.dialog( "option", "position", { my: "left top", at: "right top", of: $j(bar) } ) 620 } else if (isMobile && (window.innerWidth < window.innerHeight)) div.dialog( "option", "position", { my : "top-80%"} ); 621 622 } 623 624 function geocoderRoute(input){/*Funktion die den Geocoder zur Adresssuche aufruft und OSRM Routenlink generiert*/ 625 if (input == ""){ 626 alert2(OpenLayers.i18n('NoInput'), true); 627 } else { 628 input.replace(/ /g, "+").replace(/,/g, "%2C"); 629 var opencageJSON = "https://api.opencagedata.com/geocode/v1/json?q="+input+apk; 630 var selectedMarker = getSelectedMarker(); 631 if (selectedMarker.length > 0 && selectedMarker[0].lon >= 250000 && selectedMarker[0].lat >= 5000000) { 632 selectedMarker[0].transform(map.projection, new OpenLayers.Projection('EPSG:4326')); 633 } 634 $j.getJSON(opencageJSON, 635 function (data) { 636 let lat; 637 let lon; 638 if (data.results[0] != null) { 639 address++; 640 note(OpenLayers.i18n('AddressFound', {'address': data.results[0].formatted})); 641 lat = data.results[0].geometry.lat; 642 lon = data.results[0].geometry.lng; 643 const lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject()); 644 const markers = new OpenLayers.Layer.Markers(OpenLayers.i18n('FoundAddress')); 645 foundaddress.push(markers); 646 foundaddressmarker.push(new OpenLayers.Marker(lonLat, icon)); 647 markers.addMarker(foundaddressmarker[address - 1]); 648 if (address > 1) { 649 markers.removeMarker(foundaddressmarker[address - 2]); 650 map.removeLayer(foundaddress[address - 2]); 651 } 652 map.addLayer(foundaddress[address - 1]); 653 if (coords.length <= 1) { 654 let link = `https://www.google.com/maps/dir/?api=1&origin=${lat}%2C${lon}&travelmode=${travelmode}&destination=`; 655 link += (coords.length == 0) ? String(selectedMarker[0].lat) + "%2C" + String(selectedMarker[0].lon) : String(coordsWGS[
6550].y) + "%2C" + String(coordsWGS[0].x); 656 const code = (coords.length == 0) ? selectedMarker[1] : fids[0]; 657 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 658 setTimeout( 659 function () { 660 confirmLink(OpenLayers.i18n('OpenMaps'), link, code); 661 } 662 , 3000); 663 } else { 664 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 665 sortOption(lonLat, lat, lon, true); 666 } 667 } else { 668 alert2(OpenLayers.i18n('NoAddress'), true); 669 } 670 671 }); 672 } 673 } 674 675 function routeGeolocate() {/*Generiert OSM-Routinglink basierend auf Standortermittlung*/ 676 var selectedMarker = getSelectedMarker(); 677 if (selectedMarker.length > 0 && selectedMarker[0].lon >= 250000 && selectedMarker[0].lat >= 5000000) { 678 selectedMarker[0].transform(map.projection, new OpenLayers.Projection('EPSG:4326')); 679 } 680 681 if (navigator.geolocation) { 682 683 const loc = { 684 get_latlong: function (callback) { 685 const self = this, 686 update_loc = function (position) { 687 self.latitude = position.coords.latitude; 688 self.longitude = position.coords.longitude; 689 690 callback(self); 691 }; 692 show_error = function (error) { 693 routeMenu(OpenLayers.i18n("DeniedRoute"), true); 694 }; 695 696 navigator.geolocation.getCurrentPosition(update_loc, show_error); 697 } 698 }; 699 loc.get_latlong(function(loc) { 700 locate++; 701 const lonLat = new OpenLayers.LonLat(loc.longitude, loc.latitude) 702 .transform(new OpenLayers.Projection('EPSG:4326'), 703 map.getProjectionObject()); 704 const d = new Date(); 705 const timestamp = d.toLocaleTimeString(); 706 const markers_loc = new OpenLayers.Layer.Markers(OpenLayers.i18n('Position', { 707 'time': timestamp, 708 'url': urlpath 709 })); 710 located.push(markers_loc); 711 locationmarker.push(new OpenLayers.Marker(lonLat, icon)); 712 markers_loc.addMarker(locationmarker[locate-1]); 713 if (locate > 1) { 714 markers_loc.removeMarker(locationmarker[locate-2]); 715 map.removeLayer(located[locate-2]); 716 } 717 map.addLayer(located[locate-1]); 718 if (coords.length <= 1) { 719 let link = `https://www.google.com/maps/dir/?api=1&origin=${loc.latitude}%2C${loc.longitude}&travelmode=${travelmode}&destination=`; 720 link += (coords.length == 0) ? String(selectedMarker[0].lat)+"%2C"+String(selectedMarker[0].lon) : String(coordsWGS[0].y)+"%2C"+String(coordsWGS[0].x); 721 const code = (coords.length == 0) ? selectedMarker[1] : fids[0]; 722 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 723 confirmLink(OpenLayers.i18n('OpenMaps'), link, code); 724 } else { 725 map.setCenter([345696.87, 5528498.07], getFlexZoom()); 726 sortOption(lonLat, loc.latitude, loc.longitude, false) 727 } 728 }); 729 730 } else { 731 alert2(OpenLayers.i18n('NotSupported')); 732 } 733 } 734 735 OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {/*Generiert OSM-Routinglink basierend auf angeklickten Startpunkt*/ 736 defaultHandlerOptions: { 737 'single': true, 738 'double': false, 739 'pixelTolerance': 0, 740 'stopSingle': false, 741 'stopDouble': false 742 }, 743 744 initialize: function(options) { 745 mapDiv.style.cursor = "pointer"; 746 this.handlerOptions = OpenLayers.Util.extend( 747 {}, this.defaultHandlerOptions 748 ); 749 OpenLayers.Control.prototype.initialize.apply( 750 this, arguments 751 ); 752 this.handler = new OpenLayers.Handler.Click( 753 this, { 754 'click': this.trigger 755 }, this.handlerOptions 756 ); 757 }, 758 759 trigger: function(e) { 760 click++; 761 const lonlat = map.getLonLatFromPixel(e.xy).transform(map.projection, new OpenLayers.Projection('EPSG:4326')); 762 const xy = map.getLonLatFromPixel(e.xy); 763 const selectedMarker = getSelectedMarker(); 764 if (selectedMarker.length > 0 && selectedMarker[0].lon >= 250000 && selectedMarker[0].lat >= 5000000) { 765 selectedMarker[0].transform(map.projection, new OpenLayers.Projection('EPSG:4326')); 766 } 767 if (coords.length <= 1) { 768 let link = `https://www.google.com/maps/dir/?api=1&origin=${lonlat.lat}%2C${lonlat.lon}&travelmode=${travelmode}
768&destination=`; 769 link += (coords.length == 0) ? String(selectedMarker[0].lat)+"%2C"+String(selectedMarker[0].lon) : String(coordsWGS[0].y)+"%2C"+String(coordsWGS[0].x); 770 const code = (coords.length == 0) ? selectedMarker[1] : fids[0]; 771 confirmLink(OpenLayers.i18n('OpenMaps'), link, code); 772 } else { 773 sortOption(map.getLonLatFromPixel(e.xy), lonlat.lat, lonlat.lon, false); 774 } 775 this.deactivate(); 776 mapDiv.style.cursor = "default"; 777 const markers_click = new OpenLayers.Layer.Markers(OpenLayers.i18n('StartingPoint')); 778 clickedstart.push(markers_click); 779 clickedstartmarker.push(new OpenLayers.Marker(xy, icon)); 780 markers_click.addMarker(clickedstartmarker[click-1]); 781 if (click > 1) { 782 markers_click.removeMarker(clickedstartmarker[click-2]); 783 map.removeLayer(clickedstart[click-2]); 784 } 785 map.addLayer(clickedstart[click-1]); 786 } 787 788 }); 789 790 function sortOption(utm, lat, lon, timeout) {/*Optionsdialog für Zwischenzielsortierung*/ 791 const div = $j('<div>'); 792 div.html(OpenLayers.i18n('SortOption')); 793 div.dialog({ 794 close: function( event, ui ) { 795 hits = []; 796 }, 797 closeText: OpenLayers.i18n('CloseText'), 798 autoOpen: true, 799 modal: true, 800 draggable: false, 801 resizable: false, 802 minWidth: (window.innerWidth <= 414) ? window.innerWidth : 414, 803 title: OpenLayers.i18n('TitleRoute2_3'), 804 buttons: [{ 805 class: "onefit270", 806 text: OpenLayers.i18n('SortingOn'), 807 click: function () { 808 div.remove(); 809 sortCoords(utm); 810 const link = `https://www.google.com/maps/dir/?api=1&origin=${lat}%2C${lon}&travelmode=${travelmode}&waypoints=${String(coordsURL).replaceAll(",", "%7C")}&destination=${coordsWGS[coordsWGS.length-1].y}%2C${coordsWGS[coordsWGS.length-1].x}`; 811 const code = String(fids).replace(/,/g, ""); 812 (timeout) ? setTimeout( function(){ 813 confirmLink(OpenLayers.i18n('OpenMapsWaypoints',{'length': coords.length}), link, code); 814 } , 3000) : confirmLink(OpenLayers.i18n('OpenMapsWaypoints',{'length': coords.length}), link, code); 815 } 816 }, 817 { 818 class: "onefit270", 819 text: OpenLayers.i18n('SortingOff'), 820 click: function () { 821 div.remove(); 822 for (let i = 0; i < coordsWGS.length-1; i++) { 823 coordsURL[i] = coordsWGS[i].y+"%2C"+coordsWGS[i].x; 824 } 825 const link = `https://www.google.com/maps/dir/?api=1&origin=${lat}%2C${lon}&travelmode=${travelmode}&waypoints=${String(coordsURL).replaceAll(",", "%7C")}&destination=${coordsWGS[coordsWGS.length-1].y}%2C${coordsWGS[coordsWGS.length-1].x}`; 826 const code = String(fids).replace(/,/g, ""); 827 (timeout) ? setTimeout( function(){ 828 confirmLink(OpenLayers.i18n('OpenMapsWaypoints',{'length': coords.length}), link, code); 829 } , 3000) : confirmLink(OpenLayers.i18n('OpenMapsWaypoints',{'length': coords.length}), link, code); 830 } 831 }] 832 }); 833 if (window.innerWidth > 1024 && coords.length >= 1) div.dialog( "option", "position", { my: "left top", at: "right top", of: $j(bar) } ); 834 } 835 836 function searchmonument(e, input) { 837 838 const loc = []; 839 const mon = []; 840 841 if (input == OpenLayers.i18n('Placeholder') || input == ""){ 842 alert2(OpenLayers.i18n('NoInput')); 843 } else { 844 input_low = input.toLowerCase(); 845 846 for (let i = 0; i < layers.length; i++) { 847 848 var layer = layers[i];
849 layer.selectedFeature = null; 850 851 for (let j = 0; j < layer.features.length; j++) { 852 let tags = getNameAndLoc(OpenLayers.i18n(layer.features[j].data.ID)); 853 let ort = tags[1]; 854 let denkmal = tags[0]; 855 let ortLow = ort.toLowerCase(); 856 let denkmalLow = denkmal.toLowerCase(); 857 if (layer.features[j].popup != null) { 858 layer.features[j].layer.map.removePopup(layer.features[j].popup); 859 } 860 if (input_low == ortLow || input_low == denkmalLow) { 861 hits.push(layer.features[j]); 862 loc.push(ort); 863 mon.push(denkmal); 864 } 865 } 866 if (layer == layers[layers.length-1]) { 867 if (hits.length > 0){ 868 switch(true){ 869 case (hits.length == 1): 870 showResults(hits[0]); 871 alert2(OpenLayers.i18n('Hit',{'mon': mon, 'loc': loc})); 872 e.target.removeEventListener(e.type, arguments.callee); 873 break; 874 case (hits.length > 1): 875 multiplehits(OpenLayers.i18n('SeveralHits',{'input': input, 'length': hits.length}),mon, loc); 876 e.target.removeEventListener(e.type, arguments.callee); 877 break; 878 } 879 } else { 880 const search = input_low.replace(/ /g, "+").replace(/,/g, "%2C"); 881 const opencageJSON = "https://api.opencagedata.com/geocode/v1/json?q=" + search + apk; 882 $j.getJSON(opencageJSON, 883 function (data) { 884 (data.results[0]) ? getCloseMonuments(data.results[0]) : alert2(OpenLayers.i18n('NoHit')); 885 } 886 ); 887 } 888 } 889 890 } 891 } 892 893 } 894 895 function getCloseMonuments(address) { 896 const addressUTM = Proj4js.transform(wgs84, utm32, new Proj4js.Point(address.geometry.lng, address.geometry.lat)); 897 const features = [], featSort = [], distArr = []; 898 for (let layer of layers) { 899 for (let feature of layer.features) { 900 feature.dist = (euclideanDistance(addressUTM.x, addressUTM.y, feature.lonlat.lon, feature.lonlat.lat)); 901 if (feature.dist <= 50000) { 902 features.push(feature); 903 distArr.push(feature.dist); 904 } 905 } 906 } 907 distArr.sort(compareNumbers); 908 for (let i = 0; i < distArr.length; i++){ 909 for (let j = 0; j < features.length; j++) { 910 if (features[j].dist == distArr[i]) featSort.push(features[j]); 911 } 912 } 913 const buttons = []; 914 if (featSort.length > 5) featSort.length = 5; 915 for (let i=0; i < featSort.length; i++){ 916 let feature = featSort[i]; 917 const button = { 918 class: "onefit270", 919 text: OpenLayers.i18n(feature.id) + " (" + (feature.dist / 1000).toFixed(2) + " km)", 920 click: function () { 921 div.remove(); 922 showResults(feature); 923 $j(this).dialog("close"); 924 } 925 }; 926 buttons.push(button); 927 } 928 buttons.push({ 929 class: "onefit110", 930 text: "OK", 931 click: function () { 932 $j(this).dialog("close"); 933 div.remove(); 934 map.render("map"); 935 } 936 }); 937 var div = $j('<div>');
938 div.html(OpenLayers.i18n('NoDirectHit')+'<br>'+address.formatted+'</b><br>'); 939 div[0].innerHTML += (features.length > 0) ? OpenLayers.i18n('CloseObjects') : OpenLayers.i18n('NoObjects'); 940 div.dialog({ 941 close: function( event, ui ) { 942 hits = []; 943 }, 944 closeText: OpenLayers.i18n('CloseText'), 945 autoOpen: true, 946 modal: true, 947 draggable: false, 948 resizable: false, 949 title: OpenLayers.i18n('Title_info'), 950 buttons: buttons 951 }); 952 } 953 954 955 956 function multiplehits(message, mons, loc) {/*Optionsdialog für mehrere Treffer bei Suchfunktion*/ 957 var buttons = []; 958 959 for (let i=0; i < hits.length; i++){ 960 hits[i].index = i; 961 let hit = hits[i]; 962 var button = { 963 text: mons[i]+", "+loc[i], 964 class: "onefit270", 965 click: function () { 966 div.remove(); 967 showResults(hit); 968 $j(this).dialog("close"); 969 } 970 } 971 buttons.push(button); 972 } 973 var div = $j('<div>'); 974 div.html(message); 975 div.dialog({ 976 close: function( event, ui ) { 977 hits = []; 978 }, 979 closeText: OpenLayers.i18n('CloseText'), 980 autoOpen: true, 981 modal: true, 982 draggable: false, 983 resizable: false, 984 title: OpenLayers.i18n('Title_info'), 985 buttons: buttons 986 }); 987 } 988 989 function showResults(hit){/*Funktion zum springen auf (ausgewählten) Treffer bei Suchfunktion*/ 990 count++; 991 hit.layer.map.markerHighlight(count, hit, hit.layer); 992 map.setCenter(hit.lonlat, 15); 993 (/android/.test(userAgent) || iOS) ? c.innerHTML = hit.data.divContent : hit.layer.map.addPopup(hit.createPopup()); 994 document.getElementById("zoombtn").style.backgroundImage = urlpath+"css/icons/minus-zoom.svg)"; 995 document.getElementById("zoombtn").onmouseover = function() {document.getElementById("zoombtn").style.backgroundImage = urlpath+"css/icons/minus-zoom-hover.svg)";} 996 document.getElementById("zoombtn").onmouseout = function() {document.getElementById("zoombtn").style.backgroundImage = urlpath+"css/icons/minus-zoom.svg)";} 997 document.getElementById("zoombtn").onmousedown = function() {document.getElementById("zoombtn").style.backgroundImage = urlpath+"css/icons/minus-zoom.svg)";} 998 document.getElementById("zoombtn").ontouchstart = function() {document.getElementById("zoombtn").style.backgroundImage = urlpath+"css/icons/minus-zoom.svg)";} 999 for (let i = 0; i < layers.length; i++) { 1000 1001 var layer = layers[i]; 1002 layer.selectedFeature = hit; 1003 } 1004 hits = []; 1005 } 1006 1007 function routeBtnClick(){ 1008 routeMenu(OpenLayers.i18n('Routemenu'), false); 1009 }
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.