1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
|
module Main exposing (main)
import Browser
import Decoder
import Html exposing (div, input, label, p, pre, text)
import Html.Attributes exposing (style, type_, value)
import Html.Events exposing (onClick, onInput)
import Http
import Json.Decode
main =
Browser.document
{ init = init
, view = view
, update = update
, subscriptions = subscriptions
}
init () =
( { styleUrl = ""
, token = ""
, style = Nothing
, error = Nothing
}
, Cmd.none
)
type Msg
= LoadedStyle (Result Http.Error String)
| LoadStyle
| StyleURLChanged String
| TokenChanged String
update msg model =
case msg of
LoadedStyle (Ok style) ->
( { model | style = Just style }, Cmd.none )
LoadedStyle (Err e) ->
( { model | error = Just (errorToString e) }, Cmd.none )
LoadStyle ->
( model, fetchStyle model.styleUrl model.token )
StyleURLChanged s ->
( { model | styleUrl = s }, Cmd.none )
TokenChanged s ->
( { model | token = s }, Cmd.none )
subscriptions model =
Sub.none
fetchStyle styleUrl token =
String.replace "mapbox://styles/" "https://api.mapbox.com/styles/v1/" styleUrl
++ "?access_token="
++ token
|> Http.getString
|> Http.send LoadedStyle
form model =
div []
[ div []
[ label [] [ text "Style URL:" ]
, input [ type_ "text", value model.styleUrl, onInput StyleURLChanged ] []
]
, div []
[ label [] [ text "Token:" ]
, input [ type_ "text", value model.token, onInput TokenChanged ] []
]
, div [] [ input [ type_ "submit", value "Fetch", onClick LoadStyle ] [] ]
]
errorToString : Http.Error -> String
errorToString err =
case err of
Http.BadUrl stringString ->
"Invalid URL. Check the inputs to make sure that it is a valid https url or starts with mapbox://styles/"
Http.Timeout ->
"Request timed out. Try again later."
Http.NetworkError ->
"Network error. Are you online?"
Http.BadStatus response ->
case response.status.code of
401 ->
"An authentication error occurred. Check your key and try again."
404 ->
"Couldn't find that style"
_ ->
response.status.message
Http.BadPayload m _ ->
m
resultToString r =
case r of
Ok s ->
s
Err s ->
s
view model =
{ title = "Style Generator"
, body =
[ form model
, case ( model.error, model.style ) of
( Just err, _ ) ->
p [ style "color" "red" ] [ text err ]
( Nothing, Just styl ) ->
pre
[]
[ Json.Decode.decodeString Decoder.styleCode styl
|> Result.mapError Json.Decode.errorToString
|> resultToString
|> text
]
( Nothing, Nothing ) ->
p [] [ text "This is a tool that helps you generate elm-mapbox styles from Mapbox Studio. In Studio, hit the share button. This will give you the above two pieces of information. Then hit fetch. This tool will attempt to generate an elm-mapbox style for you. It is not perfect, but should give a nice head-start. Run the output through elm-format, than fix any compiler warnings. Then fix any Debug.todo calls." ]
]
}
|
