Add icon support.

module/assets/js/contao-leaflet.js

@@ -3,6 +3,8 @@ L.Contao = L.Class.extend( {
 
     maps: {},
 
+    icons: {},
+
     addMap: function (id, map) {
         this.maps[id] = map;
 
@@ -19,9 +21,32 @@ L.Contao = L.Class.extend( {
         return this.maps[id];
     },
 
+    addIcon: function(id, icon) {
+        this.icons[id] = icon;
+        this.fire('icon:added', { id: id, icon: icon});
+
+        return this;
+    },
+
+    getIcon: function(id) {
+        if (typeof (this.icons[id]) === 'undefined') {
+            return null;
+        }
+
+        return this.icons[id];
+    },
+
     pointToLayer: function(feature, latlng) {
         var marker = L.marker(latlng, feature.properties.options);
 
+        if (feature.properties && feature.properties.icon) {
+            var icon = this.getIcon(feature.properties.icon);
+
+            if (icon) {
+                marker.setIcon(icon);
+            }
+        }
+
         this.applyFeatureMethods(marker, feature);
         this.fire('marker:created', { marker: marker, feature: feature, latlng: latlng });
 

module/config/config.php

@@ -25,9 +25,10 @@ $GLOBALS['TL_CTE']['includes']['leaflet'] = 'Netzmacht\Contao\Leaflet\LeafletMap
 /*
  * Models.
  */
-$GLOBALS['TL_MODELS']['tl_leaflet_map']     = 'Netzmacht\Contao\Leaflet\Model\MapModel';
-$GLOBALS['TL_MODELS']['tl_leaflet_layer']   = 'Netzmacht\Contao\Leaflet\Model\LayerModel';
 $GLOBALS['TL_MODELS']['tl_leaflet_control'] = 'Netzmacht\Contao\Leaflet\Model\ControlModel';
+$GLOBALS['TL_MODELS']['tl_leaflet_icon']    = 'Netzmacht\Contao\Leaflet\Model\IconModel';
+$GLOBALS['TL_MODELS']['tl_leaflet_layer']   = 'Netzmacht\Contao\Leaflet\Model\LayerModel';
+$GLOBALS['TL_MODELS']['tl_leaflet_map']     = 'Netzmacht\Contao\Leaflet\Model\MapModel';
 $GLOBALS['TL_MODELS']['tl_leaflet_marker']  = 'Netzmacht\Contao\Leaflet\Model\MarkerModel';
 
 
@@ -45,6 +46,7 @@ $GLOBALS['LEAFLET_MAPPERS'][] = 'Netzmacht\Contao\Leaflet\Mapper\Control\ScaleCo
 $GLOBALS['LEAFLET_MAPPERS'][] = 'Netzmacht\Contao\Leaflet\Mapper\Control\LayersControlMapper';
 $GLOBALS['LEAFLET_MAPPERS'][] = 'Netzmacht\Contao\Leaflet\Mapper\Control\AttributionControlMapper';
 $GLOBALS['LEAFLET_MAPPERS'][] = 'Netzmacht\Contao\Leaflet\Mapper\UI\MarkerMapper';
+$GLOBALS['LEAFLET_MAPPERS'][] = 'Netzmacht\Contao\Leaflet\Mapper\Type\ImageIconMapper';
 
 /*
  * Leaflet encoders.
@@ -121,6 +123,7 @@ $GLOBALS['LEAFLET_CONTROLS'][] = 'layers';
 $GLOBALS['LEAFLET_CONTROLS'][] = 'scale';
 $GLOBALS['LEAFLET_CONTROLS'][] = 'attribution';
 
+$GLOBALS['LEAFLET_ICONS'] = array('image', 'div');
 
 /*
  * Leaflet tile layer providers.

module/dca/tl_leaflet_icon.php

@@ -5,7 +5,6 @@ $GLOBALS['TL_DCA']['tl_leaflet_icon'] = array
     'config' => array(
         'dataContainer'    => 'Table',
         'enableVersioning' => true,
-        'ptable'           => 'tl_leaflet_layer',
         'sql'              => array
         (
             'keys' => array
@@ -23,12 +22,11 @@ $GLOBALS['TL_DCA']['tl_leaflet_icon'] = array
             'fields'                  => array('title'),
             'flag'                    => 1,
             'headerFields'            => array('title', 'type'),
-            'child_record_callback'   => array('Netzmacht\Contao\Leaflet\Dca\Marker', 'generateRow'),
         ),
         'label' => array
         (
-            'fields'                  => array('title'),
+            'fields'                  => array('title', 'type'),
-            'format'                  => '%s',
+            'format'                  => '%s <span class="tl_gray">[%s]</span>',
         ),
         'global_operations' => array
         (
@@ -87,23 +85,32 @@ $GLOBALS['TL_DCA']['tl_leaflet_icon'] = array
         )
     ),
 
+    'palettes' => array(
+        '__selector__' => array('type')
+    ),
+
     'metapalettes'    => array(
         'default' => array(
             'title'   => array('title', 'alias', 'type'),
-            'content' => array('tooltip', 'alt',),
+        ),
+        'image extends default' => array(
             'config'  => array(
-                ':hide',
+                '',
-                'iconUrl',
+                'iconImage',
-                'iconRetinaUrl',
+                'iconRetinaImage',
                 'iconAnchor',
                 'popupAnchor',
                 'iconClassName',
+            ),
+            'shadow'  => array(
                 'shadowImage',
                 'shadowRetinaImage',
                 'shadowAnchor',
             ),
-            'active'  => array('active')
+            'active' => array(
-        ),
+                'active'
+            )
+        )
     ),
 
     'fields' => array
@@ -136,6 +143,22 @@ $GLOBALS['TL_DCA']['tl_leaflet_icon'] = array
             'eval'      => array('mandatory' => false, 'maxlength' => 255, 'tl_class' => 'w50'),
             'sql'       => "varchar(255) NOT NULL default ''"
         ),
+        'type'                  => array
+        (
+            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['type'],
+            'exclude'   => true,
+            'inputType' => 'select',
+            'eval'      => array(
+                'mandatory'          => true,
+                'tl_class'           => 'w50',
+                'includeBlankOption' => true,
+                'submitOnChange'     => true,
+                'chosen'             => true,
+            ),
+            'options'   => &$GLOBALS['LEAFLET_ICONS'],
+            'reference' => &$GLOBALS['TL_LANG']['leaflet_icon'],
+            'sql'       => "varchar(32) NOT NULL default ''"
+        ),
         'active'                => array
         (
             'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['active'],
@@ -144,58 +167,58 @@ $GLOBALS['TL_DCA']['tl_leaflet_icon'] = array
             'eval'      => array('tl_class' => 'w50'),
             'sql'       => "char(1) NOT NULL default ''"
         ),
-        'iconUrl'         => array
+        'iconImage'         => array
         (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['iconUrl'],
+            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconImage'],
             'exclude'   => true,
             'inputType' => 'fileTree',
             'eval'      => array(
                 'filesOnly'  => true,
                  'fieldType'  => 'radio',
                  'mandatory'  => true,
-                 'tl_class'   => 'clr w50',
+                 'tl_class'   => 'clr',
                  'extensions' => 'gif,png,svg,jpg'
             ),
             'sql'       => "binary(16) NULL",
         ),
-        'iconRetinaUrl'   => array
+        'iconRetinaImage'   => array
         (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['iconRetinaUrl'],
+            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconRetinaImage'],
             'exclude'   => true,
             'inputType' => 'fileTree',
             'eval'      => array(
                  'filesOnly'  => true,
                  'fieldType'  => 'radio',
                  'mandatory'  => false,
-                 'tl_class'   => 'w50',
+                 'tl_class'   => 'clr',
                  'extensions' => 'gif,png,svg,jpg'
             ),
             'sql'       => "binary(16) NULL",
         ),
         'shadowImage'         => array
         (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['shadowImage'],
+            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowImage'],
             'exclude'   => true,
             'inputType' => 'fileTree',
             'eval'      => array(
                 'filesOnly'  => true,
                 'fieldType'  => 'radio',
                 'mandatory'  => false,
-                'tl_class'   => 'clr w50',
+                'tl_class'   => 'clr',
                 'extensions' => 'gif,png,svg,jpg'
             ),
             'sql'       => "binary(16) NULL",
         ),
         'shadowRetinaImage'   => array
         (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['shadowRetinaImage'],
+            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowRetinaImage'],
             'exclude'   => true,
             'inputType' => 'fileTree',
             'eval'      => array(
                 'filesOnly'  => true,
                 'fieldType'  => 'radio',
                 'mandatory'  => false,
-                'tl_class'   => 'w50',
+                'tl_class'   => 'clr',
                 'extensions' => 'gif,png,svg,jpg'
             ),
             'sql'       => "binary(16) NULL",

module/dca/tl_leaflet_marker.php

@@ -84,7 +84,6 @@ $GLOBALS['TL_DCA']['tl_leaflet_marker'] = array
         'default' => array(
             'title'   => array('title', 'alias', 'coordinates'),
             'content' => array('tooltip', 'alt', 'addPopup'),
-            'icon'    => array(':hide', 'customIcon'),
             'config'  => array(
                 ':hide',
                 'clickable',
@@ -93,23 +92,15 @@ $GLOBALS['TL_DCA']['tl_leaflet_marker'] = array
                 'zIndexOffset',
                 'opacity',
                 'riseOnHover',
-                'riseOffset'
+                'riseOffset',
+                'customIcon',
             ),
             'active'  => array('active')
         ),
     ),
     'metasubpalettes' => array(
         'addPopup'   => array('popupContent'),
-        'customIcon' => array(
+        'customIcon' => array('icon')
-            'icon',
-            'retinaIcon',
-            'iconAnchor',
-            'popupAnchor',
-            'iconClassName',
-            'shadowImage',
-            'shadowRetinaImage',
-            'shadowAnchor',
-        )
     ),
 
     'fields' => array
@@ -206,64 +197,20 @@ $GLOBALS['TL_DCA']['tl_leaflet_marker'] = array
             'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_marker']['customIcon'],
             'exclude'   => true,
             'inputType' => 'checkbox',
-            'eval'      => array('tl_class' => 'w50', 'submitOnChange' => true),
+            'eval'      => array('tl_class' => 'clr w50 m12', 'submitOnChange' => true),
             'sql'       => "char(1) NOT NULL default ''"
         ),
         'icon'         => array
         (
             'label'     => &$GLOBALS['TL_LANG']['tl_content']['icon'],
             'exclude'   => true,
-            'inputType' => 'fileTree',
+            'inputType' => 'select',
+            'options_callback' => array('Netzmacht\Contao\Leaflet\Dca\Marker', 'getIcons'),
             'eval'      => array(
-                'filesOnly'  => true,
-                 'fieldType'  => 'radio',
                  'mandatory'  => true,
-                 'tl_class'   => 'clr w50',
-                 'extensions' => 'gif,png,svg,jpg'
-            ),
-            'sql'       => "binary(16) NULL",
-        ),
-        'retinaIcon'   => array
-        (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['retinaIcon'],
-            'exclude'   => true,
-            'inputType' => 'fileTree',
-            'eval'      => array(
-                 'filesOnly'  => true,
-                 'fieldType'  => 'radio',
-                 'mandatory'  => false,
                  'tl_class'   => 'w50',
-                 'extensions' => 'gif,png,svg,jpg'
             ),
-            'sql'       => "binary(16) NULL",
+            'sql'       => "int(10) unsigned NOT NULL default '0'",
-        ),
-        'shadowImage'         => array
-        (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['shadowImage'],
-            'exclude'   => true,
-            'inputType' => 'fileTree',
-            'eval'      => array(
-                'filesOnly'  => true,
-                'fieldType'  => 'radio',
-                'mandatory'  => false,
-                'tl_class'   => 'clr w50',
-                'extensions' => 'gif,png,svg,jpg'
-            ),
-            'sql'       => "binary(16) NULL",
-        ),
-        'shadowRetinaImage'   => array
-        (
-            'label'     => &$GLOBALS['TL_LANG']['tl_content']['shadowRetinaImage'],
-            'exclude'   => true,
-            'inputType' => 'fileTree',
-            'eval'      => array(
-                'filesOnly'  => true,
-                'fieldType'  => 'radio',
-                'mandatory'  => false,
-                'tl_class'   => 'w50',
-                'extensions' => 'gif,png,svg,jpg'
-            ),
-            'sql'       => "binary(16) NULL",
         ),
         'draggable'    => array
         (
@@ -301,58 +248,5 @@ $GLOBALS['TL_DCA']['tl_leaflet_marker'] = array
             'eval'      => array('mandatory' => true, 'maxlength' => 4, 'rgxp' => 'digit', 'tl_class' => 'clr w50'),
             'sql'       => "int(4) NOT NULL default '0'"
         ),
-        'iconAnchor'  => array
-        (
-            'label'         => &$GLOBALS['TL_LANG']['tl_leaflet_marker']['iconAnchor'],
-            'exclude'       => true,
-            'inputType'     => 'text',
-            'save_callback' => array(
-                array('Netzmacht\Contao\Leaflet\Dca\Leaflet', 'validateCoordinate')
-            ),
-            'eval'          => array(
-                'maxlength'   => 255,
-                'tl_class'    => 'w50',
-                'nullIfEmpty' => true,
-            ),
-            'sql'           => "varchar(255) NULL"
-        ),
-        'shadowAnchor'  => array
-        (
-            'label'         => &$GLOBALS['TL_LANG']['tl_leaflet_marker']['shadowAnchor'],
-            'exclude'       => true,
-            'inputType'     => 'text',
-            'save_callback' => array(
-                array('Netzmacht\Contao\Leaflet\Dca\Leaflet', 'validateCoordinate')
-            ),
-            'eval'          => array(
-                'maxlength'   => 255,
-                'tl_class'    => 'w50',
-                'nullIfEmpty' => true,
-            ),
-            'sql'           => "varchar(255) NULL"
-        ),
-        'popupAnchor'  => array
-        (
-            'label'         => &$GLOBALS['TL_LANG']['tl_leaflet_marker']['popupAnchor'],
-            'exclude'       => true,
-            'inputType'     => 'text',
-            'save_callback' => array(
-                array('Netzmacht\Contao\Leaflet\Dca\Leaflet', 'validateCoordinate')
-            ),
-            'eval'          => array(
-                'maxlength'   => 255,
-                'tl_class'    => 'w50',
-                'nullIfEmpty' => true,
-            ),
-            'sql'           => "varchar(255) NULL"
-        ),
-        'iconClassName'          => array
-        (
-            'label'     => &$GLOBALS['TL_LANG']['tl_leaflet_marker']['iconClassName'],
-            'exclude'   => true,
-            'inputType' => 'text',
-            'eval'      => array('mandatory' => false, 'maxlength' => 255, 'tl_class' => 'w50'),
-            'sql'       => "varchar(255) NOT NULL default ''"
-        ),
     ),
 );

module/languages/en/tl_leaflet_icon.php

@@ -0,0 +1,29 @@
+<?php
+
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['title_legend'] = 'Title';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['config_legend'] = 'Configuration';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadow_legend'] = 'Shadow';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['active_legend'] = 'Activation';
+
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['title'][0]             = 'Title';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['title'][1]             = 'Title of the icon.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['alias'][0]             = 'Alias';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['alias'][1]             = 'Alias of the icon.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['type'][0]              = 'Type';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['type'][1]              = 'Choose the icon type.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconImage'][0]         = 'Icon image';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconImage'][1]         = 'Choose an icon image.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconRetinaImage'][0]   = 'Retina icon image';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconRetinaImage'][1]   = 'Choose an retina icon image.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconAnchor'][0]        = 'Icon anchor';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['iconAnchor'][1]        = 'The coordinates of the "tip" of the icon (relative to its top left corner).';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['popupAnchor'][0]       = 'Popup anchor';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['popupAnchor'][1]       = 'The coordinates of the point from which popups will "open", relative to the icon anchor.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowImage'][0]       = 'Shadow image';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowImage'][1]       = 'Choose an shadow image.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowRetinaImage'][0] = 'Retina shadow image';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowRetinaImage'][1] = 'Choose an retina shadow image.';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowAnchor'][0]      = 'Shadow anchor';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['shadowAnchor'][1]      = 'The coordinates of the "tip" of the shadow (relative to its top left corner) (the same as iconAnchor if not specified).';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['active'][0]            = 'Activate the icon';
+$GLOBALS['TL_LANG']['tl_leaflet_icon']['active'][1]            = 'Activate the icon.';

src/Netzmacht/Contao/Leaflet/Dca/Marker.php

@@ -12,6 +12,9 @@
 namespace Netzmacht\Contao\Leaflet\Dca;
 
 
+use Netzmacht\Contao\DevTools\Dca\Options\OptionsBuilder;
+use Netzmacht\Contao\Leaflet\Model\IconModel;
+
 class Marker
 {
     public function generateRow($row)
@@ -19,4 +22,17 @@ class Marker
         return $row['title'];
     }
 
+    public function getIcons()
+    {
+        $collection = IconModel::findAll(array('order' => 'title'));
+        $builder    = OptionsBuilder::fromCollection(
+            $collection, 'id',
+            function($model) {
+                return sprintf('%s [%s]', $model['title'], $model['type']);
+            }
+        );
+
+        return $builder->getOptions();
+    }
+
 }

src/Netzmacht/Contao/Leaflet/Mapper/Type/AbstractIconMapper.php

@@ -0,0 +1,25 @@
+<?php
+
+/**
+ * @package    dev
+ * @author     David Molineus <david.molineus@netzmacht.de>
+ * @copyright  2015 netzmacht creative David Molineus
+ * @license    LGPL 3.0
+ * @filesource
+ *
+ */
+
+namespace Netzmacht\Contao\Leaflet\Mapper\Type;
+
+
+use Netzmacht\Contao\Leaflet\Mapper\AbstractTypeMapper;
+
+class AbstractIconMapper extends AbstractTypeMapper
+{
+    /**
+     * Class of the model being build.
+     *
+     * @var string
+     */
+    protected static $modelClass = 'Netzmacht\Contao\Leaflet\Model\IconModel';
+}

src/Netzmacht/Contao/Leaflet/Mapper/Type/ImageIconMapper.php

@@ -0,0 +1,132 @@
+<?php
+
+/**
+ * @package    dev
+ * @author     David Molineus <david.molineus@netzmacht.de>
+ * @copyright  2015 netzmacht creative David Molineus
+ * @license    LGPL 3.0
+ * @filesource
+ *
+ */
+
+namespace Netzmacht\Contao\Leaflet\Mapper\Type;
+
+
+use Netzmacht\Contao\Leaflet\Mapper\DefinitionMapper;
+use Netzmacht\Contao\Leaflet\Model\IconModel;
+use Netzmacht\LeafletPHP\Definition;
+use Netzmacht\LeafletPHP\Definition\Type\Icon;
+use Netzmacht\LeafletPHP\Definition\Type\LatLngBounds;
+
+class ImageIconMapper extends AbstractIconMapper
+{
+    /**
+     * Class of the definition being created.
+     *
+     * @var string
+     */
+    protected static $definitionClass = 'Netzmacht\LeafletPHP\Definition\Type\Icon';
+
+    /**
+     * Layer type.
+     *
+     * @var string
+     */
+    protected static $type = 'image';
+
+    protected function buildConstructArguments(\Model $model, DefinitionMapper $mapper, LatLngBounds $bounds = null)
+    {
+        $arguments = parent::buildConstructArguments($model, $mapper, $bounds);
+
+        if ($model->iconImage) {
+            $file = \FilesModel::findByUuid($model->iconImage);
+
+            if ($file) {
+                $arguments[] = $file->path;
+            }
+        }
+
+        return $arguments;
+    }
+
+
+    protected function doBuild(
+        Definition $definition,
+        \Model $model,
+        DefinitionMapper $mapper,
+        LatLngBounds $bounds = null
+    ) {
+        if ($definition instanceof Icon) {
+            $this->addIcon($definition, $model);
+            $this->addShadow($definition, $model);
+        }
+    }
+
+    /**
+     * @param Icon      $definition
+     * @param IconModel $model
+     */
+    private function addIcon(Icon $definition, IconModel $model)
+    {
+        if ($model->iconImage) {
+            $file = \FilesModel::findByUuid($model->iconImage);
+
+            if ($file) {
+                $definition->setIconUrl($file->path);
+
+                $file = new \File($file->path);
+                $definition->setIconSize(array($file->width, $file->height));
+
+                if (!$model->iconAnchor) {
+                    $definition->setIconAnchor(array($file->width / 2, $file->height));
+                }
+
+                if (!$model->popupAnchor) {
+                    $definition->setPopupAnchor(array(0, 10 - $file->height));
+                }
+            }
+        }
+
+        if ($model->iconAnchor) {
+            $definition->setIconAnchor(array_map('intval', explode(',', $model->iconAnchor)));
+        }
+
+        if ($model->iconRetinaImage) {
+            $file = \FilesModel::findByUuid($model->iconRetinaImage);
+
+            if ($file) {
+                $definition->setIconRetinaUrl($file->path);
+            }
+        }
+    }
+
+    private function addShadow(Icon $definition, $model)
+    {
+        if ($model->shadowImage) {
+            $file = \FilesModel::findByUuid($model->shadowImage);
+
+            if ($file) {
+                $definition->setShadowUrl($file->path);
+
+                $file = new \File($file->path);
+                $definition->setShadowSize(array($file->width, $file->height));
+
+                if (!$model->shadowAnchor) {
+                    $definition->setShadowAnchor(array($file->width / 2, $file->height));
+                }
+            }
+        }
+
+        if ($model->shadowAnchor) {
+            $definition->setShadowAnchor(array_map('intval', explode(',', $model->shadowAnchor)));
+        }
+
+        if ($model->shadowRetinaImage) {
+            $file = \FilesModel::findByUuid($model->shadowRetinaImage);
+
+            if ($file) {
+                $definition->setShadowRetinaUrl($file->path);
+            }
+        }
+    }
+}

src/Netzmacht/Contao/Leaflet/Mapper/UI/MarkerMapper.php

@@ -14,7 +14,9 @@ namespace Netzmacht\Contao\Leaflet\Mapper\UI;
 
 use Netzmacht\Contao\Leaflet\Mapper\AbstractMapper;
 use Netzmacht\Contao\Leaflet\Mapper\DefinitionMapper;
+use Netzmacht\Contao\Leaflet\Model\IconModel;
 use Netzmacht\LeafletPHP\Definition;
+use Netzmacht\LeafletPHP\Definition\Type\Icon;
 use Netzmacht\LeafletPHP\Definition\Type\LatLngBounds;
 use Netzmacht\LeafletPHP\Definition\UI\Marker;
 
@@ -69,6 +71,20 @@ class MarkerMapper extends AbstractMapper
             if ($model->addPopup) {
                 $definition->bindPopup($model->popupContent);
             }
+
+            if ($model->customIcon) {
+                $iconModel = IconModel::findBy(
+                    array('id=?', 'active=1'),
+                    array($model->icon),
+                    array('return' => 'Model')
+                );
+
+                if ($iconModel) {
+                    /** @var Icon $icon */
+                    $icon = $builder->handle($iconModel);
+                    $definition->setIcon($icon);
+                }
+            }
         }
     }
 }

src/Netzmacht/Contao/Leaflet/Model/IconModel.php

@@ -0,0 +1,24 @@
+<?php
+
+/**
+ * @package    dev
+ * @author     David Molineus <david.molineus@netzmacht.de>
+ * @copyright  2015 netzmacht creative David Molineus
+ * @license    LGPL 3.0
+ * @filesource
+ *
+ */
+
+namespace Netzmacht\Contao\Leaflet\Model;
+
+
+/**
+ * @property mixed|null iconImage
+ * @property mixed|null iconAnchor
+ * @property mixed|null popupAnchor
+ * @property mixed|null iconRetinaImage
+ */
+class IconModel extends \Model
+{
+    protected static $strTable = 'tl_leaflet_icon';
+}

src/Netzmacht/Contao/Leaflet/Subscriber/BootSubscriber.php

@@ -16,6 +16,11 @@ use Netzmacht\Contao\Leaflet\Event\GetJavascriptEvent;
 use Netzmacht\Contao\Leaflet\Event\InitializeDefinitionMapperEvent;
 use Netzmacht\Contao\Leaflet\Event\InitializeEventDispatcherEvent;
 use Netzmacht\Contao\Leaflet\Event\InitializeLeafletBuilderEvent;
+use Netzmacht\Contao\Leaflet\Mapper\DefinitionMapper;
+use Netzmacht\Contao\Leaflet\Model\IconModel;
+use Netzmacht\Javascript\Output;
+use Netzmacht\LeafletPHP\Definition\Type\Icon;
+use Netzmacht\LeafletPHP\Leaflet;
 use Symfony\Component\EventDispatcher\EventSubscriberInterface;
 
 /**
@@ -34,7 +39,7 @@ class BootSubscriber implements EventSubscriberInterface
             InitializeDefinitionMapperEvent::NAME => 'initializeDefinitionMapper',
             InitializeEventDispatcherEvent::NAME  => 'initializeEventDispatcher',
             InitializeLeafletBuilderEvent::NAME   => 'initializeLeafletBuilder',
-            GetJavascriptEvent::NAME              => 'loadAssets'
+            GetJavascriptEvent::NAME              => array(array('loadAssets'), array('loadIcons')),
         );
     }
 
@@ -114,4 +119,43 @@ class BootSubscriber implements EventSubscriberInterface
     {
         $GLOBALS['TL_JAVASCRIPT'][] = 'system/modules/leaflet/assets/js/contao-leaflet.js|static';
     }
+
+    /**
+     * Load icons.
+     *
+     * @throws \Netzmacht\Javascript\Exception\EncodeValueFailed
+     */
+    public function loadIcons()
+    {
+        $collection = IconModel::findBy('active', true);
+
+        if ($collection) {
+            /** @var DefinitionMapper $mapper */
+            $buffer  = '';
+            $mapper  = $GLOBALS['container']['leaflet.definition.mapper'];
+            /** @var Leaflet $builder */
+            $builder = $GLOBALS['container']['leaflet.definition.builder'];
+            $encoder = $builder->getBuilder()->getEncoder();
+
+            foreach ($collection as $model) {
+                /** @var Icon $icon */
+                $icon = $mapper->handle($model);
+
+                $buffer .= sprintf(
+                    'ContaoLeaflet.addIcon(\'%s\', L.icon(%s));' . "\n",
+                    $model->alias ?: ('icon_' . $model->id),
+                    $encoder->encodeValue($icon->getOptions())
+                );
+            }
+
+            if ($buffer) {
+                $file = new \File('assets/leaflet/js/icons.js');
+                $file->write($buffer);
+                $file->close();
+
+                // TODO: Cache it.
+                $GLOBALS['TL_JAVASCRIPT'][] = 'assets/leaflet/js/icons.js|static';
+            }
+        }
+    }
 }