Support step based rounding of the radius.

README.md

@@ -83,25 +83,24 @@ $GLOBALS['TL_DCA']['tl_page']['fields']['coordinates'] = [
 
 $GLOBALS['TL_DCA']['tl_page']['fields']['radius'] = [
     'label'     => ['Radius', 'Angabe des Radius in Metern'],
-    'inputType' => 'text',
-    'eval'      => [
-        'rgxp'     => 'natural',
+    'inputType' => 'leaflet_radius', // Optional, you can use a text widget as well
+    'eval'      => [      
         'default'  => 500,
         'minval'   => 100,
         'maxval'   => 5000,
+        'steps'    => 100, // Round value to the closest 100m.
         'tl_class' => 'w50',
     ],
     'sql' => 'varchar(255) NOT NULL default \'\''
 ];
 ```
 
-If you want to add an wizard icon to the radius field as well, a wizard is shipped with. You only have to add the 
-callback and define the coordinates field relation. 
+If you want to add an wizard icon to the radius field as well, you only have to reference the coordinates field.
 
 ```php
 $GLOBALS['TL_DCA']['tl_page']['fields']['radius'] = [
     'label'     => ['Radius', 'Angabe des Radius in Metern'],
-    'inputType' => 'text',
+    'inputType' => 'leaflet_radius',
     'eval'      => [
         'rgxp'        => 'natural',
         'default'     => 500,
@@ -110,9 +109,6 @@ $GLOBALS['TL_DCA']['tl_page']['fields']['radius'] = [
         'tl_class'    => 'w50 wizard',
         'coordinates' => 'coordinates'
     ],
-    'wizard' => [
-        ['netzmacht.contao_leaflet_geocode.listeners.radius_wizard', 'generateWizard'],
-    ],
     'sql' => 'varchar(255) NOT NULL default \'\''
 ];
 ```

src/Resources/contao/config/config.php

@@ -11,3 +11,4 @@
  */
 
 $GLOBALS['BE_FFL']['leaflet_geocode'] = 'Netzmacht\Contao\Leaflet\GeocodeWidget\Widget\GeocodeWidget';
+$GLOBALS['BE_FFL']['leaflet_radius']  = 'Netzmacht\Contao\Leaflet\GeocodeWidget\Widget\RadiusWidget';

src/Resources/contao/templates/be_widget_leaflet_radius.html5

@@ -0,0 +1,13 @@
+<div class="<?= $this->wrapperClass ?>">
+    <input type="text"
+           name="<?= $this->name ?>"
+           id="ctrl_<?= $this->id ?>"
+           class="tl_text tl_leaflet_geocode<?= $this->class ?>"
+           value="<?= $this->value ?>"<?= $this->attributes ?>
+           onfocus="Backend.getScrollOffset()"
+    >
+
+    <?php if ($this->coordinates): ?>
+        <a href="#" onclick="$('ctrl_<?= $this->coordinates ?>_toggle').click();return false;"><img src="bundles/leafletgeocodewidget/img/map.png"></a>,
+    <?php endif ?>
+</div>

src/Resources/public/js/geocode.widget.js

@@ -49,12 +49,22 @@ var LeafletGeocodeMarkerPicker = LeafletGeocodeAbstractPicker.extend({
 
 var LeafletGeocodeCirclePicker = LeafletGeocodeAbstractPicker.extend({
     apply: function (coordinatesInput, radiusInput) {
+        var radius      = '';
         var coordinates = this.marker
             ? ( this.marker.getLatLng().lat + ',' + this.marker.getLatLng().lng)
             : '';
 
         coordinatesInput.set('value', coordinates);
-        radiusInput.set('value', this.marker ? Math.round(this.marker.getRadius()) : '');
+
+        if (this.marker) {
+            radius = Math.round(this.marker.getRadius());
+
+            if (this.options.radius.steps > 0) {
+                radius = (this.options.radius.steps * Math.round(radius / this.options.radius.steps));
+            }
+        }
+
+        radiusInput.set('value', radius);
     },
     _panTo: function () {
         this.map.fitBounds(this.marker.getBounds());
@@ -66,6 +76,10 @@ var LeafletGeocodeCirclePicker = LeafletGeocodeAbstractPicker.extend({
         this.marker.on('pm:markerdragend', function () {
             var radius = this.marker.getRadius();
 
+            if (this.options.radius.steps > 0) {
+                radius = (this.options.radius.steps * Math.round(radius / this.options.radius.steps));
+            }
+
             if (this.options.radius.min > 0 && this.options.radius.min > radius) {
                 radius = this.options.radius.min;
             }

src/Widget/GeocodeWidget.php

@@ -159,6 +159,7 @@ class GeocodeWidget extends \Widget
             $options['min']          = isset($config['minval']) ? (int) $config['minval'] : 0;
             $options['max']          = isset($config['maxval']) ? (int) $config['maxval'] : 0;
             $options['defaultValue'] = isset($config['default']) ? (int) $config['default'] : 0;
+            $options['steps']        = isset($config['steps']) ? (int) $config['steps'] : 0;
         }
 
         return $options;

src/Widget/RadiusWidget.php

@@ -0,0 +1,99 @@
+<?php
+
+/**
+ * Geocode backend widget based on Leaflet.
+ *
+ * @package    netzmacht
+ * @author     David Molineus <david.molineus@netzmacht.de>
+ * @copyright  2016-2018 netzmacht David Molineus. All rights reserved.
+ * @license    LGPL-3.0 https://github.com/netzmacht/contao-leaflet-geocode-widget/blob/master/LICENSE
+ * @filesource
+ */
+
+namespace Netzmacht\Contao\Leaflet\GeocodeWidget\Widget;
+
+use Contao\BackendTemplate;
+use Contao\TextField;
+
+/**
+ * Class RadiusWidget
+ */
+class RadiusWidget extends TextField
+{
+    /**
+     * Template name.
+     *
+     * @var string
+     */
+    protected $widgetTemplate = 'be_widget_leaflet_radius';
+
+    /**
+     * {@inheritdoc}
+     */
+    public function __get($strKey)
+    {
+        if ($strKey === 'rgxp') {
+            return 'natural';
+        }
+
+        return parent::__get($strKey);
+    }
+
+    /**
+     * Generate the widget.
+     *
+     * @return string
+     */
+    public function generate()
+    {
+        $wrapperClass = $this->coordinates ? 'wizard' : '';
+
+        if (!$this->multiple || !$this->size) {
+            $this->size = 1;
+        } else {
+            $wrapperClass .= ' wizard_' . $this->size;
+        }
+
+        if (!is_array($this->value)) {
+            $this->value = [$this->value];
+        }
+
+        $buffer = '';
+
+        for ($index = 0; $index < $this->size; $index++) {
+            $template = new BackendTemplate($this->widgetTemplate);
+            $template->setData(
+                [
+                    'wrapperClass' => trim($wrapperClass),
+                    'widget'       => $this,
+                    'value'        => \StringUtil::specialchars($this->value[$index]),
+                    'class'        => $this->strClass ? ' ' . $this->strClass : '',
+                    'id'           => $this->strId . (($this->size > 1) ? '_' . $index : ''),
+                    'name'         => $this->strName . (($this->size > 1) ? '[]' : ''),
+                    'attributes'   => $this->getAttributes(),
+                    'wizard'       => $this->wizard,
+                    'label'        => $this->strLabel,
+                    'coordinates'  => $this->coordinates
+                ]
+            );
+
+            $buffer .= $template->parse();
+        }
+
+        return $buffer;
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    protected function validator($varInput)
+    {
+        if (is_numeric($varInput) && $this->steps > 0) {
+            $steps    = (int) $this->steps;
+            $varInput = (int) $varInput;
+            $varInput = ($steps * round($varInput / $steps));
+        }
+
+        return parent::validator($varInput);
+    }
+}