-
Notifications
You must be signed in to change notification settings - Fork 1
/
splittermerger.html
185 lines (161 loc) · 6.17 KB
/
splittermerger.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
<!DOCTYPE html>
<html>
<head>
<title>Tools</title>
<meta charset="UTF-8">
<meta name="description" content="SplitterMerger">
<meta name="author" content="pheuschk">
</head>
<body>
<div>
This tool allows you to split or merge <a href="https://kurviger.de/en">Kurviger</a> or <a href="https://graphhopper.com/maps/">GraphHopper</a> urls.
Simply paste the url in the field below and provide the waypoint number where you want to split.
</div>
<form>
Split or merge?<br />
<input id="split" name="choice" type="radio" value="split" onclick="toggle(0);clearall()" checked />
<label for="split">Split</label><br>
<input id="merge" name="choice" type="radio" value="merge" onclick="toggle(1);clearall()"/>
<label for="merge">Merge</label><br>
</form>
<div id="splitterDiv">
<h2>Splitting</h2>
<form>
Enter a valid Kurviger or GraphHopper URL<br>
<input id="url_split" type="text" onkeyup="split()">
<p>
Enter the numbers of the markers at which to split. For example a route with 10 waypoints, you might
want to see the first 3 waypoints in the first route and up to waypoint 7 in the second and the rest
in the last you would write <code>3,7</code><br>
<input id="splits" type="text" onkeyup="split()">
</form>
</div>
<div id="mergerDiv" style="display:none">
<h2>Merging</h2>
<form onsubmit="merge(); return false;">
Add each URL to be merged one after the other<br>
<input id="url_merge" type="text"><br>
</form>
<div id="buttons" style="padding-top:5px">
<button type="button" onclick="merge()" style="font-weight:bold">Add URL</button>
<button type="button" onclick="clearall()">Clear All</button>
</div>
<p>
</div>
<textarea id="result" rows="20" cols="80"></textarea>
<script>// <![CDATA[
function toggle(target) {
var split = document.getElementById("splitterDiv");
var merge = document.getElementById("mergerDiv");
if (target === 0) {
if (split.style.display != 'block') {
split.style.display = 'block';
merge.style.display = 'none'
}
} else if (target === 1) {
if (merge.style.display != 'block') {
merge.style.display = 'block';
split.style.display = 'none'
}
}
}
// Algo should be able to do any URL, so long as there's a list of %elementName%s in the middle
var elementName = "point";
function split() {
var total = document.getElementById("url_split").value;
var list = document.getElementById("splits").value;
var resultBox = document.getElementById("result");
var splits = list.split(/[\s,]+/);
var startIndex = findStart(total, '?');
var endIndex = findEnd(total, elementName);
var start = total.substring(0, startIndex);
var middle = total.substring(startIndex, endIndex);
var end = total.substring(endIndex);
var elements = middle.split("&");
// Remove all faulty splits entered by user so that none of the upcoming loops crash
for (i = 0; i < splits.length; i++) {
var split = splits[i];
if (split < 1 || split >= elements.length - 1 || !isInt(split)) {
console.log("Removed invalid split " + split);
splits.splice(i, 1);
}
}
var results = [];
if (splits.length === 0 || elements.length === 0) {
console.log("No valid splits found");
resultBox.innerHTML = total;
} else {
// Add first and last element separately because they have to respect the element list size, loop over rest
results.push(start + getItems(elements, 0, splits[0]) + end);
for (i = 0; i < splits.length - 1; i++) {
results.push(start + getItems(elements, splits[i], splits[i + 1]) + end);
}
results.push(start + getItems(elements, splits[splits.length - 1], elements.length - 1) + end);
var prettyString = "";
for (i = 0; i < results.length; i++) {
prettyString += results[i] + "\n\n";
}
resultBox.innerHTML = prettyString;
}
}
function merge() {
var existing = document.getElementById("result").value;
var additional = document.getElementById("url_merge").value
document.getElementById("url_merge").value = "";
if (!existing) {
document.getElementById("result").innerHTML = additional;
return;
}
var parts = [existing, additional];
// Find the full intro, protocol, domain, TLD, '?', and the first element (until first '&')
var first = parts[0];
var result = first.substring(0, findStart(first, '&'));
// For each part that is to be merged, get content from first '&' (which will always skip the first item!)
// to last item. The last item is also the start for the next part
for (i = 0; i < parts.length; i++) {
var string = parts[i];
var endIndex = findEnd(string, elementName);
result += string.substring(string.indexOf('&') + 1, endIndex);
}
// Append the fluff at the end without another element. Fluff from first part is used, rest is discarded
result += first.substring(findEnd(first, elementName));
document.getElementById("result").innerHTML = result;
}
function clearall() {
document.getElementById("result").innerHTML = "";
}
function findStart(total, limiter) {
return total.indexOf(limiter) + 1;
}
function findEnd(total, limiter) {
var regex = new RegExp("&[^(" + limiter + ")]");
var result = total.match(regex);
if (result && result.length > 0) {
return total.indexOf(result[0]) + 1;
}
return -1;
}
function toggleResult(show) {
if (show) {
document.getElementById("result").style.display = 'block';
} else {
document.getElementById("result").style.display = 'none';
}
}
function getItems(items, start, end) {
var result = "";
for (pos = start; pos <= end; pos++) {
result += items[pos] + "&";
}
return result;
}
function isInt(value) {
if (isNaN(value)) {
return false;
}
var x = parseFloat(value);
return (x | 0) === x;
}
// ]]></script>
</body>
</html>