-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
648 lines (520 loc) · 28.2 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Verkehrsordnungswidrigkeitenanzeige bei Halt- und Parkverstößen</title>
<meta name="robots" content="noindex, nofollow">
<meta name="viewport" content="width=device-width, initial-scale=1">
<a rel="me" href="https://chaos.social/@wikinaut"></a>
<!--
Dieser Code basiert auf dem ursprünglichen Code von @BerlinCyclist auf https://jsfiddle.net/spy2eh0h/44
und des ersten Forks als Gist von @Tordans.
20220272 improved image encoding; remove some h2 styles and hide certain elements for email
Wikinaut 20190727 first new running version, OSM only, zero Google code
Initial version by @BerlinCyclist ~2017
License: WTFPL
FIXME:
SHOWSTOPPER/KILLER:
embedding inline (base64-coded) images does not work on Android phones w/ K9-Mail, BlueMail
Check the image rotation flag
add handling of missing EXIF data:
missing GPS coordinates -> ping user
missing GPS data: use file creation date (if available)
TODO:
allow to send without images (may be needed now and then)
allow to send with images without EXIF data: in this case prompt the user for a manual address location information
allow users to add an incomplete address, whereas corresponding ZIP code (Postleitzahl) and city district (Bezirk) are automatically determined
determine responsible Berliner Polizei "Abschnitt"
Possibility to configure the preset texts
BOWI-Expert vs. BOWI-light mode (reduced information)
Links to Bußgeldkatalog BKat und/oder Tatbestandsnummer
-->
<style id="compiled-css" type="text/css">
/* Only for smartphones */
@media only screen and (max-width: 760px) {
#navElements {
display: none;
}
}
body {
font-family: Helvetica, Arial, sans-serif;
/* font-size: 2.2vh; */
margin-left: 1em;
margin-right: 1em;
margin-bottom: 3em;
word-break: break-all;
}
textarea {
font-family: Helvetica, Arial, sans-serif;
}
h1 {
color: #b5050e;
font-size: 1.5em;
}
h2 {
font-size: 1.2em;
}
input,
textarea {
width: 100%;
}
input, select, textarea {
height: 2em;
width: 100%;
font-size: 1em;
margin-bottom: 0.35em;
margin-top: 0.35em;
}
textarea {
min-height: 10em;
}
ol, ul {
padding-left: 1em;
}
ol>li {
padding-bottom: 1em;
}
ul .warntext {
list-style-type: disc;
list-style-position: outside;
}
p, li, a {
line-height: 1.5em;
}
</style>
<script>
window.onload=function(){
// Author of the police complaint - hide or show "more information" block by default.
$("author-more-information").show();
document.getElementById("author-more-information-toggle")
.addEventListener("click", toggleVisbility);
// Toggles the visibility of an element.
// Usage: Register this function to a DOM <a> element.
// Specify the element which should be toggled in the href.
function toggleVisbility(event) {
event.preventDefault();
var contentElement = document.querySelector(event.target.attributes.href.textContent)
if (contentElement.style.display === "none") {
contentElement.style.display = "block";
} else {
contentElement.style.display = "none";
}
}
function resizeImageToDataUri(img, width, height) {
// create an off-screen canvas
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
// set its dimension to target size
canvas.width = width;
canvas.height = height;
var size = img.src.length;
console.log({size, width, height});
// draw source image into the off-screen canvas:
ctx.drawImage(img, 0, 0, width, height);
// encode image to data-uri with base64 version of compressed image
// try encoding with decreasing quality until to reach a low image size
var quality = 1.0;
do {
var result = canvas.toDataURL('image/jpeg', quality); // quality = [0.0, 1.0]
console.log( "quality: " + quality + " base64 imagesize: " + result.length);
quality = quality - 0.1;
} while ( result.length > 200*1024 && quality > 0.01 );
return result;
}
function selectElementContents(element) {
var range = document.createRange();
range.selectNodeContents(element);
var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
}
function toDecimal(number) {
if (typeof(number) != "undefined") {
return number[0].numerator + number[1].numerator /
(60 * number[1].denominator) + number[2].numerator / (3600 * number[2].denominator);
} else {
return 0;
}
}
function reverseGeoLocateNominatim(latlng, targetElement ) {
// example: https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=52.483&lon=13.35
$.getJSON( "https://nominatim.openstreetmap.org/reverse",
{ format: 'jsonv2',
lat: latlng.lat,
lon: latlng.lng
})
.done( function( response ) {
var display_addr_osm = response.display_name; // Basic location information
var a = response.address;
/*
var addr = a.country + ', '
+ a.postcode + ' ' + a.city + ' (' + a.city_district + '/' + a.suburb + '), '
+ a.postcode + ' ' + a.village + ' (' + a.city_district + '/' + a.county + '/' + a.state + '), '
+ a.road + ' ' + a.house_number;
*/
var addr = "";
$.each( Object.keys(response.address).reverse(), function( key, keyname ) {
addr += keyname + ": " + response.address[keyname] + "<br>";
});
// $(targetElement).html( display_addr + "<br>" + addr );
$(targetElement).html( a.postcode + ' ' + a.city + '-' + a.suburb + ' (' + a.borough + '), ' + a.road + ' ' + a.house_number + "<br>" );
// the full results JSON
// console.log( response );
});
}
async function reverseGeotagImageAndCreatePreview(imgfile, container) {
const ex = await ExifReader.load( imgfile );
// console.log( ex );
// console.log("Lat: "+ex.GPSLatitude.description);
// console.log("Lon: "+ex.GPSLongitude.description);
if ( typeof ex.DateTimeOriginal != "undefined" ) {
var lat = ex.GPSLatitude.description;
var lon = ex.GPSLongitude.description;
var datetime_s = ex.DateTimeOriginal.description;
var latlng = {
lat: lat,
lng: lon
};
} else {
console.log( "no EXIF data found." );
var datetime_s = "No EXIF GPSDateStamp found.";
var lat = 0.0;
var lon = 0.0;
var latlng = {
lat: 0.0,
lng: 0.0
};
}
var datetime_p = document.createElement("p");
//var imageWidth = EXIF.getTag(this, 'PixelXDimension') || 1024; //FIXME
//var imageHeight = EXIF.getTag(this, 'PixelYDimension') || 200;//FIXME
//var newWidth = Math.min(1024, imageWidth);
var reader = new FileReader();
reader.readAsDataURL(imgfile);
reader.onload = function(event) {
var preview_img = document.createElement('img');
var zoomLevel = window.getComputedStyle(document.getElementsByTagName('body')[0], null).getPropertyValue('zoom');
if (!zoomLevel) {
zoomLevel = 1;
}
preview_img.src = reader.result;
preview_img.onload = function() {
// console.log(JSON.stringify(preview_img.naturalWidth));
var imageWidth = preview_img.naturalWidth;
var imageHeight = preview_img.naturalHeight;
var newWidth = Math.min(1024, imageWidth);
preview_img.width = Math.min(Math.round(window.innerWidth / 2 / zoomLevel), newWidth);
preview_img.maxWidth = 320; //FIXME (device width)
var count = 0;
var result = resizeImageToDataUri(this, newWidth, newWidth * imageHeight / imageWidth);
console.log({"count": count, "result.length": result.length});
while (result.length < 16*1024 && count++ < 5) {
console.log({"count": count, "result.length": result.length});
result = resizeImageToDataUri(this, newWidth, newWidth * imageHeight / imageWidth);
}
if (result.length && result.length > 64*1024) { // at least 64 kB
this.src = result;
this.onload = null;
this.style = "border: 1px solid lime;";
} else {
this.src = result;
this.onload = null;
this.style = "border: 1px solid red;";
}
}
datetime_p.appendChild(preview_img);
};
datetime_p.appendChild(document.createTextNode("Aufnahmeort: "));
var loc_elem = document.createElement("span");
loc_elem.className = "location";
datetime_p.appendChild(loc_elem);
reverseGeoLocateNominatim(latlng, loc_elem);
datetime_p.appendChild(document.createTextNode("GPS: "));
var a = document.createElement('a');
// Using OSM with a marker
a.href = 'https://www.openstreetmap.org/?mlat=' + lat + '&mlon=' + lon + '#map=19/' + lat + '/' + lon;
a.target = '_blank';
a.appendChild(document.createTextNode( lat.toFixed(4) + "," + lon.toFixed(4) + " (klicken, um Aufnahmeort in OpenStreetMap anzuzeigen)" ));
datetime_p.appendChild(a);
// var datetime = new Date(datetime_s.replace(/ /, 'T').replace(/ UTC/, 'Z'));
datetime = datetime_s;
datetime_p.appendChild(document.createElement("br"));
datetime_p.appendChild(document.createTextNode("Aufnahmezeitpunkt: " + datetime.toLocaleString('de-DE', {
weekday: 'short',
year: 'numeric',
month: 'short',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
timeZoneName: 'short'
})
));
datetime_p.appendChild(document.createElement("br"));
container.appendChild(datetime_p);
}
$("#imgfiles").change(function() {
for (i = 0; i < document.getElementById('imgfiles').files.length; i++) {
var container = document.createElement('div');
var imgfile = document.getElementById('imgfiles').files[i];
if (!imgfile.type.match('image')) {
continue;
}
var deleteButton = "<span class='deletebutton'>" + wasteBasketSymbol + "</span>";
$( container ).append( deleteButton );
$( container ).find(".deletebutton").click( function() {
$(this).parent().remove();
});
reverseGeotagImageAndCreatePreview(imgfile, container);
this.parentNode.appendChild(container);
}
});
function sendMail(address) {
var docLoc = document.location;
mailWin = window.open('mailto:' + address, 'emailWindow');
if (mailWin && mailWin.open && !mailWin.closed) {
mailWin.close();
} else {
docLoc = 'mailto:' + address;
}
}
function cleanup(nodeList) {
for (i = 0; i < nodeList.length; i++) {
//alert(nodeList.length);
if (nodeList[i].classList.contains("remove") || nodeList[i].value === null || nodeList[i].value === '') {
if (nodeList[i].nextSibling && nodeList[i].nextSibling.tagName === "BR") {
nodeList[i].nextSibling.remove();
}
nodeList[i].remove();
i--;
} else if (nodeList[i].type === "text" || nodeList[i].type === "select-one" || nodeList[i].type === "textarea") {
var elem;
/*
if (nodeList[i].name === "Anschriftstrasse") {
elem = document.createElement("a");
elem.href = "https://www.openstreetmap.org/search?query=" +
encodeURI(nodeList[i+1].value) + "," +
encodeURI(nodeList[i].value);
elem.target = "_blank";
} else {
elem = document.createElement("span");
}
*/
elem = document.createElement("span");
elem.innerHTML = nodeList[i].value;
nodeList[i].replaceWith(elem);
document.getElementsByTagName('body')[0].style.fontSize = "1em";
document.getElementsByTagName('body')[0].style.zoom = "reset";
i--;
}
}
}
function clearLocalStorage() {
localStorage.clear();
}
function saveLocalStorage(nodeList) {
for (i = 0; i < nodeList.length; i++) {
localStorage.setItem(nodeList[i].name, nodeList[i].value.trim());
}
}
function loadLocalStorage(nodeList) {
for (i = 0; i < nodeList.length; i++) {
var value = localStorage.getItem(nodeList[i].name);
if (value && (nodeList[i].type === "text" || nodeList[i].type === "textarea" || nodeList[i].type === "select-one")) {
nodeList[i].value = value.trim();
}
}
}
var greenTickSymbol = '<img src="data:image/x-icon;base64,R0lGODlhDwANANUAAB7MHSrTKkfaR0vaS3jkeJ3rnaHsoanuqa3vrbHvsb7yvsr0ys71zub65uv76/f99yDLHB/OHSDGHCPQISTMICfPJTjUNiDGGiLBGiG/GiHCGynMIyO+GSK7GSK6GSi/HSSyFjzCMFzNUqfioiauFC6zHszuyKndoNTu0CmlEiiiElS5QWC+T+/57SugDyqiES6gFW26WaPUl1KrOeXy4YK9bZzMjMrkwVWlOGuwUt3t1+jz5PT58vv9+v///////yH5BAEAAD8ALAAAAAAPAA0AAAZWwJ9wSBw+ikhhYWNKEhUUUc8pZFRCLeqvYfmgtI8B5lQ0LIiEC6s40kwSwgOgRCvOUp0IwhHgyJA7OC4eEwISK1NIPDkqGRAkN1Q9NS8gMVpCNjA6SUEAOw==">';
var attentionSymbol = '<img src="data:image/x-icon;base64,R0lGODlhDgAOAPcAAP/////uAP/mAP/hAOni4uTb28u6usDAgKCAgAAAAP///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////yH5BAEAAAAALAAAAAAOAA4AAAhoAAEIFFgAAYICAxMSRHDgwEGFAxkOEOAQIoCCAyYOeKhQYkOKCBRiDJAggYCNBhJKJGkS5MCRLAMIEIAgJYCVMWdWxDgggE+fM1FKFOCzpEydBjMSZTkzqMEDGaNKHeCQgMGrWK8SCAgAOw==">';
var wasteBasketSymbol = '<img height=16 width=16 class="wastebasketsymbol" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABz0lEQVRYhc2XvyuFURjHP/cmSUYpZZBMkkH+AOVkNEoGyaAkgwwGg1EWk82ubEbDYzFLkmTB7Q663SSDJN1keM+r854fvfd1ndv9Ts/7Pb8+nfO8T+eUKCil1ABwDvRZTW/AjIi8FpmvqygAsAqMB9qWgYMik5XSQClVBqaB/pwxu8BYoO0K2M8ZXwcuROQbsjtwBKzkDM7TJHDSRL9DYAOgbJiLLS5eRAtpYAL8JR/+qi4nAHbIAsXUVxqUTFcpNUF+Eraquojcph/2tm+S/Eox9ZuA4G75U+TFnTVsgEobAKrmh30EIYA74EzHSyR58gicam8eGAJqwLH25oBRz1yZNZoFuBSRLQCl1KwGuDe8KQ1QNbzhZgDsI3gGGgGI/9A78BIEEJEG1hn9syoikjF8hScqgG34AJxO7QaIWQucuTtyB2ICOPnVkTsQqxY4NcALELEWODXAC6AVBcBnhgC8ndsJEKMWeOfs2B2IAeDNq5LPVEqNAA+G1QA+ddxLAm56PSR3i2/gw/JSDYpIzV4r9BaokNx4Rox+9mPU55U9HsAtyW3JkfcI9LttDeP+3oI+gXVfDYDAEaTSV61tktdwd8GFv4BrYE9EbkKdfgBbVn197/txVQAAAABJRU5ErkJggg==">';
$(document).ready(function() {
loadLocalStorage(document.getElementsByTagName('input'));
loadLocalStorage(document.getElementsByTagName('textarea'));
loadLocalStorage(document.getElementsByTagName('select'));
});
$('input').change(function() {
saveLocalStorage(document.getElementsByTagName('input'));
});
$('textarea').change(function() {
saveLocalStorage(document.getElementsByTagName('textarea'));
});
$('select').change(function() {
saveLocalStorage(document.getElementsByTagName('select'));
});
$('#clearLocalStorage')
.append( wasteBasketSymbol )
.hover(function() {
$(this).css('cursor','pointer');
})
.click(function() {
if ( confirm( "Wollen Sie wirklich alle Ihre lokal speicherten Daten löschen?" ) ) {
clearLocalStorage();
location.reload(true);
}
});
$('#sendMail').click(function() {
if (document.getElementById('imgfiles').files.length > 0 /* && document.getElementsByClassName('location').length > 0 */ ) {
cleanup(document.getElementsByClassName('remove'));
cleanup(document.getElementsByTagName('input'));
cleanup(document.getElementsByTagName('textarea'));
cleanup(document.getElementsByTagName('select'));
$('.wastebasketsymbol').hide();
var tmp = document.getElementById("author-more-information").style.display;
document.getElementById("author-more-information-toggle").style.display = "none";
document.getElementById("author-more-information").style.display = "block";
$(document).find('h2').replaceWith(function() {
return $(this).text();
});
selectElementContents(document.getElementsByTagName('body')[0]);
if ( document.execCommand("copy")
&& confirm( "Der gesamte Anzeigetext mit den Fotos wurde jetzt in den Zwischenspeicher kopiert.\n" +
"Diesen bitte per 'Einfügen' in die E-Mail (geöffnetes Mailprogramm in anderem Fenster) einfügen und an [email protected] senden.\n" +
"Die E-Mail kann vor dem Absenden noch verändert bzw. verworfen werden.") ) {
sendMail('[email protected]?Subject=Verkehrsordnungswidrigkeitenanzeige%20bei%20Halt-%20und%20Parkverst%C3%B6%C3%9Fen&Body=%5BBitte%20hier%20das%20kopierte%20Formular%20einf%C3%BCgen%5D');
document.getElementById("author-more-information-toggle").style.display = "block";
document.getElementById("author-more-information").style.display = tmp;
location.reload(false);
return false;
} else {
return false;
}
} else {
if ( confirm( "Bitte fügen Sie wenigstens ein Foto bei!") ) {
$('#imgfiles').click();
};
return false;
}
});
var options = {
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
};
function success(pos) {
reverseGeoLocateNominatim(
{ lat: pos.coords.latitude,
lng: pos.coords.longitude
},
'#gpsposition'
);
}
// deaktivierte Positionsabfrage
// navigator.geolocation.getCurrentPosition(success, null, options);
//]]>
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="./exif-reader.js"></script>
</head>
<body>
<div id="gpsposition"></div>
<div id="navElements" class="remove" style="position: fixed; right: 25px; top: 5px; padding: 5px; text-align: center; line-height: 25px; font-size: 20px; border: 0px solid lime; zoom: reset;">
<fieldset style="position: relative; float: left; background-color: rgba(190,190,190,0.4); font-size: small; text-shadow: 2px 2px 4px white; padding: 5px;">
<legend style="background-color: rgba(210,210,210,0.8); font-size: 80%; text-shadow: 2px 2px 4px white; box-shadow: 2px 2px 4px grey;">In 4 Schritten zur Anzeige</legend>
<ol>
<li><button onclick="document.getElementsByName('Name')[0].focus(); return false;">Adresse eingeben</button><br></li>
<li><button onclick="document.getElementsByName('Verkehrsverstoss')[0].focus(); return false;">Vorwurf auswählen</button><br></li>
<li><button onclick="document.getElementById('imgfiles').click(); return false;">Bilder auswählen</button><br></li>
<li><button onclick="document.getElementById('sendMail').click(); return false;">E-Mail vorbereiten</button><br></li>
</ol>
</fieldset>
<!--
<div style="position: relative; float: right; border: 0px solid blue;">
<input type="button" value="^^" style="width: 2.5em" onClick="var actionElement = (document.scrollingElement || document.body); actionElement.scrollTop = 0; return false;"><br>
<input type="button" value="+" style="width: 2.5em" onClick="var actionElement = document.getElementsByTagName('body')[0]; actionElement.style.zoom = (parseFloat(window.getComputedStyle(actionElement, null).getPropertyValue('zoom')) * 1.2); return false;"><br>
<input type="button" value="*" style="width: 2.5em" onClick="var actionElement = document.getElementsByTagName('body')[0]; actionElement.style.zoom = 'reset'; actionElement.style.fontSize = '1em'; return false;"><br>
<input type="button" value="-" style="width: 2.5em" onClick="var actionElement = document.getElementsByTagName('body')[0]; actionElement.style.zoom = (parseFloat(window.getComputedStyle(actionElement, null).getPropertyValue('zoom')) * 0.8); return false;"><br>
<input type="button" value="v" style="width: 2.5em" onClick="$('body').animate({ scrollTop: $('#sendMail').offset().top }, 500); return false;"><br>
<input type="button" value="vv" style="width: 2.5em" onClick="var actionElement = (document.scrollingElement || document.body); actionElement.scrollTop = actionElement.scrollHeight; return false;"><br>
</div>
-->
</div>
<h1 class='remove'>Vereinfachte Verkehrsordnungswidrigkeitenanzeige bei Halt- und Parkverstößen per E-Mail an die Bußgeldstelle der Berliner Polizei</h2>
<ul>
<li>Hiermit erstatte ich Anzeige einer Verkehrsordnungswidrigkeit gemäß den Vorgaben der offiziellen Webseite <a href="https://www.berlin.de/polizei/aufgaben/bussgeldstelle/anzeigenerstattung/">https://www.berlin.de/polizei/aufgaben/bussgeldstelle/anzeigenerstattung</a></li>
</ul>
<ol>
<li>
<h2>Anzeigende/Anzeigender = Zeuge/Zeugin:</h2>
<p>
<input name="Name" placeholder="Anrede Vorname Familienname" type="text" required><br>
<input name="Anschriftstrasse" placeholder="Straße Hausnummer" type="text" required><br>
<input name="Anschriftort" placeholder="PLZ Ort" type="text" required><br>
<input name="Kontakt" placeholder="optional für Rückfragen: Telefonnummer und/oder E-Mail-Adresse" type="text">
</p>
<a id="author-more-information-toggle" href="#author-more-information">Mehr Informationen ...</a>
<ul id="author-more-information">
<li class="warntext">Meine vorstehend angegebenen Personalien sind zutreffend und — soweit erforderlich — vollständig (<a href="https://dejure.org/gesetze/OWiG/111.html">§111 OWiG</a>).</li>
<li class="warntext">Mir ist bewusst, dass ich als Zeugin / Zeuge zur wahrheitsgemäßen Aussage (<a href="https://dejure.org/gesetze/StPO/57.html">§ 57</a> und <a href="https://dejure.org/gesetze/StPO/161a.html">§ 161a StPO</a> i. V. m. <a href="https://dejure.org/gesetze/OWiG/46.html">§ 46 OWiG</a>)
und ggf. auch zu einem Erscheinen vor Gericht verpflichtet bin (<a href="https://dejure.org/gesetze/StPO/48.html">§ 48 StPO</a>).</li>
<li class="warntext">Ich weiß, dass vorsätzlich falsche Angaben zu angeblichen Ordnungswidrigkeiten eine Straftat (<a href="https://dejure.org/gesetze/StGB/164.html">§ 164 StGB</a>) darstellen können.</li>
<li class="warntext">Ich weiß, dass die angezeigte Person bei einer Akteneinsicht auch meinen Namen und vollständige Adresse ersehen kann (<a href="https://dejure.org/gesetze/StPO/147.html">§ 147 StPO</a>).</li>
</ul>
</li>
<br>
<li>
<h2>Angaben zum Verkehrsverstoß:</h2>
<p>
<tt class='remove'>(was) </tt><select name="Verkehrsverstoss">
<option>Halten</option>
<option selected="">Parken (§12(2) StVO: „Wer sein Fahrzeug verlässt oder länger als drei Minuten hält, der parkt.“)</option>
<option>Parken auf Baumscheibe (Ordnungswidrigkeit gem. BaumSchVO §4 Abs. 2 Nr. 5)</option>
<option>Sie hielten beim Überholen keinen ausreichenden Seitenabstand zu anderen Verkehrsteilnehmern ein.</option>
</select><br><tt class='remove'>(wo) </tt><select name="Verkehrsfläche">
<option selected="">auf Radfahrstreifen (Breitstrich Z295 0,25 m und Z237)</option>
<option>auf Schutzstreifen (Z340: unterbrochene weiße Linie 1:1)</option>
<option>auf Radweg (Hochbordradweg mit Z237)</option>
<option>auf Gehweg</option>
<option>auf Sonderweg</option>
<option>in verkehrsberuhigter Z325-Zone außerhalb dafür gekennzeichneten Fläche/n</option>
<option>im 5-Meter-Bereich vor/hinter Kreuzungen/Einmündungen</option>
<option>vor Grundstücksein/ausfahrten, auf schmalen Fahrbahnen auch ihnen gegenüber</option>
<option>vor Bordsteinabsenkungen</option>
<option>auf Sperrfläche (Z298)</option>
<option>TBNR 112063 Sie parkten nicht am rechten Fahrbahnrand und behinderten dadurch Andere.</option>
<option>TBNR 141314 Parken länger als 1 Stunde im absoluten Haltverbot (Zeichen 283)</option>
<option>auf offener, unbefestigter Baumscheibe (BaumSchVO §4 Abs.2 Nr.4)</option>
<option>(siehe Anmerkung*)</option>
</select><br><tt class='remove'>(wie) </tt><select name="Qualifizierung">
<option>ohne Behinderung</option>
<option>mit Behinderung</option>
<option>mit Behinderung: ich musste anhalten</option>
<option>mit Behinderung: ich musste ausweichen</option>
<option>mit Behinderung: ich musste schräg über die Kreuzung gehen</option>
<option>mit Behinderung: ich musste absteigen</option>
<option>mit Gefährdung</option>
<option selected="">mit Gefährdung: ich musste in den Fließverkehr ausweichen</option>
</select>
</p>
<p><textarea name="weitereAngaben" rows="3" placeholder="optional: weitere Angaben (z. B. Kennzeichen, Typ, Farbe des Kfz; vorhandene Verkehrszeichen) oder *) Anmerkung zum Verstoß"></textarea></p>
</li>
<li>
<h2>Fotos mit Orts- und Zeitangaben:</h2>
<p class="remove">Bitte fügen Sie aussagekräftige Fotos - wenn möglich mit aktiviertem Ortungsdienst (GPS) - bei. Darauf sollten das Fahrzeug, sein amtliches Kennzeichen und die relevanten Verkehrszeichen ersichtlich
sein.<br> Bei zeitabhängigen Verstößen (> 3 min; > 1 h; > 3 h) sollte der zeitliche Abstand zwischen erstem und letztem Foto größer sein.</p>
<div><input type="file" id="imgfiles" accept="image/jpeg" multiple="multiple" class="remove"><label for="imgfiles" class="remove">(1–6 Fotos)</label>
</div>
</li>
<li class="remove">
<h2>E-Mail vorbereiten</h2>
<div id="sendMail" class="remove">Eine Mail mit den oben angezeigten Daten an <a href="mailto:[email protected]?Subject=Verkehrsordnungswidrigkeitenanzeige%20bei%20Halt-%20und%20Parkverst%C3%B6%C3%9Fen&Body=%5BBitte%20das%20ausgef%C3%BCllte%20Formular%20kopieren%20und%20hier%20einf%C3%BCgen%5D" title="Link zur E-Mail">[email protected]</a> (Bußgeldstelle der Berliner Polizei) vorbereiten.</div>
</li>
<li class="remove">
<h2>Eingaben löschen</h2>
<div>Bei Bedarf können Sie <a id="clearLocalStorage" href="#">hier klicken</a>, um alle Ihre lokale Daten zu löschen und das Formular so zurückzusetzen.</div>
</li>
</ol>
<script>
// tell the embed parent frame the height of the content
if (window.parent && window.parent.parent){
window.parent.parent.postMessage(["resultsFrame", {
height: document.body.getBoundingClientRect().height,
slug: ""
}], "*")
}
// always overwrite window.name, in case users try to set it manually
window.name = "result"
</script>
</body>
</html>