pd-andy / elm-web-audio / WebAudio.Program

Each of the functions contained in this module are wrappers for the existing Browser application types. They need just two additions to the record:

audio : Model -> WebAudio.Graph
audio model =
  List.map voice model.notes
port audioPort : Json.Encode.Value -> Cmd msg

With these programs, your audio function is called automatically after every update just like your view function is. So if we wanted to create a Browser.element program, we'd instead do:

main : Program () Model Msg
main =
  WebAudio.Program.element
    { init = init
    , update = update
    , audio = audio
    , view = view
    , subscriptions = subscriptions
    , audioPort = audioPort
    }

The only program from Browser not support is Browser.sandbox as those programs cannot produce Cmds and so can't call the port needed to send our audio graph to javascript.

element : { init : flags -> ( model, Platform.Cmd.Cmd msg ), update : msg -> model -> ( model, Platform.Cmd.Cmd msg ), audio : model -> WebAudio.Graph, view : model -> Html msg, subscriptions : model -> Platform.Sub.Sub msg, audioPort : Json.Encode.Value -> Platform.Cmd.Cmd msg } -> Platform.Program flags model msg

document : { init : flags -> ( model, Platform.Cmd.Cmd msg ), update : msg -> model -> ( model, Platform.Cmd.Cmd msg ), audio : model -> WebAudio.Graph, view : model -> Browser.Document msg, subscriptions : model -> Platform.Sub.Sub msg, audioPort : Json.Encode.Value -> Platform.Cmd.Cmd msg } -> Platform.Program flags model msg

application : { init : flags -> Url -> Browser.Navigation.Key -> ( model, Platform.Cmd.Cmd msg ), update : msg -> model -> ( model, Platform.Cmd.Cmd msg ), audio : model -> WebAudio.Graph, view : model -> Browser.Document msg, subscriptions : model -> Platform.Sub.Sub msg, audioPort : Json.Encode.Value -> Platform.Cmd.Cmd msg, onUrlRequest : Browser.UrlRequest -> msg, onUrlChange : Url -> msg } -> Platform.Program flags model msg

worker : { init : flags -> ( model, Platform.Cmd.Cmd msg ), update : msg -> model -> ( model, Platform.Cmd.Cmd msg ), audio : model -> WebAudio.Graph, subscriptions : model -> Platform.Sub.Sub msg, audioPort : Json.Encode.Value -> Platform.Cmd.Cmd msg } -> Platform.Program flags model msg