Simple BMI calculator written in Elm

bmi.elm

import Html exposing (..)
import Html.App exposing (beginnerProgram)
import Html.Attributes as HA exposing (..)
import Html.Events exposing (onClick, onInput)
import String

main =
  beginnerProgram { model = model, view = view, update = update }


type alias Model =
  { valueHeight : String
  , valueWeight : String
  , valueBMI : String
  }


defaultData =
  let
    h = "170"
    w = "70"
    b = calcBMI h w   
  in
    { height = h
    , weight = w
    , bmi = toString b    
    }

model : Model
model =
  { valueHeight = defaultData.height
  , valueWeight = defaultData.weight
  , valueBMI = defaultData.bmi
  }


type Msg 
  = UpdateHeight String
  | UpdateWeight String


calcBMI : String -> String -> Float
calcBMI height weight =
  let
    h = Result.withDefault 1 (String.toFloat height) * 0.01
    w = Result.withDefault 1 (String.toFloat weight)
  
  in
    w / h / h


update : Msg -> Model -> Model
update msg model =
  let
    bmi = toString (calcBMI model.valueHeight model.valueWeight)
    
  in

  case msg of
    UpdateHeight val ->
      { model | valueHeight = val, valueBMI = bmi }
    
    UpdateWeight val ->
      { model | valueWeight = val, valueBMI = bmi }


labelUnit : String -> String -> String -> Html Msg
labelUnit name unit value =
  label [ ] [ text (name ++ value ++ unit) ]


rangeUnit min max val action =
  input [ type' "range"
        , HA.min min
        , HA.max max
        , value val
        , onInput action
        ] []


labelSlider name unit value min max action =
  div []
    [ labelUnit name unit value
    , rangeUnit min max value action ]


view : Model -> Html Msg
view model =
  div []
    [ labelSlider "Height " "cm" model.valueHeight "70" "230" UpdateHeight   
    , p [] []    
    , labelSlider "Weight " "kg" model.valueWeight "50" "200" UpdateWeight
    , p [] []
    , span [] [text ("BMI: " ++ model.valueBMI)]
    , p [] []
    , text (toString model)
    ]