Text to Html

Main.elm

module Main exposing (..)

import Html exposing (Html, text, img, div)
import Html.Attributes exposing (src)


sampleText : String
sampleText =
    "Once during your turn (before you attack), you may turn all basic Energy attached to all of your Pokémon into Fire Energy for the rest of the turn. This power can't be used if Charizard is affected by a Special Condition."


splitText : String -> List String
splitText string =
    String.words string


replaceText : List String -> Html a
replaceText words =
    let
        url =
            "https://s3-us-west-2.amazonaws.com/pokecard/assets/icons/elements/Fire-icon.png"
    in
        List.map (\word -> 
            case word of
                "Fire" ->
                    img [ src url ] []
                    
                _ as val ->
                    " " ++ val ++ " "
                        |> text
        ) words
            |> div []


main : Html a
main =
    sampleText |> splitText |> replaceText