lamassu-server/lamassu-admin-elm/src/Pair.elm
2018-10-08 21:29:06 +02:00

132 lines
3.4 KiB
Elm

module Pair exposing (..)
import Html exposing (Html, Attribute, h1, a, div, hr, input, span, text, node, button, strong, label)
import Html.Attributes exposing (id, attribute, placeholder, disabled, style, size)
import Html.Events exposing (onClick, onInput)
import Http
import HttpBuilder exposing (..)
import String
import RemoteData exposing (RemoteData(NotAsked, Loading, Failure, Success))
import QRCode
import Css.Admin exposing (..)
import Css.Classes as C
import QRCode.ECLevel as ECLevel
-- MODEL
type alias Model =
{ totem : RemoteData.WebData String
, name : String
, serverStatus : Bool
}
getTotem : String -> Cmd Msg
getTotem name =
get "/api/totem"
|> withQueryParams [ ( "name", name ) ]
|> withExpect Http.expectString
|> send RemoteData.fromResult
|> Cmd.map Load
init : Bool -> Model
init serverStatus =
{ totem = RemoteData.NotAsked
, name = ""
, serverStatus = serverStatus
}
-- UPDATE
type Msg
= Load (RemoteData.WebData String)
| InputName String
| SubmitName
updateStatus : Bool -> Model -> Model
updateStatus isUp model =
{ model | serverStatus = isUp }
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
Load webData ->
let
_ =
Debug.log "TOTEM" (RemoteData.withDefault "Network Error" webData)
in
{ model | totem = webData } ! []
InputName name ->
{ model | name = name } ! []
SubmitName ->
model ! [ getTotem model.name ]
qrCode : String -> Html msg
qrCode s =
let
resultQRCode =
QRCode.toSvgWithECLevel s ECLevel.L
in
case resultQRCode of
Result.Ok view ->
view
Result.Err err ->
Html.text (toString err)
view : Model -> Html Msg
view model =
if model.serverStatus then
case model.totem of
NotAsked ->
div []
[ h1 [] [ text "Pair a new Lamassu cryptomat" ]
, div []
[ label []
[ text "Cryptomat name"
, input
[ onInput InputName
, placeholder "Coffee shop, 43 Elm St."
, size 50
, style [ ( "margin-left", "1em" ) ]
]
[]
, button
[ onClick SubmitName, disabled (String.isEmpty model.name) ]
[ text "Pair" ]
]
]
]
Loading ->
div []
[ div [] [ text "..." ] ]
Failure err ->
div [] [ text (toString err) ]
Success totem ->
div
[]
[ div
[ class [ C.QrCode ] ]
[ qrCode totem ]
, div []
[ span [] [ text "Scan this QR Code to pair " ]
, strong [] [ text model.name ]
]
]
else
div [] [ text "Make sure lamassu-server is up before pairing" ]