Pretty format js and html

This commit is contained in:
Alexey Zakharenkov 2020-12-01 12:23:02 +03:00
parent baa77bd3a2
commit aa4149253e
5 changed files with 1382 additions and 1039 deletions

File diff suppressed because it is too large Load diff

View file

@ -1,3 +1,5 @@
const JOSM_IMPORT_LISTEN_ADDRESS = 'http://127.0.0.1:8111/import';
const BYTES_FOR_NODE = 8;
const IMPORT_ENABLED = true;
@ -9,8 +11,8 @@ const API_URL = SELF_URL;
function getServer(endpoint, base_url) {
var url = base_url ? base_url : API_URL;
if (endpoint)
url += '/' + endpoint;
return url;
var url = base_url ? base_url : API_URL;
if (endpoint)
url += '/' + endpoint;
return url;
}

View file

@ -1,157 +1,206 @@
var MB_LIMIT = 50, MB_LIMIT2 = 70;
var KM_LIMIT = 50, POINT_LIMIT = 50000;
var MB_LIMIT = 50,
MB_LIMIT2 = 70;
var KM_LIMIT = 50,
POINT_LIMIT = 50000;
function statInit() {
$('.mb_limit').text(MB_LIMIT);
$('.mb_limit2').text(MB_LIMIT2);
$('.km_limit').text(KM_LIMIT);
$('.point_limit').text(Math.round(POINT_LIMIT / 1000));
statQuery('total', statTotal);
$('.mb_limit').text(MB_LIMIT);
$('.mb_limit2').text(MB_LIMIT2);
$('.km_limit').text(KM_LIMIT);
$('.point_limit').text(Math.round(POINT_LIMIT / 1000));
statQuery('total', statTotal);
}
function statOpen(id) {
var div = document.getElementById(id);
if( div.style.display != 'block' )
div.style.display = 'block';
else
div.style.display = 'none';
var div = document.getElementById(id);
if (div.style.display != 'block')
div.style.display = 'block';
else
div.style.display = 'none';
}
function statQuery(id, callback) {
$.ajax(getServer('stat'), {
data: { 'group': id },
success: function(data) {
callback(data);
document.getElementById(id).style.display = 'block';
},
error: function() { alert('Failed!'); }
});
$.ajax(getServer('stat'), {
data: {
'group': id
},
success: function(data) {
callback(data);
document.getElementById(id).style.display = 'block';
},
error: function() {
alert('Failed!');
}
});
}
function formatNum(value, digits) {
if( digits != undefined ) {
var pow = Math.pow(10, digits);
return Math.round(value * pow) / pow;
} else
return value;
if (digits != undefined) {
var pow = Math.pow(10, digits);
return Math.round(value * pow) / pow;
}
else
return value;
}
function statFill(id, value, digits) {
document.getElementById(id).innerHTML = ('' + formatNum(value, digits)).replace('&', '&amp;').replace('<', '&lt;');
document.getElementById(id).innerHTML = ('' + formatNum(value, digits))
.replace('&', '&amp;').replace('<', '&lt;');
}
function getIndexLink(region) {
var big = region.area > 1000;
return 'index.html#' + (big ? 8 : 12) + '/' + region.lat + '/' + region.lon;
var big = region.area > 1000;
return 'index.html#' + (big ? 8 : 12) + '/' + region.lat + '/' + region.lon;
}
function statFillList(id, regions, comment, count) {
var div = document.getElementById(id), i, a, html, p;
if( !div ) {
console.log('Div ' + id + ' not found');
return;
}
if( count )
statFill(count, regions.length);
for( i = 0; i < regions.length; i++ ) {
a = document.createElement('a');
a.href = getIndexLink(regions[i]);
a.target = '_blank';
html = regions[i].name;
if( comment ) {
if( typeof comment == 'string' )
p = regions[i][comment];
else
p = comment(regions[i]);
if( p )
html += ' (' + p + ')';
}
a.innerHTML = html.replace('&', '&amp;').replace('<', '&lt;');
div.appendChild(a);
div.appendChild(document.createElement('br'));
}
var div = document.getElementById(id),
i, a, html, p;
if (!div) {
console.log('Div ' + id + ' not found');
return;
}
if (count)
statFill(count, regions.length);
for (i = 0; i < regions.length; i++) {
a = document.createElement('a');
a.href = getIndexLink(regions[i]);
a.target = '_blank';
html = regions[i].name;
if (comment) {
if (typeof comment == 'string')
p = regions[i][comment];
else
p = comment(regions[i]);
if (p)
html += ' (' + p + ')';
}
a.innerHTML = html.replace('&', '&amp;').replace('<', '&lt;');
div.appendChild(a);
div.appendChild(document.createElement('br'));
}
}
function statTotal(data) {
statFill('total_total', data.total);
statQuery('sizes', statSizes);
statFill('total_total', data.total);
statQuery('sizes', statSizes);
}
function statSizes(data) {
var list_1mb = [], list_50mb = [], list_100mb = [];
var list_spaces = [], list_bad = [];
var list_100km = [], list_100kp = [], list_zero = [];
var list_100p = [];
var list_disabled = [], list_commented = [];
var list_1mb = [],
list_50mb = [],
list_100mb = [];
var list_spaces = [],
list_bad = [];
var list_100km = [],
list_100kp = [],
list_zero = [];
var list_100p = [];
var list_disabled = [],
list_commented = [];
for( var i = 0; i < data.regions.length; i++ ) {
region = data.regions[i];
if( region.area > 0 && region.area < KM_LIMIT )
list_100km.push(region);
if( region.area <= 0 )
list_zero.push(region);
if( region.nodes > POINT_LIMIT )
list_100kp.push(region);
if( region.nodes < 50 )
list_100p.push(region);
var size_mb = region.size * window.BYTES_FOR_NODE / 1024 / 1024;
region.size_mb = size_mb;
if( size_mb < 1 )
list_1mb.push(region);
if( size_mb > MB_LIMIT )
list_50mb.push(region);
if( size_mb > MB_LIMIT2 )
list_100mb.push(region);
if( !/^[\x20-\x7F]*$/.test(region.name) )
list_bad.push(region);
if( region.name.indexOf(' ') >= 0 )
list_spaces.push(region);
if( region.disabled )
list_disabled.push(region);
if( region.commented )
list_commented.push(region);
}
for (var i = 0; i < data.regions.length; i++) {
region = data.regions[i];
if (region.area > 0 && region.area < KM_LIMIT)
list_100km.push(region);
if (region.area <= 0)
list_zero.push(region);
if (region.nodes > POINT_LIMIT)
list_100kp.push(region);
if (region.nodes < 50)
list_100p.push(region);
var size_mb = region.size * window.BYTES_FOR_NODE / 1024 / 1024;
region.size_mb = size_mb;
if (size_mb < 1)
list_1mb.push(region);
if (size_mb > MB_LIMIT)
list_50mb.push(region);
if (size_mb > MB_LIMIT2)
list_100mb.push(region);
if (!/^[\x20-\x7F]*$/.test(region.name))
list_bad.push(region);
if (region.name.indexOf(' ') >= 0)
list_spaces.push(region);
if (region.disabled)
list_disabled.push(region);
if (region.commented)
list_commented.push(region);
}
statFill('names_spaces', list_spaces.length);
statFillList('names_bad_list', list_bad, null, 'names_bad');
statFillList('total_disabled_list', list_disabled, null, 'total_disabled');
statFillList('total_commented_list', list_commented, null, 'total_commented');
statFill('names_spaces', list_spaces.length);
statFillList('names_bad_list', list_bad, null, 'names_bad');
statFillList('total_disabled_list', list_disabled, null, 'total_disabled');
statFillList('total_commented_list', list_commented, null,
'total_commented');
list_1mb.sort(function(a, b) { return a.size_mb - b.size_mb; });
list_50mb.sort(function(a, b) { return a.size_mb - b.size_mb; });
list_100mb.sort(function(a, b) { return b.size_mb - a.size_mb; });
statFillList('sizes_1mb_list', list_1mb, function(r) { return formatNum(r.size_mb, 2) + ' МБ'; }, 'sizes_1mb');
statFillList('sizes_50mb_list', list_50mb, function(r) { return formatNum(r.size_mb, 0) + ' МБ'; }, 'sizes_50mb');
statFillList('sizes_100mb_list', list_100mb, function(r) { return formatNum(r.size_mb, 0) + ' МБ'; }, 'sizes_100mb');
list_1mb.sort(function(a, b) {
return a.size_mb - b.size_mb;
});
list_50mb.sort(function(a, b) {
return a.size_mb - b.size_mb;
});
list_100mb.sort(function(a, b) {
return b.size_mb - a.size_mb;
});
statFillList('sizes_1mb_list', list_1mb, function(r) {
return formatNum(r.size_mb, 2) + ' МБ';
}, 'sizes_1mb');
statFillList('sizes_50mb_list', list_50mb, function(r) {
return formatNum(r.size_mb, 0) + ' МБ';
}, 'sizes_50mb');
statFillList('sizes_100mb_list', list_100mb, function(r) {
return formatNum(r.size_mb, 0) + ' МБ';
}, 'sizes_100mb');
list_100km.sort(function(a, b) { return a.area - b.area; });
list_100kp.sort(function(a, b) { return b.nodes - a.nodes; });
list_100p.sort(function(a, b) { return a.nodes - b.nodes; });
statFillList('areas_100km_list', list_100km, function(r) { return formatNum(r.area, 2) + ' км²'; }, 'areas_100km');
statFillList('areas_50k_points_list', list_100kp, 'nodes', 'areas_50k_points');
statFillList('areas_100_points_list', list_100p, 'nodes', 'areas_100_points');
statFillList('areas_0_list', list_zero, null, 'areas_0');
list_100km.sort(function(a, b) {
return a.area - b.area;
});
list_100kp.sort(function(a, b) {
return b.nodes - a.nodes;
});
list_100p.sort(function(a, b) {
return a.nodes - b.nodes;
});
statFillList('areas_100km_list', list_100km, function(r) {
return formatNum(r.area, 2) + ' км²';
}, 'areas_100km');
statFillList('areas_50k_points_list', list_100kp, 'nodes',
'areas_50k_points');
statFillList('areas_100_points_list', list_100p, 'nodes',
'areas_100_points');
statFillList('areas_0_list', list_zero, null, 'areas_0');
statQuery('topo', statTopo);
statQuery('topo', statTopo);
}
function statTopo(data) {
var list_holed = [], list_multi = [], list_100km = [];
for( var i = 0; i < data.regions.length; i++ ) {
region = data.regions[i];
if( region.outer > 1 )
list_multi.push(region);
if( region.inner > 0 )
list_holed.push(region);
if( region.outer > 1 && region.min_area > 0 && region.min_area < KM_LIMIT )
list_100km.push(region);
}
var list_holed = [],
list_multi = [],
list_100km = [];
for (var i = 0; i < data.regions.length; i++) {
region = data.regions[i];
if (region.outer > 1)
list_multi.push(region);
if (region.inner > 0)
list_holed.push(region);
if (region.outer > 1 && region.min_area > 0 && region.min_area <
KM_LIMIT)
list_100km.push(region);
}
list_multi.sort(function(a, b) { return b.outer - a.outer; });
list_holed.sort(function(a, b) { return b.inner - a.inner; });
list_100km.sort(function(a, b) { return a.min_area - b.min_area; });
statFillList('topo_holes_list', list_holed, 'inner', 'topo_holes');
statFillList('topo_multi_list', list_multi, 'outer', 'topo_multi');
statFillList('topo_100km_list', list_100km, function(r) { return formatNum(r.min_area, 2) + ' км²'; }, 'topo_100km');
list_multi.sort(function(a, b) {
return b.outer - a.outer;
});
list_holed.sort(function(a, b) {
return b.inner - a.inner;
});
list_100km.sort(function(a, b) {
return a.min_area - b.min_area;
});
statFillList('topo_holes_list', list_holed, 'inner', 'topo_holes');
statFillList('topo_multi_list', list_multi, 'outer', 'topo_multi');
statFillList('topo_100km_list', list_100km, function(r) {
return formatNum(r.min_area, 2) + ' км²';
}, 'topo_100km');
}

