-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbookmarklets.html
93 lines (88 loc) · 6.84 KB
/
bookmarklets.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
<!doctype html>
<html lang="uk">
<head>
<meta name="google-site-verification" content="uODKu3iR1BrTeQrKbIusqfGvtH9ywffkXYmpZmmXLEE" />
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Yuriy Voziy :: Графік відключень на ДТЕК</title>
<style>
#result {
border: darkblue dashed;
display: inline-block;
width: auto;
padding: 10pt;
margin-top: 10pt;
background-color: lightblue;
color: slategray;
}
#result > a {
/* color: blue; */
text-decoration: dashed underline;
text-underline-offset: 2px;
}
label {
font-size: larger;
}
#help {
margin-top: 10pt;
}
.geo-icon {
width: 20pt;
height: 20pt;
cursor: pointer;
display: inline-block;
}
.geo-icon svg {
width: 20pt;
height: 20pt;
}
</style>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', () => {
document.querySelector('#street').value = new URLSearchParams(location.search).get('street')
document.querySelector('#num').value = new URLSearchParams(location.search).get('num')
document.querySelectorAll('.geo-icon').forEach((el) => el.addEventListener('click', () => {
navigator.geolocation.getCurrentPosition(({coords: {latitude, longitude}}) => {
fetch(`https://nominatim.openstreetmap.org/search.php?q=${latitude},${longitude}&polygon_geojson=1&format=json`)
.then(r => r.json())
.then(([{display_name}]) => {
([num, street] = display_name.split(', '))
document.querySelector('#num').value = num;
document.querySelector('#street').value = street.split(' ').shift();
main()
})
.catch(console.error)
}, console.error)
}))
})
function main() {
document.querySelector('#result').innerHTML = 'Перетягніть на панель закладок<br/>Перше натискання перейде на сторінку графіка, друге натискання — заповнить форму<br/>'
let street = document.querySelector('#street').value.trim()
let num = document.querySelector('#num').value.trim()
if (!street || !num) {
document.querySelector('#result').innerHTML = 'Спочатку введіть адресу'
return
}
let bookmarkTemplate = `<a href="javascript:(() => {if (location.href != 'https://www.dtek-kem.com.ua/ua/shutdowns') {location.href='https://dtek-kem.com.ua/ua/shutdowns'}; $('#street').val('${street}').click(); setTimeout(() => $('#streetautocomplete-list div')[0].click(), 500); setTimeout(() => $('#house_num').val(${num}).click(), 1000); setTimeout(() => {$('#house_numautocomplete-list div')[0].click(); $('.span-error, .error-active').removeClass('span-error error-active')}, 2000)})()">${street}, ${num}</a>`
// javascript:(() => {if (location.href != 'https://www.dtek-kem.com.ua/ua/shutdowns') {location.href='https://dtek-kem.com.ua/ua/shutdowns'}; $('#street').val('Коперніка').click(); setTimeout(() => $('#streetautocomplete-list div')[0].click(), 500); setTimeout(() => $('#house_num').val(3).click(), 1000); setTimeout(() => {$('#house_numautocomplete-list div')[0].click(); $('.span-error, .error-active').removeClass('span-error error-active')}, 2000)})()
document.querySelector('#result').innerHTML += bookmarkTemplate
}
</script>
<link rel="stylesheet" href="stylesheets/styles.css">
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
</head>
<body onload="main()"><h2>Автоматизація перевірки графіка відключень ДТЕК</h2>
<label id="blackouts" for="bookmarklet-blackout">Введіть адресу, щоб створити букмарклет для автоматизації
введення адреси
</label>
<form id="bookmarklet-blackout" onkeyup="main()">
<div class="geo-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve"><title>Клацніть для автовизначення</title> <defs> </defs> <g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" > <path d="M 45 0 C 27.677 0 13.584 14.093 13.584 31.416 c 0 4.818 1.063 9.442 3.175 13.773 c 2.905 5.831 11.409 20.208 20.412 35.428 l 4.385 7.417 C 42.275 89.252 43.585 90 45 90 s 2.725 -0.748 3.444 -1.966 l 4.382 -7.413 c 8.942 -15.116 17.392 -29.4 20.353 -35.309 c 0.027 -0.051 0.055 -0.103 0.08 -0.155 c 2.095 -4.303 3.157 -8.926 3.157 -13.741 C 76.416 14.093 62.323 0 45 0 z M 45 51.92 c -11.916 0 -21.611 -9.694 -21.611 -21.61 c 0 -11.916 9.695 -21.611 21.611 -21.611 c 11.915 0 21.61 9.695 21.61 21.611 C 66.61 42.226 56.915 51.92 45 51.92 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" /> </g> </svg> <path d="M 45 0 C 27.677 0 13.584 14.093 13.584 31.416 c 0 4.818 1.063 9.442 3.175 13.773 c 2.905 5.831 11.409 20.208 20.412 35.428 l 4.385 7.417 C 42.275 89.252 43.585 90 45 90 s 2.725 -0.748 3.444 -1.966 l 4.382 -7.413 c 8.942 -15.116 17.392 -29.4 20.353 -35.309 c 0.027 -0.051 0.055 -0.103 0.08 -0.155 c 2.095 -4.303 3.157 -8.926 3.157 -13.741 C 76.416 14.093 62.323 0 45 0 z M 45 51.92 c -11.916 0 -21.611 -9.694 -21.611 -21.61 c 0 -11.916 9.695 -21.611 21.611 -21.611 c 11.915 0 21.61 9.695 21.61 21.611 C 66.61 42.226 56.915 51.92 45 51.92 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(0,0,0); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" /> </g> </svg>
</div>
<input id="street" placeholder="Вулиця" value="">
<input id="num" type="text" placeholder="Номер" value="">
</form>
<div id="result"></div>
<div id="help"><a href="https://uk.wikipedia.org/wiki/%D0%91%D1%83%D0%BA%D0%BC%D0%B0%D1%80%D0%BA%D0%BB%D0%B5%D1%82">Що таке букмарклет?</a></div>
</body>
</html>