Clean up various messes

9 files changed, 325 insertions, 254 deletions

diff --git a/src/LngLat.elm b/src/LngLat.elm
new file mode 100644
index 0000000..896dc73
--- /dev/null
+++ b/src/LngLat.elm
@@ -0,0 +1,58 @@
+module LngLat exposing (LngLat, encodeAsPair, encodeAsObject, decodeFromPair, decodeFromObject, map)
+
+{-| @docs LngLat, encodeAsPair, encodeAsObject, decodeFromPair, decodeFromObject, map
+-}
+
+import Json.Encode as Encode exposing (Value)
+import Json.Decode as Decode exposing (Decoder)
+
+
+{-| A LngLat represents a geographic position.
+-}
+type alias LngLat =
+    { lng : Float
+    , lat : Float
+    }
+
+
+{-| Most implementations seem to encode these as a 2 member array.
+-}
+encodeAsPair : LngLat -> Value
+encodeAsPair { lng, lat } =
+    Encode.list [ Encode.float lng, Encode.float lat ]
+
+
+{-| Most implementations seem to encode these as a 2 member array.
+-}
+decodeFromPair : Decoder LngLat
+decodeFromPair =
+    Decode.list Decode.float
+        |> Decode.andThen
+            (\l ->
+                case l of
+                    [ lng, lat ] ->
+                        Decode.succeed (LngLat lng lat)
+
+                    _ ->
+                        Decode.fail "Doesn't apear to be a valid lng lat pair"
+            )
+
+
+{-| We can also encode as an `{lng: 32, lat: 435}` object.
+-}
+encodeAsObject : LngLat -> Value
+encodeAsObject { lng, lat } =
+    Encode.object [ ( "lng", Encode.float lng ), ( "lat", Encode.float lat ) ]
+
+
+{-| We can also encode from an `{lng: 32, lat: 435}` object.
+-}
+decodeFromObject : Decoder LngLat
+decodeFromObject =
+    Decode.map2 LngLat (Decode.field "lng" Decode.float) (Decode.field "lat" Decode.float)
+
+
+{-| -}
+map : (Float -> Float) -> LngLat -> LngLat
+map f { lng, lat } =
+    { lng = f lng, lat = f lat }
diff --git a/src/Mapbox/Cmd/Internal.elm b/src/Mapbox/Cmd/Internal.elm
new file mode 100644
index 0000000..1445e78
--- /dev/null
+++ b/src/Mapbox/Cmd/Internal.elm
@@ -0,0 +1,14 @@
+module Mapbox.Cmd.Internal exposing (..)
+
+import Json.Encode as Encode exposing (Value)
+
+
+{-| Options use phantom types to show which commands support them.
+-}
+type Option support
+    = Option String Value
+
+
+{-| -}
+type Supported
+    = Supported
diff --git a/src/Mapbox/Cmd/Option.elm b/src/Mapbox/Cmd/Option.elm
new file mode 100644
index 0000000..6157de4
--- /dev/null
+++ b/src/Mapbox/Cmd/Option.elm
@@ -0,0 +1,188 @@
+module Mapbox.Cmd.Option exposing (..)
+
+{-|
+
+
+### Animation options
+
+Options common to map movement commands that involve animation, such as panBy and easeTo, controlling the duration and easing function of the animation. All properties are optional.
+
+@docs duration, easing, offset, animate
+
+@docs curve, minZoom, speed, screenSpeed, maxDuration
+
+
+### Camera Options
+
+Options common to `jumpTo`, `easeTo`, and `flyTo`, controlling the desired location, zoom, bearing, and pitch of the camera. All properties are optional, and when a property is omitted, the current camera value for that property will remain unchanged.
+
+@docs center, zoom, bearing, pitch, around
+
+
+### Fiting bounds
+
+@docs padding, Padding, linear, maxZoom
+
+@docs layers, filter
+
+-}
+
+import Mapbox.Helpers exposing (encodePair)
+import Json.Encode as Encode exposing (Value)
+import Mapbox.Cmd.Internal as Internal exposing (Option(..), Supported)
+import Mapbox.Helpers exposing (encodePair)
+import LngLat exposing (LngLat)
+import Mapbox.Expression exposing (DataExpression, Expression)
+
+
+{-| The animation's duration, measured in milliseconds.
+-}
+duration : Int -> Option { a | duration : Supported }
+duration =
+    Encode.int >> Option "duration"
+
+
+{-| The name of an easing function. These must be passed to `elmMapbox`
+in the `easingFunctions` option.
+-}
+easing : String -> Option { a | easing : Supported }
+easing =
+    Encode.string >> Option "easing"
+
+
+{-| Offset of the target center relative to real map container center at the end of animation.
+-}
+offset : ( Int, Int ) -> Option { a | offset : Supported }
+offset =
+    encodePair Encode.int >> Option "offset"
+
+
+{-| If false, no animation will occur.
+-}
+animate : Bool -> Option { a | animate : Supported }
+animate =
+    Encode.bool >> Option "animate"
+
+
+{-| The desired center.
+-}
+center : LngLat -> Option { a | center : Supported }
+center =
+    LngLat.encodeAsPair >> Option "center"
+
+
+{-| The desired zoom level.
+-}
+zoom : Float -> Option { a | zoom : Supported }
+zoom =
+    Encode.float >> Option "zoom"
+
+
+{-| The desired bearing, in degrees. The bearing is the compass direction that is "up"; for example, a bearing of 90° orients the map so that east is up.
+-}
+bearing : Float -> Option { a | bearing : Supported }
+bearing =
+    Encode.float >> Option "bearing"
+
+
+{-| The desired pitch, in degrees.
+-}
+pitch : Float -> Option { a | pitch : Supported }
+pitch =
+    Encode.float >> Option "pitch"
+
+
+{-| If `zoom` is specified, `around` determines the point around which the zoom is centered.
+-}
+around : LngLat -> Option { a | around : Supported }
+around =
+    LngLat.encodeAsPair >> Option "around"
+
+
+{-| The amount of padding in pixels to add to the given bounds.
+-}
+padding : Padding -> Option { a | padding : Supported }
+padding =
+    encodePadding >> Option "padding"
+
+
+{-| -}
+type alias Padding =
+    { top : Int, right : Int, bottom : Int, left : Int }
+
+
+encodePadding { top, right, bottom, left } =
+    Encode.object
+        [ ( "top", Encode.int top )
+        , ( "right", Encode.int right )
+        , ( "bottom", Encode.int bottom )
+        , ( "left", Encode.int left )
+        ]
+
+
+{-| If true, the map transitions using `easeTo` . If false, the map transitions using `flyTo`.
+-}
+linear : Bool -> Option { a | linear : Supported }
+linear =
+    Encode.bool >> Option "linear"
+
+
+{-| The maximum zoom level to allow when the map view transitions to the specified bounds.
+-}
+maxZoom : Float -> Option { a | maxZoom : Supported }
+maxZoom =
+    Encode.float >> Option "maxZoom"
+
+
+{-| The zooming "curve" that will occur along the flight path.
+A high value maximizes zooming for an exaggerated animation, while a
+low value minimizes zooming for an effect closer to `easeTo`.
+1.42 is the average value selected by participants in the user study discussed in [van Wijk (2003)](https://www.win.tue.nl/~vanwijk/zoompan.pdf).
+A value of `6 ^ 0.25` would be equivalent to the root mean squared average velocity. A value of 1 would produce a circular motion.
+-}
+curve : Float -> Option { a | curve : Supported }
+curve =
+    Encode.float >> Option "curve"
+
+
+{-| The zero-based zoom level at the peak of the flight path.
+If `curve` is specified, this option is ignored.
+-}
+minZoom : Float -> Option { a | minZoom : Supported }
+minZoom =
+    Encode.float >> Option "minZoom"
+
+
+{-| The average speed of the animation defined in relation to `curve`. A speed of 1.2 means that the map appears to move along the flight path by 1.2 times `curve` screenfuls every second. A screenful is the map's visible span. It does not correspond to a fixed physical distance, but varies by zoom level.
+-}
+speed : Float -> Option { a | speed : Supported }
+speed =
+    Encode.float >> Option "speed"
+
+
+{-| The average speed of the animation measured in screenfuls per second, assuming a linear timing curve. If `speed` is specified, this option is ignored.
+-}
+screenSpeed : Float -> Option { a | screenSpeed : Supported }
+screenSpeed =
+    Encode.float >> Option "screenSpeed"
+
+
+{-| The animation's maximum duration, measured in milliseconds. If duration exceeds maximum duration, it resets to 0.
+-}
+maxDuration : Float -> Option { a | maxDuration : Supported }
+maxDuration =
+    Encode.float >> Option "maxDuration"
+
+
+{-| A list of style layer IDs for the query to inspect. Only features within these layers will be returned. If this parameter is not set, all layers will be checked.
+-}
+layers : List String -> Option { a | layers : Supported }
+layers =
+    List.map Encode.string >> Encode.list >> Option "layers"
+
+
+{-| A filter to limit query results.
+-}
+filter : Expression DataExpression Bool -> Option { a | filter : Supported }
+filter =
+    Mapbox.Expression.encode >> Option "filter"
diff --git a/src/Mapbox/Cmd.elm b/src/Mapbox/Cmd/Template.elm
index 17cea13..d0f306e 100644
--- a/src/Mapbox/Cmd.elm
+++ b/src/Mapbox/Cmd/Template.elm
@@ -1,36 +1,22 @@
-module Mapbox.Cmd exposing (Id, Outgoing, Option, Supported, duration, easing, offset, animate, panBy, panTo, zoomTo, zoomIn, zoomOut, rotateTo, jumpTo, easeTo, flyTo, curve, minZoom, speed, screenSpeed, maxDuration, stop, center, zoom, bearing, pitch, around, fitBounds, padding, Padding, linear, maxZoom, setRTLTextPlugin, Response, queryResults, getBounds, queryRenderedFeatures, Query, layers, filter, resize)
+module Mapbox.Cmd.Template exposing (Id, Outgoing, Option, Supported, panBy, panTo, zoomTo, zoomIn, zoomOut, rotateTo, jumpTo, easeTo, flyTo, stop, fitBounds, setRTLTextPlugin, Response(..), queryResults, getBounds, queryRenderedFeatures, Query(..), resize)
 
 {-| This module has a bunch of essentially imperative commands for your map.
 
-@docs Id, Outgoing
+However, since a published library can't have ports in it, you will need to do some setup. The easiest way to do this is to copy [this file into your app](https://github.com/gampleman/elm-mapbox/blob/master/examples/MapCommands.elm). You can see the module docs for that [here](https://github.com/gampleman/elm-mapbox/blob/master/docs/MapCommands.md).
 
-However, since a published library can't have ports in it, you will need to do some setup. The easiest way to do this is to copy [this file into your app](https://github.com/gampleman/elm-mapbox/blob/master/examples/MapCommands.elm).
+@docs Id, Outgoing, Option, Supported
 
-@docs Option, Supported
-
-
-### Animation options
-
-Options common to map movement commands that involve animation, such as panBy and easeTo, controlling the duration and easing function of the animation. All properties are optional.
-
-@docs duration, easing, offset, animate
+You can of course customize the module you copy into your codebase to support things like having multiple maps on the page at once, etc.
 
 
 ### Moving the map around
 
-@docs panBy, panTo, zoomTo, zoomIn, zoomOut, rotateTo, jumpTo, easeTo, flyTo, curve, minZoom, speed, screenSpeed, maxDuration, stop
-
-
-### Camera Options
-
-Options common to `jumpTo`, `easeTo`, and `flyTo`, controlling the desired location, zoom, bearing, and pitch of the camera. All properties are optional, and when a property is omitted, the current camera value for that property will remain unchanged.
-
-@docs center, zoom, bearing, pitch, around
+@docs panBy, panTo, zoomTo, zoomIn, zoomOut, rotateTo, jumpTo, easeTo, flyTo, stop
 
 
 ### Fiting bounds
 
-@docs fitBounds, padding, Padding, linear, maxZoom
+@docs fitBounds
 
 
 ### Other
@@ -40,14 +26,15 @@ Options common to `jumpTo`, `easeTo`, and `flyTo`, controlling the desired locat
 
 ### Querying the map
 
-@docs Response, queryResults, getBounds, queryRenderedFeatures, Query, layers, filter
+@docs Response, queryResults, getBounds, queryRenderedFeatures, Query
 
 -}
 
 import Json.Decode as Decode
 import Json.Encode as Encode exposing (Value)
-import Mapbox.Element exposing (LngLat, Viewport)
-import Mapbox.Expression exposing (DataExpression, Expression)
+import Mapbox.Cmd.Internal as Internal exposing (Option(..), Supported)
+import Mapbox.Helpers exposing (encodePair)
+import LngLat exposing (LngLat)
 
 
 {-| The type of a port that you need to provide for this module to work.
@@ -62,151 +49,16 @@ type alias Id =
     String
 
 
+type alias Option support =
+    Internal.Option support
 
--- AnimationOptions
-
-
-{-| The animation's duration, measured in milliseconds.
--}
-duration : Int -> Option { a | duration : Supported }
-duration =
-    Encode.int >> Option "duration"
-
-
-{-| The name of an easing function. These must be passed to `elmMapbox`
-in the `easingFunctions` option.
--}
-easing : String -> Option { a | easing : Supported }
-easing =
-    Encode.string >> Option "easing"
-
-
-{-| Offset of the target center relative to real map container center at the end of animation.
--}
-offset : ( Int, Int ) -> Option { a | offset : Supported }
-offset =
-    encodePair Encode.int >> Option "offset"
-
-
-{-| If false, no animation will occur.
--}
-animate : Bool -> Option { a | animate : Supported }
-animate =
-    Encode.bool >> Option "animate"
-
-
-{-| The desired center.
--}
-center : LngLat -> Option { a | center : Supported }
-center =
-    encodePair Encode.float >> Option "center"
-
-
-{-| The desired zoom level.
--}
-zoom : Float -> Option { a | zoom : Supported }
-zoom =
-    Encode.float >> Option "zoom"
 
-
-{-| The desired bearing, in degrees. The bearing is the compass direction that is "up"; for example, a bearing of 90° orients the map so that east is up.
--}
-bearing : Float -> Option { a | bearing : Supported }
-bearing =
-    Encode.float >> Option "bearing"
-
-
-{-| The desired pitch, in degrees.
--}
-pitch : Float -> Option { a | pitch : Supported }
-pitch =
-    Encode.float >> Option "pitch"
-
-
-{-| If `zoom` is specified, `around` determines the point around which the zoom is centered.
--}
-around : LngLat -> Option { a | around : Supported }
-around =
-    encodePair Encode.float >> Option "around"
-
-
-{-| The amount of padding in pixels to add to the given bounds.
--}
-padding : Padding -> Option { a | padding : Supported }
-padding =
-    encodePadding >> Option "padding"
+type alias Supported =
+    Internal.Supported
 
 
-{-| -}
-type alias Padding =
-    { top : Int, right : Int, bottom : Int, left : Int }
 
-
-encodePadding { top, right, bottom, left } =
-    Encode.object
-        [ ( "top", Encode.int top )
-        , ( "right", Encode.int right )
-        , ( "bottom", Encode.int bottom )
-        , ( "left", Encode.int left )
-        ]
-
-
-{-| If true, the map transitions using `easeTo` . If false, the map transitions using `flyTo`.
--}
-linear : Bool -> Option { a | linear : Supported }
-linear =
-    Encode.bool >> Option "linear"
-
-
-{-| The maximum zoom level to allow when the map view transitions to the specified bounds.
--}
-maxZoom : Float -> Option { a | maxZoom : Supported }
-maxZoom =
-    Encode.float >> Option "maxZoom"
-
-
-{-| The zooming "curve" that will occur along the flight path.
-A high value maximizes zooming for an exaggerated animation, while a
-low value minimizes zooming for an effect closer to `easeTo`.
-1.42 is the average value selected by participants in the user study discussed in [van Wijk (2003)](https://www.win.tue.nl/~vanwijk/zoompan.pdf).
-A value of `6 ^ 0.25` would be equivalent to the root mean squared average velocity. A value of 1 would produce a circular motion.
--}
-curve : Float -> Option { a | curve : Supported }
-curve =
-    Encode.float >> Option "curve"
-
-
-{-| The zero-based zoom level at the peak of the flight path.
-If `curve` is specified, this option is ignored.
--}
-minZoom : Float -> Option { a | minZoom : Supported }
-minZoom =
-    Encode.float >> Option "minZoom"
-
-
-{-| The average speed of the animation defined in relation to `curve`. A speed of 1.2 means that the map appears to move along the flight path by 1.2 times `curve` screenfuls every second. A screenful is the map's visible span. It does not correspond to a fixed physical distance, but varies by zoom level.
--}
-speed : Float -> Option { a | speed : Supported }
-speed =
-    Encode.float >> Option "speed"
-
-
-{-| The average speed of the animation measured in screenfuls per second, assuming a linear timing curve. If `speed` is specified, this option is ignored.
--}
-screenSpeed : Float -> Option { a | screenSpeed : Supported }
-screenSpeed =
-    Encode.float >> Option "screenSpeed"
-
-
-{-| The animation's maximum duration, measured in milliseconds. If duration exceeds maximum duration, it resets to 0.
--}
-maxDuration : Float -> Option { a | maxDuration : Supported }
-maxDuration =
-    Encode.float >> Option "maxDuration"
-
-
-encodePair encoder ( a, b ) =
-    Encode.list [ encoder a, encoder b ]
+-- AnimationOptions
 
 
 decodePair decoder =
@@ -263,22 +115,11 @@ fitBounds prt id options bounds =
     makeCmd prt
         id
         "fitBounds"
-        [ ( "bounds", encodePair (encodePair Encode.float) bounds )
+        [ ( "bounds", encodePair LngLat.encodeAsPair bounds )
         , encodeOptions options
         ]
 
 
-{-| Options use phantom types to show which commands support them.
--}
-type Option support
-    = Option String Value
-
-
-{-| -}
-type Supported
-    = Supported
-
-
 encodeOptions opts =
     ( "options", Encode.object <| List.map (\(Option key val) -> ( key, val )) opts )
 
@@ -320,7 +161,7 @@ panTo :
     -> LngLat
     -> Cmd msg
 panTo prt id options location =
-    makeCmd prt id "panTo" [ ( "location", encodePair Encode.float location ), encodeOptions options ]
+    makeCmd prt id "panTo" [ ( "location", LngLat.encodeAsPair location ), encodeOptions options ]
 
 
 {-| Zooms the map to the specified zoom level, with an animated transition.
@@ -513,10 +354,10 @@ encodeQuery query =
             Encode.string "viewport"
 
         Point lngLat ->
-            encodePair Encode.float lngLat
+            LngLat.encodeAsPair lngLat
 
         Box sw ne ->
-            encodePair (encodePair Encode.float) ( sw, ne )
+            encodePair LngLat.encodeAsPair ( sw, ne )
 
 
 {-| Returns an array of GeoJSON Feature objects representing visible features that satisfy the query parameters. Takes a numerical ID that allows you to associate the question with the answer.
@@ -543,20 +384,6 @@ queryRenderedFeatures prt id reqId options query =
         ]
 
 
-{-| A list of style layer IDs for the query to inspect. Only features within these layers will be returned. If this parameter is not set, all layers will be checked.
--}
-layers : List String -> Option { a | layers : Supported }
-layers =
-    List.map Encode.string >> Encode.list >> Option "layers"
-
-
-{-| A filter to limit query results.
--}
-filter : Expression DataExpression Bool -> Option { a | filter : Supported }
-filter =
-    Mapbox.Expression.encode >> Option "filter"
-
-
 {-| A response to the queries. See the relevant methods for more information.
 -}
 type Response
@@ -589,7 +416,7 @@ responseDecoder =
             (\s ->
                 case s of
                     "getBounds" ->
-                        Decode.map2 GetBounds (Decode.field "id" Decode.int) (Decode.field "bounds" (decodePair (decodePair Decode.float)))
+                        Decode.map2 GetBounds (Decode.field "id" Decode.int) (Decode.field "bounds" (decodePair LngLat.decodeFromPair))
 
                     "queryRenderedFeatures" ->
                         Decode.map2 QueryRenderedFeatures (Decode.field "id" Decode.int) (Decode.field "features" (Decode.list Decode.value))
diff --git a/src/Mapbox/Element.elm b/src/Mapbox/Element.elm
index 13f5f00..83f818e 100644
--- a/src/Mapbox/Element.elm
+++ b/src/Mapbox/Element.elm
@@ -1,4 +1,4 @@
-module Mapbox.Element exposing (map, css, MapboxAttr, token, id, maxZoom, minZoom, maxBounds, LngLat, renderWorldCopies, featureState, EventData, TouchEvent, eventFeaturesFilter, eventFeaturesLayers, onMouseDown, onMouseUp, onMouseOver, onMouseMove, onClick, onDblClick, onMouseOut, onContextMenu, onZoom, onZoomStart, onZoomEnd, onRotate, onRotateStart, onRotateEnd, onTouchEnd, onTouchMove, onTouchCancel, controlledMap, Viewport)
+module Mapbox.Element exposing (map, css, MapboxAttr, token, id, maxZoom, minZoom, maxBounds, renderWorldCopies, EventData, TouchEvent, eventFeaturesFilter, eventFeaturesLayers, onMouseDown, onMouseUp, onMouseOver, onMouseMove, onClick, onDblClick, onMouseOut, onContextMenu, onZoom, onZoomStart, onZoomEnd, onRotate, onRotateStart, onRotateEnd, onTouchEnd, onTouchMove, onTouchCancel)
 
 {-| This library wraps a Custom Element that actually renders a map.
 
@@ -7,7 +7,7 @@ module Mapbox.Element exposing (map, css, MapboxAttr, token, id, maxZoom, minZoo
 
 ### Attributes
 
-@docs token, id, maxZoom, minZoom, maxBounds, LngLat, renderWorldCopies, featureState
+@docs token, id, maxZoom, minZoom, maxBounds, renderWorldCopies
 
 
 ### Events
@@ -16,11 +16,6 @@ module Mapbox.Element exposing (map, css, MapboxAttr, token, id, maxZoom, minZoo
 
 @docs onMouseDown, onMouseUp, onMouseOver, onMouseMove, onClick, onDblClick, onMouseOut, onContextMenu, onZoom, onZoomStart, onZoomEnd, onRotate, onRotateStart, onRotateEnd, onTouchEnd, onTouchMove, onTouchCancel
 
-
-### Controlled mode
-
-@docs controlledMap, Viewport
-
 -}
 
 import Html exposing (Attribute, Html, node)
@@ -28,8 +23,10 @@ import Html.Attributes exposing (attribute, property)
 import Html.Events exposing (Options)
 import Json.Decode as Decode exposing (Decoder, Value)
 import Json.Encode as Encode
+import LngLat exposing (LngLat)
 import Mapbox.Expression exposing (DataExpression, Expression)
 import Mapbox.Style exposing (Style)
+import Mapbox.Helpers exposing (encodePair)
 
 
 {-| This is the type that all attributes have.
@@ -99,17 +96,11 @@ id =
     attribute "id" >> MapboxAttr
 
 
-{-| A longitude latitude pair (in that order).
--}
-type alias LngLat =
-    ( Float, Float )
-
-
 {-| If set, the map will be constrained to the given bounds. The bounds are the `(south-west corner, north-east corner)`.
 -}
 maxBounds : ( LngLat, LngLat ) -> MapboxAttr msg
 maxBounds =
-    encodePair (encodePair Encode.float) >> property "maxBounds" >> MapboxAttr
+    encodePair LngLat.encodeAsPair >> property "maxBounds" >> MapboxAttr
 
 
 {-| If true, multiple copies of the world will be rendered, when zoomed out.
@@ -119,23 +110,6 @@ renderWorldCopies =
     Encode.bool >> property "renderWorldCopies" >> MapboxAttr
 
 
-encodePair encoder ( a, b ) =
-    Encode.list [ encoder a, encoder b ]
-
-
-decodePair decoder =
-    Decode.list decoder
-        |> Decode.andThen
-            (\l ->
-                case l of
-                    [ a, b ] ->
-                        Decode.succeed ( a, b )
-
-                    _ ->
-                        Decode.fail "Doesn't apear to be a pair"
-            )
-
-
 {-| This is a declarative API for controlling states on the features.
 
 The API takes a bunch of GeoJSON features (these can be returned from the event listeners for example). They should at a minimum have these properties defined:
@@ -146,6 +120,8 @@ The API takes a bunch of GeoJSON features (these can be returned from the event
 
 Then you can give it a `List ( String, Value )` state. You can use this state infromation through the `Mapbox.Expression.featureState` expression.
 
+This needs more design before release.
+
 -}
 featureState : List ( Value, List ( String, Value ) ) -> MapboxAttr msg
 featureState =
@@ -220,10 +196,6 @@ type alias TouchEvent =
     }
 
 
-decodeLngLat =
-    Decode.map2 (,) (Decode.field "lng" Decode.float) (Decode.field "lat" Decode.float)
-
-
 decodePoint =
     Decode.map2 (,) (Decode.field "x" Decode.int) (Decode.field "y" Decode.int)
 
@@ -231,7 +203,7 @@ decodePoint =
 decodeEventData =
     Decode.map3 EventData
         (Decode.field "point" decodePoint)
-        (Decode.field "lngLat" decodeLngLat)
+        (Decode.field "lngLat" LngLat.decodeFromObject)
         (Decode.field "features" (Decode.list Decode.value))
 
 
@@ -239,7 +211,7 @@ decodeTouchEvent =
     Decode.map2 TouchEvent
         (Decode.map3 (List.map3 EventData)
             (Decode.field "points" (Decode.list decodePoint))
-            (Decode.field "lngLats" (Decode.list decodeLngLat))
+            (Decode.field "lngLats" (Decode.list LngLat.decodeFromObject))
             (Decode.field "perPointFeatures" (Decode.list (Decode.list Decode.value)))
         )
         decodeEventData
@@ -408,6 +380,9 @@ type alias Viewport =
 
 
 {-| By default the map is "uncontrolled". By this we mean that it has its own internal state (namely the center, zoom level, pitch and bearing). This is nice if you don't care about these, but it does break some of the niceness of TEA. It also means some advanced interaction techniques are impossible to implement. For this reason we allow controlled mode where no event handlers are attached, but you need to feed the element its state. So it's up to you to implement all the user interactions. In the future, this library may help with that, but in the present this is not available.
+
+Not done, so let's not release this.
+
 -}
 controlledMap : Viewport -> List (MapboxAttr msg) -> Style -> Html msg
 controlledMap { center, zoom, bearing, pitch } attrs style =
@@ -415,7 +390,7 @@ controlledMap { center, zoom, bearing, pitch } attrs style =
         props =
             property "mapboxStyle" (Mapbox.Style.encode style)
                 :: property "interactive" (Encode.bool False)
-                :: property "center" (encodePair Encode.float center)
+                :: property "center" (LngLat.encodeAsPair center)
                 :: property "zoom" (Encode.float zoom)
                 :: property "bearing" (Encode.float bearing)
                 :: property "pitch" (Encode.float pitch)
diff --git a/src/Mapbox/Helpers.elm b/src/Mapbox/Helpers.elm
index f2072aa..ed66d37 100644
--- a/src/Mapbox/Helpers.elm
+++ b/src/Mapbox/Helpers.elm
@@ -12,3 +12,7 @@ encodeAnchor v =
 
         Map ->
             Encode.string "map"
+
+
+encodePair encoder ( a, b ) =
+    Encode.list [ encoder a, encoder b ]
diff --git a/src/Mapbox/Source.elm b/src/Mapbox/Source.elm
index a927621..7677df8 100644
--- a/src/Mapbox/Source.elm
+++ b/src/Mapbox/Source.elm
@@ -49,6 +49,7 @@ Tiled sources can also take the following attributes:
 -}
 
 import Json.Encode exposing (Value)
+import LngLat exposing (LngLat)
 
 
 {-| Every layer is identified by an id.
@@ -115,11 +116,11 @@ getId (Source k _) =
     k
 
 
-{-| The longitude and latitude of the southwest and northeast corners of the source's bounding box in the following order: `sw.lng, sw.lat, ne.lng, ne.lat`. When this property is included in a source, no tiles outside of the given bounds are requested by Mapbox GL.
+{-| The longitude and latitude of the southwest and northeast corners of the source's bounding box. When this property is included in a source, no tiles outside of the given bounds are requested by Mapbox GL.
 -}
-bounds : Float -> Float -> Float -> Float -> SourceOption any
-bounds a b c d =
-    SourceOption "bounds" (Json.Encode.list [ Json.Encode.float a, Json.Encode.float b, Json.Encode.float c, Json.Encode.float d ])
+bounds : LngLat -> LngLat -> SourceOption any
+bounds sw ne =
+    SourceOption "bounds" (Json.Encode.list [ Json.Encode.float sw.lng, Json.Encode.float sw.lat, Json.Encode.float sw.lng, Json.Encode.float sw.lat ])
 
 
 {-| Minimum zoom level for which tiles are available, as in the TileJSON spec.
@@ -296,20 +297,21 @@ geoJSONFromValue id options data =
 {-| `(longitude, latitude)` pairs for the corners. You can use the type alias constructor in clockwise order: top left, top right, bottom right, bottom left.
 -}
 type alias Coords =
-    { topLeft : ( Float, Float )
-    , topRight : ( Float, Float )
-    , bottomRight : ( Float, Float )
-    , bottomLeft : ( Float, Float )
+    { topLeft : LngLat
+    , topRight : LngLat
+    , bottomRight : LngLat
+    , bottomLeft : LngLat
     }
 
 
 encodeCoordinates : Coords -> Value
 encodeCoordinates { topLeft, topRight, bottomRight, bottomLeft } =
-    let
-        encodePair ( x, y ) =
-            Json.Encode.list [ Json.Encode.float x, Json.Encode.float y ]
-    in
-        Json.Encode.list [ encodePair topLeft, encodePair topRight, encodePair bottomRight, encodePair bottomLeft ]
+    Json.Encode.list
+        [ LngLat.encodeAsPair topLeft
+        , LngLat.encodeAsPair topRight
+        , LngLat.encodeAsPair bottomRight
+        , LngLat.encodeAsPair bottomLeft
+        ]
 
 
 {-| An image source
diff --git a/src/Mapbox/Style.elm b/src/Mapbox/Style.elm
index c647814..1793067 100644
--- a/src/Mapbox/Style.elm
+++ b/src/Mapbox/Style.elm
@@ -30,6 +30,7 @@ You can also use one of these predefined styles.
 
 import Array exposing (Array)
 import Json.Encode as Encode exposing (Value)
+import LngLat exposing (LngLat)
 import Mapbox.Expression exposing (Anchor(Viewport), CameraExpression, Color, Expression, float, floats, rgba)
 import Mapbox.Helpers exposing (encodeAnchor)
 import Mapbox.Layer exposing (Layer)
@@ -161,9 +162,9 @@ name =
 
 {-| Default map center in longitude and latitude. The style center will be used only if the map has not been positioned by other means (e.g. map options or user interaction).
 -}
-defaultCenter : Float -> Float -> MiscAttr
-defaultCenter lat lng =
-    Encode.list [ Encode.float lat, Encode.float lng ] |> MiscAttr "center"
+defaultCenter : LngLat -> MiscAttr
+defaultCenter =
+    LngLat.encodeAsPair >> MiscAttr "center"
 
 
 {-| Default zoom level. The style zoom will be used only if the map has not been positioned by other means (e.g. map options or user interaction).
diff --git a/src/js/main.js b/src/js/main.js
index 3d70e9b..ce720ca 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -7,7 +7,8 @@ function wrapElmApplication(elmApp, settings = {}) {
       incomingPort: "elmMapboxIncoming",
       easingFunctions: {
         linear: t => t
-      }
+      },
+      onMount() {}
     },
     settings
   );
@@ -223,7 +224,7 @@ function wrapElmApplication(elmApp, settings = {}) {
       }
 
       _createMapInstance() {
-        let options = {
+        let mapOptions = {
           container: this,
           style: this._style,
           minZoom: this._minZoom || 0,
@@ -236,18 +237,18 @@ function wrapElmApplication(elmApp, settings = {}) {
           renderWorldCopies: this._renderWorldCopies
         };
         if (this._center) {
-          options.center = this._center;
+          mapOptions.center = this._center;
         }
         if (this._zoom) {
-          options.zoom = this._zoom;
+          mapOptions.zoom = this._zoom;
         }
         if (this._bearing) {
-          options.bearing = this._bearing;
+          mapOptions.bearing = this._bearing;
         }
         if (this._pitch) {
-          options.pitch = this._pitch;
+          mapOptions.pitch = this._pitch;
         }
-        this._map = new mapboxgl.Map(options);
+        this._map = new mapboxgl.Map(mapOptions);
 
         Object.entries(this._eventRegistrationQueue).forEach(
           ([type, listeners]) => {
@@ -257,6 +258,7 @@ function wrapElmApplication(elmApp, settings = {}) {
           }
         );
         this._eventRegistrationQueue = {};
+        options.onMount(this._map, this);
         return this._map;
       }