Create an Elm app that supports playing audio.
elementWithAudio : { init : flags -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), view : AudioData -> model -> Html msg, update : AudioData -> msg -> model -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), subscriptions : AudioData -> model -> Platform.Sub.Sub msg, audio : AudioData -> model -> Audio, audioPort : Ports msg } -> Platform.Program flags (Model msg model) (Msg msg)
Browser.element but with the ability to play sounds.
documentWithAudio : { init : flags -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), view : AudioData -> model -> Browser.Document msg, update : AudioData -> msg -> model -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), subscriptions : AudioData -> model -> Platform.Sub.Sub msg, audio : AudioData -> model -> Audio, audioPort : Ports msg } -> Platform.Program flags (Model msg model) (Msg msg)
Browser.document but with the ability to play sounds.
applicationWithAudio : { init : flags -> Url -> Browser.Navigation.Key -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), view : AudioData -> model -> Browser.Document msg, update : AudioData -> msg -> model -> ( model, Platform.Cmd.Cmd msg, AudioCmd msg ), subscriptions : AudioData -> model -> Platform.Sub.Sub msg, onUrlRequest : Browser.UrlRequest -> msg, onUrlChange : Url -> msg, audio : AudioData -> model -> Audio, audioPort : Ports msg } -> Platform.Program flags (Model msg model) (Msg msg)
Browser.application but with the ability to play sounds.
The top level model for our program. This contains the model for your app as well as extra data needed to keep track of what audio is playing.
The top level msg for our program. This contains the msg type your app uses in addition to msgs that are needed to handle when audio gets loaded.
Information about audio files you have loaded. This is passed as a parameter to your update, view, subscriptions, and audio functions.
Load audio so you can later play it.
An audio command.
loadAudio : (Result LoadError Source -> msg) -> String -> AudioCmd msg
Load audio from a url.
These are possible errors we can get when loading an audio source file.
Audio data we can use to play sounds
cmdMap : (a -> b) -> AudioCmd a -> AudioCmd b
Map a command from one type to another. Conceptually the same as Cmd.map.
cmdBatch : List (AudioCmd userMsg) -> AudioCmd userMsg
Combine multiple commands into a single command. Conceptually the same as Cmd.batch.
cmdNone : AudioCmd msg
A command that does nothing. Conceptually the same as Cmd.none.
Define what audio should be playing.
Some kind of sound we want to play. To create Audio
start with audio
.
audio : Source -> Time.Posix -> Audio
Play audio from an audio source at a given time. This is the same as using audioWithConfig audioDefaultConfig
.
Note that in some browsers audio will be muted until the user interacts with the webpage.
group : List Audio -> Audio
Combine multiple Audio
s into a single Audio
.
silence : Audio
The sound of no sound at all.
length : AudioData -> Source -> Duration
Get how long an audio source plays for.
audioWithConfig : PlayAudioConfig -> Source -> Time.Posix -> Audio
Play audio from an audio source at a given time with config.
Note that in some browsers audio will be muted until the user interacts with the webpage.
audioDefaultConfig : PlayAudioConfig
Default config used for audioWithConfig
.
{ loop : Maybe LoopConfig
, playbackRate : Basics.Float
, startAt : Duration
}
Extra settings when playing audio from a file.
-- Here we play a song at half speed and it skips the first 15 seconds of the song.
audioWithConfig
{ loop = Nothing
, playbackRate = 0.5
, startAt = Duration.seconds 15
}
myCoolSong
songStartTime
{ loopStart : Duration
, loopEnd : Duration
}
Control how audio loops. loopEnd
defines where (relative to the start of the audio) the audio should loop and loopStart
defines where it should loop to.
-- Here we have a song that plays an intro once and then loops between the 10 second point and the end of the song.
let
default =
Audio.audioDefaultConfig
-- We can use Audio.length to get the duration of coolBackgroundMusic but for simplicity it's hardcoded in this example
songLength =
Duration.seconds 120
in
audioWithConfig
{ default | loop = Just { loopStart = Duration.seconds 10, loopEnd = songLength } }
coolBackgroundMusic
startTime
Effects you can apply to Audio
.
scaleVolume : Basics.Float -> Audio -> Audio
Scale how loud a given Audio
is.
1 preserves the current volume, 0.5 halves it, and 0 mutes it.
If the the volume is less than 0, 0 will be used instead.
scaleVolumeAt : List ( Time.Posix, Basics.Float ) -> Audio -> Audio
Scale how loud some Audio
is at different points in time.
The volume will transition linearly between those points.
The points in time don't need to be sorted but they need to be unique.
import Audio
import Duration
import Time
-- Here we define an audio function that fades in to full volume and then fades out until it's muted again.
--
-- 1 ________
-- / \
-- 0 ____________/ \_______
-- t -> fade in fade out
fadeInOut fadeInTime fadeOutTime audio =
Audio.scaleVolumeAt
[ ( Duration.subtractFrom fadeInTime Duration.second, 0 )
, ( fadeInTime, 1 )
, ( fadeOutTime, 1 )
, ( Duration.addTo fadeOutTime Duration.second, 0 )
]
audio
offsetBy : Duration -> Audio -> Audio
Add an offset to the audio.
import Audio
import Duration
delayByOneSecond audio =
Audio.offsetBy Duration.second audio
WIP support for Lamdera. Ignore this for now.
lamderaFrontendWithAudio : { init : Url -> Browser.Navigation.Key -> ( model, Platform.Cmd.Cmd frontendMsg, AudioCmd frontendMsg ), view : AudioData -> model -> Browser.Document frontendMsg, update : AudioData -> frontendMsg -> model -> ( model, Platform.Cmd.Cmd frontendMsg, AudioCmd frontendMsg ), updateFromBackend : AudioData -> toFrontend -> model -> ( model, Platform.Cmd.Cmd frontendMsg, AudioCmd frontendMsg ), subscriptions : AudioData -> model -> Platform.Sub.Sub frontendMsg, onUrlRequest : Browser.UrlRequest -> frontendMsg, onUrlChange : Url -> frontendMsg, audio : AudioData -> model -> Audio, audioPort : Ports frontendMsg } -> { init : Url -> Browser.Navigation.Key -> ( Model frontendMsg model, Platform.Cmd.Cmd (Msg frontendMsg) ), view : Model frontendMsg model -> Browser.Document (Msg frontendMsg), update : Msg frontendMsg -> Model frontendMsg model -> ( Model frontendMsg model, Platform.Cmd.Cmd (Msg frontendMsg) ), updateFromBackend : toFrontend -> Model frontendMsg model -> ( Model frontendMsg model, Platform.Cmd.Cmd (Msg frontendMsg) ), subscriptions : Model frontendMsg model -> Platform.Sub.Sub (Msg frontendMsg), onUrlRequest : Browser.UrlRequest -> Msg frontendMsg, onUrlChange : Url -> Msg frontendMsg }
Lamdera.frontend but with the ability to play sounds (highly experimental, just ignore this for now).
migrateModel : (msgOld -> msgNew) -> (modelOld -> ( modelNew, Platform.Cmd.Cmd msgNew )) -> Model msgOld modelOld -> ( Model msgNew modelNew, Platform.Cmd.Cmd msgNew )
Use this function when migrating your model in Lamdera.
migrateMsg : (msgOld -> ( msgNew, Platform.Cmd.Cmd msgNew )) -> Msg msgOld -> ( Msg msgNew, Platform.Cmd.Cmd msgNew )
Use this function when migrating messages in Lamdera.