View file

@ -1,229 +1,346 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Редактор границ для MAPS.ME</title>
<link rel="stylesheet" href="{{ url_for('static', filename='lib/leaflet.css') }}" />
<script src="{{ url_for('static', filename='lib/leaflet.js') }}"></script>
<script src="{{ url_for('static', filename='lib/Leaflet.Editable.js') }}"></script>
<script src="{{ url_for('static', filename='lib/leaflet-hash.js') }}"></script>
<script src="{{ url_for('static', filename='lib/jquery-1.11.2.min.js') }}"></script>
<script src="{{ url_for('static', filename='config.js') }}"></script>
<script src="{{ url_for('static', filename='borders.js') }}"></script>
<style>
html, body, #map, #panel { margin: 0; height: 100%; }
#panel { width: 250px; float: right; padding: 1em; font-family: sans-serif; font-size: 80% }
#panel button { font-size: 9pt; margin: 4px 0; background-color: #eee; }
#map { margin-right: 250px; }
#selected_border_actions, #b_divide { display: none; }
#unbound_actions { display: none; margin-bottom: 1em; }
#backups { display: none; }
#rename, #potential_parents { display: none; margin-left: 10px; }
#wait_start_over { display: none; }
#info { margin-top: 1em; }
#b_delete, #b_clear, .back_del { font-size: 8pt; }
#split, #join, #join_to_parent, #point,
#divide, #backup { display: none; }
.actions input[type='text'], #search input[type='text'] { width: 150px; }
#header { border-bottom: 1px solid gray; margin-bottom: 1em; padding-bottom: 1em; }
#f_topo, #f_chars, #f_comments, #links { font-size: 10pt; }
#backup_saving, #backup_restoring { margin-bottom: 1em; }
#filefm, #old_action, #josm_old { display: none; }
#h_iframe { display: block; width: 100%; height: 80px; }
a, a:hover, a:visited { color: blue; }
#start_over, #start_over:hover, #start_over:visited { color: red; }
#population_thresholds { padding-left: 1.5em; }
#mwm_size_thr { max-width: 50px;}
#r_green, #r_red { width: 40px; }
#b_import { max-width: 180px; }
#import_div { position: relative; display: none; }
#hide_import_button {
position: absolute;
width: 20px; height: 20px;
top: 0; right: 0;
background-color: #ccc;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
<head>
<meta charset="utf-8">
<title>Редактор границ для MAPS.ME</title>
<link rel="stylesheet" href="{{ url_for('static', filename='lib/leaflet.css') }}"/>
<script src="{{ url_for('static', filename='lib/leaflet.js') }}"></script>
<script src="{{ url_for('static', filename='lib/Leaflet.Editable.js') }}"></script>
<script src="{{ url_for('static', filename='lib/leaflet-hash.js') }}"></script>
<script src="{{ url_for('static', filename='lib/jquery-1.11.2.min.js') }}"></script>
<script src="{{ url_for('static', filename='config.js') }}"></script>
<script src="{{ url_for('static', filename='borders.js') }}"></script>
<style>
html,
body,
#map,
#panel {
margin: 0;
height: 100%;
}
#panel {
width: 250px;
float: right;
padding: 1em;
font-family: sans-serif;
font-size: 80%
}
#panel button {
font-size: 9pt;
margin: 4px 0;
background-color: #eee;
}
#map {
margin-right: 250px;
}
#selected_border_actions,
#b_divide,
#unbound_actions,
#backups,
#wait_start_over,
#split,
#join,
#join_to_parent,
#point,
#divide,
#backup,
#filefm,
#old_action,
#josm_old {
display: none;
}
#unbound_actions {
margin-bottom: 1em;
}
</style>
</head>
<body onload="init();">
<div id="panel">
<div id="header">
<div id="filter">
Раскраска по <select size="1" id="f_type" value="size" onchange="filterSelect()">
<option value="country">стране</option>
<option value="nodes_size">размеру по точкам</option>
<option value="predict_size">предсказ. размеру</option>
<option value="topo">топологии</option>
<option value="chars">буквам в назв.</option>
<option value="comments">комментариям</option>
</select>
<div id="f_size">
Цвета: 0<input type="text" size="2" id="r_green"><input type="text" size="3" id="r_red">
<button onclick="bUpdateColors()">&#10003;</button>
</div>
<div id="f_topo">
Красный — есть дыры, синий — больше одного полигона.
Маркерами обозначены мелкие острова.
</div>
<div id="f_chars">
Синий — есть пробелы, красный — символы не из ASCII.
</div>
<div id="f_comments">
Красный — есть комментарий.
</div>
</div>
<div id="b_josm">
<button onclick="bJOSM()">Открыть в JOSM</button>
<button id="josm_old" onclick="bJosmOld()">ст.</button>
<button onclick="bJosmZoom()">&#x1f50d;</button>
</div>
<form action="" enctype="multipart/form-data" method="post" id="filefm" target="import_frame">
Импорт <input type="file" accept=".osm,.xml" name="file" id="b_import" onchange="bImport();">
</form>
<div id="import_div">
<iframe name="import_frame" id="h_iframe" src="about:blank"></iframe>
<div id="hide_import_button"><div>x</div></div>
</div>
#rename,
#potential_parents {
display: none;
margin-left: 10px;
}
#info {
margin-top: 1em;
}
#b_delete,
#b_clear,
.back_del {
font-size: 8pt;
}
.actions input[type='text'],
#search input[type='text'] {
width: 150px;
}
#header {
border-bottom: 1px solid gray;
margin-bottom: 1em;
padding-bottom: 1em;
}
#f_topo,
#f_chars,
#f_comments,
#links {
font-size: 10pt;
}
#backup_saving,
#backup_restoring {
margin-bottom: 1em;
}
#h_iframe {
display: block;
width: 100%;
height: 80px;
}
a,
a:hover,
a:visited {
color: blue;
}
#start_over,
#start_over:hover,
#start_over:visited {
color: red;
}
#population_thresholds {
padding-left: 1.5em;
}
#mwm_size_thr {
max-width: 50px;
}
#r_green,
#r_red {
width: 40px;
}
#b_import {
max-width: 180px;
}
#import_div {
position: relative;
display: none;
}
#hide_import_button {
position: absolute;
width: 20px;
height: 20px;
top: 0;
right: 0;
background-color: #ccc;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
<div id="backups">
<button onclick="bBackup()">Архив границ</button><br>
</div>
<div id="old_action">
<input type="checkbox" id="old" onchange="bOldBorders()"><label for="old"> старые границы</label>
</div>
<div id="links">
<a href="stat.html">Статистика</a>
<a href="#" id="poly_bbox">Скачать в poly видимое</a>,
<a href="#" id="poly_all">всё</a><br>
<a href="#" id="start_over" onclick="startOver()">Начать заново</a>
<span id="wait_start_over">ожидайте...</span>
</div>
<div id="search">
Поиск <input type="text" id="fsearch"><button id="b_search" onclick="doSearch()">&#x1f50d;</button>
</div>
</div>
<div id="actions">
<div id="unbound_actions">
<button id="b_point" onclick="bPoint()">Регион из точки</button><br>
</div>
<div id="selected_border_actions" class="actions">
<div id="action_buttons">
<!--button onclick="bDisable()" id="b_disable">Убрать</button-->
<!--a href="#" onclick="bDelete(); return false;" id="b_delete">Удалить</a-->
<button onclick="bDelete()" id="b_delete">Удалить</button><br>
<button onclick="bSplit()">Разрезать</button>
<button onclick="bJoin()">Склеить</button><br>
<button onclick="bJoinToParent()">Склеить всё до родителя</button><br>
<button onclick="bLargest()">Выделить острова</button>
<button onclick="bHull()">Единый контур</button><br>
<button id="b_divide" onclick="bDivide()">Заменить регионами</button><br>
</div>
<div id="info">
<b><a href="#" id="rename_link" onclick="bToggleRename(); return false;">Название &#9660:</a></b>
<span id="b_name"></span>
<span id="b_al"></span><br>
<div id="rename">
<input type="text" id="b_rename">
<button onclick="bRename()">Переименовать</button>
</div>
<div>
<b><a href="#" id="parent_link" onclick="bTogglePotentialParents(); return false;">Родитель &#9660:</a></b>
<span id="b_parent_name"></span>
</div>
<div id="potential_parents">
</div>
<b>Оценка размера по точкам:</b> <span id="b_size"></span><br>
<b>Оценка размера по нас+пл:</b> <span id="pa_size"></span><br>
<b>Последняя правка:</b> <span id="b_date"></span><br>
<b>Количество точек:</b> <span id="b_nodes"></span><br>
<b>Площадь:</b> <span id="b_area"></span> км²<br>
<!--b>Статус:</b> <span id="b_status"></span><br-->
<b>Комментарий:</b><br>
<textarea style="width: 240px; height: 100px;" id="b_comment"></textarea><br>
<button id="b_comment_send" onclick="bComment()">Отправить</button>
<a href="#" onclick="bClearComment(); return false;" id="b_clear">Очистить</a>
</div>
</div>
</div>
<div id="split" class="actions">
Выбрана область <span id="s_sel"></span>.<br><br>
Нарисуйте линию через выбранную область (повторный клик на последней точке для завершения), затем нажмите кнопку<br>
<div id="s_do">
<button onclick="bSplitDo()">Разрезать область</button>
<input type="checkbox" id="save_split_region" checked></input>
<label for="save_split_region">Не удалять</label><br>
<button onclick="bSplitJosm()">Границы вдоль — в JOSM</button><br>
<button onclick="bSplitAgain()">Нарисовать по-другому</button>
</div>
<br>
<button onclick="bSplitCancel()">Вернуться</button>
</div>
<div id="join" class="actions">
Выбрана область <span id="j_sel"></span>.<br><br>
Выберите область, которую к ней присоединить.<br>
<div id="j_do">
Выбрана: <span id="j_name2"></span><br>
<button onclick="bJoinDo()">Склеить области</button>
</div>
<br>
<button onclick="bJoinCancel()">Вернуться</button>
</div>
<div id="join_to_parent" class="actions">
Выбрана область <span id="j_to_parent_sel"></span>.<br>
Родительская область <span id="j_sel_parent"></span>.<br><br>
<button onclick="bJoinToParentPreview()">Посмотреть результат</button><br>
<button onclick="bJoinToParentDo()">Склеить всё до родителя</button><br>
<button onclick="bJoinToParentCancel()">Вернуться</button>
</div>
<div id="point" class="actions">
Переместите маркер в нужную точку и нажмите<br>
<button onclick="bPointList()">Получить список областей</button><br>
Название <input type="text" id="p_name"><br>
<div id="p_list"></div>
<br>
<button onclick="bPointCancel()">Вернуться</button>
</div>
<div id="divide" class="actions">
Выбранная область <span id="region_to_divide"></span>
будет заменена вложенными областями уровня
<input type="number" id="next_level" min="2" max="12">.<br>
<br>
<div>
<input type="checkbox" id="auto_divide" checked>
<label for="auto_divide">Автослияние по населению</label>
<div id="population_thresholds">
Верхняя граница размера mwm:
<input id="mwm_size_thr" type="number"
min="1" value="70" step="1"> Мб
</div>
</style>
</head>
<body onload="init();">
<div id="panel">
<div id="header">
<div id="filter">
Раскраска по <select size="1" id="f_type" value="size" onchange="filterSelect()">
<option value="country">стране</option>
<option value="nodes_size">размеру по точкам</option>
<option value="predict_size">предсказ. размеру</option>
<option value="topo">топологии</option>
<option value="chars">буквам в назв.</option>
<option value="comments">комментариям</option>
</select>
<div id="f_size">
Цвета: 0<input type="text" size="2" id="r_green"><input type="text" size="3" id="r_red">
<button onclick="bUpdateColors()">&#10003;</button>
</div>
<div id="f_topo">
Красный — есть дыры, синий — больше одного полигона.
Маркерами обозначены мелкие острова.
</div>
<div id="f_chars">
Синий — есть пробелы, красный — символы не из ASCII.
</div>
<div id="f_comments">
Красный — есть комментарий.
</div>
</div>
<div id="b_josm">
<button onclick="bJOSM()">Открыть в JOSM</button>
<button id="josm_old" onclick="bJosmOld()">ст.</button>
<button onclick="bJosmZoom()">&#x1f50d;</button>
</div>
<form action="" enctype="multipart/form-data" method="post" id="filefm" target="import_frame">
Импорт <input type="file" accept=".osm,.xml" name="file" id="b_import" onchange="bImport();">
</form>
<div id="import_div">
<iframe name="import_frame" id="h_iframe" src="about:blank"></iframe>
<div id="hide_import_button">
<div>x</div>
</div>
</div>
<div id="backups">
<button onclick="bBackup()">Архив границ</button>
<br>
</div>
<div id="old_action">
<input type="checkbox" id="old" onchange="bOldBorders()"><label for="old"> старые границы</label>
</div>
<div id="links">
<a href="stat.html">Статистика</a>
<a href="#" id="poly_bbox">Скачать в poly видимое</a>,
<a href="#" id="poly_all">всё</a><br>
<a href="#" id="start_over" onclick="startOver()">Начать заново</a>
<span id="wait_start_over">ожидайте...</span>
</div>
<div id="search">
Поиск <input type="text" id="fsearch">
<button id="b_search" onclick="doSearch()">&#x1f50d;</button>
</div>
</div>
<div id="actions">
<div id="unbound_actions">
<button id="b_point" onclick="bPoint()">Регион из точки</button>
<br>
</div>
<div id="selected_border_actions" class="actions">
<div id="action_buttons">
<!--button onclick="bDisable()" id="b_disable">Убрать</button-->
<button onclick="bDelete()" id="b_delete">Удалить</button>
<br>
<button onclick="bSplit()">Разрезать</button>
<button onclick="bJoin()">Склеить</button>
<br>
<button onclick="bJoinToParent()">Склеить всё до родителя</button>
<br>
<button onclick="bLargest()">Выделить острова</button>
<button onclick="bHull()">Единый контур</button>
<br>
<button id="b_divide" onclick="bDivide()">Заменить регионами</button>
<br>
</div>
<div id="info">
<b><a href="#" id="rename_link" onclick="bToggleRename(); return false;">Название &#9660:</a></b>
<span id="b_name"></span>
<span id="b_al"></span><br>
<div id="rename">
<input type="text" id="b_rename">
<button onclick="bRename()">Переименовать</button>
</div>
<div>
<input type="checkbox" id="apply_to_similar">
<label for="apply_to_similar">
Для всех областей страны того же уровня
</label>
<b><a href="#" id="parent_link" onclick="bTogglePotentialParents(); return false;">Родитель
&#9660:</a></b>
<span id="b_parent_name"></span>
</div>
<button onclick="bDividePreview()">Посмотреть субобласти</button><br>
<div id="d_count"></div>
<button id="b_divide_do" onclick="bDivideDo()">Заменить область</button>
<br>
<button onclick="bDivideCancel()">Вернуться</button>
</div>
<div id="backup" class="actions">
<button onclick="bBackupSave()" id="backup_save">Сохранить границы</button>
<div id="backup_saving">Копирую границы...</div>
<div id="backup_restoring">Восстанавливаю границы...</div>
<div>Или выберите набор границ для восстановления:</div>
<div id="backup_list"></div>
<button onclick="bBackupCancel()">Вернуться</button>
</div>
</div>
<div id="map"></div>
</body>
<div id="potential_parents">
</div>
<b>Оценка размера по точкам:</b> <span id="b_size"></span><br>
<b>Оценка размера по нас+пл:</b> <span id="pa_size"></span><br>
<b>Последняя правка:</b> <span id="b_date"></span><br>
<b>Количество точек:</b> <span id="b_nodes"></span><br>
<b>Площадь:</b> <span id="b_area"></span> км²<br>
<!--b>Статус:</b> <span id="b_status"></span><br-->
<b>Комментарий:</b><br>
<textarea style="width: 240px; height: 100px;" id="b_comment"></textarea><br>
<button id="b_comment_send" onclick="bComment()">Отправить</button>
<a href="#" onclick="bClearComment(); return false;" id="b_clear">Очистить</a>
</div>
</div>
</div>
<div id="split" class="actions">
Выбрана область <span id="s_sel"></span>.<br><br>
Нарисуйте линию через выбранную область (повторный клик на последней точке для завершения), затем нажмите кнопку<br>
<div id="s_do">
<button onclick="bSplitDo()">Разрезать область</button>
<input type="checkbox" id="save_split_region" checked></input>
<label for="save_split_region">Не удалять</label><br>
<button onclick="bSplitJosm()">Границы вдоль — в JOSM</button>
<br>
<button onclick="bSplitAgain()">Нарисовать по-другому</button>
</div>
<br>
<button onclick="bSplitCancel()">Вернуться</button>
</div>
<div id="join" class="actions">
Выбрана область <span id="j_sel"></span>.<br><br>
Выберите область, которую к ней присоединить.<br>
<div id="j_do">
Выбрана: <span id="j_name2"></span><br>
<button onclick="bJoinDo()">Склеить области</button>
</div>
<br>
<button onclick="bJoinCancel()">Вернуться</button>
</div>
<div id="join_to_parent" class="actions">
Выбрана область <span id="j_to_parent_sel"></span>.<br>
Родительская область <span id="j_sel_parent"></span>.<br><br>
<button onclick="bJoinToParentPreview()">Посмотреть результат</button>
<br>
<button onclick="bJoinToParentDo()">Склеить всё до родителя</button>
<br>
<button onclick="bJoinToParentCancel()">Вернуться</button>
</div>
<div id="point" class="actions">
Переместите маркер в нужную точку и нажмите<br>
<button onclick="bPointList()">Получить список областей</button>
<br>
Название <input type="text" id="p_name"><br>
<div id="p_list"></div>
<br>
<button onclick="bPointCancel()">Вернуться</button>
</div>
<div id="divide" class="actions">
Выбранная область <span id="region_to_divide"></span>
будет заменена вложенными областями уровня
<input type="number" id="next_level" min="2" max="12">.<br>
<br>
<div>
<input type="checkbox" id="auto_divide" checked>
<label for="auto_divide">Автослияние по населению</label>
<div id="population_thresholds">
Верхняя граница размера mwm:
<input id="mwm_size_thr" type="number"
min="1" value="70" step="1"> Мб
</div>
</div>
<div>
<input type="checkbox" id="apply_to_similar">
<label for="apply_to_similar">
Для всех областей страны того же уровня
</label>
</div>
<button onclick="bDividePreview()">Посмотреть субобласти</button>
<br>
<div id="d_count"></div>
<button id="b_divide_do" onclick="bDivideDo()">Заменить область</button>
<br>
<button onclick="bDivideCancel()">Вернуться</button>
</div>
<div id="backup" class="actions">
<button onclick="bBackupSave()" id="backup_save">Сохранить границы</button>
<div id="backup_saving">Копирую границы...</div>
<div id="backup_restoring">Восстанавливаю границы...</div>
<div>Или выберите набор границ для восстановления:</div>
<div id="backup_list"></div>
<button onclick="bBackupCancel()">Вернуться</button>
</div>
</div>
<div id="map"></div>
</body>
</html>

