patrick
/
osmfixer


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
							<!DOCTYPE html>
<html lang="en">
<head>
	<title>staty | OSM Station Relationships</title>

	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="Description" content="Analyze public transport station in OpenStreetMap for correctness">

    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.5.1/dist/leaflet.css"/ async>
    <script src="https://unpkg.com/leaflet@1.5.1/dist/leaflet.js" defer></script>

    <link href="https://fonts.googleapis.com/css?family=Nunito:600&display=swap" rel="stylesheet" async>
    <link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet" async>
    <link href="https://fonts.googleapis.com/css?family=Inconsolata&display=swap" rel="stylesheet" async>

    <link rel="preconnect" href="http://a.tile.stamen.com/toner-lite">
    <link rel="preconnect" href="http://b.tile.stamen.com/toner-lite">
    <link rel="preconnect" href="http://c.tile.stamen.com/toner-lite">

    <style>
     body{padding:0;margin:0;font-family:'Roboto',sans-serif}html,body{height:100%;width:100%}tt{font-family:Inconsolata,monospace}#attr-tbl tr{background-color:#c0f7c0}.stat-label{white-space:nowrap;background:transparent}#attr-tbl .err-10{background-color:red}#attr-tbl .err-9{background-color:#ff1010}#attr-tbl .err-8{background-color:#f92424}#attr-tbl .err-7{background-color:#f93838}#attr-tbl .err-6{background-color:#f56262}#attr-tbl .err-5{background-color:#f38484}.attr-err-info{margin-top:5px;font-size:13px;font-style:italic}.leaflet-popup-content-wrapper{border-radius:5px}#attr-tbl .err-wrap {max-height: 100px;display: block;overflow-y: auto;}#attr-tbl{margin-top:10px;width:100%}.sugtit,.oldmemberstit,.newmemberstit{font-style:normal;font-weight:700}#group-stations-new,#group-stations-old{margin-top:8px;padding-top:4px;border-top:solid 1px #AAA}#group-stations-new div{background-color:rgb(182, 182, 228);border-left:solid 4px #00f;padding:2px;margin:2px;padding-left:5px}#group-stations-old div{border-left:solid 4px #0f0;padding:2px;margin:2px;padding-left:5px}#sugg{margin-top:8px;padding-top:4px;border-top:solid 1px #AAA;color:#0000c3}#sugg ul{padding:5px;margin:5px;padding-top:0}#logo{text-decoration:none;font-weight:600;font-family:'Nunito',sans-serif;font-size:60px;position:absolute;z-index:1000;right:.3em;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;color:#fff;opacity:.7}.leaflet-control-zoom a{font-family:'Nunito',sans-serif!important;font-weight:700!important;font-size:38px!important}.leaflet-touch .leaflet-bar a{width:40px;height:40px;line-height:38px;overflow:hidden;display:block}.leaflet-control-zoom-out{margin-top:10px}.leaflet-container{font-family:'Roboto',sans-serif!important;font-size:14px}.leaflet-control-attribution a{font-family:'Roboto',sans-serif!important;color:#333!important;font-size:12px}.leaflet-control-zoom-in,.leaflet-control-zoom-out{border-radius:25px!important;border:1px solid #000!important;opacity:.7;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;color:#fff!important}.leaflet-touch .leaflet-control-layers,.leaflet-touch .leaflet-bar{border:none;background:transparent}.leaflet-popup{left:-20px!important}.leaflet-popup-tip-container{left:20px}.leaflet-popup-tip{box-shadow:none!important}.leaflet-popup:before{content:"";position:absolute;border:13px solid transparent;border-bottom-color:#fff;bottom:0;margin-left:-13px}.attrval{font-weight:700}.grouplink{cursor:pointer;text-decoration:underline;z-index:1000}.noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}#group-stations-old div.del-stat:before{content:"❌";position:relative;width:0;color:#800;margin-left:-1.15em;left:-.6em;padding-right:.5em}#group-stations-old div.del-stat{background-color:#F44336;border-left:solid 4px #800}#group-stations-old,#group-stations-new{max-height:200px;overflow-y:auto;}.editbut{display: block;float: right;margin-right: 10px;font-size: 18px;text-decoration: none;line-height: 18px;}

#search {position: absolute;
    z-index: 9999;
    top: 1.3em;
    width: 30%;
    margin: 0;
    min-width: 300px;
    right: 35%;
    font-size: 16px;
    opacity: 0.8;
    padding: 7px;
    border: solid black 1px;
    border-radius: 5px;
    background: white;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#search input {
    width: 100%;
    border: none;
    padding: 0;
    font-size: 20px;
}

#searchresults {
    max-height: 0;
    transition: max-height 0.15s ease-out;
    overflow: hidden;
}

#searchresults.res-open {
    max-height: 1000px;    
    transition: max-height 0.3s ease-in;
}

#search .searchres:first-child {
    margin-top: 10px;
}

input:focus {
    outline:none;
}

#search .searchres {
    display: block;
    line-height: 2;
    padding-left: 0.5rem;
    border-top-right-radius: 5px;    
    border-bottom-right-radius: 5px;
    border-left: solid 5px green;
}

#search .searchres .via {
    display:block;
    margin-left: 0.7rem;
    font-size: 14px;
    color: #333;
}

.selected-res {
    background: #eee;
    cursor: pointer;
}

#del {
    position: absolute;
    right: 0;
    top: 0;
    padding: 0;
    text-decoration: none;
    font-size: 20px;
    margin-top: 7px;
    margin-right: 7px;
    line-height: 1;
    opacity: 0;
    transition: opacity .3s;
    color: #303030;
}

#searchresults.res-open + #del {
    opacity: 1;
}

     @media (max-width: 600px){#logo{font-size: 50px; right:.3em; bottom: 2rem;}.leaflet-control-container,.leaflet-top{height:100%;}.leaflet-control-zoom{position:absolute;bottom:2rem;}#search{width:80%; right: auto;left:10px;top:10px;}}

     .leaflet-popup-content-wrapper{opacity:0.9; border: solid 1px black;}.leaflet-popup-tip-container{margin-top:-1px;}.leaflet-popup-tip{opacity:1;background:#fcfcfc;border:solid 1px black;margin:-11px auto 0;}
    </style>
</head>
<body>
    <a id="logo" class="noselect"href="/">staty</a>
    <div id="map" style="width: 100%;height: 100%;"></div>
    <div id="search">
        <input id="searchinput" oninput="search(this.value)" onkeyup="keypress(event)" autocorrect="off" autocomplete="off" autocapitalize="off" placeholder="Search for a station…" type="text">
        <div id="searchresults">
            <span class="searchres">Freiburg Hauptbahnhof</span>
            <span class="searchres">Freiburg Murrgurr</span>
        </div>        
        <a href="#" id="del">✖</a>
    </div>
    <script src="build.js" defer>
    </script>
</body>
</html>