All4DK
/
wikipoints
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ADD миникарта на редакторе трека

This commit is contained in:
Krivchikov Dmitry 2016-06-13 14:09:24 +03:00
parent 7860013f60
commit 3a7d0818ac
3 changed files with 62 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
controllers/EdittrackController.php
View File

@ -187,7 +187,7 @@ class EdittrackController extends Controller
App::error404();
}
$trackpoints = TrackPoints::model()->getAll(array('where' => '`trackId` = ' . $track->id, 'asArray' => TRUE, 'noKeys' => TRUE,));
$trackpoints = TrackPoints::model()->getAll(array('where' => '`trackId` = ' . $track->id, 'asArray' => TRUE, 'noKeys' => TRUE, 'order' => '`id`'));
self::renderPartial('json.php', $trackpoints);
}

3
controllers/TracksController.php
View File

@ -30,6 +30,9 @@ class TracksController extends Controller
function actionEdit()
{
self::addScript('/js/leaflet.js');
self::addStyle('/css/leaflet.css');
$id = intval(App::getParam('id'));
if (!$id) {

71
views/tracks/edit.php
View File

@ -1,5 +1,5 @@
<?php
$tracksCounter = 1;
$tracksCounter = 1;
?>
<a href="/tracks/" class="btn btn-success pull-right">
<span class="glyphicon glyphicon-home" aria-hidden="true"></span>
@ -38,6 +38,7 @@
<?php foreach ($tracks as $track): ?>
<form onfocusout="saveChangesTrack(<?= $track->id ?>)" class="form-horizontal">
<div class="form-group">
<a name="trackpointsList<?= $track->id ?>"/>
<div style="font-size: 20px" class="col-sm-1"><?= $track->distance() ?></div>
<div class="col-sm-2">
<input type="text" class="form-control" id="trackName<?= $track->id ?>" placeholder="День №__" value="<?= $track->name ?>">
@ -47,15 +48,24 @@
</div>
<div class="col-sm-2">
<a href="/edittrack/deletetrack/id/<?= $track->id ?>" class="btn btn-danger" onclick="return confirm('Вы уверены, что хотите удалить фрагмент трека?')" title="Удалить фрагмент трека"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>
<a href="#" class="btn btn-default" onclick="loadTrackDetails(<?= $track->id ?>)" title="Просмотреть точки"><span class="glyphicon glyphicon-list" aria-hidden="true"></span></a>
<?php if ($tracksCounter < count($tracks)):?>
<a href="/edittrack/mergetrack/id/<?= $track->id ?>" class="btn btn-default" onclick="return confirm('Вы уверены, что хотите совместить фрагмент трека с идущим ниже?')" title="Слить с идущим ниже"><span class="glyphicon glyphicon-resize-small" aria-hidden="true"></span></a>
<a href="#trackpointsList<?= $track->id ?>" class="btn btn-default" onclick="loadTrackDetails(<?= $track->id ?>)" title="Просмотреть точки"><span class="glyphicon glyphicon-list" aria-hidden="true"></span></a>
<?php if ($tracksCounter < count($tracks)): ?>
<a href="/edittrack/mergetrack/id/<?= $track->id ?>" class="btn btn-default" onclick="return confirm('Вы уверены, что хотите совместить фрагмент трека с идущим ниже?')" title="Слить с идущим ниже"><span class="glyphicon glyphicon-resize-small" aria-hidden="true"></span></a>
<?php endif; ?>
</div>
</div>
</form>
<div id="trackpointsList<?= $track->id ?>"></div>
<?php $tracksCounter++; endforeach; ?>
<div id="trackpointsContainer<?= $track->id ?>" style="display: none;">
<table style="height: 500px; width: 100%;">
<tr>
<td style="width: 50%;"><div id="trackpointsList<?= $track->id ?>" style="overflow-y: scroll; height: 500px;"></div></td>
<td style="width: 50%;"><div id="trackpointsMap<?= $track->id ?>" style="height: 500px;"></div></td>
</tr>
</table>
</div>
<?php $tracksCounter++;
endforeach;
?>
<span id="trackSavedOK" style="color: #999; display: none;">изменения сохранены...</span>
<span id="trackSavedError" style="color: #900; display: none;">при сохранении возникла ошибка!</span>
<br/>
@ -66,7 +76,7 @@
<h3 onclick="$('#waypointsBlock').toggle()" style="cursor: pointer;">Путевые точки (<?= count($waypoints) ?>)</h3>
<div id="waypointsBlock" style="display: none;">
<!--<hr/>-->
<?php foreach ($waypoints as $waypoint): ?>
<?php foreach ($waypoints as $waypoint): ?>
<form onfocusout="saveChangesWaypoint(<?= $waypoint->id ?>)" class="form-horizontal">
<div class="form-group">
<div class="col-sm-3">
@ -81,13 +91,23 @@
</div>
</form>
<!--<hr/>-->
<?php endforeach; ?>
<?php endforeach; ?>
<span id="waypointSavedOK" style="color: #999; display: none;">изменения сохранены...</span>
<span id="waypointSavedError" style="color: #900; display: none;">при сохранении возникла ошибка!</span>
</div>
<?php endif; ?>
<script lang="javascript">
var tracks = new Array;
var maps = new Array;
var markers = new Array;
var icon = L.icon({
iconUrl: '/ico/marker.png',
iconSize: [32, 37],
iconAnchor: [16, 37],
popupAnchor: [0, 1]
});
function saveChangesTrip()
{
$('#tripSavedOK').hide();
@ -163,15 +183,34 @@
function loadTrackDetails(id)
{
$('#trackpointsContainer' + id).toggle();
if ($('#trackpointsMap' + id).text() != '') {
return true;
}
$.ajax({
url: "/edittrack/gettrackdetails/id/" + id,
method: "POST",
success: function (data) {
$('#trackpointsList'+id).html('');
$('#trackpointsList' + id).html('');
if (typeof (data) != 'undefined') {
latlngs = new Array();
for (var i = 0; i < data.length; i++) {
$(makeRow(data[i])).appendTo('#trackpointsList'+id);
$(makeRow(data[i])).appendTo('#trackpointsList' + id);
latlngs.push({lat: data[i]['lat'], lng: data[i]['lng']})
}
maps[id] = L.map('trackpointsMap' + id, {zoomControl: true}).setView([latlngs[1]['lat'], latlngs[1]['lng']], 13);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(maps[id]);
tracks[id] = L.polyline(latlngs, {color: '#F00', width: 4, opacity: 0.8});
maps[id].addLayer(tracks[id]);
markers[id] = L.marker([latlngs[1]['lat'], latlngs[1]['lng']], {icon: icon});
maps[id].addLayer(markers[id])
}
},
error: function (data) {
@ -182,11 +221,17 @@
function makeRow(data)
{
row = '<div class="trackPoint">';
row += data.id + ' - ' + data.lat + ' / '+ data.lng;
row += ' <a href="/edittrack/cut/id/'+data.id+'" title="Разрезать трек в этой точке"><span class="glyphicon glyphicon-resize-full" aria-hidden="true"></span></a> ';
row = '<div class="trackPoint" onmouseover="moveMarker(' + data.trackId + ', ' + data.lat + ', ' + data.lng + ')">';
row += data.id + ' - ' + data.lat + ' / ' + data.lng;
row += ' <a href="/edittrack/cut/id/' + data.id + '" title="Разрезать трек в этой точке"><span class="glyphicon glyphicon-resize-full" aria-hidden="true"></span></a> ';
row += '</div>';
return row;
}
function moveMarker(mapId, lat, lng)
{
markers[mapId].setLatLng([lat, lng]);
maps[mapId].setView([lat, lng], maps[mapId].getZoom());
}
</script>