View file

@ -1,61 +1,97 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Статистика границ для MAPS.ME</title>
<script src="{{ url_for('static', filename='lib/jquery-1.11.2.min.js') }}"></script>
<script src="{{ url_for('static', filename='config.js') }}"></script>
<script src="{{ url_for('static', filename='stat.js') }}"></script>
<style>
body > div { display: none; margin-bottom: 1em; }
#sizes > div { margin-top: 1em; }
.h { display: none; padding-left: 1em; }
</style>
</head>
<body onload="statInit();">
<h1>Статистика по границам</h1>
<div id="total">
Всего границ: <span id="total_total"></span><br>
</div>
<div id="sizes">
<div>
Отключено из сборки: <span id="total_disabled"></span> (<a href="#" onclick="return statOpen('total_disabled_list');">список</a>)<br>
<div id="total_disabled_list" class="h"></div>
Прокомментировано: <span id="total_commented"></span> (<a href="#" onclick="return statOpen('total_commented_list');">список</a>)<br>
<div id="total_commented_list" class="h"></div>
</div>
<div>
Названий с пробелами: <span id="names_spaces"></span><br>
Названий с левыми символами: <span id="names_bad"></span> (<a href="#" onclick="return statOpen('names_bad_list');">список</a>)<br>
<div id="names_bad_list" class="h"></div>
</div>
<div>
Размер MWM до 1 МБ: <span id="sizes_1mb"></span> (<a href="#" onclick="return statOpen('sizes_1mb_list');">список</a>)<br>
<div id="sizes_1mb_list" class="h"></div>
Размер MWM больше <span class="mb_limit"></span> МБ: <span id="sizes_50mb"></span> (<a href="#" onclick="return statOpen('sizes_50mb_list');">список</a>)<br>
<div id="sizes_50mb_list" class="h"></div>
Из них больше <span class="mb_limit2"></span> МБ: <span id="sizes_100mb"></span> (<a href="#" onclick="return statOpen('sizes_100mb_list');">список</a>)<br>
<div id="sizes_100mb_list" class="h"></div>
</div>
<div>
Регионов меньше <span class="km_limit"></span> км²: <span id="areas_100km"></span> (<a href="#" onclick="return statOpen('areas_100km_list');">список</a>)<br>
<div id="areas_100km_list" class="h"></div>
Регионов от <span class="point_limit"></span> тысяч точек в контуре: <span id="areas_50k_points"></span> (<a href="#" onclick="return statOpen('areas_50k_points_list');">список</a>)<br>
<div id="areas_50k_points_list" class="h"></div>
Регионов до 50 точек в контуре: <span id="areas_100_points"></span> (<a href="#" onclick="return statOpen('areas_100_points_list');">список</a>)<br>
<div id="areas_100_points_list" class="h"></div>
Регионов с неизвестной площадью: <span id="areas_0"></span> (<a href="#" onclick="return statOpen('areas_0_list');">список</a>)<br>
<div id="areas_0_list" class="h"></div>
</div>
</div>
<div id="topo">
Регионов с дырками: <span id="topo_holes"></span> (<a href="#" onclick="return statOpen('topo_holes_list');">список</a>)<br>
<div id="topo_holes_list" class="h"></div>
Регионов из нескольких частей: <span id="topo_multi"></span> (<a href="#" onclick="return statOpen('topo_multi_list');">список</a>)<br>
<div id="topo_multi_list" class="h"></div>
Регионов с островами меньше <span class="km_limit"></span> км²: <span id="topo_100km"></span> (<a href="#" onclick="return statOpen('topo_100km_list');">список</a>)<br>
<div id="topo_100km_list" class="h"></div>
<hr>
</div>
</body>
<head>
<meta charset="utf-8">
<title>Статистика границ для MAPS.ME</title>
<script src="{{ url_for('static', filename='lib/jquery-1.11.2.min.js') }}">
</script>
<script src="{{ url_for('static', filename='config.js') }}"></script>
<script src="{{ url_for('static', filename='stat.js') }}"></script>
<style>
body>div {
display: none;
margin-bottom: 1em;
}
#sizes>div {
margin-top: 1em;
}
.h {
display: none;
padding-left: 1em;
}
</style>
</head>
<body onload="statInit();">
<h1>Статистика по границам</h1>
<div id="total">
Всего границ: <span id="total_total"></span><br>
</div>
<div id="sizes">
<div>
Отключено из сборки: <span id="total_disabled"></span> (<a href="#"
onclick="return statOpen('total_disabled_list');">список</a>)<br>
<div id="total_disabled_list" class="h"></div>
Прокомментировано: <span id="total_commented"></span> (<a href="#"
onclick="return statOpen('total_commented_list');">список</a>)<br>
<div id="total_commented_list" class="h"></div>
</div>
<div>
Названий с пробелами: <span id="names_spaces"></span><br>
Названий с левыми символами: <span id="names_bad"></span> (<a
href="#"
onclick="return statOpen('names_bad_list');">список</a>)<br>
<div id="names_bad_list" class="h"></div>
</div>
<div>
Размер MWM до 1 МБ: <span id="sizes_1mb"></span> (<a href="#"
onclick="return statOpen('sizes_1mb_list');">список</a>)<br>
<div id="sizes_1mb_list" class="h"></div>
Размер MWM больше <span class="mb_limit"></span> МБ: <span
id="sizes_50mb"></span> (<a href="#"
onclick="return statOpen('sizes_50mb_list');">список</a>)<br>
<div id="sizes_50mb_list" class="h"></div>
Из них больше <span class="mb_limit2"></span> МБ: <span
id="sizes_100mb"></span> (<a href="#"
onclick="return statOpen('sizes_100mb_list');">список</a>)<br>
<div id="sizes_100mb_list" class="h"></div>
</div>
<div>
Регионов меньше <span class="km_limit"></span> км²: <span
id="areas_100km"></span> (<a href="#"
onclick="return statOpen('areas_100km_list');">список</a>)<br>
<div id="areas_100km_list" class="h"></div>
Регионов от <span class="point_limit"></span> тысяч точек в контуре:
<span id="areas_50k_points"></span> (<a href="#"
onclick="return statOpen('areas_50k_points_list');">список</a>)<br>
<div id="areas_50k_points_list" class="h"></div>
Регионов до 50 точек в контуре: <span id="areas_100_points"></span>
(<a href="#"
onclick="return statOpen('areas_100_points_list');">список</a>)<br>
<div id="areas_100_points_list" class="h"></div>
Регионов с неизвестной площадью: <span id="areas_0"></span> (<a
href="#"
onclick="return statOpen('areas_0_list');">список</a>)<br>
<div id="areas_0_list" class="h"></div>
</div>
</div>
<div id="topo">
Регионов с дырками: <span id="topo_holes"></span> (<a href="#"
onclick="return statOpen('topo_holes_list');">список</a>)<br>
<div id="topo_holes_list" class="h"></div>
Регионов из нескольких частей: <span id="topo_multi"></span> (<a
href="#"
onclick="return statOpen('topo_multi_list');">список</a>)<br>
<div id="topo_multi_list" class="h"></div>
Регионов с островами меньше <span class="km_limit"></span> км²: <span
id="topo_100km"></span> (<a href="#"
onclick="return statOpen('topo_100km_list');">список</a>)<br>
<div id="topo_100km_list" class="h"></div>
<hr>
</div>
</body>
</html>