Add apikey parameter and map onclick event

README.md

@@ -34,7 +34,7 @@ Open `config/admin.php` and add the following configuration to the extensions se
                     'api_key' => '',
                 ],
 
-                'yadex' => [
+                'yandex' => [
                     'api_key' => '',
                 ],
 
@@ -66,6 +66,12 @@ $form->latlong('latitude', 'longitude', 'Position')->height(500);
 
 // Set default position
 $form->latlong('latitude', 'longitude', 'Position')->default(['lat' => 90, 'lng' => 90]);
+
+$form->latlong('lat','lon')->callbacks([
+            'address'=>'parseAddress', //parseAddress is js function name with data param. You may rename it what you want. Define it in external js before using!
+            'district'=>'parseDistrict',
+            'metro'=>'parseMetro'
+        ]);
 ```
 
 Use in show page

src/Latlong.php

@@ -6,18 +6,15 @@
 
 class Latlong extends Field
 {
-    /**
-     * Set to true to automatically get the current position from the browser
-     * @var bool
-     */
-    protected $autoPosition = false;
     /**
      * Column name.
      *
      * @var array
      */
     protected $column = [];
 
+    protected $callbacks;
+
     /**
      * @var string
      */
@@ -70,24 +67,14 @@ public function height(int $height)
         return $this;
     }
 
-    /**
-     * Set true to automatically get the current position from the browser on page load
-     * @param $bool
-     * @return Latlong
-     */
-    public function setAutoPosition($bool) {
-        $this->autoPosition = $bool;
-        return $this;
-    }
-
     /**
      * {@inheritdoc}
      *
      * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View|string
      */
     public function render()
     {
-        $this->script = Extension::getProvider()->setAutoPosition($this->autoPosition)->applyScript($this->id);
+        $this->script = Extension::getProvider()->applyScript($this->id,$this->callbacks);
 
         $variables = [
             'height'   => $this->height,
@@ -96,4 +83,8 @@ public function render()
 
         return parent::render()->with($variables);
     }
+
+    public function callbacks($callbacks=[]){
+        $this->callbacks=$callbacks;
+    }
 }

src/Map/AbstractMap.php

@@ -2,15 +2,8 @@
 
 namespace Encore\Admin\Latlong\Map;
 
-
 abstract class AbstractMap
 {
-    /**
-     * Set to true to automatically get the current position from the browser
-     * @var bool
-     */
-    protected $autoPosition = false;
-
     /**
      * @var string
      */
@@ -35,20 +28,9 @@ public function getAssets()
         return [$this->api];
     }
 
-    /**
-     * Set true to automatically get the current position from the browser on page load
-     * @param $bool
-     * @return $this
-     */
-    public function setAutoPosition($bool) {
-        $this->autoPosition = $bool;
-        return $this;
-    }
-
     /**
      * @param array $id
-     * @param bool $autoPosition
      * @return string
      */
-    abstract public function applyScript(array $id);
-}
+    abstract public function applyScript(array $id,array $callbacks=[]);
+}

src/Map/Yandex.php

@@ -7,25 +7,113 @@ class Yandex extends AbstractMap
     /**
      * @var string
      */
-    protected $api = '//api-maps.yandex.ru/2.1/?lang=ru_RU';
+    protected $api = 'https://api-maps.yandex.ru/2.1/?apikey=%s&lang=ru_RU';
 
     /**
      * {@inheritdoc}
      */
-    public function applyScript(array $id)
+    public function applyScript(array $id,$callbacks=[])
     {
-        return <<<EOT
+        $addjs='';
+        if (isset($callbacks['address']) && !empty($callbacks['address'])){
+            $addjs.=<<<JS
+var addr_callback_{$id['lat']}{$id['lng']}=1;
+JS;
+        }
+        else{
+            $callbacks['address']='console.log';
+        }
+        if (isset($callbacks['metro']) && !empty($callbacks['metro'])){
+            $addjs.=<<<JS
+var metro_callback_{$id['lat']}{$id['lng']}=1;
+JS;
+        }
+        else{
+            $callbacks['metro']='console.log';
+        }
+        if (isset($callbacks['district']) && !empty($callbacks['district'])){
+            $addjs.=<<<JS
+var district_callback_{$id['lat']}{$id['lng']}=1;
+JS;
+        }
+        else{
+            $callbacks['district']='console.log';
+        }
+        if (isset($callbacks['map']) && !empty($callbacks['map'])){
+            $addjs.=<<<JS
+var map_callback_{$id['lat']}{$id['lng']}=1;
+JS;
+        }
+        if (isset($callbacks['placemark']) && !empty($callbacks['placemark'])){
+            $addjs.=<<<JS
+var placemark_callback_{$id['lat']}{$id['lng']}=1;
+JS;
+        }
+        return <<<JS
+{$addjs}
         (function() {
             function init(name) {
                 ymaps.ready(function(){
-
+                    function filladdress(coords){
+                        if(typeof addr_callback_{$id['lat']}{$id['lng']}!=='undefined'){
+                            ymaps.geocode(coords).then(function (res) {
+                                if(res.geoObjects.getLength()>0){
+                                    var firstGeoObject = res.geoObjects.get(0);
+
+                                    var administrativeAreas=firstGeoObject.getAdministrativeAreas();
+                                    var localities=firstGeoObject.getLocalities();
+                                    var thoroughfare=firstGeoObject.getThoroughfare();
+                                    var premiseNumber=firstGeoObject.getPremiseNumber();
+                                    var premise=firstGeoObject.getPremise();
+                                    var country=firstGeoObject.getCountry();
+                                    var countryCode=firstGeoObject.getCountryCode();
+                                    var addressLine=firstGeoObject.getAddressLine();
+                                    var address={
+                                        country:country,
+                                        countryCode:countryCode,
+                                        administrativeAreas:administrativeAreas,
+                                        localities:localities,
+                                        thoroughfare:thoroughfare,
+                                        premiseNumber:premiseNumber,
+                                        premise:premise,
+                                        addressLine:addressLine,
+                                    };
+                                    {$callbacks['address']}(address);
+                                }
+                            });
+                        }
+                        if(typeof metro_callback_{$id['lat']}{$id['lng']}!=='undefined'){
+                            ymaps.geocode(coords, {
+                                kind: 'metro',
+                                results: 10,
+                                json: true,                          
+                            }).then(function (res) {
+                                var metrolist = res.GeoObjectCollection.featureMember;
+                                {$callbacks['metro']}(metrolist);
+                            });
+                        }
+                        if(typeof district_callback_{$id['lat']}{$id['lng']}!=='undefined'){
+                            ymaps.geocode(coords, {
+                                kind: 'district',                           
+                                json: true,                          
+                            }).then(function (res) {
+                                var dstlist = res.GeoObjectCollection.featureMember;
+                                var districts=[];
+                                dstlist.forEach(function(dst) {
+                                  districts.push(dst.GeoObject.name);
+                                });
+                                {$callbacks['district']}(districts.reverse());
+                            });
+                        }
+                    }
                     var lat = $('#{$id['lat']}');
                     var lng = $('#{$id['lng']}');
 
                     var myMap = new ymaps.Map("map_"+name, {
                         center: [lat.val(), lng.val()],
-                        zoom: 18
-                    }); 
+                        zoom: 17,
+                        controls: ['zoomControl', 'typeSelector', 'fullscreenControl', 'rulerControl','geolocationControl']
+                    });
 
                     var myPlacemark = new ymaps.Placemark([lat.val(), lng.val()], {
                     }, {
@@ -36,15 +124,57 @@ function init(name) {
                     myPlacemark.events.add(['dragend'], function (e) {
                         lat.val(myPlacemark.geometry.getCoordinates()[0]);
                         lng.val(myPlacemark.geometry.getCoordinates()[1]);
+                        filladdress([lat.val(),lng.val()]);
                     });                
 
                     myMap.geoObjects.add(myPlacemark);
+
+                    myMap.events.group().add('click', function (e) {
+                        coords = e.get('coords');
+                        myPlacemark.geometry.setCoordinates(coords);
+                        filladdress(coords);
+                        lat.val(coords[0]);
+                        lng.val(coords[1]);
+                    });
+
+                    lat.on('change',function(){
+                        if (lat.val().length>0 && isFinite(lat.val())){
+                            myPlacemark.geometry.setCoordinates([lat.val(),lng.val()]);
+                            myMap.setCenter([lat.val(),lng.val()]);
+                            filladdress([lat.val(),lng.val()]);
+                        }
+                    });
+                    lng.on('change',function(){
+                        if (lng.val().length>0 && isFinite(lng.val())){
+                            myPlacemark.geometry.setCoordinates([lat.val(),lng.val()]);
+                            myMap.setCenter([lat.val(),lng.val()]);
+                            filladdress([lat.val(),lng.val()]);
+                        }
+                    });
+
+                    ymaps.geolocation.get({
+                        mapStateAutoApply: true
+                    }).then(function (result) {
+                        if (lat.val().length==0 || lng.val().length==0){
+                            var pos=result.geoObjects.position;
+                            lat.val(pos[0]);
+                            lng.val(pos[1]);
+                            myPlacemark.geometry.setCoordinates(pos);
+                            myMap.setCenter(pos);
+                        }
+                    });
+
+                    if(typeof map_callback_{$id['lat']}{$id['lng']}!=='undefined'){
+                        {$callbacks['map']}(myMap);
+                    }
+                    if(typeof placemark_callback_{$id['lat']}{$id['lng']}!=='undefined'){
+                        {$callbacks['placemark']}(myPlacemark);
+                    }
                 });
-
             }
 
             init('{$id['lat']}{$id['lng']}');
         })();
-EOT;
+JS;
     }
-}
+}