Process JS code separately [draft]

docs/user_guide/plugins/mouse_position.md

@@ -20,7 +20,7 @@ m
 ```{code-cell} ipython3
 m = folium.Map()
 
-formatter = "function(num) {return L.Util.formatNum(num, 3) + ' ° ';};"
+formatter = "function(num) {return L.Util.formatNum(num, 3) + ' ° '}"
 
 MousePosition(
     position="topright",

folium/elements.py

@@ -1,7 +1,8 @@
 from typing import List, Tuple
 
 from branca.element import CssLink, Element, Figure, JavascriptLink, MacroElement
-from jinja2 import Template
+
+from folium.template import Template
 
 
 class JSCSSMixin(Element):

folium/features.py

@@ -14,11 +14,11 @@
 from branca.colormap import ColorMap, LinearColormap, StepColormap
 from branca.element import Element, Figure, Html, IFrame, JavascriptLink, MacroElement
 from branca.utilities import color_brewer
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.folium import Map
 from folium.map import FeatureGroup, Icon, Layer, Marker, Popup, Tooltip
+from folium.template import Template
 from folium.utilities import (
     TypeJsonValue,
     TypeLine,

folium/folium.py

@@ -8,11 +8,11 @@
 from typing import Any, List, Optional, Sequence, Union
 
 from branca.element import Element, Figure, MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.map import FitBounds, Layer
 from folium.raster_layers import TileLayer
+from folium.template import Template
 from folium.utilities import (
     TypeBounds,
     TypeJsonValue,

folium/map.py

@@ -7,10 +7,11 @@
 from typing import Dict, List, Optional, Sequence, Tuple, Type, Union
 
 from branca.element import Element, Figure, Html, MacroElement
-from jinja2 import Template
 
 from folium.elements import ElementAddToElement
+from folium.template import Template
 from folium.utilities import (
+    JsCode,
     TypeBounds,
     TypeJsonValue,
     camelize,
@@ -147,21 +148,9 @@ class LayerControl(MacroElement):
     _template = Template(
         """
         {% macro script(this,kwargs) %}
-            var {{ this.get_name() }}_layers = {
-                base_layers : {
-                    {%- for key, val in this.base_layers.items() %}
-                    {{ key|tojson }} : {{val}},
-                    {%- endfor %}
-                },
-                overlays :  {
-                    {%- for key, val in this.overlays.items() %}
-                    {{ key|tojson }} : {{val}},
-                    {%- endfor %}
-                },
-            };
             let {{ this.get_name() }} = L.control.layers(
-                {{ this.get_name() }}_layers.base_layers,
-                {{ this.get_name() }}_layers.overlays,
+                {{ this.base_layers|tojavascript }},
+                {{ this.overlays|tojavascript }},
                 {{ this.options|tojson }}
             ).addTo({{this._parent.get_name()}});
 
@@ -187,8 +176,8 @@ def __init__(
             position=position, collapsed=collapsed, autoZIndex=autoZIndex, **kwargs
         )
         self.draggable = draggable
-        self.base_layers: OrderedDict[str, str] = OrderedDict()
-        self.overlays: OrderedDict[str, str] = OrderedDict()
+        self.base_layers: OrderedDict[str, JsCode] = OrderedDict()
+        self.overlays: OrderedDict[str, JsCode] = OrderedDict()
 
     def reset(self) -> None:
         self.base_layers = OrderedDict()
@@ -202,9 +191,9 @@ def render(self, **kwargs) -> None:
                 continue
             key = item.layer_name
             if not item.overlay:
-                self.base_layers[key] = item.get_name()
+                self.base_layers[key] = JsCode(item.get_name())
             else:
-                self.overlays[key] = item.get_name()
+                self.overlays[key] = JsCode(item.get_name())
         super().render()
 
 

folium/plugins/antpath.py

@@ -1,6 +1,5 @@
-from jinja2 import Template
-
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.vector_layers import BaseMultiLocation, path_options
 
 

folium/plugins/beautify_icon.py

@@ -1,7 +1,7 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/boat_marker.py

@@ -1,7 +1,6 @@
-from jinja2 import Template
-
 from folium.elements import JSCSSMixin
 from folium.map import Marker
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/draw.py

@@ -1,7 +1,7 @@
 from branca.element import Element, Figure, MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 
 
 class Draw(JSCSSMixin, MacroElement):

folium/plugins/dual_map.py

@@ -1,9 +1,9 @@
 from branca.element import Figure, MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.folium import Map
 from folium.map import LayerControl
+from folium.template import Template
 from folium.utilities import deep_copy
 
 

folium/plugins/fast_marker_cluster.py

@@ -1,6 +1,5 @@
-from jinja2 import Template
-
 from folium.plugins.marker_cluster import MarkerCluster
+from folium.template import Template
 from folium.utilities import if_pandas_df_convert_to_numpy, validate_location
 
 

folium/plugins/feature_group_sub_group.py

@@ -1,7 +1,6 @@
-from jinja2 import Template
-
 from folium.elements import JSCSSMixin
 from folium.map import Layer
+from folium.template import Template
 
 
 class FeatureGroupSubGroup(JSCSSMixin, Layer):

folium/plugins/float_image.py

@@ -1,5 +1,6 @@
 from branca.element import MacroElement
-from jinja2 import Template
+
+from folium.template import Template
 
 
 class FloatImage(MacroElement):

folium/plugins/fullscreen.py

@@ -1,7 +1,7 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/geocoder.py

@@ -1,7 +1,7 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/groupedlayercontrol.py

@@ -1,7 +1,7 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/heat_map.py

@@ -1,10 +1,10 @@
 import warnings
 
 import numpy as np
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.map import Layer
+from folium.template import Template
 from folium.utilities import (
     if_pandas_df_convert_to_numpy,
     none_max,

folium/plugins/heat_map_withtime.py

@@ -1,8 +1,8 @@
 from branca.element import Element, Figure
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.map import Layer
+from folium.template import Template
 from folium.utilities import none_max, none_min
 
 

folium/plugins/locate_control.py

@@ -4,9 +4,9 @@
 """
 
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/marker_cluster.py

@@ -1,7 +1,6 @@
-from jinja2 import Template
-
 from folium.elements import JSCSSMixin
 from folium.map import Layer, Marker
+from folium.template import Template
 from folium.utilities import parse_options, validate_locations
 
 

folium/plugins/measure_control.py

@@ -1,7 +1,7 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/minimap.py

@@ -1,8 +1,8 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.raster_layers import TileLayer
+from folium.template import Template
 from folium.utilities import parse_options
 
 

folium/plugins/mouse_position.py

@@ -1,8 +1,8 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
-from folium.utilities import parse_options
+from folium.template import Template
+from folium.utilities import JsCode, TypeJsFunctionArg
 
 
 class MousePosition(JSCSSMixin, MacroElement):
@@ -27,14 +27,14 @@ class MousePosition(JSCSSMixin, MacroElement):
         longitude and latitude decimal degree values.
     prefix : str, default ''
         A string to be prepended to the coordinates.
-    lat_formatter : str, default None
+    lat_formatter : str or JsCode, optional
         Custom Javascript function to format the latitude value.
-    lng_formatter : str, default None
+    lng_formatter : str or JsCode, optional
         Custom Javascript function to format the longitude value.
 
     Examples
     --------
-    >>> fmtr = "function(num) {return L.Util.formatNum(num, 3) + ' º ';};"
+    >>> fmtr = "function(num) {return L.Util.formatNum(num, 3) + ' º '}"
     >>> MousePosition(
     ...     position="topright",
     ...     separator=" | ",
@@ -49,12 +49,8 @@ class MousePosition(JSCSSMixin, MacroElement):
         """
         {% macro script(this, kwargs) %}
             var {{ this.get_name() }} = new L.Control.MousePosition(
-                {{ this.options|tojson }}
+                {{ this.options|tojavascript }}
             );
-            {{ this.get_name() }}.options["latFormatter"] =
-                {{ this.lat_formatter }};
-            {{ this.get_name() }}.options["lngFormatter"] =
-                {{ this.lng_formatter }};
             {{ this._parent.get_name() }}.addControl({{ this.get_name() }});
         {% endmacro %}
     """
@@ -81,21 +77,21 @@ def __init__(
         lng_first=False,
         num_digits=5,
         prefix="",
-        lat_formatter=None,
-        lng_formatter=None,
+        lat_formatter: TypeJsFunctionArg = None,
+        lng_formatter: TypeJsFunctionArg = None,
         **kwargs
     ):
         super().__init__()
         self._name = "MousePosition"
 
-        self.options = parse_options(
+        self.options = dict(
             position=position,
             separator=separator,
             empty_string=empty_string,
             lng_first=lng_first,
             num_digits=num_digits,
             prefix=prefix,
+            lat_formatter=JsCode.optional_create(lat_formatter),
+            lng_formatter=JsCode.optional_create(lng_formatter),
             **kwargs
         )
-        self.lat_formatter = lat_formatter or "undefined"
-        self.lng_formatter = lng_formatter or "undefined"

folium/plugins/pattern.py

@@ -1,8 +1,8 @@
 from branca.element import MacroElement
-from jinja2 import Template
 
 from folium.elements import JSCSSMixin
 from folium.folium import Map
+from folium.template import Template
 from folium.utilities import get_obj_in_upper_tree, parse_options
 
 

folium/plugins/polyline_text_path.py

@@ -1,7 +1,6 @@
-from jinja2 import Template
-
 from folium.elements import JSCSSMixin
 from folium.features import MacroElement
+from folium.template import Template
 from folium.utilities import parse_options