diff --git a/ground/controllers/IndexController.php b/ground/controllers/IndexController.php
index e64cb97..0010718 100644
--- a/ground/controllers/IndexController.php
+++ b/ground/controllers/IndexController.php
@@ -10,10 +10,11 @@ class IndexController extends Controller
{
self::addScript('/js/jquery-2.1.0.min.js');
self::addScript('/js/jquery-ui-1.10.4.custom.min.js');
- self::addScript('http://api-maps.yandex.ru/2.0-stable/?load=package.full&lang=ru-RU&mode=release');
+ self::addScript('http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js');
self::addScript('/js/main.js?ver='.App::getConfig('version'));
self::addScript('/js/bootstrap.min.js');
self::addStyle('/css/style.css?ver='.App::getConfig('version'));
+ self::addStyle('http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css');
self::addStyle('/css/bootstrap.min.css');
self::addStyle('/css/bootstrap-theme.min.css');
diff --git a/ground/controllers/JsonController.php b/ground/controllers/JsonController.php
index e6898c6..0b76365 100644
--- a/ground/controllers/JsonController.php
+++ b/ground/controllers/JsonController.php
@@ -21,6 +21,7 @@ class JsonController extends Controller
$result[$point['id']]['name'] = $point['name'];
$result[$point['id']]['lat'] = $point['lat'];
$result[$point['id']]['lng'] = $point['lng'];
+ $result[$point['id']]['categoryId'] = $point['categoryId'];
$result[$point['id']]['categoryIcon'] = $categories[$point['categoryId']]['icon'];
}
diff --git a/ground/views/layout.php b/ground/views/layout.php
index a356702..5222b7b 100644
--- a/ground/views/layout.php
+++ b/ground/views/layout.php
@@ -22,6 +22,7 @@
+
diff --git a/public/js/main.js b/public/js/main.js
index 76d9ccc..f477593 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -35,9 +35,9 @@ function resetStatus()
}
// -----------------------------------------------------------------------------
-ymaps.ready(init);
+$(document).ready(function(){init()});
var myMap;
-var categories;
+var categories = Array();
var points = Array();
var pointsSources = Array();
var search;
@@ -57,107 +57,121 @@ function getURLParameter(name) {
* @returns true
*/
function init() {
- questLayer = function () {
- return new ymaps.Layer(
- 'http://otile1.mqcdn.com/tiles/1.0.0/osm/%z/%x/%y.png', {projection: ymaps.projection.sphericalMercator});
- };
- ymaps.layer.storage.add('quest#layer', questLayer);
- ymaps.mapType.storage.add('quest#type', new ymaps.MapType('MapQuest', ['quest#layer']));
-
- osmLayer = function () {
- return new ymaps.Layer(
- 'http://c.tile.openstreetmap.org/%z/%x/%y.png', {projection: ymaps.projection.sphericalMercator});
- };
- ymaps.layer.storage.add('osm#layer', osmLayer);
- ymaps.mapType.storage.add('osm#type', new ymaps.MapType('OpenStreetMap', ['osm#layer']));
-
- googleLayer = function () {
- return new ymaps.Layer('http://mt0.google.com/vt/lyrs=s@176000000&hl=ru&%c', {projection: ymaps.projection.sphericalMercator,tileTransparent: true});
- }
- ymaps.layer.storage.add('google#layer', googleLayer);
- ymaps.mapType.storage.add('google#type', new ymaps.MapType('Google Maps', ['google#layer']));
-
- myMap = new ymaps.Map("map", {
- center: [ymaps.geolocation.latitude, ymaps.geolocation.longitude],
- zoom: 12,
- type:'quest#type',
- behaviors: ['default', 'scrollZoom']
- });
-
- myMap.controls.add('mapTools');
- myMap.controls.add('smallZoomControl');
- myMap.controls.add('scaleLine');
-
- typeSelector = new ymaps.control.TypeSelector();
- typeSelector.addMapType('quest#type', 0);
- typeSelector.addMapType('google#type', 1);
- typeSelector.addMapType('yandex#publicMap', 2);
- typeSelector.addMapType('osm#type', 3);
- myMap.controls.add(typeSelector);
- myMap.copyrights.add('Участники OpenStreetMap');
- myMap.copyrights.add('Tiles courtesy of MapQuest');
+ myMap = L.map('map').setView([51.505, -0.09], 13);
+ L.tileLayer('http://otile1.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png', {
+ attribution: 'Map data © OpenStreetMap contributors, CC-BY-SA, Imagery © Mapbox',
+ maxZoom: 18
+ }).addTo(myMap);
+
+//
+// questLayer = function () {
+// return new ymaps.Layer(
+// 'http://otile1.mqcdn.com/tiles/1.0.0/osm/%z/%x/%y.png', {projection: ymaps.projection.sphericalMercator});
+// };
+// ymaps.layer.storage.add('quest#layer', questLayer);
+// ymaps.mapType.storage.add('quest#type', new ymaps.MapType('MapQuest', ['quest#layer']));
+//
+// osmLayer = function () {
+// return new ymaps.Layer(
+// 'http://c.tile.openstreetmap.org/%z/%x/%y.png', {projection: ymaps.projection.sphericalMercator});
+// };
+// ymaps.layer.storage.add('osm#layer', osmLayer);
+// ymaps.mapType.storage.add('osm#type', new ymaps.MapType('OpenStreetMap', ['osm#layer']));
+//
+// googleLayer = function () {
+// return new ymaps.Layer('http://mt0.google.com/vt/lyrs=s@176000000&hl=ru&%c', {projection: ymaps.projection.sphericalMercator,tileTransparent: true});
+// }
+// ymaps.layer.storage.add('google#layer', googleLayer);
+// ymaps.mapType.storage.add('google#type', new ymaps.MapType('Google Maps', ['google#layer']));
+//
+// myMap = new ymaps.Map("map", {
+// center: [ymaps.geolocation.latitude, ymaps.geolocation.longitude],
+// zoom: 12,
+// type:'quest#type',
+// behaviors: ['default', 'scrollZoom']
+// });
+//
+// myMap.controls.add('mapTools');
+// myMap.controls.add('smallZoomControl');
+// myMap.controls.add('scaleLine');
+//
+// typeSelector = new ymaps.control.TypeSelector();
+// typeSelector.addMapType('quest#type', 0);
+// typeSelector.addMapType('google#type', 1);
+// typeSelector.addMapType('yandex#publicMap', 2);
+// typeSelector.addMapType('osm#type', 3);
+// myMap.controls.add(typeSelector);
+// myMap.copyrights.add('Участники OpenStreetMap');
+// myMap.copyrights.add('Tiles courtesy of MapQuest');
initCategories()
- getPoints();
+// getPoints();
- myMap.events.add('click', function(e) {
- if (!myMap.balloon.isOpen()) {
- if (status == statusHunting)
- {
- coords = e.get('coordPosition');
+// myMap.events.add('click', function(e) {
+// if (!myMap.balloon.isOpen()) {
+// if (status == statusHunting)
+// {
+// coords = e.get('coordPosition');
+//
+// $('#addPointId').remove();
+// $('#addPointForm input').val('');
+// $("#addPointCategoryId option" ).attr('selected', null);
+// $('#addPointLat').val(coords[0].toPrecision(11));
+// $('#addPointLng').val(coords[1].toPrecision(11));
+//
+// $('#myModalLabel').text('Добавление новой точки');
+// $('#addPointModal').modal('show');
+// } else if (status == statusReHunting)
+// {
+// resetStatus();
+// coords = e.get('coordPosition');
+//
+// $('#addPointLat').val(coords[0].toPrecision(11));
+// $('#addPointLng').val(coords[1].toPrecision(11));
+//
+// $('#myModalLabel').text('Редактирование точки');
+// $('#addPointModal').modal('show');
+// }
+// }
+// else {
+// myMap.balloon.close();
+// }
+// });
+//
+// myMap.events.add('boundschange', function(e) {
+// if (!myMap.balloon.isOpen() && $('#routeWindow').css('display') == 'none')
+// {
+// history.pushState({}, document.title, "/?lat=" + e.get('newCenter')[0] + "&lng=" + e.get('newCenter')[1] + "&zoom=" + e.get('newZoom'));
+// }
+// });
+//
+// points.im = new ymaps.Placemark(
+// [ymaps.geolocation.latitude, ymaps.geolocation.longitude],
+// {
+// balloonContentHeader: 'Вы здесь',
+// hintContent: 'Ваше местоположение',
+// balloonContent:
+// ''
+// },
+// {
+// iconImageHref: '/ico/man.png',
+// iconImageSize: [32, 37],
+// iconImageOffset: [-16, -33],
+// }
+// );
+// myMap.geoObjects.add(points.im);
+//
+// $("#wayPoints").sortable();
+// $("#wayPoints").disableSelection();
- $('#addPointId').remove();
- $('#addPointForm input').val('');
- $("#addPointCategoryId option" ).attr('selected', null);
- $('#addPointLat').val(coords[0].toPrecision(11));
- $('#addPointLng').val(coords[1].toPrecision(11));
-
- $('#myModalLabel').text('Добавление новой точки');
- $('#addPointModal').modal('show');
- } else if (status == statusReHunting)
- {
- resetStatus();
- coords = e.get('coordPosition');
-
- $('#addPointLat').val(coords[0].toPrecision(11));
- $('#addPointLng').val(coords[1].toPrecision(11));
-
- $('#myModalLabel').text('Редактирование точки');
- $('#addPointModal').modal('show');
- }
- }
- else {
- myMap.balloon.close();
- }
- });
-
- myMap.events.add('boundschange', function(e) {
- if (!myMap.balloon.isOpen() && $('#routeWindow').css('display') == 'none')
- {
- history.pushState({}, document.title, "/?lat=" + e.get('newCenter')[0] + "&lng=" + e.get('newCenter')[1] + "&zoom=" + e.get('newZoom'));
- }
- });
-
- points.im = new ymaps.Placemark(
- [ymaps.geolocation.latitude, ymaps.geolocation.longitude],
- {
- balloonContentHeader: 'Вы здесь',
- hintContent: 'Ваше местоположение',
- balloonContent:
- ''
- },
- {
- iconImageHref: '/ico/man.png',
- iconImageSize: [32, 37],
- iconImageOffset: [-16, -33],
- }
- );
- myMap.geoObjects.add(points.im);
-
- $("#wayPoints").sortable();
- $("#wayPoints").disableSelection();
+ myMap.on('moveend', function(e) {
+ if (!myMap._popup && $('#routeWindow').css('display') == 'none')
+ {
+ history.pushState({}, document.title, "/?lat=" + myMap.getCenter().lat + "&lng=" + myMap.getCenter().lng + "&zoom=" + myMap.getZoom());
+ }
+ });
return true;
}
@@ -170,22 +184,10 @@ function init() {
function constructPoint(data)
{
id = data['id'];
- points[id] = new ymaps.Placemark(
- [data['lat'], data['lng']], {
- hintContent: data['name'],
- id: id
- },
- {
- iconImageHref: data['categoryIcon'],
- iconImageSize: [32, 37],
- iconImageOffset: [-16, -33],
- openEmptyBalloon: true,
- balloonCloseButton: true
- });
- points[id].events.add('click', function(e) {
- showInfo(e.get('target').properties.get('id'));
- });
+ points[id] = L.marker(
+ [data['lat'], data['lng']], {icon: categories[data['categoryId']], title: data['name'],id: id}
+ ).on('click', function(e){showInfo(e.target.options.id);});
return points[id];
}
@@ -200,7 +202,7 @@ function getPoints()
url: "/json/points/",
success: function(data) {
for (var k in data) {
- myMap.geoObjects.add(constructPoint(data[k]));
+ constructPoint(data[k]).addTo(myMap);
}
if (getURLParameter('point') != 'null')
@@ -212,7 +214,7 @@ function getPoints()
buildRoute();
} else if ((getURLParameter('lat') != 'null') && (getURLParameter('lng') != 'null') && (getURLParameter('zoom') != 'null'))
{
- myMap.setCenter([getURLParameter('lat'), getURLParameter('lng')], getURLParameter('zoom'));
+ myMap.setView([getURLParameter('lat'), getURLParameter('lng')], getURLParameter('zoom'));
}
}
});
@@ -227,9 +229,10 @@ function getPoints()
*/
function showInfo(id)
{
- if (!(id in points) || points[id].properties.get('balloonContent') == undefined)
+ marker = points[id];
+ if (!(id in points) || marker.options.description == undefined)
{
- points[id].properties.set('balloonContent', 'Загрузка...');
+ marker.bindPopup("Загрузка...").openPopup();
$.ajax({
url: "/json/point/id/" + id,
success: function(data) {
@@ -254,13 +257,9 @@ function showInfo(id)
description = description + ' Подробнее...';
description = description + '';
- points[id].properties.set('balloonContent', description);
-
- point = getURLParameter('point');
- if (point != null && id == point)
- {
- points[point].balloon.open();
- }
+
+ marker.options.description = description;
+ marker.bindPopup(marker.options.description, {maxWidth: 500}).openPopup();
}
});
}
@@ -278,7 +277,17 @@ function initCategories()
$.ajax({
url: "/json/categories/",
success: function(data) {
- categories = data;
+ //categories = data;
+ for (var k in data) {
+ categories[data[k]['id']] = L.icon({
+ iconUrl: data[k]['icon'],
+ iconSize: [32, 37], // size of the icon
+ iconAnchor: [16, 37], // point of the icon which will correspond to marker's location
+ popupAnchor: [0, 1] // point from which the popup should open relative to the iconAnchor
+ });
+ }
+
+ getPoints();
}
});